FileDetails.vue 35 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078
  1. <template>
  2. <view>
  3. <view class="filedetails">
  4. <view class="cardBox" @click="selectCustomer"
  5. style="margin-bottom: 0; border-bottom: 4rpx solid #f5f5f5; border-radius: 12rpx 12rpx 0 0;">
  6. <!-- @click="pickerShowfun('KH')" -->
  7. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  8. <view style="display: flex;align-items: center;">
  9. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  10. <u-icon name="account" color="#FD4B09" size="18"></u-icon>
  11. <text style="font-size: 30rpx; margin-left: 10rpx;">客户</text>
  12. </view>
  13. <u--input inputAlign="right" disabled disabledColor="#fff" placeholder="客户" border="none"
  14. v-model="form.corpName">
  15. </u--input>
  16. </view>
  17. </view>
  18. <view class="filedetails_right">
  19. <u-icon name="arrow-right" color="#101010" size="22"></u-icon>
  20. </view>
  21. </view>
  22. <view class="cardBox" style="margin-bottom: 0; border-bottom: 4rpx solid #f5f5f5; border-radius: 0;">
  23. <!-- <view class="filedetails_left">
  24. <view>
  25. <u--input prefixIcon="account"
  26. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  27. placeholder="联系人" border="none"
  28. v-model="form.contacts">
  29. </u--input>
  30. </view>
  31. </view>
  32. -->
  33. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  34. <view style="display: flex;align-items: center;">
  35. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  36. <u-icon name="account" color="#FD4B09" size="18"></u-icon>
  37. <text style="font-size: 30rpx; margin-left: 10rpx;">联系人</text>
  38. </view>
  39. <u--input inputAlign="right" prefixIconStyle="fontSize:50rpx;"
  40. placeholderStyle="fontSize:34rpx;" placeholder="联系人" border="none" v-model="form.contacts">
  41. </u--input>
  42. </view>
  43. </view>
  44. </view>
  45. <view class="cardBox" style="margin-bottom: 0; border-bottom: 4rpx solid #f5f5f5; border-radius: 0;">
  46. <!-- <view class="filedetails_left">
  47. <view>
  48. <u--input prefixIcon="phone"
  49. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  50. placeholder="电话" border="none"
  51. v-model="form.contactsTel">
  52. </u--input>
  53. </view>
  54. </view> -->
  55. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  56. <view style="display: flex;align-items: center;">
  57. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  58. <u-icon name="account" color="#FD4B09" size="18"></u-icon>
  59. <text style="font-size: 30rpx; margin-left: 10rpx;">电话</text>
  60. </view>
  61. <u--input inputAlign="right" prefixIconStyle="fontSize:50rpx;"
  62. placeholderStyle="fontSize:34rpx;" placeholder="电话" border="none"
  63. v-model="form.contactsTel">
  64. </u--input>
  65. </view>
  66. </view>
  67. </view>
  68. <view class="cardBox" style="margin-bottom: 0; border-bottom: 4rpx solid #f5f5f5; border-radius: 0;">
  69. <!-- <view class="filedetails_left">
  70. <view>
  71. <u--input prefixIcon="home"
  72. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  73. placeholder="地址" border="none"
  74. v-model="form.address">
  75. </u--input>
  76. </view>
  77. </view> -->
  78. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  79. <view style="display: flex;align-items: center;">
  80. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  81. <u-icon name="account" color="#FD4B09" size="18"></u-icon>
  82. <text style="font-size: 30rpx; margin-left: 10rpx;">地址</text>
  83. </view>
  84. <u--input inputAlign="right" prefixIconStyle="fontSize:50rpx;"
  85. placeholderStyle="fontSize:34rpx;" placeholder="地址" border="none" v-model="form.address">
  86. </u--input>
  87. </view>
  88. </view>
  89. </view>
  90. <view class="cardBox" @click="calendarShowfun(1,1)"
  91. style="margin-bottom: 0; border-bottom: 4rpx solid #f5f5f5; border-radius: 0;">
  92. <!-- <view class="filedetails_left">
  93. <view>
  94. <u--input prefixIcon="calendar"
  95. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  96. disabled disabledColor="#fff" placeholder="请选择合同起" border="none"
  97. v-model="form.signingDateStart">
  98. </u--input>
  99. </view>
  100. </view>
  101. <view class="filedetails_right" @click="calendarShowfun(1,1)">
  102. <u-icon name="arrow-right" color="#101010" size="22"></u-icon>
  103. </view> -->
  104. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  105. <view style="display: flex;align-items: center;">
  106. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  107. <u-icon name="calendar" color="#FD4B09" size="18"></u-icon>
  108. <text style="font-size: 30rpx; margin-left: 10rpx;">合同日期起</text>
  109. </view>
  110. <u--input inputAlign="right" disabled disabledColor="#fff" placeholder="合同日期起" border="none"
  111. v-model="form.signingDateStart">
  112. </u--input>
  113. </view>
  114. </view>
  115. <view class="filedetails_right">
  116. <u-icon name="arrow-right" color="#101010" size="22"></u-icon>
  117. </view>
  118. </view>
  119. <view class="cardBox" style="border-bottom: 4rpx solid #f5f5f5; border-radius: 0 0 12rpx 12rpx;">
  120. <!-- <view class="filedetails_left">
  121. <view>
  122. <u--input prefixIcon="calendar"
  123. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  124. disabled disabledColor="#fff" placeholder="请选择合同止" border="none"
  125. v-model="form.signingDateEnd">
  126. </u--input>
  127. </view>
  128. </view>
  129. <view class="filedetails_right" @click="calendarShowfun(1,2)">
  130. <u-icon name="arrow-right" color="#101010" size="22"></u-icon>
  131. </view> -->
  132. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;"
  133. @click="calendarShowfun(1,2)">
  134. <view style="display: flex;align-items: center;">
  135. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  136. <u-icon name="calendar" color="#FD4B09" size="18"></u-icon>
  137. <text style="font-size: 30rpx; margin-left: 10rpx;">合同日期止</text>
  138. </view>
  139. <u--input inputAlign="right" disabled disabledColor="#fff" placeholder="合同日期止" border="none"
  140. v-model="form.signingDateEnd">
  141. </u--input>
  142. </view>
  143. </view>
  144. <view class="filedetails_right">
  145. <u-icon name="arrow-right" color="#101010" size="22"></u-icon>
  146. </view>
  147. </view>
  148. <view class="cardBox">
  149. <u-upload :fileList="form.filesList" @afterRead="afterRead($event,1)" @delete="deletePic($event,1)"
  150. name="1" multiple :maxCount="10"></u-upload>
  151. </view>
  152. <view class="cardBox" style="display: flex;align-items: center;">
  153. <!-- <view class="filedetails_left">
  154. <view>
  155. <u--input prefixIcon="file-text"
  156. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  157. disabled disabledColor="#fff" :placeholder="`设备列表(${form.corpEquipmentArchivesItemList.length})`" border="none">
  158. </u--input>
  159. </view>
  160. </view>
  161. <view class="filedetails_right" @click="EquipmentAddition">
  162. <u-icon name="list-dot" color="#101010" size="22"></u-icon>
  163. </view> -->
  164. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  165. <view style="display: flex;align-items: center;">
  166. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  167. <u-icon name="list-dot" color="#FD4B09" size="18"></u-icon>
  168. <text
  169. style="font-size: 30rpx; margin-left: 10rpx;">设备列表({{form.corpEquipmentArchivesItemList.length}})</text>
  170. </view>
  171. <!-- <u--input
  172. inputAlign="right"
  173. disabled disabledColor="#fff" :placeholder="`设备列表(${form.corpEquipmentArchivesItemList.length})`" border="none">
  174. </u--input> -->
  175. </view>
  176. </view>
  177. <!-- <view class="filedetails_right" @click="EquipmentAddConfirm = true"> -->
  178. <!-- <u-icon name="file-text" color="#101010" size="22"></u-icon> -->
  179. <!-- <view style="font-size: 30rpx;
  180. width: 150rpx;
  181. height: 44rpx;
  182. background-color: #FD4B09;
  183. border-radius:44rpx;
  184. color: #fff;
  185. padding: 10rpx" @click="pickerShowfun('CP',null)">+添加设备</view> -->
  186. <!-- EquipmentAddConfirm = true -->
  187. <!-- </view> -->
  188. </view>
  189. <view class="cardBox" v-for="(item,index) in form.corpEquipmentArchivesItemList" :key="item.id"
  190. v-if="form.corpEquipmentArchivesItemList.length">
  191. <view class="listbox">
  192. <view class="listbox_title">
  193. <view class="listbox_titleXh">
  194. 设备{{index+1}}
  195. </view>
  196. <view class="listbox_titleDe" @click="DeleteWindow(item,index)">删除</view>
  197. </view>
  198. <view class="inputbox" @click="pickerShowfun('CP',index)">
  199. <!-- <view class="shebetext">设备名称:</view> -->
  200. <u--input prefixIconStyle="fontSize:60rpx;" placeholderStyle="fontSize:30rpx;" disabled
  201. disabledColor="#fff" placeholder="请选择设备名称" border="bottom" v-model="item.cname">
  202. <!-- <template slot="suffix">
  203. <u-icon @click="pickerShowfun('CP',index)" name="arrow-right" color="#101010" size="20"></u-icon>
  204. </template> -->
  205. </u--input>
  206. </view>
  207. <view class="inputbox">
  208. <!-- <view class="shebetext">设备编号:</view> -->
  209. <u--input prefixIconStyle="fontSize:60rpx;" placeholderStyle="fontSize:30rpx;"
  210. disabledColor="#fff" placeholder="请输入设备编号" border="bottom" v-model="item.code">
  211. </u--input>
  212. </view>
  213. <view class="inputbox">
  214. <!-- <view class="shebetext">设备描述:</view> -->
  215. <u--textarea v-model="item.equipmentDescribe" placeholderStyle="fontSize:30rpx;"
  216. placeholder="请输入设备描述">
  217. </u--textarea>
  218. </view>
  219. <view class="inputbox" @click="calendarShowfun(2,1,index)">
  220. <!-- <view class="shebetext">出厂日期:</view> -->
  221. <u--input prefixIconStyle="fontSize:60rpx;" placeholderStyle="fontSize:30rpx;" disabled
  222. disabledColor="#fff" placeholder="请选择出厂日期" border="bottom" v-model="item.exitDate">
  223. <!-- <template slot="suffix">
  224. <u-icon @click="calendarShowfun(2,1,index)" name="arrow-right" color="#101010" size="20"></u-icon>
  225. </template> -->
  226. </u--input>
  227. </view>
  228. <view class="inputbox" @click="calendarShowfun(2,2,index)">
  229. <!-- <view class="shebetext">保养日期:</view> -->
  230. <u--input prefixIconStyle="fontSize:60rpx;" placeholderStyle="fontSize:30rpx;" disabled
  231. disabledColor="#fff" placeholder="请选择保养日期" border="bottom" v-model="item.maintenanceDate">
  232. <!-- <template slot="suffix">
  233. <u-icon @click="calendarShowfun(2,2,index)" name="arrow-right" color="#101010" size="20"></u-icon>
  234. </template> -->
  235. </u--input>
  236. </view>
  237. <!-- <view class="inputbox">
  238. <view class="shebetext">维修次数:</view>
  239. <u--input
  240. prefixIconStyle="fontSize:60rpx;color:#215476"
  241. placeholderStyle="fontSize:30rpx;"
  242. disabled disabledColor="#fff" placeholder="请选择维修次数" border="bottom"
  243. v-model="item.maintenanceSecond">
  244. </u--input>
  245. </view>
  246. <view class="inputbox">
  247. <view class="shebetext">工厂:</view>
  248. <u--input
  249. prefixIconStyle="fontSize:60rpx;color:#215476"
  250. placeholderStyle="fontSize:30rpx;"
  251. disabled disabledColor="#fff" placeholder="请选择工厂" border="bottom"
  252. v-model="item.factoryName">
  253. </u--input>
  254. </view>
  255. <view class="inputbox">
  256. <view class="shebetext">功能分类:</view>
  257. <u--input
  258. prefixIconStyle="fontSize:60rpx;color:#215476"
  259. placeholderStyle="fontSize:30rpx;"
  260. disabled disabledColor="#fff" placeholder="请选择功能分类" border="bottom"
  261. v-model="item.categoryitem">
  262. </u--input>
  263. </view>
  264. <view class="inputbox">
  265. <view class="shebetext">设备分类:</view>
  266. <u--input
  267. prefixIconStyle="fontSize:60rpx;color:#215476"
  268. placeholderStyle="fontSize:30rpx;"
  269. disabled disabledColor="#fff" placeholder="请输入设备分类" border="bottom"
  270. v-model="item.category">
  271. </u--input>
  272. </view>
  273. <view class="inputbox">
  274. <view class="shebetext">规格:</view>
  275. <u--input
  276. prefixIconStyle="fontSize:60rpx;color:#215476"
  277. placeholderStyle="fontSize:30rpx;"
  278. disabled disabledColor="#fff" placeholder="请输入规格" border="bottom"
  279. v-model="item.specs">
  280. </u--input>
  281. </view> -->
  282. <view class="inputbox" style="margin-top: 20rpx;">
  283. <view class="shebetext">图片:</view>
  284. <u-upload :fileList="item.filesList" @afterRead="afterRead($event,2,index)"
  285. @delete="deletePic($event,2,index)" name="1" multiple :maxCount="10"></u-upload>
  286. </view>
  287. <!-- <view class="binahao">设备编号:{{item.code}}</view>
  288. <view class="bottombox">
  289. <view class="bottombox_img">
  290. <image :src="item.url" mode="widthFix"></image>
  291. </view>
  292. <view class="bottombox_text">
  293. <view class="bottombox_textleft">
  294. <view class="bottombox_textTitle">{{item.cname}}</view>
  295. <view>出厂日期:{{item.exitDate?item.exitDate.slice(0,10):''}}</view>
  296. <view>报修日期:{{item.repairReportDate?item.repairReportDate.slice(0,10):''}}</view>
  297. </view>
  298. <view class="bottombox_textRight">
  299. <u-icon name="arrow-right" color="#101010" size="20"></u-icon>
  300. </view>
  301. </view>
  302. </view> -->
  303. </view>
  304. </view>
  305. <view class="cardBox" style="display: flex;align-items: center;">
  306. <!-- <view class="filedetails_left">
  307. <view>
  308. <u--input prefixIcon="file-text"
  309. prefixIconStyle="fontSize:50rpx;" placeholderStyle="fontSize:34rpx;"
  310. disabled disabledColor="#fff" :placeholder="`设备列表(${form.corpEquipmentArchivesItemList.length})`" border="none">
  311. </u--input>
  312. </view>
  313. </view>
  314. <view class="filedetails_right" @click="EquipmentAddition">
  315. <u-icon name="list-dot" color="#101010" size="22"></u-icon>
  316. </view> -->
  317. <view class="filedetails_left" style="width: 100%; margin-right: 20rpx;">
  318. <view style="display: flex;align-items: center;">
  319. <view class="shebetext" style="display: flex;align-items: center; color: #FD4B09;">
  320. <u-icon name="list-dot" color="#FD4B09" size="18"></u-icon>
  321. <text
  322. style="font-size: 30rpx; margin-left: 10rpx;">设备</text>
  323. </view>
  324. <!-- <u--input
  325. inputAlign="right"
  326. disabled disabledColor="#fff" :placeholder="`设备列表(${form.corpEquipmentArchivesItemList.length})`" border="none">
  327. </u--input> -->
  328. </view>
  329. </view>
  330. <view class="filedetails_right" @click="EquipmentAddConfirm = true">
  331. <!-- <u-icon name="file-text" color="#101010" size="22"></u-icon> -->
  332. <view style="font-size: 30rpx;
  333. width: 150rpx;
  334. height: 44rpx;
  335. background-color: #FD4B09;
  336. border-radius:44rpx;
  337. color: #fff;
  338. padding: 10rpx" @click="pickerShowfun('CP',null)">+添加设备</view>
  339. <!-- EquipmentAddConfirm = true -->
  340. </view>
  341. </view>
  342. </view>
  343. <view style="height: 100rpx;"></view>
  344. <view class="bottomButton">
  345. <view class="savebutton" @click="savefun">保存档案</view>
  346. </view>
  347. <u-picker :show="pickerShow" :columns="pickerColumns" keyName="cname" @confirm="pickerConfirm"
  348. @cancel="pickerCancel"></u-picker>
  349. <!-- 日期 -->
  350. <u-calendar :show="calendarShow" @confirm="calendarConfirm" @close="calendarClose"></u-calendar>
  351. <!-- 提示 -->
  352. <u-toast ref="uToast"></u-toast>
  353. <!-- 添加设备弹框 -->
  354. <!-- <u-modal :show="EquipmentAddConfirm" title="提示" showCancelButton @confirm="EquipmentAddition"
  355. @cancel="EquipmentAddConfirm = false">
  356. <view class="slot-content">
  357. <view class="inputbox" @click="pickerShowfun('CP',index)">
  358. <u--input
  359. prefixIconStyle="fontSize:60rpx;"
  360. placeholderStyle="fontSize:30rpx;"
  361. disabled disabledColor="#fff" placeholder="请选择设备名称" border="bottom"
  362. v-model="machine.cname" >
  363. </u--input>
  364. </view>
  365. <view class="inputbox">
  366. <u--input
  367. prefixIconStyle="fontSize:60rpx;"
  368. placeholderStyle="fontSize:30rpx;"
  369. disabledColor="#fff" placeholder="请输入设备编号" border="bottom"
  370. v-model="machine.code">
  371. </u--input>
  372. </view>
  373. <view class="inputbox">
  374. <u--textarea v-model="machine.equipmentDescribe"
  375. placeholderStyle="fontSize:30rpx;" placeholder="请输入设备描述" >
  376. </u--textarea>
  377. </view>
  378. <view class="inputbox" @click="calendarShowfun(machine.exitDate,2,1,index)">
  379. <u--input
  380. prefixIconStyle="fontSize:60rpx;"
  381. placeholderStyle="fontSize:30rpx;"
  382. disabled disabledColor="#fff" placeholder="请选择出厂日期" border="bottom"
  383. v-model="machine.exitDate">
  384. </u--input>
  385. </view>
  386. <view class="inputbox" @click="calendarShowfun(machine.maintenanceDate,2,2,index)">
  387. <u--input
  388. prefixIconStyle="fontSize:60rpx;"
  389. placeholderStyle="fontSize:30rpx;"
  390. disabled disabledColor="#fff" placeholder="请选择保养日期" border="bottom"
  391. v-model="machine.maintenanceDate">
  392. </u--input>
  393. </view>
  394. <view class="inputbox" style="margin-top: 20rpx;">
  395. <view class="shebetext">图片:</view>
  396. <u-upload
  397. :fileList="machine.filesList"
  398. @afterRead="afterRead($event,2,index)"
  399. @delete="deletePic($event,2,index)"
  400. name="1"
  401. multiple
  402. :maxCount="10"
  403. ></u-upload>
  404. </view>
  405. </view>
  406. </u-modal> -->
  407. <!-- 删除弹框 -->
  408. <u-modal :show="EquipmentDeleteConfirm" title="提示" showCancelButton @confirm="DeleteDevicefun"
  409. @cancel="EquipmentDeleteConfirm = false">
  410. <view class="slot-content">
  411. <rich-text nodes="确定要删除该设备吗?"></rich-text>
  412. </view>
  413. </u-modal>
  414. <!-- <u-datetime-picker :show="calendarShow" @confirm="calendarConfirm" @close="calendarShow = false" v-model="optionDate"
  415. mode="date"></u-datetime-picker> -->
  416. <!-- <u-calendar :show="calendarShow" @confirm="calendarConfirm" @close="calendarClose"></u-calendar> -->
  417. </view>
  418. </template>
  419. <script>
  420. import {
  421. corpequipmentarchivesDetail,
  422. corpequipmentarchivesSubmit,
  423. goodsdescDescList,
  424. corpequipmentarchivesitemRemove
  425. } from '@/api/device/index.js'
  426. import {
  427. corpsDescList
  428. } from '@/api/views/sale/index.js'
  429. import {
  430. queryDetail
  431. } from '@/api/views/customer/index.js'
  432. import http from '@/http/api.js'
  433. import {
  434. clientId,
  435. clientSecret
  436. } from '@/common/setting'
  437. export default {
  438. data() {
  439. return {
  440. // 弹框
  441. // 设备添加
  442. EquipmentAddConfirm: false,
  443. // 设备删除
  444. EquipmentDeleteConfirm: false,
  445. EquipmentDeleteRow: {},
  446. EquipmentDeleteIndex: -1,
  447. // 传递过来的id
  448. id: null,
  449. // 绑定的数据
  450. form: {
  451. corpEquipmentArchivesItemList: [],
  452. filesList: []
  453. },
  454. // 弹窗的开启和管理
  455. pickerShow: false,
  456. // 弹窗的数据配置 数组嵌套
  457. pickerColumns: [],
  458. // 日期弹窗
  459. calendarShow: false,
  460. // 当前打开弹窗的状态
  461. calendarType: {
  462. type: null,
  463. sort: null,
  464. index: null
  465. },
  466. // 当前打开的弹窗的状态
  467. pickerType: {},
  468. // 设备弹窗
  469. machine: {},
  470. optionDate: 0
  471. }
  472. },
  473. onLoad(e) {
  474. this.id = e.id
  475. if (e.id) {
  476. this.corpequipmentarchivesDetailfun()
  477. }
  478. },
  479. onShow() {
  480. },
  481. methods: {
  482. disabledDate(time) {
  483. return time.getTime() > Date.now() - 8.64e7
  484. },
  485. // 保存新增
  486. savefun() {
  487. if (!this.form.corpName) {
  488. return this.$refs.uToast.show({
  489. type: 'warning',
  490. message: '客户名称不能为空',
  491. })
  492. }
  493. if (!this.form.contacts) {
  494. return this.$refs.uToast.show({
  495. type: 'warning',
  496. message: '联系人不能为空',
  497. })
  498. }
  499. if (!this.form.contactsTel) {
  500. return this.$refs.uToast.show({
  501. type: 'warning',
  502. message: '电话不能为空',
  503. })
  504. }
  505. if (!this.form.address) {
  506. return this.$refs.uToast.show({
  507. type: 'warning',
  508. message: '地址不能为空',
  509. })
  510. }
  511. // if (!this.form.corpEquipmentArchivesItemList.length > 0){
  512. // return this.$refs.uToast.show({
  513. // type: 'warning',
  514. // message: '请添加一条设备',
  515. // })
  516. // }
  517. this.form.corpEquipmentArchivesItemList.map(item => {
  518. if (!item.cname) {
  519. if (!item.equipmentDescribe) {
  520. return this.$refs.uToast.show({
  521. type: 'warning',
  522. message: '请维护设备描述',
  523. })
  524. }
  525. return
  526. }
  527. item.id = item.id ? item.id : null
  528. item.exitDate = item.exitDate ? item.exitDate + ' 00:00:00' : null
  529. item.repairReportDate = item.repairReportDate ? item.repairReportDate + ' 00:00:00' : null
  530. item.maintenanceDate = item.maintenanceDate ? item.maintenanceDate + ' 00:00:00' : null
  531. })
  532. const obj = {
  533. ...this.form,
  534. id: this.form.id ? this.form.id : null,
  535. sysNo: this.form.sysNo ? this.form.sysNo : null,
  536. equipmentNumber: this.form.corpEquipmentArchivesItemList.length,
  537. maintenanceSecond: this.form.maintenanceSecond ? this.form.maintenanceSecond : null,
  538. signingDateStart: this.form.signingDateStart ? this.form.signingDateStart + ' 00:00:00' : null,
  539. signingDateEnd: this.form.signingDateEnd ? this.form.signingDateEnd + ' 00:00:00' : null,
  540. remarks: this.form.remarks ? this.form.remarks : null
  541. }
  542. console.log(obj, 166);
  543. this.corpequipmentarchivesSubmitfun(obj)
  544. },
  545. // 保存数据接口
  546. corpequipmentarchivesSubmitfun(obj) {
  547. corpequipmentarchivesSubmit(obj).then(res => {
  548. if (res.code == 200) {
  549. this.$refs.uToast.show({
  550. type: 'success',
  551. message: '操作成功',
  552. })
  553. this.form = res.data
  554. } else {
  555. this.$refs.uToast.show({
  556. type: 'error',
  557. message: res.msg,
  558. })
  559. }
  560. })
  561. },
  562. // 跳转选择用户
  563. selectCustomer() {
  564. this.$u.route('/pages/views/salesSlip/selectCustomer', {
  565. corpType: 'KH'
  566. });
  567. },
  568. // 选中用户赋值
  569. otherFun(user) {
  570. console.log(user);
  571. queryDetail({
  572. id: user.id
  573. }).then(res => {
  574. this.$set(this.form, 'address', res.data.corpsAddrList[0].detailedAddress)
  575. this.form.corpId = user.id
  576. this.form.corpName = res.data.cname
  577. this.form.contacts = res.data.attn
  578. this.form.contactsTel = res.data.tel
  579. })
  580. },
  581. // 设备新增
  582. EquipmentAddition() {
  583. this.form.corpEquipmentArchivesItemList.push({
  584. cname: '',
  585. cname: '',
  586. code: '',
  587. brand: '',
  588. specs: '',
  589. category: '',
  590. categoryitem: '',
  591. url: '',
  592. goodsTypeId: '',
  593. exitDate: '',
  594. repairReportDate: '',
  595. brandId: '',
  596. maintenanceDate: '',
  597. factoryId: '',
  598. factoryName: '',
  599. equipmentDescribe: '',
  600. maintenanceSecond: '',
  601. filesList: [],
  602. })
  603. this.EquipmentAddConfirm = false
  604. },
  605. // 弹窗的开启
  606. pickerShowfun(type, index) {
  607. this.pickerColumns = []
  608. if (type == 'KH') {
  609. this.pickerType.type = type
  610. this.pickerType.index = null
  611. corpsDescList({
  612. corpType: 'KH'
  613. }).then(res => {
  614. this.pickerColumns = [res.data]
  615. })
  616. this.pickerShow = true
  617. } else if (type == 'CP') {
  618. if (index == null) {
  619. this.pickerType.type = type
  620. this.pickerType.index = this.form.corpEquipmentArchivesItemList.length
  621. this.form.corpEquipmentArchivesItemList.push({
  622. cname: '',
  623. cname: '',
  624. code: '',
  625. brand: '',
  626. specs: '',
  627. category: '',
  628. categoryitem: '',
  629. url: '',
  630. goodsTypeId: '',
  631. exitDate: '',
  632. repairReportDate: '',
  633. brandId: '',
  634. maintenanceDate: '',
  635. factoryId: '',
  636. factoryName: '',
  637. equipmentDescribe: '',
  638. maintenanceSecond: '',
  639. filesList: [],
  640. })
  641. this.$u.route('/pages/device/FileDetails/selectMachine', {
  642. corpType: 'KH'
  643. });
  644. } else {
  645. this.pickerType.type = type
  646. this.pickerType.index = index
  647. this.$u.route('/pages/device/FileDetails/selectMachine', {
  648. corpType: 'KH'
  649. });
  650. }
  651. }
  652. },
  653. machineOtherFun(form) {
  654. this.form.corpEquipmentArchivesItemList[this.pickerType.index].cname = form.cname
  655. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].code = form.code
  656. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brand = form.brand
  657. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brandId = form.brandId
  658. this.form.corpEquipmentArchivesItemList[this.pickerType.index].specs = form.specs
  659. this.form.corpEquipmentArchivesItemList[this.pickerType.index].remarks = form.remarks
  660. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeId = form.goodsTypeId
  661. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeName = form.goodsTypeName
  662. this.form.corpEquipmentArchivesItemList[this.pickerType.index].maintenanceSecond = form.maintenanceSecond ?
  663. form.maintenanceSecond : null
  664. this.form.corpEquipmentArchivesItemList[this.pickerType.index].repairReportDate = form.repairReportDate
  665. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryId = form.factoryId ? form
  666. .factoryId : null
  667. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryName = form.factoryName ? form
  668. .factoryName : null
  669. this.form.corpEquipmentArchivesItemList[this.pickerType.index].categoryitem = form.categoryitem
  670. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].equipmentDescribe = form.cname
  671. this.pickerType.index = null
  672. },
  673. // 弹窗点击确认按钮
  674. pickerConfirm(val) {
  675. if (this.pickerType.type == 'KH') {
  676. this.form.corpId = val.value[0].id
  677. this.form.corpName = val.value[0].cname
  678. queryDetail({
  679. id: val.value[0].id
  680. }).then(res => {
  681. this.$set(this.form, 'address', res.data.corpsAddrList[0].detailedAddress)
  682. this.form.contacts = res.data.attn
  683. this.form.contactsTel = res.data.tel
  684. })
  685. } else if (this.pickerType.type == 'CP') {
  686. this.form.corpEquipmentArchivesItemList[this.pickerType.index].cname = val.value[0].cname
  687. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].code = val.value[0].code
  688. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brand = val.value[0].brand
  689. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brandId = val.value[0].brandId
  690. this.form.corpEquipmentArchivesItemList[this.pickerType.index].specs = val.value[0].specs
  691. this.form.corpEquipmentArchivesItemList[this.pickerType.index].remarks = val.value[0].remarks
  692. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeId = val.value[0].goodsTypeId
  693. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeName = val.value[0]
  694. .goodsTypeName
  695. this.form.corpEquipmentArchivesItemList[this.pickerType.index].maintenanceSecond = val.value[0]
  696. .maintenanceSecond ? val.value[0].maintenanceSecond : null
  697. this.form.corpEquipmentArchivesItemList[this.pickerType.index].repairReportDate = val.value[0]
  698. .repairReportDate
  699. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryId = val.value[0].factoryId ? val
  700. .value[0].factoryId : null
  701. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryName = val.value[0].factoryName ?
  702. val.value[0].factoryName : null
  703. this.form.corpEquipmentArchivesItemList[this.pickerType.index].categoryitem = val.value[0].categoryitem
  704. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].equipmentDescribe = val.value[0].cname
  705. } else {}
  706. this.pickerShow = false
  707. },
  708. // 弹窗点击取消按钮
  709. pickerCancel() {
  710. this.pickerShow = false
  711. },
  712. // 日历弹窗的开启
  713. calendarShowfun(type, sort, index) {
  714. // if (date != null && date != "") {
  715. // console.log("赋值");
  716. // console.log(date);
  717. // this.optionDate = Date.parse(date);
  718. // console.log(this.optionDate);
  719. // }
  720. this.calendarType.type = type
  721. this.calendarType.sort = sort
  722. this.calendarType.index = index
  723. this.calendarShow = true
  724. },
  725. // 日历关闭触发
  726. calendarClose() {
  727. this.calendarShow = false
  728. },
  729. // 日历选择完成触发
  730. calendarConfirm(val) {
  731. // var timer = new Date(val.value)
  732. //
  733. // const year = timer.getFullYear()
  734. // const month = timer.getMonth() + 1 // 由于月份从0开始,因此需加1
  735. // const day = timer.getDate()
  736. // const hour = timer.getHours()
  737. // const minute = timer.getMinutes()
  738. // const second = timer.getSeconds()
  739. // var data = `${this.pad(year, 4)}-${this.pad(month)}-${this.pad(day)}`
  740. if (this.calendarType.type == 1) {
  741. if (this.calendarType.sort == 1) {
  742. this.form.signingDateStart = val[0]
  743. } else {
  744. this.form.signingDateEnd = val[0]
  745. }
  746. } else {
  747. if (this.calendarType.sort == 1) {
  748. this.form.corpEquipmentArchivesItemList[this.calendarType.index].exitDate = val[0]
  749. } else {
  750. this.form.corpEquipmentArchivesItemList[this.calendarType.index].maintenanceDate = val[0]
  751. }
  752. }
  753. this.calendarShow = false
  754. },
  755. pad(timeEl, total = 2, str = '0') {
  756. return timeEl.toString().padStart(total, str)
  757. },
  758. // 详情接口
  759. corpequipmentarchivesDetailfun() {
  760. corpequipmentarchivesDetail({
  761. id: this.id
  762. }).then(res => {
  763. this.form = res.data
  764. })
  765. },
  766. // 删除弹窗
  767. DeleteWindow(row, index) {
  768. this.EquipmentDeleteRow = row;
  769. this.EquipmentDeleteIndex = index;
  770. this.EquipmentDeleteConfirm = true;
  771. },
  772. // 删除设备
  773. DeleteDevicefun() {
  774. var row = this.EquipmentDeleteRow
  775. var index = this.EquipmentDeleteIndex
  776. if (row.id) {
  777. this.form.corpEquipmentArchivesItemList.splice(index, 1)
  778. this.corpequipmentarchivesitemRemovefun(row.id)
  779. } else {
  780. this.form.corpEquipmentArchivesItemList.splice(index, 1)
  781. }
  782. this.EquipmentDeleteRow = null;
  783. this.EquipmentDeleteIndex = -1;
  784. this.EquipmentDeleteConfirm = false;
  785. },
  786. // 删除接口
  787. corpequipmentarchivesitemRemovefun(id) {
  788. corpequipmentarchivesitemRemove({
  789. ids: id
  790. }).then(res => {
  791. this.$refs.uToast.show({
  792. type: 'success',
  793. message: '操作成功',
  794. })
  795. })
  796. },
  797. // 新增图片
  798. async afterRead(event, type, index) {
  799. // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
  800. let lists = [].concat(event.file)
  801. console.log(event);
  802. console.log(lists, 394);
  803. if (type == 1) {
  804. let fileListLen = this.form.filesList.length
  805. lists.map((item) => {
  806. this.form.filesList.push({
  807. ...item,
  808. })
  809. })
  810. let sort = this.form.filesList.length
  811. for (let i = 0; i < lists.length; i++) {
  812. const result = await this.uploadFilePromise(lists[i].url)
  813. let item = this.form.filesList[fileListLen]
  814. this.form.filesList.splice(fileListLen, 1, Object.assign(item, {
  815. sort: sort,
  816. fileName: JSON.parse(result).data.originalName,
  817. url: JSON.parse(result).data.link
  818. }))
  819. fileListLen++
  820. }
  821. } else if (type == 2) {
  822. let fileListLen = this.form.corpEquipmentArchivesItemList[index].filesList.length
  823. lists.map((item) => {
  824. this.form.corpEquipmentArchivesItemList[index].filesList.push({
  825. ...item,
  826. })
  827. })
  828. let sort = this.form.corpEquipmentArchivesItemList[index].filesList.length
  829. for (let i = 0; i < lists.length; i++) {
  830. const result = await this.uploadFilePromise(lists[i].url)
  831. let item = this.form.corpEquipmentArchivesItemList[index].filesList[fileListLen]
  832. this.form.corpEquipmentArchivesItemList[index].filesList.splice(fileListLen, 1, Object.assign(
  833. item, {
  834. sort: sort,
  835. fileName: JSON.parse(result).data.originalName,
  836. url: JSON.parse(result).data.link
  837. }))
  838. fileListLen++
  839. }
  840. } else {}
  841. },
  842. // 上传附件接口
  843. uploadFilePromise(url) {
  844. return new Promise((resolve, reject) => {
  845. let a = uni.uploadFile({
  846. url: http.config.baseURL +
  847. '/blade-resource/oss/endpoint/put-file', // 仅为示例,非真实的接口地址
  848. filePath: url,
  849. name: 'file',
  850. formData: {
  851. user: 'test'
  852. },
  853. header: {
  854. // 客户端认证参数
  855. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
  856. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  857. },
  858. success: (res) => {
  859. setTimeout(() => {
  860. resolve(res.data)
  861. }, 1000)
  862. }
  863. });
  864. })
  865. },
  866. // 删除图片
  867. deletePic(e, type, index) {
  868. if (type == 1) {
  869. this.form.filesList.splice(e.index, 1)
  870. } else if (type == 2) {
  871. this.form.corpEquipmentArchivesItemList[index].filesList.splice(e.index, 1)
  872. } else {}
  873. }
  874. }
  875. }
  876. </script>
  877. <style lang="scss" scoped>
  878. .filedetails {
  879. padding: 20rpx;
  880. box-sizing: border-box;
  881. .listbox {
  882. width: 100%;
  883. .inputbox {
  884. display: flex;
  885. align-items: center;
  886. .shebetext {
  887. width: 140rpx;
  888. font-size: 32rpx;
  889. color: #215476;
  890. text-align: right;
  891. margin-right: 10rpx;
  892. }
  893. }
  894. .listbox_title {
  895. display: flex;
  896. align-items: center;
  897. justify-content: space-between;
  898. margin-bottom: 20rpx;
  899. .listbox_titleXh {
  900. font-size: 28rpx;
  901. background: #dd451b;
  902. width: 90rpx;
  903. height: 90rpx;
  904. color: #fff;
  905. text-align: center;
  906. line-height: 90rpx;
  907. border-radius: 50%;
  908. }
  909. .listbox_titleDe {
  910. font-size: 30rpx;
  911. border: 2rpx solid #dd451b;
  912. border-radius: 12rpx;
  913. padding: 5rpx 20rpx;
  914. color: #dd451b;
  915. }
  916. }
  917. .binahao {
  918. font-size: 30rpx;
  919. color: #101010;
  920. margin-bottom: 10rpx;
  921. }
  922. .bottombox {
  923. width: 100%;
  924. display: flex;
  925. align-content: center;
  926. .bottombox_img {
  927. // width: 35%;
  928. width: 220rpx;
  929. height: 220rpx;
  930. }
  931. .bottombox_text {
  932. margin-left: 20rpx;
  933. width: 65%;
  934. display: flex;
  935. align-items: center;
  936. justify-content: space-between;
  937. .bottombox_textleft {
  938. font-size: 30rpx;
  939. .bottombox_textTitle {
  940. font-size: 34rpx;
  941. color: #2d4a6a;
  942. font-weight: 500;
  943. margin-bottom: 20rpx;
  944. width: 400rpx;
  945. overflow: hidden;
  946. white-space: nowrap;
  947. text-overflow: ellipsis;
  948. }
  949. }
  950. .bottombox_textRight {}
  951. }
  952. }
  953. }
  954. }
  955. .cardBox {
  956. background: #fff;
  957. border-radius: 12rpx;
  958. width: 100%;
  959. padding: 20rpx 30rpx;
  960. box-sizing: border-box;
  961. display: flex;
  962. align-content: center;
  963. justify-content: space-between;
  964. margin-bottom: 20rpx;
  965. }
  966. .bottomButton {
  967. position: fixed;
  968. bottom: 0;
  969. width: 100%;
  970. padding: 20rpx 30rpx;
  971. background: #fff;
  972. display: flex;
  973. justify-content: center;
  974. align-items: center;
  975. box-sizing: border-box;
  976. z-index: 99;
  977. .savebutton {
  978. border-radius: 30rpx;
  979. // color: #3f7cef;
  980. color: #fff;
  981. font-size: 34rpx;
  982. // border: 2rpx solid #3f7cef;
  983. border: 2rpx solid #FD4B09;
  984. background: #FD4B09;
  985. padding: 10rpx 40rpx;
  986. font-weight: 500;
  987. }
  988. }
  989. image {
  990. width: 100%;
  991. }
  992. </style>