a.html 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport"
  6. content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />
  7. <link rel="stylesheet" href="./resource/vantIndex.css" />
  8. <link rel="stylesheet" href="./vue-form-making/index.css">
  9. </head>
  10. <body>
  11. <style>
  12. :root:root {
  13. --van-nav-bar-background: rgb(21, 122, 44);
  14. --van-nav-bar-title-text-color: rgb(255, 255, 255);
  15. --van-nav-bar-icon-color: rgb(255, 255, 255);
  16. }
  17. :root#app{
  18. background: #4298fd0d;
  19. }
  20. ::v-deep.fm-form-item{
  21. magin-bottom:10px .!important;
  22. }
  23. </style>
  24. <div id="app">
  25. <van-nav-bar height='100rpx;margin-top:100rpx' @click-left="onClickLeft" style="background-color: rgb(21, 122, 44);color: rgb(255, 255, 255);"
  26. :title="title" left-arrow :safe-area-inset-top='true' :placeholder='true' :fixed='true'></van-nav-bar>
  27. <fm-generate-vant-form style='height: 81vh !important;overflow: auto;background: #a3a6ad1c;margin-top:44px' v-if='isFlag' :data="jsonData"
  28. :value="form.valueJson" ref="generateForm" :edit='isEdit'>
  29. </fm-generate-vant-form>
  30. <div>
  31. <!-- <van-form>
  32. <van-cell-group inset>
  33. <van-field type="textarea" v-model="form.reason" label="意见" placeholder="" rows="2" autosize
  34. show-word-limit />
  35. </van-cell-group>
  36. </van-form> -->
  37. <div v-if='isEdit'
  38. style="display: flex;justify-content: space-between; padding: 30px 30px; position: fixed; bottom: 0; width: 100%; height: 80px;">
  39. <van-button style="width:48%" type="primary" @click="handleAudit(1)">提交
  40. </van-button>
  41. <van-button style="width:48%" type="danger" @click="onClickLeft">取消
  42. </van-button>
  43. </div>
  44. </div>
  45. </div>
  46. <script src="./resource/vue.global.prod.js"></script>
  47. <script src="./resource/vant.min.js"></script>
  48. <script src="./resource/axios.min.js"></script>
  49. <script src="./resource/uni.webview.js"></script>
  50. <script src="./vue-form-making/form-making-v3.umd.js"></script>
  51. <script>
  52. let EnvObj = {}
  53. uni.getEnv(function(res) {
  54. EnvObj = res;
  55. console.log('当前环境:' + JSON.stringify(res));
  56. });
  57. Vue.createApp({
  58. data() {
  59. return {
  60. isFlag: false,
  61. isEdit: true,
  62. title: '',
  63. jsonData: {},
  64. editData: {},
  65. form: {},
  66. headers: {},
  67. APIUrl: '',
  68. }
  69. },
  70. created() {
  71. this.headers = this.getQueryParams('headers');
  72. let params = this.getQueryParams('params');
  73. this.isEdit = params.isEdit || true
  74. this.APIUrl = this.headers.serverInfo || 'http://192.168.1.105:18086'
  75. console.log(params)
  76. axios({
  77. method: 'get',
  78. url: this.APIUrl + `/flowable/bpmcustomform/getById/${params.id}`,
  79. headers: this.headers,
  80. }).then((res) => {
  81. if (res.data.code != '-1') {
  82. this.form = res.data.data
  83. this.form.formId = res.data.data.id
  84. this.form.id = ''
  85. this.form.valueJson = {}
  86. this.title = this.form.name
  87. this.jsonData = JSON.parse(res.data.data.formJson.makingJson);
  88. this.jsonData.list.forEach(item => {
  89. item.options.headers = [{
  90. key: 'Authorization',
  91. value: this.headers.Authorization
  92. }]
  93. item.options.action = item.options.action && item.options.action.replace(
  94. '/api', this.APIUrl)
  95. if (item.type == "deptAndUserCascader") {
  96. item.type = 'cascader'
  97. }
  98. if (item.type == "deptCascader") {
  99. item.type = 'cascader'
  100. /* item.isPathValue = false */
  101. if (item.options.isDefaultLoginUser) {
  102. /* this.form.valueJson[item.model] = [1,1765997946953797633]; */
  103. this.form.valueJson[item.model] = params.userInfo.groupIdList;
  104. }
  105. }
  106. if (item.type == "userSelect") {
  107. item.type = 'select'
  108. if (item.options.isDefaultLoginUser) {
  109. this.form.valueJson[item.model] = params.userInfo.userId;
  110. }
  111. }
  112. })
  113. this.jsonData.config.dataSource && this.jsonData.config.dataSource.forEach(item => {
  114. item.headers = {
  115. Authorization: this.headers.Authorization
  116. }
  117. item.url = item.url && item.url.replace('/api', this.APIUrl)
  118. })
  119. this.isFlag = true
  120. }
  121. });
  122. // axios({
  123. // method: 'get',
  124. // url: this.APIUrl + `/bpm/task/list-by-process-instance-id?processInstanceId=${params.id}`,
  125. // headers: this.headers,
  126. // }).then((res) => {
  127. // console.log(res)
  128. // if (res.data.code != '-1') {
  129. // }
  130. // });
  131. },
  132. methods: {
  133. getQueryParams(queryName) {
  134. const urlSearchParams = new URLSearchParams(window.location.search);
  135. const query = urlSearchParams.get(queryName);
  136. return JSON.parse(query);
  137. },
  138. generateFormValid(validate = true) {
  139. return this.$refs.generateForm.getData(validate).then((data) => { //清空content
  140. for(key in data){
  141. if(key.includes('fileupload')){
  142. data[key].forEach(item=>{
  143. item['content']=''
  144. })
  145. }
  146. }
  147. return data;
  148. });
  149. },
  150. async handleAudit(status) {
  151. this.form.valueJson = await this.generateFormValid();
  152. console.log(this.form.valueJson)
  153. this.form.processType = '1';
  154. let API = this.APIUrl + '/bpm/process-instance/create'
  155. axios({
  156. method: 'post',
  157. url: API,
  158. headers: this.headers,
  159. data: {
  160. ...this.form,
  161. }
  162. }).then((res) => {
  163. if (res.data.code != '-1') {
  164. vant.showNotify({
  165. type: 'success',
  166. message: `提交成功!`,
  167. duration: 1000,
  168. });
  169. setTimeout(() => {
  170. this.onClickLeft()
  171. }, 1000)
  172. }
  173. });
  174. },
  175. onClickLeft() {
  176. uni.navigateBack({
  177. delta: 1
  178. });
  179. }
  180. }
  181. }).use(vant).use(FormMakingV3).mount('#app')
  182. </script>
  183. </body>
  184. </html>