index.vue 8.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. <template>
  2. <flow-form :data="formData" @submit="submitNextActivity">
  3. <card title="基础信息">
  4. <van-form required="auto" :readonly="formRead">
  5. <van-cell-group inset>
  6. <van-field
  7. v-model="formData.userNickname"
  8. name="申请人"
  9. label="申请人"
  10. placeholder="申请人"
  11. readonly
  12. />
  13. <van-field
  14. v-model="formData.deptName"
  15. name="所在部门"
  16. label="所在部门"
  17. placeholder="所在部门"
  18. readonly
  19. />
  20. <van-field
  21. v-model="formData.applyTime"
  22. name="申请时间"
  23. label="申请时间"
  24. placeholder="申请时间"
  25. readonly
  26. />
  27. <van-field
  28. v-model="formData.useMoneyNo"
  29. name="用款单号"
  30. label="用款单号"
  31. placeholder="用款单号"
  32. readonly
  33. />
  34. <van-field
  35. v-model="formData.projectName"
  36. name="项目名称"
  37. label="项目名称"
  38. placeholder="项目名称"
  39. readonly
  40. />
  41. <van-field
  42. v-model="formData.projectXmbh"
  43. name="项目编号"
  44. label="项目编号"
  45. placeholder="项目编号"
  46. readonly
  47. />
  48. <van-field
  49. v-model="formData.projectZrbm"
  50. name="项目责任部门"
  51. label="项目责任部门"
  52. placeholder="项目责任部门"
  53. readonly
  54. />
  55. <van-field
  56. v-model="formData.hth"
  57. name="合同号"
  58. label="合同号"
  59. placeholder="合同号"
  60. readonly
  61. />
  62. <van-field
  63. v-model="formData.name"
  64. name="分包合同名称"
  65. label="分包合同名称"
  66. placeholder="分包合同名称"
  67. readonly
  68. v-if="formData.contractId!=null&&formData.contractType==1"
  69. />
  70. <van-field
  71. v-model="formData.name"
  72. name="外包合同名称"
  73. label="外包合同名称"
  74. placeholder="外包合同名称"
  75. readonly
  76. v-if="formData.contractId!=null&&formData.contractType==2"
  77. />
  78. <van-field
  79. v-model="formData.contractAmount"
  80. name="合同金额(元)"
  81. label="合同金额(元)"
  82. placeholder="合同金额(元)"
  83. readonly
  84. v-if="formData.contractId!=null"
  85. />
  86. <van-field
  87. v-model="formData.payAmount"
  88. name="已支付金额"
  89. label="已支付金额"
  90. placeholder="已支付金额"
  91. readonly
  92. v-if="formData.contractId!=null"
  93. />
  94. <van-field
  95. v-model="formData.paymentTerms"
  96. name="付款条件"
  97. label="付款条件"
  98. placeholder="付款条件"
  99. readonly
  100. v-if="formData.contractId!=null"
  101. />
  102. <van-field
  103. v-model="formData.paymentCompanyName"
  104. name="付款单位"
  105. label="付款单位"
  106. placeholder="付款单位"
  107. readonly
  108. />
  109. <van-field
  110. v-model="formData.paymentMethod"
  111. name="付款方式"
  112. label="付款方式"
  113. placeholder="付款方式"
  114. readonly
  115. />
  116. <van-field
  117. v-model="formData.agreedPayTime"
  118. name="约定付款期限"
  119. label="约定付款期限"
  120. placeholder="约定付款期限"
  121. readonly
  122. />
  123. <van-field
  124. v-model="formData.collectionCompany"
  125. name="收款单位"
  126. label="收款单位"
  127. placeholder="收款单位"
  128. readonly
  129. />
  130. <van-field
  131. v-model="formData.collectionCompanyBank"
  132. name="收款单位开户行"
  133. label="收款单位开户行"
  134. placeholder="收款单位开户行"
  135. readonly
  136. />
  137. <van-field
  138. v-model="formData.collectionCompanyAccount"
  139. name="收款单位账号"
  140. label="收款单位账号"
  141. placeholder="收款单位账号"
  142. readonly
  143. />
  144. <van-field
  145. v-model="formData.totalAmount"
  146. name="用款总金额(元)"
  147. label="用款总金额(元)"
  148. placeholder="用款总金额(元)"
  149. readonly
  150. />
  151. <van-field
  152. v-model="formData.totalAmountCn"
  153. name="大写用款总金额"
  154. label="大写用款总金额"
  155. placeholder="大写用款总金额"
  156. readonly
  157. />
  158. <van-field
  159. v-model="formData.remark"
  160. name="用款说明"
  161. label="用款说明"
  162. placeholder="用款说明"
  163. type="textarea"
  164. rows="3"
  165. autosize
  166. readonly
  167. />
  168. </van-cell-group>
  169. </van-form>
  170. </card>
  171. <card title="用款详情">
  172. <template #default>
  173. <div v-for="(item,index) in formData.detailList" :key="index">
  174. <van-swipe-cell :disabled="formRead">
  175. <card-cell>
  176. <van-cell title="金额(元)" :value="item.amount" />
  177. <van-cell title="实际所属类型" :value="item.costTypeName" />
  178. <van-cell title="用途" :value="item.costContent" />
  179. <van-cell title="备注" :value="item.remark" />
  180. </card-cell>
  181. </van-swipe-cell>
  182. </div>
  183. </template>
  184. </card>
  185. </flow-form>
  186. </template>
  187. <script setup lang="ts">
  188. import { useRoute } from 'vue-router';
  189. import { FlowDTO, getNextActivity } from '@/service/flow';
  190. import reqest from "@/utils/request";
  191. import FlowForm from '@/components/flowForm.vue';
  192. import Card from '@/components/card.vue';
  193. import CardCell from '@/components/cardCell.vue';
  194. import moment from 'moment'
  195. const route = useRoute();
  196. interface FormDataType {
  197. instanceId: string
  198. id: string
  199. leaveHours: number | null
  200. userNickname: string
  201. deptName: string
  202. applyTime: string
  203. leaveNo: string
  204. leaveType: number | null
  205. leaveTypeText: string
  206. leaveDays: string
  207. leaveReason: string
  208. detailList: {
  209. amount: string,
  210. costTypeName: string,
  211. costContent: string,
  212. remark: string
  213. }[]
  214. }
  215. const formData = ref<FormDataType>({
  216. instanceId: '',
  217. id: '',
  218. leaveHours: null,
  219. userNickname: '',
  220. deptName: '',
  221. applyTime: '',
  222. leaveNo: '',
  223. leaveType: null,
  224. leaveTypeText: '',
  225. leaveDays: '',
  226. leaveReason: '',
  227. detailList: []
  228. })
  229. const formRead = ref(false)
  230. const { activityInstanceId, participant,flowInstanceId,read } = route.query as {
  231. activityInstanceId: string;
  232. participant: string;
  233. flowInstanceId: string;
  234. read: string;
  235. };
  236. const activityData: FlowDTO = {
  237. activityInstanceId,
  238. participantId: participant,
  239. flowOpinion: ''
  240. }
  241. const submitNextActivity = async (activeOpinion: any) => {
  242. //工作流转件
  243. activityData.activityInstanceId=activityInstanceId
  244. activityData.participantId=participant
  245. activityData.flowOpinion=JSON.stringify(activeOpinion)
  246. const result = await getNextActivity(jsonToFormData(activityData))
  247. }
  248. const jsonToFormData = (json: any): FormData | null => {
  249. const keys: string[] = Object.keys(json)
  250. if (keys.length > 0) {
  251. const formData = new FormData();
  252. keys.forEach((key) => {
  253. formData.append(key, (json[key] instanceof Object) ? JSON.stringify(json[key]) : json[key]);
  254. });
  255. return formData;
  256. }
  257. return null;
  258. }
  259. /** 初始化表单数据 */
  260. const initFormData= async () => {
  261. const result = await reqest.get(`/business/UseMoney/mobileAdd?flowInstanceId=${flowInstanceId}`)
  262. formData.value = result.data
  263. formData.value.applyTime=moment(formData.value.applyTime).format('YYYY-MM-DD')
  264. formData.value.agreedPayTime=moment(formData.value.agreedPayTime).format('YYYY-MM-DD')
  265. }
  266. /** 初始化 */
  267. onMounted(() => {
  268. initFormData()
  269. if(read==='1'){
  270. formRead.value=true
  271. }
  272. })
  273. </script>
  274. <style lang="scss" scoped>
  275. @import "./index.scss";
  276. </style>