c.html 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  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. .van-nav-bar--fixed{
  18. top: 44px;
  19. }
  20. </style>
  21. <div id="app">
  22. <van-nav-bar height='100rpx' @click-left="onClickLeft" style="background-color: rgb(21, 122, 44);color: rgb(255, 255, 255);"
  23. :title="title" left-arrow :safe-area-inset-top='true' :placeholder='true' :fixed='true'></van-nav-bar>
  24. <fm-generate-vant-form style='height: 75vh !important;overflow: auto;margin-top:44px' v-if='isFlag' :data="jsonData" :value="form.valueJson" ref="generateForm" :edit='false'>
  25. </fm-generate-vant-form>
  26. <div v-if="type!='view'" style='position: fixed; bottom: 0;background: #f9fafb;width:100%;height:20%'>
  27. <van-form label-width='30px'>
  28. <van-cell-group inset>
  29. <van-field style="background: #f9fafb;" type="textarea" v-model="form.reason" label="意见" placeholder="" rows="2" :autosize='{maxHeight: 50}'
  30. show-word-limit />
  31. </van-cell-group>
  32. </van-form>
  33. <div
  34. style="display: flex;justify-content: space-between; padding: 0px 30px; width: 100%; height: 80px;">
  35. <van-button style="width:48%" type="primary" @click="handleAudit(1)">通过
  36. </van-button>
  37. <van-button style="width:48%" type="danger" @click="handleAudit(0)">驳回
  38. </van-button>
  39. </div>
  40. </div>
  41. </div>
  42. <script src="./resource/vue.global.prod.js"></script>
  43. <script src="./resource/vant.min.js"></script>
  44. <script src="./resource/axios.min.js"></script>
  45. <script src="./resource/uni.webview.js"></script>
  46. <script src="./vue-form-making/form-making-v3.umd.js"></script>
  47. <script>
  48. let EnvObj = {}
  49. uni.getEnv(function(res) {
  50. EnvObj = res;
  51. console.log('当前环境:' + JSON.stringify(res));
  52. });
  53. Vue.createApp({
  54. data() {
  55. return {
  56. isFlag:false,
  57. isEdit:true,
  58. type:'',
  59. jsonData: {},
  60. editData: {},
  61. form: {},
  62. headers: {},
  63. APIUrl: '',
  64. title: '',
  65. }
  66. },
  67. created() {
  68. this.headers = this.getQueryParams('headers');
  69. let params = this.getQueryParams('params');
  70. this.APIUrl = this.headers.serverInfo || 'http://192.168.1.105:18086'
  71. this.title = params.type =='view'?'查看':'审核'
  72. this.type = params.type
  73. axios({
  74. method: 'get',
  75. url: this.APIUrl + `/bpm/process-instance/get?id=${params.processInstanceId}`,
  76. headers: this.headers,
  77. }).then((res) => {
  78. console.log(res)
  79. if (res.data.code != '-1') {
  80. this.form = res.data.data
  81. this.form.submitId = params.id
  82. this.jsonData = JSON.parse(res.data.data.formJson.makingJson);
  83. this.jsonData.list.forEach(item=>{
  84. item.options.headers = [{key:'Authorization',value:this.headers.Authorization}]
  85. if(item.type=="deptAndUserCascader"){
  86. item.type = 'cascader'
  87. }
  88. if(item.type=="deptCascader"){
  89. item.type = 'cascader'
  90. }
  91. if(item.type=="userSelect"){
  92. item.type = 'select'
  93. }
  94. if (item.type == "imgupload") {
  95. this.form.valueJson[item.model].length && this.form.valueJson[item.model].forEach(
  96. item => {
  97. //item.objectUrl = this.APIUrl +'/kd-aiot' + item.storePath
  98. item.objectUrl = item.url
  99. })
  100. }
  101. })
  102. this.jsonData.config.dataSource && this.jsonData.config.dataSource.forEach(item => {
  103. item.headers = {
  104. Authorization: this.headers.Authorization
  105. }
  106. item.url = item.url && item.url.replace('/api', this.APIUrl)
  107. })
  108. this.isFlag = true
  109. }
  110. });
  111. },
  112. methods: {
  113. getQueryParams(queryName) {
  114. const urlSearchParams = new URLSearchParams(window.location.search);
  115. const query = urlSearchParams.get(queryName);
  116. return JSON.parse(query);
  117. },
  118. async handleAudit(status) {
  119. await this._approveTaskWithVariables(status);
  120. },
  121. async _approveTaskWithVariables(status) {
  122. let variables = {
  123. pass: !!status,
  124. ...this.form.formVariables
  125. };
  126. if (!this.form.reason) this.form.reason = !!status ? '通过' : '驳回'
  127. let API = !!status ? this.APIUrl + '/bpm/task/approveTaskWithVariables' :
  128. this.APIUrl + '/bpm/task/reject'
  129. axios({
  130. method: 'put',
  131. url: API,
  132. headers: this.headers,
  133. data: {
  134. id: this.form.submitId,
  135. reason: this.form.reason,
  136. variables
  137. }
  138. }).then((res) => {
  139. if (res.data.code != '-1') {
  140. let params = {
  141. status,
  142. title: status === 0 ? '驳回' : ''
  143. }
  144. vant.showNotify({
  145. type: 'success',
  146. message: `审批${params.title}成功!`,
  147. duration: 1000,
  148. });
  149. setTimeout(() => {
  150. this.onClickLeft()
  151. }, 1000)
  152. }
  153. });
  154. },
  155. onClickLeft() {
  156. uni.navigateBack({
  157. delta: 1
  158. });
  159. }
  160. }
  161. }).use(vant).use(FormMakingV3).mount('#app')
  162. </script>
  163. </body>
  164. </html>