index.vue 54 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711
  1. <template>
  2. <page-meta root-font-size="system" />
  3. <view class="process_detail_container">
  4. <uni-card>
  5. <view class="main_container">
  6. <uni-section titleFontSize="1.3rem" title="申请内容" type="line"></uni-section>
  7. <uni-forms ref="$mainForm" :rules="$mainFormRules" :modelValue="mainFormValue" label-position="left"
  8. :label-width="125" :border="true">
  9. <view v-for="(elem, index) in formElements" :key="index">
  10. <uni-forms-item
  11. v-if="!(elem.elementName.endsWith('审批') && '' == elem.defaultValue && ['0', undefined].includes(elem.canEdit)) && ('' != elem.defaultValue || 1 == elem.canEdit) && !(elem.elementName.endsWith('单号') || elem.elementName.endsWith('申请人'))"
  12. :label="elem.elementName" :name="elem.elementId">
  13. <view class="element_value_container">
  14. <view v-if="'1' == elem.canEdit && '8' != elem.type" class="element_value">
  15. <!-- 关联变量输入框 -->
  16. <!-- 计算出差天数 -->
  17. <uni-easyinput v-if="undefined != elem.bindTimeRange && elem.elementName == '出差天数'"
  18. :type="fieldTypeDict[elem.fieldType] || 'text'"
  19. :value="calculateBusinessDifference(elem, formElements)" placeholder=""
  20. :disabled="true"></uni-easyinput>
  21. <uni-easyinput v-else-if="undefined != elem.bindTimeRange"
  22. :type="fieldTypeDict[elem.fieldType] || 'text'"
  23. :value="calculateTimeDifference(elem, formElements)" placeholder=""
  24. :disabled="true"></uni-easyinput>
  25. <!-- 金额转大写 -->
  26. <uni-easyinput v-else-if="elem.elementName.endsWith('大写')" placeholder=""
  27. :value="computedNumberToChineseCurrency(elem, formElements)" :disabled="true"></uni-easyinput>
  28. <!-- 主表关联变量输入框 -->
  29. <!-- 数值输入框 -->
  30. <uni-easyinput v-else-if="'1' == elem.fieldType && elem.BddzText" type="digit"
  31. :value="computedBddzTextValue(elem)" @input="digitInput($event, elem)"
  32. placeholder="" :disabled="true"></uni-easyinput>
  33. <!-- 输入框 -->
  34. <uni-easyinput v-else-if="elem.BddzText"
  35. :type="fieldTypeDict[elem.fieldType] || 'text'"
  36. :value="computedBddzTextValue(elem)" placeholder=""
  37. :disabled="true"></uni-easyinput>
  38. <!-- 数值输入框 -->
  39. <uni-easyinput v-else-if="'0' == elem.type && '1' == elem.fieldType"
  40. :disabled="'0' == elem.canEdit" type="digit"
  41. :placeholder="'0' == elem.canEdit ? '' : '请输入内容'"
  42. @input="digitInput($event, elem)" v-model="elem.defaultValue"
  43. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))"></uni-easyinput>
  44. <!-- 输入框 -->
  45. <uni-easyinput v-else-if="'0' == elem.type"
  46. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))" placeholder="请输入内容"
  47. v-model="elem.defaultValue" type="text"></uni-easyinput>
  48. <!-- 富文本框 -->
  49. <uni-easyinput v-else-if="'1' == elem.type"
  50. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))" placeholder="请输入内容"
  51. v-model="elem.defaultValue" type="textarea"></uni-easyinput>
  52. <!-- 下拉框 -->
  53. <picker class="picker_container" v-else-if="'2' == elem.type"
  54. @change="bindPickerChange($event, elem)" :value="elem.defaultValue"
  55. :range="formatDict(elem.typeDetail.enum)">
  56. <view class="uni-input input_text">
  57. <!-- 设置默认值为第一个选项 -->
  58. {{ elem.defaultValue ? elem.defaultValue : elem.defaultValue =
  59. elem.typeDetail.enum[0].enumVname }}
  60. </view>
  61. </picker>
  62. <!-- 数据选择器 -->
  63. <uni-data-checkbox v-else-if="'4' == elem.type" v-model="elem.defaultValue"
  64. :localdata="formatCheckbox(elem)"
  65. @change="changeDataSingleCheckBox($event,elem)"></uni-data-checkbox>
  66. <uni-data-checkbox v-else-if="'5' == elem.type" multiple v-model="elem.defaultValue"
  67. :localdata="formatCheckbox(elem)"
  68. @change="changeDataCheckBox($event,elem)"></uni-data-checkbox>
  69. <!-- 开始时间选择器 -->
  70. <uni-datetime-picker :end="formElements[elem.endElemIndex].defaultValue"
  71. @click.native.stop
  72. @change="setTimeRange(elem)"
  73. v-else-if="'9' == elem.type && undefined != elem.endElemIndex"
  74. v-model="elem.defaultValue" :clear-icon="false" type="datetime" />
  75. <!-- 结束时间选择器 -->
  76. <uni-datetime-picker :start="formElements[elem.startElemIndex].defaultValue"
  77. @click.native.stop
  78. @change="setTimeRange(elem)"
  79. v-else-if="'9' == elem.type && undefined != elem.startElemIndex"
  80. v-model="elem.defaultValue" :clear-icon="false" type="datetime" />
  81. <!-- 年月日 时分秒 -->
  82. <uni-datetime-picker v-else-if="'9' == elem.type"
  83. @click.native.stop
  84. v-model="elem.defaultValue"
  85. type="datetime" />
  86. <!-- 年月日 -->
  87. <uni-datetime-picker v-else-if="'3' == elem.type"
  88. @click.native.stop
  89. v-model="elem.defaultValue"
  90. type="date" />
  91. <!-- 审批签字板 -->
  92. <view v-else-if="'13' == elem.type">
  93. <view v-if="elem.defaultValue == ''">
  94. <uni-row>
  95. <uni-col :span="24">
  96. <button type="primary" @click="handleSignature(index)">手动签名</button>
  97. </uni-col>
  98. <uni-col :span="24">
  99. <button style="margin-top: 5px;" type="primary" @click="onclickAutosealButton(index)">一键签名</button>
  100. </uni-col>
  101. </uni-row>
  102. </view>
  103. <view v-else class="signature_img">
  104. <img style="width: 100%;" mode="widthFix" @click="handleSignature(index)"
  105. :src="config.baseUrlPre + elem.sealImgPath"
  106. :alt="elem.elementName + '签名'" />
  107. </view>
  108. </view>
  109. </view>
  110. <view
  111. v-else-if="typeof elem.sealImgPath === 'string' && elem.sealImgPath.startsWith('/shares')"
  112. class="signature_img">
  113. <img style="width: 100%;" mode="widthFix"
  114. :src="config.baseUrlPre + elem.sealImgPath" />
  115. </view>
  116. <view
  117. v-else-if="typeof elem.defaultValue === 'string' && elem.defaultValue.startsWith('/shares')"
  118. class="signature_img">
  119. <img style="width: 100%;" mode="widthFix"
  120. :src="config.baseUrlPre + elem.defaultValue" />
  121. </view>
  122. <!-- type=25 时显示加密内容和复制按钮 -->
  123. <view v-else-if="elem.type == '25'" class="encrypted_content_container">
  124. <text class="element_value encrypted_text">{{ maskContent(elem.defaultValue) }}</text>
  125. <button class="copy_button" @click="copyEncryptedContent(elem.defaultValue)" size="mini" type="primary">复制</button>
  126. </view>
  127. <text class="element_value" v-else>{{ Array.isArray(elem.defaultValue) ? elem.defaultValue.join(',') : elem.defaultValue }}</text>
  128. </view>
  129. </uni-forms-item>
  130. </view>
  131. </uni-forms>
  132. </view>
  133. </uni-card>
  134. <view class="repeating_table">
  135. <!-- 重复表 -->
  136. <!-- <uni-card v-if="flowInfo.seModel == '0' && repeatingFormNotEmpty" spacing="0" padding="0">
  137. <button @click="handleRepeatingForm" type="primary">查看明细</button>
  138. </uni-card> -->
  139. <uni-card v-if="!(flowInfo.seModel == '0' && repeatingFormNotEmpty)"
  140. v-for="(table, tableIndex) in repeatingForm.elements" spacing="0" :key="tableIndex">
  141. <uni-forms label-position="left" :label-width="125" :border="true">
  142. <uni-forms-item :name="elem.tableField" v-for="(elem, itemIndex) in table"
  143. :label="repeatingForm.elementItem[itemIndex].elementName.slice(3)" :key="itemIndex">
  144. <!-- 自定义关联变量 -->
  145. <uni-easyinput v-if="repeatingForm.elementItem[itemIndex].bddzText" :placeholder="''"
  146. :type="fieldTypeDict[repeatingForm.elementItem[itemIndex].fieldType.value] || 'text'"
  147. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))"
  148. :value="calculateRepeatingFormExpression(elem, table)" :disabled="true"></uni-easyinput>
  149. <!-- 数值输入框 -->
  150. <uni-easyinput v-else-if="'1' == repeatingForm.elementItem[itemIndex].fieldType.value"
  151. placeholder="请输入内容" v-model="elem.defaultValue" @input="digitInput($event, elem)"
  152. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))" type="digit"></uni-easyinput>
  153. <!-- 输入框 -->
  154. <uni-easyinput v-else placeholder="请输入内容" v-model="elem.defaultValue" type="'text'"
  155. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))"></uni-easyinput>
  156. </uni-forms-item>
  157. </uni-forms>
  158. <!-- <view class="repeating_table_button_container">
  159. <uni-row>
  160. <uni-col :span="10" :offset="1">
  161. <button @click="addrepeatingFormItem(tableIndex)" type="primary">新增</button>
  162. </uni-col>
  163. <uni-col :span="10" :offset="2">
  164. <button @click="delrepeatingFormItem(tableIndex)"
  165. :disabled="repeatingForm.elements.length <= 1" type="warn">删除</button>
  166. </uni-col>
  167. </uni-row>
  168. </view> -->
  169. </uni-card>
  170. <!-- <uni-popup v-if="flowInfo.seModel == '0' && repeatingFormNotEmpty" ref="repeatingFormPopup">
  171. <uni-card margin="0px" spacing="0px" padding="0px">
  172. <view class="repeating_table_container">
  173. <uni-table :border="true" stripe>
  174. <uni-tr>
  175. <uni-th align="center" v-for="(item, index) in repeatingForm.elementItem" :key="index">
  176. {{ item.elementName.slice(3, 5) }}
  177. </uni-th>
  178. </uni-tr>
  179. <uni-tr v-for="(table, tableIndex) in repeatingForm.elements" :key="tableIndex">
  180. <uni-td align="center" v-for="(elem, itemIndex) in table" :key="itemIndex">
  181. {{ elem.defaultValue }}
  182. </uni-td>
  183. </uni-tr>
  184. </uni-table>
  185. </view>
  186. </uni-card>
  187. </uni-popup> -->
  188. </view>
  189. <!-- 明细 -->
  190. <!-- <view class="repeating_table_detail2">
  191. <uni-card v-if="flowInfo.seModel == '0' && repeatingFormNotEmpty">
  192. <uni-section titleFontSize="1.3rem" title="明细" type="line"></uni-section>
  193. <uni-forms ref="baseForm" :modelValue="baseFormData" v-for="(table, tableIndex) in repeatingForm.elements" :key="tableIndex">
  194. <uni-forms-item v-for="(item, index) in repeatingForm.elementItem"
  195. :label="item.elementName.slice(3, 5)" :key="index">
  196. <text>{{table[index].defaultValue}}</text>
  197. </uni-forms-item>
  198. </uni-forms>
  199. </uni-card>
  200. </view> -->
  201. <view class="repeating_table_detail">
  202. <uni-card v-if="flowInfo.seModel == '0' && repeatingFormNotEmpty">
  203. <uni-section titleFontSize="1.3rem" title="明细" type="line"></uni-section>
  204. <view class="repeating_table_container">
  205. <uni-table :border="true" stripe>
  206. <uni-tr>
  207. <uni-th align="center" v-for="(item, index) in repeatingForm.elementItem" :key="index">
  208. {{ item.elementName.slice(3, 5) }}
  209. </uni-th>
  210. </uni-tr>
  211. <uni-tr v-for="(table, tableIndex) in repeatingForm.elements" :key="tableIndex">
  212. <uni-td align="center" v-for="(elem, itemIndex) in table" :key="itemIndex">
  213. {{ elem.defaultValue }}
  214. </uni-td>
  215. </uni-tr>
  216. </uni-table>
  217. </view>
  218. </uni-card>
  219. </view>
  220. <!-- 附件 -->
  221. <view v-for="(item, index) in fileList" :key="index">
  222. <uni-card v-if="item.files.length != undefined && item.files.length > 0">
  223. <uni-section titleFontSize="1.3rem" title="附件" type="line"></uni-section>
  224. <attachment-list @clickDelete="deleteFile" :canEdit="flowInfo.seModel == '1'"
  225. :attachments="item.files"></attachment-list>
  226. </uni-card>
  227. </view>
  228. <!-- 上传附件 -->
  229. <view v-if="processInfo.tinsId || flowInfo.seModel == '1'" class="file_picker_container">
  230. <uni-card title="上传附件" :extra="`${subFileList.length}/50`" spacing="0">
  231. <uni-file-picker ref="filePicker" v-model="subFileList" :auto-upload="true" mode="list" :limit="50"
  232. file-mediatype="all" @select="handleFileSelect" @progress="handleFileProgress"
  233. @success="handleFileSuccess" @fail="handleFileFail" @delete="handleFileDelete" />
  234. </uni-card>
  235. </view>
  236. <!-- 流转过程 -->
  237. <view>
  238. <uni-card>
  239. <view class="flow_step_container">
  240. <uni-section titleFontSize="1.3rem" title="流转过程" type="line"></uni-section>
  241. <up-steps :current="stepActive" activeColor="#18bc37" inactiveColor="#2979ff" direction="column">
  242. <view v-for="(step, index) in options" :key="index">
  243. <up-steps-item :contentClass="'redcontent'" v-if="step.state == 3"
  244. :title="step.title + ' 退回'" :desc="step.desc" :key="index" error></up-steps-item>
  245. <up-steps-item :contentClass="'redcontent'" v-else-if="step.state == 0"
  246. :title="step.title + ' 撤销'" :desc="step.desc" :key="index" error></up-steps-item>
  247. <up-steps-item v-else-if="index == stepActive" :title="step.title" :desc="step.desc"
  248. :key="index">
  249. <template #icon>
  250. <view class="active_step_circle">
  251. <text class="active_step_text">{{ index + 1 }}</text>
  252. </view>
  253. </template>
  254. </up-steps-item>
  255. <up-steps-item v-else :title="step.title" :desc="step.desc" :key="index"></up-steps-item>
  256. </view>
  257. </up-steps>
  258. </view>
  259. </uni-card>
  260. </view>
  261. <view v-if="processInfo.tinsId">
  262. <view class="remark_container">
  263. <uni-card>
  264. <uni-section titleFontSize="1.3rem" title="环节备注" type="line"></uni-section>
  265. <view class="remark_content">
  266. <uni-easyinput type="textarea" autoHeight v-model="remark" placeholder="请输入"
  267. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))"></uni-easyinput>
  268. </view>
  269. </uni-card>
  270. </view>
  271. </view>
  272. <view v-if="processInfo.tinsId" class="approve_button">
  273. <uni-card spacing="0" padding="0">
  274. <button :disabled="!button_state" :loading="!button_state" type="primary"
  275. @click="handleSubmitProcess('1')">
  276. {{ flowInfo.seModel == '0' ? '通过' : '提交' }}
  277. </button>
  278. </uni-card>
  279. </view>
  280. </view>
  281. <view v-if="processInfo.tinsId && flowInfo.seModel == '0'">
  282. <view class="reject_button">
  283. <uni-card spacing="0" padding="0" :is-shadow="false" :border="false">
  284. <uni-row>
  285. <uni-col :span="11">
  286. <button :disabled="!button_state" :loading="!button_state" type="warn"
  287. @click="handleSubmitProcess('0')">退回上一级</button>
  288. </uni-col>
  289. <uni-col :span="11" :offset="2">
  290. <button :disabled="!button_state" :loading="!button_state" type="warn"
  291. @click="handleSubmitProcess('2')">退回发起人</button>
  292. </uni-col>
  293. </uni-row>
  294. </uni-card>
  295. </view>
  296. </view>
  297. <view v-else-if="isCancel">
  298. <view class="remark_container">
  299. <uni-card>
  300. <uni-section titleFontSize="1.3rem" title="撤销备注" type="line"></uni-section>
  301. <view class="remark_content">
  302. <uni-easyinput type="textarea" autoHeight v-model="remark" placeholder="请输入"
  303. placeholderStyle="font-size: calc(14px + 1.2*(1rem - 16px))"></uni-easyinput>
  304. </view>
  305. </uni-card>
  306. </view>
  307. <view class="cancel_button_container" >
  308. <uni-card spacing="0" padding="0">
  309. <button :disabled="!button_state" :loading="!button_state" type="warn"
  310. @click="handleCancelProcess">撤销</button>
  311. </uni-card>
  312. </view>
  313. </view>
  314. <view style="height: 5px; margin-top: 20px;"></view>
  315. <!-- 签字版弹出层 -->
  316. <uni-popup ref="signaturePopup" @maskClick="closeSignaturePopup">
  317. <view class="signature_container" :class="{ 'signature_container_landscape': isLandscape }">
  318. <view class="signature_content">
  319. <l-signature ref="signatureRef" v-if="signaturePopupShow" :landscape="isLandscape" :penSize="8"
  320. :minLineWidth="4" :maxLineWidth="12" :openSmooth="true" :preferToDataURL="true"
  321. backgroundColor="#ffffff" penColor="black"></l-signature>
  322. </view>
  323. <view class="signature_button_container">
  324. <uni-row :gutter="10">
  325. <uni-col :span="6">
  326. <button type="warn" @click="onclickSignatureButton('undo')">撤销</button>
  327. </uni-col>
  328. <uni-col :span="6">
  329. <button type="warn" @click="onclickSignatureButton('clear')">清空</button>
  330. </uni-col>
  331. <uni-col :span="6">
  332. <button type="primary" @click="onclickSignatureButton('save')">保存</button>
  333. </uni-col>
  334. <uni-col :span="6">
  335. <button @click="onclickSignatureButton('landscape')">全屏</button>
  336. </uni-col>
  337. <!-- <uni-col :span="24">
  338. <button type="primary" @click="onclickAutosealButton()">一键签名</button>
  339. </uni-col> -->
  340. </uni-row>
  341. </view>
  342. </view>
  343. </uni-popup>
  344. </template>
  345. <script setup lang="ts">
  346. import { computed, onMounted, reactive, ref, nextTick } from 'vue'
  347. import { onLoad, onShow, onShareAppMessage } from '@dcloudio/uni-app'
  348. import { LSignatureToTempFilePathOptions, LSignatureToFileSuccess } from '@/uni_modules/lime-signature'
  349. import attachmentList from '@/components/ygoa/attachmentList.vue'
  350. import config from '@/config.js'
  351. import $tab from '@/plugins/tab.js'
  352. import $modal from '@/plugins/modal.js'
  353. import { getProcessFlowInfo, getProcessFormInfo, getProcessFormInfoInFlow, getProcessFlow, submitProcessFlow, cancelProcessFlow, uploadSignatureImg, uploadSignatureBoardImg, uploadFile, getSeal, getTacheInfo } from '@/api/process.js'
  354. import { getAttendanceSegment } from '@/api/work.js'
  355. import { useUserStore } from '@/store/user.js'
  356. import { getLoginInfo, getSession, setSession } from '@/utils/auth.js'
  357. import { reLogin, keepSession } from '@/api/login.js'
  358. import { convertToChineseCurrency } from '@/utils/ygoa.js'
  359. import { calCommonExp } from '@/utils/rpn.js'
  360. const fieldTypeDict = {
  361. '0': 'text',
  362. '1': 'digit'
  363. }
  364. const userStore = useUserStore()
  365. const processInfo = reactive({
  366. insId: '',
  367. insName: '',
  368. control: 1,
  369. username: '',
  370. reqOffice: 0,
  371. reqRemark: 0,
  372. tinsId: undefined,
  373. // tinsObj: {}//存储流转最后一步的对象
  374. })
  375. onLoad(({ insId, tinsId, insName, control }) => {
  376. // 获取传入的标题参数
  377. const title = insName || '流程信息';
  378. processInfo.insId = insId
  379. processInfo.insName = insName
  380. processInfo.control = control
  381. if (tinsId) {
  382. processInfo['tinsId'] = tinsId
  383. }
  384. // 设置导航栏标题
  385. uni.setNavigationBarTitle({
  386. title: title
  387. });
  388. })
  389. onShow(() => {
  390. keepSession().then(res => {
  391. if (typeof res === 'number') {
  392. return
  393. } else {
  394. const loginInfo = getLoginInfo()
  395. //如果有登录信息,就自动登录刷session
  396. if (Object.keys(loginInfo).length !== 0) {
  397. reLogin(loginInfo.username, loginInfo.password).then((res) => {
  398. if ("ok" === res.data) {
  399. setSession(res.cookies[0].split("=")[1].split(";")[0]);
  400. }
  401. }).catch(res => {
  402. console.log(res);
  403. })
  404. } else {
  405. $tab.reLaunch({ url: '/pages/login' })
  406. }
  407. }
  408. })
  409. .catch(err => {
  410. console.log('err', err);
  411. // $tab.navigateBack()
  412. })
  413. })
  414. onMounted(() => {
  415. initProcessForm() // 获取表单数据
  416. initProcessInfo() // 获取流程数据
  417. })
  418. //分享转发事件
  419. onShareAppMessage((res) => {
  420. if (res.from === 'menu') {
  421. // console.log('res', res)
  422. }
  423. let url = '/pages/tabbar-process/index?insId=' + processInfo.insId + '&insName=' + processInfo.insName + '&control=' + processInfo.control
  424. // console.log('url',url);
  425. return {
  426. title: processInfo.insName,
  427. path: url
  428. }
  429. })
  430. const repeatingForm = ref({
  431. elements: [],
  432. elementItem: [],
  433. })
  434. // 是否有重复表
  435. const repeatingFormNotEmpty = ref(false)
  436. function repeatingFormHasValue() {
  437. if (repeatingForm.value === undefined) return
  438. if (repeatingForm.value.elementItem.length <= 0) return
  439. repeatingForm.value.elements.forEach(({ defaultValue }) => {
  440. if (defaultValue != "") {
  441. repeatingFormNotEmpty.value = true
  442. return new Promise((resolve, reject) => {
  443. resolve(repeatingFormNotEmpty)
  444. })
  445. }
  446. })
  447. }
  448. // 新增重复表表单
  449. function addrepeatingFormItem(index) {
  450. // parseCalculation(repeatingForm.value.elementItem)
  451. const table = repeatingForm.value.elementItem.map(({ tableField, bddzText }) => {
  452. const item = {
  453. name: tableField,
  454. defaultValue: ""
  455. }
  456. if (bddzText != '') {
  457. const mulItem = bddzText.split('*')
  458. // 保存关联数据索引
  459. item['bddzText'] = mulItem.map(item => {
  460. // item['operation '].operands = mulItem.map(item => {
  461. return repeatingForm.value.elementItem.findIndex(({ elementName }) => item == elementName)
  462. })
  463. }
  464. return item
  465. })
  466. repeatingForm.value.elements.splice(index + 1, 0, table)
  467. }
  468. // 删除重复表表单
  469. function delrepeatingFormItem(index) {
  470. $modal.confirm('', '确认删除该重复表数据')
  471. .then(() => {
  472. repeatingForm.value.elements.splice(index, 1)
  473. // $repeatingForms.value.splice(index, 1)
  474. }).catch(() => { })
  475. }
  476. const formElements = ref([])
  477. const formInfo = ref({
  478. formElements: [],
  479. formId: '',
  480. formInsId: ''
  481. })
  482. const fileList = ref([])
  483. const isCancel = ref(false)
  484. // 获取流程表单
  485. function initProcessForm() {
  486. //debugger
  487. if (processInfo.tinsId) {
  488. // 待办审批流程表单数据todo
  489. getProcessFormInfoInFlow(userStore.user.useId, processInfo).then(({ returnParams }) => {
  490. console.log('returnParams', returnParams);
  491. const modifyReturnParams = (returnParams) => {
  492. return returnParams.formElements.map(element => {
  493. if (element.type === "5") {
  494. // 将 defaultValue 按逗号分割成数组
  495. element.defaultValue = element.defaultValue.split(",");
  496. }
  497. return element;
  498. });
  499. };
  500. formElements.value = modifyReturnParams(returnParams)
  501. formInfo.value = returnParams.formInfo[0]
  502. repeatingForm.value = returnParams.repeatingForm
  503. getMainFormRule()
  504. computedMainFormValue()
  505. if (returnParams.isCancel == 1) {
  506. isCancel.value = true
  507. }
  508. repeatingFormHasValue()
  509. bindTimeRangeData()
  510. remark.value = flowInfo.value.seModel == '0' ? '同意' : '重新提交'
  511. })
  512. } else {
  513. // 我的 在办 办结流程表单数据 todo
  514. getProcessFormInfo(userStore.user.useId, processInfo.insId).then(({ returnParams }) => {
  515. formElements.value = returnParams.formElements
  516. repeatingForm.value = returnParams.repeatingForm
  517. fileList.value = returnParams.fileList
  518. if (returnParams.isCancel == 1) {
  519. isCancel.value = true
  520. }
  521. repeatingFormHasValue()
  522. })
  523. }
  524. }
  525. const options = ref([])
  526. const stepActive = ref(-1)
  527. const flowInfo = ref({
  528. seModel: '0'
  529. })
  530. // 获取流程信息
  531. function initProcessInfo() {
  532. //debugger
  533. getProcessFlow(userStore.user.useId, processInfo).then(({ returnParams }) => {
  534. options.value = returnParams.list.map((item, index) => {
  535. const { tmodelName, name, createdate, finishdate, remark, state, task, groupName, positionName, processType } = item
  536. if (state == 1) {
  537. stepActive.value = index
  538. }
  539. let title = tmodelName + (name == '' ? '' : ' ( ' + name + ' ' + groupName + '-' + positionName + ' )')
  540. if(state != 1) {
  541. title += processType== 1 ? ' \uD83D\uDCF1' : ' \uD83D\uDCBB'
  542. }
  543. let desc = '创建时间: ' + createdate
  544. + (finishdate == '' ? '' : '\n办理时间: ' + finishdate)
  545. + (remark == '' ? '' : '\n环节意见: ' + remark)
  546. if(task && task.length > 0) {
  547. desc += '\n抄送信息'
  548. task.forEach((taskitem) => {
  549. desc += '\n抄送对象:(' + taskitem.username + ') 抄送时间: ' + taskitem.createdate
  550. })
  551. }
  552. return {
  553. title,
  554. desc,
  555. state
  556. }
  557. })
  558. if (stepActive.value === -1) stepActive.value = returnParams.list.length
  559. // 获取未完成过程
  560. if (processInfo.tinsId) {
  561. getProcessFlowInfo(userStore.user.useId, processInfo).then(({ returnParams }) => {
  562. options.value.push({ title: returnParams.nextTmodels[0].nextTmodelName })
  563. flowInfo.value = returnParams.flow[0]
  564. fileList.value = [
  565. { files: returnParams.flow[0].files }
  566. ]
  567. processInfo.reqOffice = returnParams.tmodel.reqOffice
  568. processInfo.reqRemark = returnParams.tmodel.reqRemark
  569. })
  570. }
  571. console.log('options', options.value);
  572. })
  573. }
  574. // 下拉框
  575. function bindPickerChange(e, item) {
  576. const index = e.detail.value;
  577. item.defaultValue = item.typeDetail.enum[index].enumVname
  578. }
  579. function formatDict(dict) {
  580. return dict.map(({ enumVname }) => enumVname)
  581. }
  582. //数据选择器
  583. function formatCheckbox(elem) {
  584. let dict = elem.typeDetail.enum
  585. // elem['checkBox'] = ''
  586. return dict.map((item, index) => ({
  587. text: item.enumVname,
  588. value: item.enumVname
  589. }));
  590. }
  591. function changeDataCheckBox(e, elem) {
  592. elem['checkBox'] = e.detail.value.join(",")
  593. // console.log(e)
  594. }
  595. //单选框切换事件
  596. function changeDataSingleCheckBox(){
  597. }
  598. const timeRangeItems = ref([
  599. ['开始时间', '结束时间', '多少小时'],
  600. ['出发时间', '预计返回时间'],
  601. ['出差时间', '返回时间', '出差天数'],
  602. ['出门时间', '预计返回时间'],
  603. ['开始时间', '结束时间', '合计小时'],
  604. ])
  605. // 关联时间变量
  606. function bindTimeRangeData() {
  607. return new Promise<void>((resolve) => {
  608. timeRangeItems.value.forEach((range) => {
  609. const [startName, endName, bindName] = range;
  610. // 找到 startName 和 endName 的索引
  611. const startIndex = formElements.value.findIndex((item) => item.elementName === startName);
  612. const endIndex = formElements.value.findIndex((item) => item.elementName === endName);
  613. const formatDate = (date) => {
  614. const pad = (num) => num.toString().padStart(2, '0');
  615. return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
  616. }
  617. // 只有找到 startName 和 endName 后,才检查 bindName
  618. if (startIndex !== -1 && endIndex !== -1) {
  619. if (formElements.value[startIndex].defaultValue == '') {
  620. formElements.value[startIndex].defaultValue = formatDate(new Date())
  621. } else {
  622. formElements.value[startIndex].defaultValue = formatDate(new Date(formElements.value[startIndex].defaultValue))
  623. }
  624. if (bindName) {
  625. const bindIndex = formElements.value.findIndex((item) => item.elementName === bindName);
  626. if (bindIndex !== -1) {
  627. // 所有匹配项都存在,保存索引
  628. formElements.value[startIndex].endElemIndex = endIndex;
  629. formElements.value[endIndex].startElemIndex = startIndex;
  630. formElements.value[bindIndex].bindTimeRange = {
  631. startIndex,
  632. endIndex
  633. };
  634. setAttendanceSegment() // 获取班次信息
  635. }
  636. } else {
  637. // 没有 bindName,仅保存 start 和 end 的索引
  638. formElements.value[startIndex].endElemIndex = endIndex;
  639. formElements.value[endIndex].startElemIndex = startIndex;
  640. }
  641. // TODO 加班开始时间默认当天下班时间 请假时间默认当天上班时间
  642. }
  643. });
  644. resolve(); // 返回一个 resolved 状态的 Promise
  645. });
  646. }
  647. // 计算时间差
  648. function calculateBusinessDifference(item, form) {
  649. return item.defaultValue = (calculateTimeDifference(item, form) / 7).toFixed(2)
  650. }
  651. function calculateTimeDifference(item, form) {
  652. // 获取 开始时间 和 结束时间
  653. const { startIndex, endIndex } = item.bindTimeRange;
  654. const startTime = new Date(form[startIndex].defaultValue);
  655. const endTime = new Date(form[endIndex].defaultValue);
  656. // 检查时间是否合法
  657. if (isNaN(startTime.getTime()) || isNaN(endTime.getTime())) {
  658. return item.defaultValue = 0
  659. }
  660. // 请假申请的时间差 表单项为合计小时
  661. const type = item.elementName == '合计小时' ? '非工作时间' : '工作时间'
  662. // 计算时间差
  663. const timeDifferenceInHours = calculateWorkingHours(startTime, endTime, type);
  664. // const timeDifferenceInMs = endTime - startTime;
  665. // let timeDifferenceInHours = (timeDifferenceInMs / (1000 * 60 * 60)).toFixed(1);
  666. // let timeDifferenceInHours = (timeDifferenceInMs / (1000 * 60 * 60))
  667. // // 计算小数部分
  668. // const decimalPart = timeDifferenceInHours - Math.floor(timeDifferenceInHours)
  669. // if (decimalPart >= 0.5) {
  670. // // 如果小数部分大于等于 0.5,向上取整到 0.5 的倍数
  671. // timeDifferenceInHours = Math.floor(timeDifferenceInHours) + 0.5;
  672. // } else {
  673. // // 如果小数部分小于 0.5,向下取整到 0.5 的倍数
  674. // timeDifferenceInHours = Math.floor(timeDifferenceInHours);
  675. // }
  676. // 保存到 defaultValue
  677. return item.defaultValue = Number(timeDifferenceInHours.toFixed(2));
  678. }
  679. let workingPeriods = [
  680. { start: "09:00", end: "12:00" }, // 上午
  681. { start: "13:30", end: "17:30" }, // 下午
  682. ]
  683. let workDays = [1, 2, 3, 4, 5, 6, 0] // 0为周日
  684. // 获取考勤时间段
  685. function setAttendanceSegment() {
  686. getAttendanceSegment(userStore.user.unitId).then(({ returnParams }) => {
  687. const workTime = returnParams[0].work_time.split(';')
  688. let workDayArr = returnParams[0].work_days.split(',')
  689. let workTimeArr = []
  690. for (const time of workTime) {
  691. if (time == '') continue
  692. const times = time.split(',')
  693. const obj = {
  694. start: times[0],
  695. end: times[1]
  696. }
  697. workTimeArr.push(obj)
  698. }
  699. if (workTimeArr.length != 0) {
  700. workingPeriods = workTimeArr
  701. }
  702. workDayArr = workDayArr.map(item => Number(item))
  703. const sundayIndex = workDayArr.findIndex(item => item == 7)
  704. // console.log('workDays: ', workDayArr);
  705. if (sundayIndex != -1) {
  706. workDayArr[sundayIndex] = 0
  707. }
  708. if (workDayArr.length != 0) {
  709. workDays = workDayArr
  710. }
  711. })
  712. }
  713. function calculateWorkingHours(startTime, endTime, type) {
  714. // 将时间字符串解析为分钟数
  715. const formatTime = (timeString) => {
  716. const [hours, minutes] = timeString.split(":").map(Number)
  717. return hours * 60 + minutes
  718. };
  719. // 计算两个时间段的重叠部分
  720. const calculateOverlap = (start1, end1, start2, end2) => {
  721. const overlapStart = Math.max(start1, start2)
  722. const overlapEnd = Math.min(end1, end2)
  723. return Math.max(0, overlapEnd - overlapStart) // 如果无重叠返回 0
  724. };
  725. // 将 Date 转化为当天的分钟数
  726. const dateToMinutes = (date) => date.getHours() * 60 + date.getMinutes()
  727. // 判断日期是否是工作日
  728. const isRestdays = (date) => !workDays.includes(date.getDay())
  729. // 确保 startTime 和 endTime 是 Date 类型
  730. if (!(startTime instanceof Date) || !(endTime instanceof Date)) {
  731. throw new Error("startTime 和 endTime 必须是 Date 类型")
  732. }
  733. // 将时间范围分解为每天的计算
  734. const startDate = new Date(startTime)
  735. const endDate = new Date(endTime)
  736. startDate.setHours(0, 0, 0, 0)
  737. endDate.setHours(0, 0, 0, 0)
  738. let totalMinutes = 0
  739. // 遍历时间范围的每一天
  740. for (
  741. let currentDate = new Date(startDate);
  742. currentDate <= endDate;
  743. currentDate.setDate(currentDate.getDate() + 1)
  744. ) {
  745. const isStartDay = currentDate.getTime() === startDate.getTime();
  746. const isEndDay = currentDate.getTime() === endDate.getTime();
  747. // 当天的起始和结束时间
  748. const dayStart = isStartDay ? dateToMinutes(startTime) : 0;
  749. const dayEnd = isEndDay ? dateToMinutes(endTime) : 1440; // 1440 = 24 * 60
  750. // TODO 改为配置选择
  751. if (type == "工作时间") {
  752. // 如果当前日期不是工作日,跳过
  753. if (isRestdays(currentDate)) continue;
  754. // 计算工作时间段内的时间
  755. workingPeriods.forEach((period) => {
  756. const periodStart = formatTime(period.start);
  757. const periodEnd = formatTime(period.end);
  758. totalMinutes += calculateOverlap(dayStart, dayEnd, periodStart, periodEnd);
  759. });
  760. } else if (type == "非工作时间") {
  761. if (isRestdays(currentDate)) {
  762. // 计算非工作日时间差
  763. const midnight = new Date(currentDate)
  764. midnight.setHours(24, 0, 0, 0)
  765. const timeDiffInMs = dayEnd - dayStart
  766. totalMinutes += timeDiffInMs
  767. continue
  768. }
  769. // 计算非工作时间段的时间
  770. let nonWorkingMinutes = 0;
  771. let current = dayStart;
  772. for (const period of workingPeriods) {
  773. const periodStart = formatTime(period.start);
  774. const periodEnd = formatTime(period.end);
  775. if (current < periodStart) {
  776. nonWorkingMinutes += calculateOverlap(current, dayEnd, current, periodStart);
  777. }
  778. current = Math.max(current, periodEnd);
  779. }
  780. if (current < dayEnd) {
  781. nonWorkingMinutes += dayEnd - current;
  782. }
  783. totalMinutes += nonWorkingMinutes;
  784. }
  785. }
  786. // 转换为小时
  787. return totalMinutes / 60;
  788. }
  789. function setTimeRange(e) {
  790. // console.log('setTimeRange', e)
  791. }
  792. /**
  793. * 加密内容显示 - 将内容用 * 号替换
  794. * @param content 原始内容
  795. * @returns 加密后的字符串
  796. */
  797. function maskContent(content) {
  798. if (!content) return '';
  799. const str = String(content);
  800. if (str.length === 0) return '';
  801. // 全部用 * 替换
  802. return '*'.repeat(str.length);
  803. }
  804. /**
  805. * 复制加密内容到剪贴板
  806. * @param content 要复制的原始内容
  807. */
  808. function copyEncryptedContent(content) {
  809. if (!content) {
  810. $modal.msg('没有可复制的内容');
  811. return;
  812. }
  813. // #ifdef H5
  814. const input = document.createElement('input');
  815. input.value = String(content);
  816. document.body.appendChild(input);
  817. input.select();
  818. try {
  819. document.execCommand('copy');
  820. $modal.msgSuccess('复制成功');
  821. } catch (err) {
  822. $modal.msgError('复制失败');
  823. } finally {
  824. document.body.removeChild(input);
  825. }
  826. // #endif
  827. // #ifdef APP-PLUS || MP-WEIXIN
  828. uni.setClipboardData({
  829. data: String(content),
  830. success: () => {
  831. $modal.msgSuccess('复制成功');
  832. },
  833. fail: () => {
  834. $modal.msgError('复制失败');
  835. }
  836. });
  837. // #endif
  838. }
  839. // 生成人民币大写
  840. function computedNumberToChineseCurrency(item, form) {
  841. const elem = form.find(elem => !elem.elementName.endsWith('大写') && (elem.BddzText == item.BddzText || elem.elementName == item.BddzText.slice(3)))
  842. if(elem != null) {
  843. console.log("大写转换")
  844. return item.defaultValue = convertToChineseCurrency(elem.defaultValue);
  845. } else {
  846. return '';
  847. }
  848. }
  849. // 按照公式统计数据
  850. function computedBddzTextValue(item) {
  851. const mainIndex = formElements.value.findIndex(({ elementName }) => elementName == item.BddzText.slice(3))
  852. const reIndex = repeatingForm.value.elementItem.findIndex(({ elementName }) => elementName == item.BddzText)
  853. if (item.defaultValue) {
  854. if (mainIndex != -1) {
  855. return item.defaultValue = formElements.value[mainIndex].defaultValue
  856. }
  857. if (reIndex != -1) {
  858. return computedValueToRepeatingForm(item)
  859. }
  860. }
  861. }
  862. // 统计重复表数据
  863. function computedValueToRepeatingForm(item) {
  864. const index = repeatingForm.value.elementItem.findIndex(({ elementName }) => elementName.slice(3) == item.BddzText.slice(3))
  865. let result = 0
  866. for (const formItem of repeatingForm.value.elements) {
  867. result += Number(formItem[index].defaultValue) || 0
  868. }
  869. if (item.defaultValue) {
  870. return item.defaultValue = Number(result.toFixed(2))
  871. }
  872. }
  873. function digitInput(event, item) {
  874. // 获取输入框当前的值
  875. let currentValue = event;
  876. // 过滤非数字和小数点的字符
  877. currentValue = currentValue.replace(/[^0-9.]/g, '');
  878. // 处理前导零的情况:
  879. // 如果当前值没有小数点(即是整数),去掉前导零
  880. if (currentValue.indexOf('.') === -1) {
  881. currentValue = currentValue.replace(/^0+(?=\d)/, ''); // 只有当有数字跟随时才去掉前导零
  882. } else {
  883. // 如果包含小数点,处理整数部分的前导零,保留小数部分
  884. let parts = currentValue.split('.');
  885. parts[0] = parts[0].replace(/^0+(?=\d)/, ''); // 只去掉整数部分的前导零
  886. currentValue = parts.join('.'); // 重新拼接
  887. }
  888. // 防止多个小数点
  889. const parts = currentValue.split('.');
  890. let finalValue;
  891. if (parts.length > 2) {
  892. // 如果有多个小数点,保留第一个小数点及后续数字
  893. finalValue = parts[0] + '.' + parts[1];
  894. } else {
  895. finalValue = currentValue;
  896. }
  897. // 更新最终结果到 item
  898. nextTick(() => {
  899. item.defaultValue = finalValue;
  900. event = finalValue; // 更新输入框的值
  901. });
  902. return event;
  903. }
  904. // 计算重复表关联变量表达式结果值
  905. function calculateRepeatingFormExpression(item, form) {
  906. // 提取表达式中的变量名
  907. const variablePattern = /my:[\u4e00-\u9fa5]+/g;
  908. let match;
  909. let expression = item.BddzText
  910. // 替换表达式中的变量
  911. while ((match = variablePattern.exec(item.BddzText)) !== null) {
  912. const variableName = match[0]; // 完整变量名
  913. // 找到 重复表 中对应的索引
  914. const index = repeatingForm.value.elementItem.findIndex(item => item.elementName === variableName);
  915. if (index !== -1) {
  916. const value = form[index]?.defaultValue || 0;
  917. expression = expression.replace(match[0], value);
  918. } else {
  919. // 未匹配到的变量替换为 0
  920. expression = expression.replace(match[0], 0);
  921. }
  922. }
  923. if (/[^0-9\+\-\*\/\(\)\.]/.test(expression)) {
  924. console.error('错误的表达式:', expression);
  925. $modal.msg('自动计算错误,请手动输入')
  926. return item.defaultValue = 0;
  927. }
  928. return item.defaultValue = Number(calCommonExp(expression).toFixed(2)); // 返回填充后的表达式
  929. }
  930. const signaturePopup = ref(null)
  931. const signatureRef = ref(null)
  932. const signaturePopupShow = ref(false)
  933. const isLandscape = ref(false)
  934. const signatureItemIndex = ref(-1)
  935. function handleSignature(index) {
  936. signatureItemIndex.value = index
  937. signaturePopup.value.open()
  938. initSignature()
  939. }
  940. // 初始化签字板
  941. function initSignature() {
  942. signaturePopupShow.value = false
  943. setTimeout(() => {
  944. signaturePopupShow.value = true
  945. }, 100)
  946. }
  947. // 点击签字板按钮
  948. function onclickSignatureButton(event) {
  949. // console.log('onclickSignatureButton: ', event);
  950. switch (event) {
  951. case 'undo':
  952. signatureRef.value.undo()
  953. break;
  954. case 'clear':
  955. signatureRef.value.clear()
  956. break;
  957. case 'save':
  958. signatureRef.value.canvasToTempFilePath({
  959. success: (res : LSignatureToFileSuccess) => {
  960. if (res.isEmpty) {
  961. $modal.msgError('签名不能为空!')
  962. return
  963. }
  964. // 判断上传文件是否是base64
  965. if (res.tempFilePath.substring(0, 'data:image/png;base64,'.length) == 'data:image/png;base64,') {
  966. const _fileData = res.tempFilePath
  967. uploadSignatureBoardImg(userStore.user.useId, _fileData, formElements.value[signatureItemIndex.value].tableField)
  968. .then(({ returnParams }) => {
  969. formElements.value[signatureItemIndex.value].defaultValue = returnParams.sealInsID
  970. formElements.value[signatureItemIndex.value].sealImgPath = returnParams.path
  971. signatureItemIndex.value = -1
  972. signaturePopupShow.value = false
  973. signaturePopup.value.close()
  974. })
  975. } else {
  976. // 转 base64
  977. wx.getFileSystemManager().readFile({
  978. filePath: res.tempFilePath,
  979. encoding: 'base64',
  980. success: fileData => {
  981. const _fileData = 'data:image/png;base64,' + fileData.data
  982. uploadSignatureBoardImg(userStore.user.useId, _fileData, formElements.value[signatureItemIndex.value].tableField)
  983. .then(({ returnParams }) => {
  984. formElements.value[signatureItemIndex.value].defaultValue = returnParams.sealInsID
  985. formElements.value[signatureItemIndex.value].sealImgPath = returnParams.path
  986. signatureItemIndex.value = -1
  987. signaturePopupShow.value = false
  988. signaturePopup.value.close()
  989. })
  990. }
  991. })
  992. }
  993. }
  994. } as LSignatureToTempFilePathOptions)
  995. break;
  996. case 'landscape':
  997. isLandscape.value = !isLandscape.value
  998. initSignature()
  999. break;
  1000. }
  1001. }
  1002. function onclickAutosealButton(index) {
  1003. if (signatureItemIndex.value != -1) index = signatureItemIndex.value
  1004. getSeal(userStore.user.useId).then(({ returnParams }) => {
  1005. formElements.value[index].defaultValue = returnParams.sealFileId.universalid
  1006. formElements.value[index].sealImgPath = returnParams.sealFileId.path
  1007. signaturePopupShow.value = false
  1008. signaturePopup.value.close()
  1009. })
  1010. }
  1011. function closeSignaturePopup() {
  1012. signatureItemIndex.value = -1
  1013. signaturePopupShow.value = false
  1014. }
  1015. const repeatingFormPopup = ref(null)
  1016. // 查看重复表
  1017. function handleRepeatingForm() {
  1018. repeatingFormPopup.value.open()
  1019. }
  1020. // 附件管理
  1021. function deleteFile(file) {
  1022. // console.log('deleteFile: ',file);
  1023. fileList.value[0].files = fileList.value[0].files.filter(({ fileId }) => !(fileId == file.fileId))
  1024. }
  1025. // 上传附件
  1026. const subFileList = ref([]) // 文件列表
  1027. const subFileSeqs = ref([])
  1028. async function handleFileSelect(files) { // 新增文件
  1029. // console.log('handleFileSelect', files.tempFiles)
  1030. files.tempFiles.forEach(file => {
  1031. const data = {
  1032. name: file.name,
  1033. filePath: file.path,
  1034. }
  1035. uploadFile(data)
  1036. .then(res => {
  1037. file.seq = res.returnParams
  1038. subFileSeqs.value.push({ 'seq': res.returnParams, 'path': file.path })
  1039. subFileList.value.push(file)
  1040. $modal.msgSuccess('文件' + data.name + '上传成功')
  1041. })
  1042. .catch(err => {
  1043. $modal.msgError('文件' + data.name + '上传失败,请删除重新上传')
  1044. switch (err) {
  1045. case -201:
  1046. console.log('文件上传失败 未找到该文件');
  1047. break;
  1048. case -20201:
  1049. console.log('文件上传失败 返回值不是JSON字符串');
  1050. break;
  1051. }
  1052. })
  1053. })
  1054. // console.log('UploadFiles', files.tempFiles);
  1055. }
  1056. // 文件上传触发事件
  1057. function handleFileProgress(file, progress) {
  1058. // console.log('handleFileProgress', file, progress);
  1059. }
  1060. function handleFileSuccess(file, res) {
  1061. // console.log('handleFileSuccess', file, res);
  1062. }
  1063. function handleFileFail(file, err) {
  1064. // console.log('handleFileFail', file, err);
  1065. }
  1066. function handleFileDelete(file) { // 移除文件
  1067. // console.log('handleDelete', file)
  1068. subFileSeqs.value.splice(subFileSeqs.value.findIndex(({ path }) => path == file.tempFilePath))
  1069. }
  1070. const $mainForm = ref(null)
  1071. const $mainFormRules = ref({})
  1072. const mainFormValue = ref({})
  1073. const repeatingFormsValue = ref([])
  1074. const formatTypeDict = {
  1075. '0': 'string',
  1076. '1': 'number'
  1077. }
  1078. function computedMainFormValue() {
  1079. // 设置主表校验数据
  1080. mainFormValue.value = computed(() => {
  1081. const obj = {};
  1082. formElements.value.forEach(elem => {
  1083. if (!('0' != elem.canEdit && '8' != elem.type)) return
  1084. obj[elem.elementId] = elem.defaultValue;
  1085. });
  1086. return obj;
  1087. }).value
  1088. }
  1089. // 获取主表校验规则
  1090. function getMainFormRule() {
  1091. $mainFormRules.value = computed(() => {
  1092. const obj = {};
  1093. formElements.value.forEach(elem => {
  1094. if (!('0' != elem.canEdit && '8' != elem.type)) return
  1095. let labelName = elem.elementName
  1096. let errorMessage = ''
  1097. if ('13' == elem.type) errorMessage = '请完成签名'
  1098. obj[elem.elementId] = {
  1099. rules: [
  1100. {
  1101. required: '1' == elem.noNull,
  1102. errorMessage,
  1103. },
  1104. // {
  1105. // format: formatTypeDict[elem.fieldType] || 'string',
  1106. // }
  1107. ],
  1108. label: labelName
  1109. };
  1110. });
  1111. return obj;
  1112. }).value
  1113. }
  1114. function validateRepeatingForm2() {
  1115. // 设置重复表校验数据
  1116. const filterElements = repeatingForm.value.elements.filter(item => item.canEdit == "1")
  1117. if (filterElements.length == 0) return true
  1118. repeatingFormsValue.value = filterElements.map((item, index) => {
  1119. return computed(() => {
  1120. const obj = {};
  1121. item.forEach(({ name, defaultValue }) => {
  1122. obj[name] = defaultValue;
  1123. });
  1124. return obj;
  1125. }).value
  1126. })
  1127. let flag = false
  1128. repeatingFormsValue.value.forEach((item, index) => {
  1129. let ItemIndex = 0
  1130. for (const elem in item) {
  1131. if (item[elem] == '') {
  1132. const name = repeatingForm.value.elementItem[ItemIndex].elementName.slice(3)
  1133. $modal.msgError(`详情表 ${name} 数据填写错误`)
  1134. flag = false
  1135. return
  1136. }
  1137. ItemIndex++
  1138. }
  1139. flag = true
  1140. })
  1141. return flag
  1142. }
  1143. const button_state = ref(true)
  1144. const remark = ref('')
  1145. function handleSubmitProcess(result) {
  1146. let content = '确认退回'
  1147. if (result == "1") {
  1148. content = '确认通过'
  1149. }
  1150. $modal.confirm(content).then(() => {
  1151. // 如果是退回操作且备注为"同意",则清空备注
  1152. if ((result == '0' || result == '2') && remark.value == '同意') {
  1153. remark.value = ''
  1154. }
  1155. button_state.value = false
  1156. if (result == "1") {
  1157. // 处理主表校验数据
  1158. mainFormValue.value = computed(() => {
  1159. const obj = {};
  1160. formElements.value.forEach(elem => {
  1161. let value = elem.defaultValue
  1162. if (!('0' != elem.canEdit && '8' != elem.type)) return
  1163. if ('5' == elem.type && Array.isArray(elem.defaultValue)) {
  1164. value = elem.defaultValue.join(",")
  1165. }
  1166. obj[elem.elementId] = value;
  1167. });
  1168. return obj;
  1169. }).value
  1170. // console.log('$mainForm.value: ', $mainForm.value);
  1171. // 主表数据校验
  1172. $mainForm.value.validate().then(res => {
  1173. // 重复表数据校验
  1174. if (repeatingFormNotEmpty.value && !validateRepeatingForm2()) {
  1175. button_state.value = true
  1176. return
  1177. }
  1178. submitProcess(result)
  1179. })
  1180. .catch(err => {
  1181. button_state.value = true
  1182. $modal.msgError('表单填写错误')
  1183. })
  1184. } else {
  1185. submitProcess(result)
  1186. }
  1187. }).catch(() => { })
  1188. }
  1189. function submitProcess(result) {
  1190. let flow = Object.assign({}, flowInfo.value)
  1191. formInfo.value.formElements = formElements.value
  1192. // 过滤不可编辑的表单项
  1193. .filter(({ canEdit }) => canEdit == '1')
  1194. .map(({ tableField, defaultValue, type }) => {
  1195. let value = defaultValue
  1196. if ('5' == type && Array.isArray(defaultValue)) {
  1197. value = defaultValue.join(",")
  1198. }
  1199. return {
  1200. name: tableField,
  1201. value
  1202. }
  1203. })
  1204. repeatingForm.value.elements.forEach((table, index) => {
  1205. const newItem = table.map((item) => {
  1206. item['value'] = item.defaultValue
  1207. return item
  1208. })
  1209. formInfo.value.formElements.push(...newItem)
  1210. })
  1211. flow['staffId'] = userStore.user.useId
  1212. flow['gxId'] = userStore.user.gxId
  1213. flow['groupId'] = flowInfo.value.groupid
  1214. if (result == "1") {
  1215. const seqs = subFileSeqs.value.map(({ seq }) => seq)
  1216. if (flowInfo.value.seModel == '0' && processInfo.reqOffice == 1 && seqs.length == 0) {
  1217. button_state.value = true
  1218. $modal.msgError('请上传附件')
  1219. return
  1220. } else {
  1221. flow['fileIds'] = seqs
  1222. }
  1223. if (processInfo.reqRemark == 1 && remark.value == '') {
  1224. button_state.value = true
  1225. $modal.msgError('请填写备注')
  1226. return
  1227. }
  1228. } else {
  1229. flow.fileIds = []
  1230. flow.files = []
  1231. }
  1232. flow['remark'] = remark.value
  1233. // result: 1通过 2退回发起人 0退回上一级
  1234. flow['result'] = result
  1235. flow['nextTmodelId'] = 'undefined'
  1236. submitProcessFlow(flow, formInfo.value, processInfo.control).then(({ returnMsg }) => {
  1237. if (returnMsg.includes('提交失败')) {
  1238. // 启用提交按钮
  1239. button_state.value = true
  1240. $modal.msgError(returnMsg)
  1241. } else {
  1242. $modal.msgSuccess(returnMsg)
  1243. // 通知列表刷新数据
  1244. uni.$emit('ReloadProcessData');
  1245. setTimeout(() => {
  1246. $tab.navigateBack();
  1247. }, 1000)
  1248. }
  1249. })
  1250. }
  1251. // 取消流程
  1252. function handleCancelProcess() {
  1253. if (remark.value.trim() == '') {
  1254. $modal.msgError('备注不能为空!')
  1255. return
  1256. }
  1257. $modal.confirm('确认撤销').then(() => {
  1258. cancelProcess()
  1259. }).catch(() => { })
  1260. }
  1261. function cancelProcess() {
  1262. cancelProcessFlow(userStore.user.useId, remark.value, processInfo).then(({ returnMsg }) => {
  1263. if (returnMsg.includes('success')) {
  1264. $modal.msgSuccess('撤销成功')
  1265. // 通知列表刷新数据
  1266. uni.$emit('ReloadProcessData');
  1267. setTimeout(() => {
  1268. $tab.navigateBack();
  1269. }, 1000)
  1270. } else {
  1271. // 启用按钮
  1272. button_state.value = true
  1273. $modal.msgError(returnMsg)
  1274. }
  1275. })
  1276. }
  1277. </script>
  1278. <style lang="scss" scoped>
  1279. ::v-deep .uni-section {
  1280. margin-left: -15px;
  1281. margin-bottom: 10px;
  1282. }
  1283. .signature_container {
  1284. background-color: #f5f5f5;
  1285. height: 40vh;
  1286. width: 90vw;
  1287. .signature_content {
  1288. height: 80%;
  1289. width: 100%;
  1290. }
  1291. .signature_button_container {
  1292. height: 20%;
  1293. width: 100%;
  1294. button {
  1295. height: 100%;
  1296. }
  1297. }
  1298. }
  1299. .signature_container_landscape {
  1300. height: 100vh;
  1301. width: 100vw;
  1302. .signature_content {
  1303. height: 85%;
  1304. width: 100%;
  1305. }
  1306. .signature_button_container {
  1307. margin-top: 10%;
  1308. height: 15%;
  1309. width: 100%;
  1310. button {
  1311. height: 100%;
  1312. width: 100%;
  1313. transform: rotate(90deg);
  1314. }
  1315. }
  1316. }
  1317. .process_detail_container {
  1318. position: relative;
  1319. ::v-deep uni-card{
  1320. .uni-card{
  1321. padding: 0 8px !important;
  1322. }
  1323. }
  1324. .repeating_table {
  1325. ::v-deep .uni-forms {
  1326. .uni-forms-item__label {
  1327. font-size: calc(1rem + 0px) !important;
  1328. line-height: calc(1rem + 0px) !important;
  1329. font-weight: 700;
  1330. }
  1331. .uni-forms-item__content {
  1332. font-size: calc(14px + (1rem - 16px)) !important;
  1333. font-weight: 500;
  1334. .uni-easyinput__content-input {
  1335. height: calc(35px + .5*(1rem - 16px)) !important;
  1336. font-size: calc(14px + (1rem - 16px)) !important;
  1337. font-weight: 500;
  1338. }
  1339. }
  1340. }
  1341. ::v-deep .uni-forms-item--border {
  1342. padding: 5px 0 !important;
  1343. }
  1344. .repeating_table_button_container {
  1345. margin-top: 5px;
  1346. button {
  1347. height: 36px;
  1348. line-height: 36px;
  1349. color: #fff;
  1350. }
  1351. .add {
  1352. background-color: #1ca035;
  1353. }
  1354. .del {
  1355. background-color: #e64340;
  1356. }
  1357. }
  1358. }
  1359. .main_container {
  1360. min-height: 40vh;
  1361. ::v-deep .uni-forms {
  1362. .uni-forms-item__label {
  1363. font-size: calc(1rem + 0px) !important;
  1364. line-height: calc(1rem + 0px) !important;
  1365. font-weight: 700;
  1366. }
  1367. .uni-forms-item__content {
  1368. font-size: calc(14px + (1rem - 16px)) !important;
  1369. font-weight: 500;
  1370. .uni-easyinput__content-textarea {
  1371. font-size: calc(14px + (1rem - 16px)) !important;
  1372. font-weight: 500;
  1373. }
  1374. .uni-easyinput__content-input {
  1375. height: calc(35px + .5*(1rem - 16px)) !important;
  1376. font-size: calc(14px + (1rem - 16px)) !important;
  1377. font-weight: 500;
  1378. color: #333;
  1379. }
  1380. .uni-date {
  1381. .uni-icons {
  1382. font-size: calc(22px + 1.2*(1rem - 16px)) !important;
  1383. font-weight: 500;
  1384. }
  1385. .uni-date__x-input {
  1386. height: auto;
  1387. font-size: calc(14px + 1.2*(1rem - 16px)) !important;
  1388. font-weight: 500;
  1389. }
  1390. }
  1391. }
  1392. }
  1393. .element_value_container {
  1394. .signature_img {
  1395. width: 180px;
  1396. }
  1397. .element_value {
  1398. line-height: 36px;
  1399. }
  1400. }
  1401. }
  1402. // ::v-deep .repeating_table_detail2{
  1403. // .uni-forms-item__content{
  1404. // margin: auto;
  1405. // }
  1406. // .uni-forms{
  1407. // border-top: 2px #eee solid;
  1408. // }
  1409. // .uni-forms-item__label {
  1410. // width: 125px !important;
  1411. // font-size: calc(1rem + 0px) !important;
  1412. // line-height: calc(1rem + 0px) !important;
  1413. // font-weight: 700;
  1414. // }
  1415. // .uni-forms-item__content {
  1416. // font-size: calc(14px + (1rem - 16px)) !important;
  1417. // font-weight: 500;
  1418. // .uni-date {
  1419. // .uni-icons {
  1420. // font-size: calc(22px + 1.2*(1rem - 16px)) !important;
  1421. // font-weight: 500;
  1422. // }
  1423. // }
  1424. // }
  1425. // }
  1426. ::v-deep .repeating_table_detail {
  1427. .uni-card {
  1428. padding: 0 !important;
  1429. }
  1430. .uni-card__content {
  1431. padding: 0 !important;
  1432. }
  1433. .uni-section {
  1434. margin: 10px 5px;
  1435. }
  1436. }
  1437. ::v-deep .repeating_table_container {
  1438. width: 92vw;
  1439. .uni-table-scroll {
  1440. max-height: 80vh;
  1441. .uni-table {
  1442. min-width: 100% !important;
  1443. .uni-table-th {
  1444. font-size: calc(14px + 1.2*(1rem - 16px)) !important;
  1445. min-width: calc(50px + 2.5*(1rem - 16px));
  1446. background-color: #2979ff;
  1447. font-weight: bold;
  1448. color: #fcfcfc;
  1449. }
  1450. .uni-table-td {
  1451. font-size: calc(14px + 1.2*(1rem - 16px)) !important;
  1452. }
  1453. }
  1454. }
  1455. }
  1456. ::v-deep .file_picker_container {
  1457. .uni-card {
  1458. .uni-card__header-content-title {
  1459. font-size: calc(15px + .5*(1rem - 16px));
  1460. }
  1461. .uni-card__header-extra-text {
  1462. font-size: calc(15px + .5*(1rem - 16px));
  1463. }
  1464. }
  1465. }
  1466. ::v-deep .flow_step_container {
  1467. min-height: 200px;
  1468. .u-steps {
  1469. .u-steps-item {
  1470. padding-bottom: 11px;
  1471. .u-text__value--tips {
  1472. font-size: calc(12px + .5*(1rem - 16px)) !important;
  1473. }
  1474. .redcontent {
  1475. .u-text__value--content {
  1476. color: #ff4500;
  1477. }
  1478. }
  1479. .active_step_circle {
  1480. width: 20px;
  1481. height: 20px;
  1482. box-sizing: border-box;
  1483. flex-shrink: 0;
  1484. border-radius: 100px;
  1485. border-width: 1px;
  1486. border-color: #A78BFA;
  1487. background-color: #A78BFA;
  1488. border-style: solid;
  1489. display: flex;
  1490. flex-direction: row;
  1491. align-items: center;
  1492. justify-content: center;
  1493. transition: background-color .3s;
  1494. .active_step_text {
  1495. color: #fff;
  1496. font-size: 11px;
  1497. display: flex;
  1498. flex-direction: row;
  1499. align-items: center;
  1500. justify-content: center;
  1501. text-align: center;
  1502. line-height: 11px;
  1503. }
  1504. }
  1505. }
  1506. .u-steps-item view:last-of-type {
  1507. margin-top: 0 !important;
  1508. .u-text__value--content {
  1509. font-size: calc(16px + .5*(1rem - 16px)) !important;
  1510. }
  1511. .u-text__value--main {
  1512. font-size: calc(16px + .5*(1rem - 16px)) !important;
  1513. font-weight: 500;
  1514. }
  1515. }
  1516. }
  1517. }
  1518. .approve_button {
  1519. position: sticky;
  1520. z-index: 10;
  1521. width: 100%;
  1522. bottom: 10px;
  1523. }
  1524. }
  1525. ::v-deep button {
  1526. font-size: calc(18px + .5*(1rem - 16px));
  1527. }
  1528. .reject_button {
  1529. ::v-deep .uni-card {
  1530. background-color: #f5f5f5;
  1531. }
  1532. }
  1533. .remark_container {
  1534. .remark_content {
  1535. margin-bottom: 10px;
  1536. ::v-deep .uni-easyinput {
  1537. .uni-easyinput__content-textarea {
  1538. font-size: calc(14px + .5*(1rem - 16px)) !important;
  1539. }
  1540. }
  1541. }
  1542. }
  1543. ::v-deep .uni-calendar__content {
  1544. margin: -20px;
  1545. margin-top: 20px;
  1546. // 防止鸿蒙系统上日期选择器误触发返回
  1547. pointer-events: auto;
  1548. .uni-calendar__header {
  1549. .uni-calendar__header-text {
  1550. font-size: calc(14px + .5*(1rem - 16px)) !important;
  1551. }
  1552. .uni-calendar__backtoday {
  1553. padding: 2px 8px 2px 10px !important;
  1554. font-size: calc(0.75rem + 0px) !important;
  1555. }
  1556. }
  1557. .uni-calendar__box {
  1558. .uni-calendar__weeks {
  1559. .uni-calendar__weeks-day {
  1560. .uni-calendar__weeks-day-text {
  1561. font-size: calc(14px + .5*(1rem - 16px)) !important;
  1562. }
  1563. }
  1564. .uni-calendar__weeks-item {
  1565. .uni-calendar-item__weeks-box-item {
  1566. .uni-calendar-item__weeks-box-circle {
  1567. width: calc(8px + .5*(1rem - 16px)) !important;
  1568. height: calc(8px + .5*(1rem - 16px)) !important;
  1569. top: calc(5px - .25*(1rem - 16px)) !important;
  1570. right: calc(5px - .25*(1rem - 16px)) !important;
  1571. }
  1572. .uni-calendar-item__weeks-box-text {
  1573. font-size: calc(14px + .5*(1rem - 16px)) !important;
  1574. }
  1575. .uni-calendar-item__weeks-lunar-text {
  1576. font-size: calc(12px + .5*(1rem - 16px)) !important;
  1577. }
  1578. }
  1579. }
  1580. }
  1581. }
  1582. .uni-date-changed {
  1583. .uni-date-changed--time-date {
  1584. font-size: calc(14px + 1*(1rem - 16px)) !important;
  1585. }
  1586. .uni-datetime-picker-text {
  1587. font-size: calc(14px + 1*(1rem - 16px)) !important;
  1588. }
  1589. }
  1590. }
  1591. .username {
  1592. color: #2979ff;
  1593. }
  1594. /* 加密内容容器样式 */
  1595. .encrypted_content_container {
  1596. display: flex;
  1597. align-items: center;
  1598. justify-content: space-between;
  1599. gap: 10px;
  1600. }
  1601. /* 加密文本样式 */
  1602. .encrypted_text {
  1603. flex: 1;
  1604. letter-spacing: 2px;
  1605. font-weight: 500;
  1606. }
  1607. /* 复制按钮样式 */
  1608. .copy_button {
  1609. padding: 0 15px;
  1610. height: 32px;
  1611. line-height: 32px;
  1612. font-size: 12px;
  1613. border-radius: 4px;
  1614. flex-shrink: 0;
  1615. }
  1616. </style>