DisposeRubbishForm.vue 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878
  1. <template>
  2. <view>
  3. <cu-custom :backUrl="'/pages/index/index?id=apps'" :isBack="true" bgColor="bg-gradual-blue">
  4. <block slot="content">建筑垃圾清运处理</block>
  5. </cu-custom>
  6. <!-- First Section: 巡视工单 to 联系方式 -->
  7. <view class="form-section">
  8. <!-- 遮罩层 -->
  9. <view v-if="isProcessing" class="mask"></view>
  10. <u--form :model="inputForm" labelWidth="100px" class="u-form" labelPosition="left" :rules="rules" ref="inputForm" v-if="!nodeFlag">
  11. <u-form-item label="清运编号" prop="no">
  12. <u--input v-model="inputForm.no" :disabled="true" placeholder="工单编号" clearable></u--input>
  13. </u-form-item>
  14. <u-form-item label="所属单位" prop="processingUnitName" :required="true" v-if="disFlag">
  15. <u--input v-model="inputForm.processingUnitName" :disabled="true" placeholder="所属单位" clearable></u--input>
  16. </u-form-item>
  17. <u-form-item label="村负责人" prop="clearUserName">
  18. <u--input v-model="inputForm.clearUserName" :disabled="true" placeholder="村负责人" clearable></u--input>
  19. </u-form-item>
  20. <u-form-item label="联系方式" prop="clearUserMobile">
  21. <u--input v-model="inputForm.clearUserMobile" :disabled="true" placeholder="联系方式" clearable></u--input>
  22. </u-form-item>
  23. <u-form-item label="处理方式" prop="disposeType" :required="true">
  24. <jp-picker v-model="inputForm.disposeType" rangeKey="label" rangeValue="value" :range="[
  25. { label: '转运调剂处理', value: '1' },
  26. { label: '自行处理', value: '2' },
  27. ]" ></jp-picker>
  28. </u-form-item>
  29. <u-form-item label="垃圾站点" prop="rubbishStation">
  30. <u--input v-model="inputForm.rubbishStation" :disabled="true" placeholder="垃圾站点" clearable></u--input>
  31. </u-form-item>
  32. <template>
  33. <div>
  34. <u-form-item
  35. v-for="(item, index_workOver) in inputForm.workOverNoList"
  36. :key="index_workOver"
  37. :label="`巡视工单 ${index_workOver + 1}`"
  38. :required="true"
  39. :prop="'workOverNoList[' + index_workOver + '].no'"
  40. >
  41. <div style="width: 100%" @click="showWorkOver(index_workOver)">
  42. <u--input v-model="inputForm.workOverNoList[index_workOver].no" readonly
  43. style="pointer-events: none;"
  44. placeholder="请选择巡视工单编号" @focus="showWorkOver(index_workOver)" clearable></u--input>
  45. <view >
  46. <text class="u-demo-block__title">{{inputForm.workOverNoList[index_workOver].no}}清理前照片</text>
  47. <view class="u-page__upload-item">
  48. <u-upload
  49. :disabled="true"
  50. :fileList="getFileList(index_workOver)"
  51. @afterRead="afterRead"
  52. name="1"
  53. multiple
  54. :maxCount="10"
  55. ></u-upload>
  56. </view>
  57. </view>
  58. <u-button type="error" text="删除" @click="removeRow(index_workOver)"></u-button>
  59. </div>
  60. </u-form-item>
  61. </div>
  62. </template>
  63. <u-form-item label="" >
  64. <u-button style="width: 100%" type="primary" @click="addRow()" plain>新增巡视工单</u-button>
  65. </u-form-item>
  66. </u--form>
  67. <u--form :model="inputForm" labelWidth="100px" class="u-form" labelPosition="left" :rules="rules" ref="inputForm" v-if="nodeFlag">
  68. <u-form-item label="清运编号" prop="no">
  69. <u--input v-model="inputForm.no" :disabled="true" placeholder="工单编号" clearable></u--input>
  70. </u-form-item>
  71. <u-form-item label="所属单位" prop="processingUnitName" :required="true" v-if="disFlag">
  72. <u--input v-model="inputForm.processingUnitName" :disabled="true" placeholder="所属单位" clearable></u--input>
  73. </u-form-item>
  74. <u-form-item label="村负责人" prop="clearUserName">
  75. <u--input v-model="inputForm.clearUserName" :disabled="true" placeholder="村负责人" clearable></u--input>
  76. </u-form-item>
  77. <u-form-item label="联系方式" prop="clearUserMobile">
  78. <u--input v-model="inputForm.clearUserMobile" :disabled="true" placeholder="联系方式" clearable></u--input>
  79. </u-form-item>
  80. <u-form-item label="处理方式" prop="disposeType" :required="true" >
  81. <jp-picker v-model="inputForm.disposeType" rangeKey="label" :disabled="true" rangeValue="value" :range="[
  82. { label: '转运调剂处理', value: '1' },
  83. { label: '自行处理', value: '2' },
  84. ]" ></jp-picker>
  85. </u-form-item>
  86. <u-form-item label="垃圾站点" prop="rubbishStation">
  87. <u--input v-model="inputForm.rubbishStation" :disabled="true" placeholder="垃圾站点" clearable></u--input>
  88. </u-form-item>
  89. <template>
  90. <div>
  91. <u-form-item
  92. v-for="(item, index_workOver) in inputForm.workOverNoList"
  93. :key="index_workOver"
  94. :label="`巡视工单 ${index_workOver + 1}`"
  95. :required="true"
  96. :prop="'workOverNoList[' + index_workOver + '].no'"
  97. >
  98. <u--input
  99. v-model="inputForm.workOverNoList[index_workOver].no"
  100. :disabled="true"
  101. placeholder="请选择巡视工单编号">
  102. </u--input>
  103. <u-button type="primary" style="width: 20%" text="处理" @click="disposeWorkOver(inputForm.workOverNoList[index_workOver].id)" v-if="!weighFlag"></u-button>
  104. </u-form-item>
  105. </div>
  106. </template>
  107. </u--form>
  108. </view>
  109. <!-- Second Section: 上传图片 -->
  110. <view class="form-section" v-if="nodeFlag">
  111. <text class="u-demo-block__title">清理前照片</text>
  112. <view class="u-page__upload-item">
  113. <u-upload
  114. :disabled="true"
  115. :fileList="fileList1"
  116. @afterRead="afterRead"
  117. name="1"
  118. multiple
  119. :maxCount="10"
  120. ></u-upload>
  121. </view>
  122. </view>
  123. <!-- Second Section: 上传图片 -->
  124. <view class="form-section" v-if="nodeFlag">
  125. <text class="u-demo-block__title">清理中照片</text>
  126. <view class="u-page__upload-item">
  127. <u-upload
  128. :disabled="true"
  129. :fileList="fileList2"
  130. @afterRead="afterRead"
  131. name="2"
  132. multiple
  133. :maxCount="10"
  134. ></u-upload>
  135. </view>
  136. </view>
  137. <!-- Second Section: 上传图片 -->
  138. <view class="form-section" v-if="nodeFlag">
  139. <text class="u-demo-block__title">清理后照片</text>
  140. <view class="u-page__upload-item">
  141. <u-upload
  142. :disabled="true"
  143. :fileList="fileList3"
  144. @afterRead="afterRead"
  145. name="3"
  146. multiple
  147. :maxCount="10"
  148. ></u-upload>
  149. </view>
  150. </view>
  151. <!-- Third Section: 备注 -->
  152. <view class="form-section" v-if="!nodeFlag">
  153. <u--form :model="inputForm" labelWidth="100px" class="u-form" labelPosition="left" :rules="rules" ref="inputForm" >
  154. <u-form-item label="备注" borderBottom prop="remarks">
  155. <u--textarea placeholder='请填写备注' :maxlength="500" v-model="inputForm.remarks"></u--textarea>
  156. </u-form-item>
  157. <!--<view class="button-container">
  158. <u-button
  159. text="提交"
  160. size="large"
  161. type="primary"
  162. @click="saveForm"
  163. ></u-button>
  164. </view>-->
  165. </u--form>
  166. </view>
  167. <!-- Third Section: 备注 -->
  168. <view class="form-section" v-if="nodeFlag || weighFlag">
  169. <u--form :model="inputForm" labelWidth="100px" class="u-form" labelPosition="left" :rules="rules" ref="inputForm" >
  170. <u-form-item label="备注" borderBottom prop="remarks">
  171. <u--textarea placeholder='请填写备注' :disabled="true" :maxlength="500" v-model="inputForm.remarks"></u--textarea>
  172. </u-form-item>
  173. </u--form>
  174. </view>
  175. <view class="form-section" v-if="weighFlag">
  176. <span style="color: #4396fd;">现场信息登记</span>
  177. <u--form :model="inputForm" labelWidth="100px" class="u-form" labelPosition="left" :rules="rules" ref="inputForm">
  178. <u-form-item label="重量(t)" prop="weight" :required="true">
  179. <u--input
  180. v-model="inputForm.weight"
  181. @input="handleInput('weight', $event)"
  182. placeholder="重量"
  183. clearable
  184. ></u--input>
  185. </u-form-item>
  186. <u-form-item label="运输里程(km)" prop="transportMileage" :required="true">
  187. <u--input
  188. v-model="inputForm.transportMileage"
  189. @input="handleInput('transportMileage', $event)"
  190. placeholder="运输里程"
  191. clearable
  192. ></u--input>
  193. </u-form-item>
  194. <u-form-item label="补贴(元)" prop="subsidy" :required="true">
  195. <u--input
  196. v-model="inputForm.subsidy"
  197. @input="handleInput('subsidy', $event)"
  198. placeholder="补贴"
  199. clearable
  200. ></u--input>
  201. </u-form-item>
  202. </u--form>
  203. </view>
  204. <!-- Second Section: 上传图片 -->
  205. <view class="form-section" v-if="weighFlag">
  206. <text style="color: black">过磅现场照片</text>
  207. <view class="u-page__upload-item" >
  208. <text class="u-demo-block__title">照片上传</text>
  209. <u-upload
  210. :fileList="fileList4"
  211. @afterRead="afterRead"
  212. @delete="deletePic"
  213. name="4"
  214. multiple
  215. :maxCount="10"
  216. ></u-upload>
  217. </view>
  218. </view>
  219. <WorkOverChoose ref="workOverChoose" @input="selectWorkOverChange" title="报告项目选择"/>
  220. </view>
  221. </template>
  222. <script>
  223. import disposeRubbishService from '@/api/garbageClearance/disposeRubbishService'
  224. import overService from '@/api/garbageClearance/overService'
  225. import WorkOverChoose from './WorkOverChoose'
  226. import taskService from "@/api/flowable/taskService"
  227. import {mapState, mapMutations, mapActions} from 'vuex'
  228. import * as $auth from "../../common/auth";
  229. import { EventBus } from '@/store/eventBus.js';
  230. export default {
  231. components: {
  232. WorkOverChoose,
  233. },
  234. computed: mapState({
  235. userInfo: (state) => state.user.userInfo,
  236. avatar: (state) => state.user.avatar
  237. }),
  238. data () {
  239. return {
  240. disFlag: true, // 启用动态获取处理单位则设置为false
  241. isProcessing: false, // 遮罩层
  242. uploadFlag: true, // 上传判定值
  243. processingUnits: [],
  244. taskName: '', //当前节点处理人节点名称
  245. fileList1: [],
  246. fileList2: [],
  247. fileList3: [],
  248. fileList4: [],
  249. nodeFlag: false,
  250. weighFlag: false, // 过磅管理员看到的信息
  251. inputForm: {
  252. programId: '',
  253. programIds: [],
  254. no: '',
  255. processingUnit: '',
  256. processingUnitName: '',
  257. clearUserId: '',
  258. clearUserName: '',
  259. clearUserMobile: '',
  260. remarks: '',
  261. status: '',
  262. workOverNoList: [],
  263. disposeType: '',
  264. rubbishStation: '',
  265. weight: '',
  266. transportMileage: '',
  267. subsidy: '',
  268. },
  269. rules: {
  270. 'processingUnit': [
  271. {
  272. required: true,
  273. message: '处理单位不能为空',
  274. trigger: ['blur', 'change']
  275. }
  276. ],
  277. }
  278. }
  279. },
  280. // 页面加载时执行
  281. async created() {
  282. EventBus.$on('refreshPhoto', this.refreshPhoto);
  283. if(!this.nodeFlag){
  284. let data = await disposeRubbishService.getMaxNo();
  285. if (data) {
  286. let newNo = parseInt(data, 10) + 1;
  287. this.inputForm.no = newNo;
  288. } else {
  289. // 获取当前年份
  290. let nowY = new Date().getFullYear();
  291. this.inputForm.no = nowY + '0001';
  292. }
  293. //获取垃圾站点信息
  294. let rubbishStation = await disposeRubbishService.getRubbishStation();
  295. this.inputForm.rubbishStation = rubbishStation;
  296. this.inputForm.processingUnit = this.userInfo.officeDTO.id
  297. this.inputForm.processingUnitName = this.userInfo.officeDTO.name
  298. // 不动态获取 根据当前登录人去查
  299. await overService.getUserInfoByOffId(this.userInfo.officeDTO.id)
  300. .then(data => {
  301. this.inputForm.clearUserId = data.id
  302. this.inputForm.clearUserName = data.name
  303. this.inputForm.clearUserMobile = data.mobile
  304. })
  305. .catch(e => {
  306. throw e;
  307. });
  308. }
  309. },
  310. props: {
  311. businessId: {
  312. type: String,
  313. default: ''
  314. },
  315. formReadOnly: {
  316. type: Boolean,
  317. default: false
  318. },
  319. status: {
  320. type: String,
  321. default: ''
  322. }
  323. },
  324. watch: {
  325. 'businessId': {
  326. handler (newVal) {
  327. if (this.businessId) {
  328. this.init(this.businessId)
  329. } else {
  330. this.$nextTick(() => {
  331. // this.$refs.inputForm.reset()
  332. })
  333. }
  334. },
  335. immediate: true,
  336. deep: false
  337. },
  338. },
  339. methods: {
  340. handleMouseDown(event) {
  341. console.log('21312312')
  342. event.preventDefault(); // 防止选择文本
  343. this.$refs.input.focus(); // 使 input 获得焦点
  344. },
  345. getFileList(index_workOver) {
  346. // 返回当前行的文件列表
  347. return this.inputForm.workOverNoList[index_workOver].photos || [];
  348. },
  349. handleInput(field, value) {
  350. // Ensure value is a string and sanitize input
  351. value = value.toString();
  352. // Regular expression to match numbers with up to 2 decimal places and ensure positive value
  353. const regex = /^(?!.*[a-zA-Z])\-?\d+(\.\d{0,2})?$/;
  354. // Format the value based on regex
  355. const match = value.match(regex);
  356. let formattedValue = (match && match[0]) || '';
  357. // Ensure the value is positive
  358. if (parseFloat(formattedValue) < 0) {
  359. formattedValue = '';
  360. }
  361. // Update input form based on the field
  362. this.inputForm[field] = formattedValue;
  363. },
  364. async init(id) {
  365. this.nodeFlag = true;
  366. this.inputForm.id = id;
  367. if (id) {
  368. // 使用 await 等待查询结果
  369. const data = await disposeRubbishService.queryById(id);
  370. // 获取当前节点流程信息,并等待其执行完成
  371. const taskName = await taskService.getTaskNameByProcInsId(data.procInsId);
  372. this.taskName = taskName
  373. // 根据任务名称处理逻辑
  374. if (this.isNotEmpty(taskName)) {
  375. if (taskName === '发起人重新申请' || this.isEmpty(taskName)) {
  376. this.nodeFlag = false;
  377. } else if (taskName === '过磅专员处理') {
  378. this.nodeFlag = true;
  379. this.weighFlag = true;
  380. }
  381. }
  382. // 恢复表单数据
  383. this.inputForm = this.recover(this.inputForm, data);
  384. // 处理文件列表
  385. if (data.fileList1) {
  386. this.fileList1 = data.fileList1.map(item => ({
  387. attachmentName: item.name,
  388. fileSize: item.size,
  389. url: item.temporaryUrl,
  390. type: item.type // 如果不需要,可以不写
  391. }));
  392. }
  393. if (data.fileList2) {
  394. this.fileList2 = data.fileList2.map(item => ({
  395. attachmentName: item.name,
  396. fileSize: item.size,
  397. url: item.temporaryUrl,
  398. type: item.type // 如果不需要,可以不写
  399. }));
  400. }
  401. if (data.fileList3) {
  402. this.fileList3 = data.fileList3.map(item => ({
  403. attachmentName: item.name,
  404. fileSize: item.size,
  405. url: item.temporaryUrl,
  406. type: item.type // 如果不需要,可以不写
  407. }));
  408. }
  409. }
  410. }
  411. ,
  412. async selectWorkOverChange(rows, index) {
  413. //判定index所在行是否有数据,若有数据,则需要将数据从programIds 和 workOverNoList 进行删除
  414. var flag = false;
  415. if(this.inputForm.programIds.length>index ){
  416. var result= this.inputForm.programIds[index]
  417. if(result){
  418. flag = true
  419. }
  420. }
  421. if (rows.length > 0) {
  422. // 遍历 rows 数组
  423. for (const [rowIndex, item] of rows.entries()) {
  424. if(flag) {
  425. flag = false
  426. this.inputForm.programIds[index] = item.id
  427. }
  428. const uniqueIds = [...new Set([...this.inputForm.programIds, item.id])];
  429. // 更新 programIds 数组
  430. this.inputForm.programIds = uniqueIds;
  431. console.log(this.inputForm.programIds)
  432. }
  433. const programIdString = this.inputForm.programIds.join(','); // 用逗号分隔
  434. await overService.getPhotoListByIdAndAttachmentFlag(programIdString,'before').then(data => {
  435. this.inputForm.workOverNoList = [];
  436. // 将数据填充到 workOverNoList
  437. data.forEach((item) => {
  438. // 创建新的工作项
  439. let workOverItem = { no: item.no };
  440. // 处理 fileList1 数据
  441. if (item.fileList1) {
  442. workOverItem.photos = item.fileList1.map(file => ({
  443. url: file.temporaryUrl,
  444. type: file.type
  445. }));
  446. }
  447. // 将新的工作项添加到 workOverNoList
  448. this.inputForm.workOverNoList.push(workOverItem);
  449. });
  450. }).catch(() => {
  451. reject('数据错误');
  452. });
  453. }
  454. },
  455. addRow() {
  456. this.inputForm.workOverNoList.push({ recipientAgent: this.userInfo.name,
  457. recipientAgentId: this.userInfo.id, recipientOffice: this.userInfo.officeDTO.name });
  458. },
  459. // 显示 项目选择器
  460. showWorkOver(index) {
  461. this.$refs.workOverChoose.init(index);
  462. },
  463. // 显示 项目选择器
  464. disposeWorkOver(id) {
  465. if(this.inputForm.status === '2'){
  466. uni.navigateTo({
  467. url: '/pages/edt/PatrolWorkOrderForm?id='+id
  468. })
  469. }else{
  470. this.toEdit(this.inputForm)
  471. }
  472. },
  473. //刷信photo获取对应的id
  474. refreshPhoto() {
  475. disposeRubbishService.queryById(this.inputForm.id).then((data) => {
  476. if (data.fileList1) {
  477. this.fileList1 = []
  478. data.fileList1.forEach(
  479. (item) => {
  480. const newItem = {
  481. attachmentName: item.name,
  482. fileSize: item.size,
  483. url: item.temporaryUrl,
  484. type: item.type, // 如果不需要,可以不写
  485. };
  486. this.fileList1.push(newItem);
  487. }
  488. );
  489. }
  490. if (data.fileList2) {
  491. this.fileList2 = []
  492. data.fileList2.forEach(
  493. (item) => {
  494. const newItem = {
  495. attachmentName: item.name,
  496. fileSize: item.size,
  497. url: item.temporaryUrl,
  498. type: item.type, // 如果不需要,可以不写
  499. };
  500. this.fileList2.push(newItem);
  501. }
  502. );
  503. }
  504. if (data.fileList3) {
  505. this.fileList3 = []
  506. data.fileList3.forEach(
  507. (item) => {
  508. const newItem = {
  509. attachmentName: item.name,
  510. fileSize: item.size,
  511. url: item.temporaryUrl,
  512. type: item.type, // 如果不需要,可以不写
  513. };
  514. this.fileList3.push(newItem);
  515. }
  516. );
  517. }
  518. })
  519. },
  520. removeRow(index) {
  521. // 点击删除按钮时,从表格中移除指定行
  522. this.inputForm.programIds.splice(index, 1);
  523. this.inputForm.workOverNoList.splice(index, 1);
  524. //重新获取巡视工单信息
  525. this.insertRefreshPhoto()
  526. },
  527. //刷信photo获取对应的id
  528. insertRefreshPhoto() {
  529. disposeRubbishService.getByWorkOverId(this.inputForm.programIds).then((data) => {
  530. if (data) {
  531. this.fileList1 = []
  532. data.forEach(
  533. (item) => {
  534. const newItem = {
  535. attachmentName: item.name,
  536. fileSize: item.size,
  537. url: item.temporaryUrl,
  538. type: item.type, // 如果不需要,可以不写
  539. };
  540. this.fileList1.push(newItem);
  541. }
  542. );
  543. }
  544. })
  545. },
  546. formatDate(date) {
  547. const dateNew = new Date(date); // 将日期字符串转换为 Date 对象
  548. const year = dateNew.getFullYear();
  549. const month = (dateNew.getMonth() + 1).toString().padStart(2, '0');
  550. const day = dateNew.getDate().toString().padStart(2, '0');
  551. return `${year}-${month}-${day}`;
  552. },
  553. isEmpty(value) {
  554. let result = false;
  555. if (value == null || value == undefined) {
  556. result = true;
  557. }
  558. if (typeof value == 'string' && (value.replace(/\s+/g, "") == "" || value == "")) {
  559. result = true;
  560. }
  561. if (typeof value == "object" && value instanceof Array && value.length === 0) {
  562. result = true;
  563. }
  564. return result;
  565. },
  566. isNotEmpty (value) {
  567. return !this.isEmpty(value)
  568. },
  569. /**
  570. * 判断是否为空
  571. */
  572. isNull(val) {
  573. if (val instanceof Array) {
  574. if (val.length === 0) return true;
  575. } else if (val instanceof Object) {
  576. if (JSON.stringify(val) === "{}") return true;
  577. } else {
  578. if (
  579. val === "null" ||
  580. val == null ||
  581. val === "undefined" ||
  582. val === undefined ||
  583. val === ""
  584. )
  585. return true;
  586. return false;
  587. }
  588. return false;
  589. },
  590. formatDateNew(date) {
  591. const year = date.getFullYear();
  592. const month = (date.getMonth() + 1).toString().padStart(2, '0');
  593. const day = date.getDate().toString().padStart(2, '0');
  594. const hours = date.getHours().toString().padStart(2, '0');
  595. const minutes = date.getMinutes().toString().padStart(2, '0');
  596. const seconds = date.getSeconds().toString().padStart(2, '0');
  597. return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
  598. },
  599. saveForm(callback) {
  600. this.isProcessing = true; // 显示遮罩层
  601. return new Promise((resolve, reject) => {
  602. // 表单规则验证
  603. // ...
  604. let errors = [];
  605. if(!this.uploadFlag){
  606. errors.push("图片未上传完成,请等待上传完后在提交")
  607. }
  608. if(!this.inputForm.disposeType){
  609. errors.push("请选择处理方式")
  610. }
  611. if(this.inputForm.programId && !this.inputForm.programIds){
  612. this.inputForm.programIds = []
  613. let fruitsArray = this.inputForm.programId.split(',');
  614. this.inputForm.programIds = fruitsArray
  615. }
  616. if(!this.inputForm.programId && this.inputForm.programIds){
  617. const programIdString = this.inputForm.programIds.join(','); // 用逗号分隔
  618. this.inputForm.programId = programIdString
  619. }
  620. if(this.inputForm.programIds.length == 0){
  621. errors.push("请选择巡视工单")
  622. }
  623. if(this.weighFlag){
  624. if(!this.inputForm.weight){
  625. errors.push("请填写重量")
  626. }
  627. if(!this.inputForm.transportMileage){
  628. errors.push("请填写运输里程")
  629. }
  630. if(!this.inputForm.subsidy){
  631. errors.push("请填写补贴金额")
  632. }
  633. }
  634. if (errors.length > 0) {
  635. // 存在错误,显示提示信息
  636. errors.forEach(error => {
  637. this.isProcessing = false; // 显示遮罩层
  638. uni.showToast({
  639. title: error,
  640. icon: 'none',
  641. duration: 2000
  642. });
  643. });
  644. this.isProcessing = false;
  645. reject('Form validation failed');
  646. } else {
  647. // 所有验证通过,执行保存操作
  648. this.$refs.inputForm.validate().then(() => {
  649. uni.showLoading();
  650. if(this.weighFlag){
  651. this.inputForm.status = '5'
  652. }else{
  653. if(this.inputForm.disposeType === '1'){
  654. this.inputForm.status = '2'
  655. }else if(this.inputForm.disposeType === '2'){
  656. if(this.taskName){
  657. this.inputForm.status = '5'
  658. }else{
  659. this.inputForm.status = '2'
  660. }
  661. }else{
  662. this.inputForm.status = '2'
  663. }
  664. }
  665. this.inputForm.fileList4 = this.fileList4
  666. disposeRubbishService.save(this.inputForm).then(data => {
  667. uni.showToast({
  668. title: "提交成功",
  669. icon: "success",
  670. duration: 1000 // 提示持续时间为1秒(1000毫秒)
  671. });
  672. // 延迟1秒后再跳转到上一页
  673. setTimeout(() => {
  674. this.isProcessing = false; // 显示遮罩层
  675. callback(data.businessTable, data.businessId,this.inputForm,this.inputForm.disposeType);
  676. uni.navigateBack({
  677. delta: 1
  678. });
  679. }, 1000);
  680. resolve('Form saved successfully');
  681. }).catch(error => {
  682. reject('Save operation failed');
  683. });
  684. }).catch(() => {
  685. reject('Form validation failed');
  686. });
  687. }
  688. });
  689. },
  690. // 删除图片
  691. deletePic(event) {
  692. this[`fileList${event.name}`].splice(event.index, 1)
  693. },
  694. // 新增图片
  695. async afterRead(event) {
  696. try {
  697. this.uploadFlag = false
  698. // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
  699. let lists = [].concat(event.file)
  700. let fileListLen = this[`fileList${event.name}`].length
  701. lists.map((item) => {
  702. this[`fileList${event.name}`].push({
  703. ...item,
  704. status: 'uploading',
  705. message: '上传中'
  706. })
  707. })
  708. for (let i = 0; i < lists.length; i++) {
  709. const result = await this.uploadFilePromise(lists[i].url, fileListLen)
  710. let item = this[`fileList${event.name}`][fileListLen]
  711. this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
  712. status: 'success',
  713. message: '',
  714. url: result
  715. }))
  716. fileListLen++
  717. }
  718. this.uploadFlag = true
  719. } catch (error) {
  720. console.error('上传失败:', error);
  721. } finally {
  722. this.uploadFlag = true
  723. }
  724. },
  725. uploadFilePromise(url, index) {
  726. return new Promise((resolve, reject) => {
  727. let a = uni.uploadFile({
  728. url: 'http://dttz.xgccpm.cn/api/app/file/webUpload/fileUpload', // 仅为示例,非真实的接口地址
  729. filePath: url,
  730. name: 'file',
  731. formData: {
  732. user: this.$store.state.user.userInfo
  733. },
  734. header: {
  735. 'token': $auth.getUserToken(),
  736. },
  737. success: (res) => {
  738. // this.fileList1[index].url = url
  739. setTimeout(() => {
  740. const dataObj = JSON.parse(res.data);
  741. const url = dataObj.url;
  742. resolve(url);
  743. }, 1000);
  744. },
  745. fail: (err) => {
  746. console.error('Upload failed:', err);
  747. }
  748. });
  749. })
  750. },
  751. getUserInfoByOffId(){
  752. // 根据组织ID 获取 该村的 村支书
  753. overService.getUserInfoByOffId(this.inputForm.processingUnit)
  754. .then(data => {
  755. this.inputForm.clearUserId = data.id
  756. this.inputForm.clearUserName = data.name
  757. this.inputForm.clearUserMobile = data.mobile
  758. })
  759. .catch(e => {
  760. throw e;
  761. });
  762. }
  763. }
  764. }
  765. </script>
  766. <style>
  767. .form-section {
  768. padding: 10px 15px;
  769. margin-bottom: 10px;
  770. background-color: #ffffff;
  771. border-radius: 5px;
  772. box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  773. }
  774. .u-page__upload-item {
  775. margin-top: 10px;
  776. }
  777. .button-container {
  778. margin-top: 20px;
  779. text-align: center;
  780. }
  781. .cu-form-group .title {
  782. min-width: 100px;
  783. }
  784. /* 遮罩层样式 */
  785. .mask {
  786. position: fixed;
  787. top: 0;
  788. left: 0;
  789. width: 100%;
  790. height: 100%;
  791. background-color: rgba(0, 0, 0, 0.05); /* 半透明遮罩 */
  792. z-index: 9999; /* 确保遮罩层在最顶层 */
  793. }
  794. </style>