FileDetails.vue 35 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081
  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. background-color: #FD4B09;
  335. border-radius:44rpx;
  336. color: #fff;
  337. padding: 10rpx" @click="pickerShowfun('CP',null)">+添加设备</view>
  338. <!-- EquipmentAddConfirm = true -->
  339. </view>
  340. </view>
  341. </view>
  342. <view style="height: 100rpx;"></view>
  343. <view class="bottomButton">
  344. <view class="savebutton" @click="savefun">保存档案</view>
  345. </view>
  346. <u-picker :show="pickerShow" :columns="pickerColumns" keyName="cname" @confirm="pickerConfirm"
  347. @cancel="pickerCancel"></u-picker>
  348. <!-- 日期 -->
  349. <u-calendar :show="calendarShow" @confirm="calendarConfirm" @close="calendarClose"></u-calendar>
  350. <!-- 提示 -->
  351. <u-toast ref="uToast"></u-toast>
  352. <!-- 添加设备弹框 -->
  353. <!-- <u-modal :show="EquipmentAddConfirm" title="提示" showCancelButton @confirm="EquipmentAddition"
  354. @cancel="EquipmentAddConfirm = false">
  355. <view class="slot-content">
  356. <view class="inputbox" @click="pickerShowfun('CP',index)">
  357. <u--input
  358. prefixIconStyle="fontSize:60rpx;"
  359. placeholderStyle="fontSize:30rpx;"
  360. disabled disabledColor="#fff" placeholder="请选择设备名称" border="bottom"
  361. v-model="machine.cname" >
  362. </u--input>
  363. </view>
  364. <view class="inputbox">
  365. <u--input
  366. prefixIconStyle="fontSize:60rpx;"
  367. placeholderStyle="fontSize:30rpx;"
  368. disabledColor="#fff" placeholder="请输入设备编号" border="bottom"
  369. v-model="machine.code">
  370. </u--input>
  371. </view>
  372. <view class="inputbox">
  373. <u--textarea v-model="machine.equipmentDescribe"
  374. placeholderStyle="fontSize:30rpx;" placeholder="请输入设备描述" >
  375. </u--textarea>
  376. </view>
  377. <view class="inputbox" @click="calendarShowfun(machine.exitDate,2,1,index)">
  378. <u--input
  379. prefixIconStyle="fontSize:60rpx;"
  380. placeholderStyle="fontSize:30rpx;"
  381. disabled disabledColor="#fff" placeholder="请选择出厂日期" border="bottom"
  382. v-model="machine.exitDate">
  383. </u--input>
  384. </view>
  385. <view class="inputbox" @click="calendarShowfun(machine.maintenanceDate,2,2,index)">
  386. <u--input
  387. prefixIconStyle="fontSize:60rpx;"
  388. placeholderStyle="fontSize:30rpx;"
  389. disabled disabledColor="#fff" placeholder="请选择保养日期" border="bottom"
  390. v-model="machine.maintenanceDate">
  391. </u--input>
  392. </view>
  393. <view class="inputbox" style="margin-top: 20rpx;">
  394. <view class="shebetext">图片:</view>
  395. <u-upload
  396. :fileList="machine.filesList"
  397. @afterRead="afterRead($event,2,index)"
  398. @delete="deletePic($event,2,index)"
  399. name="1"
  400. multiple
  401. :maxCount="10"
  402. ></u-upload>
  403. </view>
  404. </view>
  405. </u-modal> -->
  406. <!-- 删除弹框 -->
  407. <u-modal :show="EquipmentDeleteConfirm" title="提示" showCancelButton @confirm="DeleteDevicefun"
  408. @cancel="EquipmentDeleteConfirm = false">
  409. <view class="slot-content">
  410. <rich-text nodes="确定要删除该设备吗?"></rich-text>
  411. </view>
  412. </u-modal>
  413. <!-- <u-datetime-picker :show="calendarShow" @confirm="calendarConfirm" @close="calendarShow = false" v-model="optionDate"
  414. mode="date"></u-datetime-picker> -->
  415. <!-- <u-calendar :show="calendarShow" @confirm="calendarConfirm" @close="calendarClose"></u-calendar> -->
  416. </view>
  417. </template>
  418. <script>
  419. import {
  420. corpequipmentarchivesDetail,
  421. corpequipmentarchivesSubmit,
  422. goodsdescDescList,
  423. corpequipmentarchivesitemRemove
  424. } from '@/api/device/index.js'
  425. import {
  426. corpsDescList
  427. } from '@/api/views/sale/index.js'
  428. import {
  429. queryDetail
  430. } from '@/api/views/customer/index.js'
  431. import http from '@/http/api.js'
  432. import {
  433. clientId,
  434. clientSecret
  435. } from '@/common/setting'
  436. export default {
  437. data() {
  438. return {
  439. // 弹框
  440. // 设备添加
  441. EquipmentAddConfirm: false,
  442. // 设备删除
  443. EquipmentDeleteConfirm: false,
  444. EquipmentDeleteRow: {},
  445. EquipmentDeleteIndex: -1,
  446. // 传递过来的id
  447. id: null,
  448. // 绑定的数据
  449. form: {
  450. corpEquipmentArchivesItemList: [],
  451. filesList: []
  452. },
  453. // 弹窗的开启和管理
  454. pickerShow: false,
  455. // 弹窗的数据配置 数组嵌套
  456. pickerColumns: [],
  457. // 日期弹窗
  458. calendarShow: false,
  459. // 当前打开弹窗的状态
  460. calendarType: {
  461. type: null,
  462. sort: null,
  463. index: null
  464. },
  465. // 当前打开的弹窗的状态
  466. pickerType: {},
  467. // 设备弹窗
  468. machine: {},
  469. optionDate: 0
  470. }
  471. },
  472. onLoad(e) {
  473. this.id = e.id
  474. if (e.id) {
  475. this.corpequipmentarchivesDetailfun()
  476. }
  477. },
  478. onShow() {
  479. },
  480. methods: {
  481. disabledDate(time) {
  482. return time.getTime() > Date.now() - 8.64e7
  483. },
  484. // 保存新增
  485. savefun() {
  486. if (!this.form.corpName) {
  487. return this.$refs.uToast.show({
  488. type: 'warning',
  489. message: '客户名称不能为空',
  490. })
  491. }
  492. if (!this.form.contacts) {
  493. return this.$refs.uToast.show({
  494. type: 'warning',
  495. message: '联系人不能为空',
  496. })
  497. }
  498. if (!this.form.contactsTel) {
  499. return this.$refs.uToast.show({
  500. type: 'warning',
  501. message: '电话不能为空',
  502. })
  503. }
  504. if (!this.form.address) {
  505. return this.$refs.uToast.show({
  506. type: 'warning',
  507. message: '地址不能为空',
  508. })
  509. }
  510. // if (!this.form.corpEquipmentArchivesItemList.length > 0){
  511. // return this.$refs.uToast.show({
  512. // type: 'warning',
  513. // message: '请添加一条设备',
  514. // })
  515. // }
  516. this.form.corpEquipmentArchivesItemList.map(item => {
  517. if (!item.cname) {
  518. if (!item.equipmentDescribe) {
  519. return this.$refs.uToast.show({
  520. type: 'warning',
  521. message: '请维护设备描述',
  522. })
  523. }
  524. return
  525. }
  526. item.id = item.id ? item.id : null
  527. item.exitDate = item.exitDate ? item.exitDate + ' 00:00:00' : null
  528. item.repairReportDate = item.repairReportDate ? item.repairReportDate + ' 00:00:00' : null
  529. item.maintenanceDate = item.maintenanceDate ? item.maintenanceDate + ' 00:00:00' : null
  530. })
  531. const obj = {
  532. ...this.form,
  533. id: this.form.id ? this.form.id : null,
  534. sysNo: this.form.sysNo ? this.form.sysNo : null,
  535. equipmentNumber: this.form.corpEquipmentArchivesItemList.length,
  536. maintenanceSecond: this.form.maintenanceSecond ? this.form.maintenanceSecond : null,
  537. signingDateStart: this.form.signingDateStart ? this.form.signingDateStart + ' 00:00:00' : null,
  538. signingDateEnd: this.form.signingDateEnd ? this.form.signingDateEnd + ' 00:00:00' : null,
  539. remarks: this.form.remarks ? this.form.remarks : null
  540. }
  541. console.log(obj, 166);
  542. this.corpequipmentarchivesSubmitfun(obj)
  543. },
  544. // 保存数据接口
  545. corpequipmentarchivesSubmitfun(obj) {
  546. corpequipmentarchivesSubmit(obj).then(res => {
  547. if (res.code == 200) {
  548. this.$refs.uToast.show({
  549. type: 'success',
  550. message: '操作成功',
  551. })
  552. this.form = res.data
  553. } else {
  554. this.$refs.uToast.show({
  555. type: 'error',
  556. message: res.msg,
  557. })
  558. }
  559. })
  560. },
  561. // 跳转选择用户
  562. selectCustomer() {
  563. this.$u.route('/pages/views/salesSlip/selectCustomer', {
  564. corpType: 'KH'
  565. });
  566. },
  567. // 选中用户赋值
  568. otherFun(user) {
  569. console.log(user);
  570. queryDetail({
  571. id: user.id
  572. }).then(res => {
  573. this.$set(this.form, 'address', res.data.corpsAddrList[0].detailedAddress)
  574. this.form.corpId = user.id
  575. this.form.corpName = res.data.cname
  576. this.form.contacts = res.data.attn
  577. this.form.contactsTel = res.data.tel
  578. })
  579. },
  580. // 设备新增
  581. EquipmentAddition() {
  582. this.form.corpEquipmentArchivesItemList.push({
  583. cname: '',
  584. cname: '',
  585. code: '',
  586. brand: '',
  587. specs: '',
  588. category: '',
  589. categoryitem: '',
  590. url: '',
  591. goodsTypeId: '',
  592. exitDate: '',
  593. repairReportDate: '',
  594. brandId: '',
  595. maintenanceDate: '',
  596. factoryId: '',
  597. factoryName: '',
  598. equipmentDescribe: '',
  599. maintenanceSecond: '',
  600. filesList: [],
  601. })
  602. this.EquipmentAddConfirm = false
  603. },
  604. // 弹窗的开启
  605. pickerShowfun(type, index) {
  606. this.pickerColumns = []
  607. if (type == 'KH') {
  608. this.pickerType.type = type
  609. this.pickerType.index = null
  610. corpsDescList({
  611. corpType: 'KH'
  612. }).then(res => {
  613. this.pickerColumns = [res.data]
  614. })
  615. this.pickerShow = true
  616. } else if (type == 'CP') {
  617. if (index == null) {
  618. this.pickerType.type = type
  619. this.pickerType.index = this.form.corpEquipmentArchivesItemList.length
  620. this.form.corpEquipmentArchivesItemList.push({
  621. cname: '',
  622. cname: '',
  623. code: '',
  624. brand: '',
  625. specs: '',
  626. category: '',
  627. categoryitem: '',
  628. url: '',
  629. goodsTypeId: '',
  630. exitDate: '',
  631. repairReportDate: '',
  632. brandId: '',
  633. maintenanceDate: '',
  634. factoryId: '',
  635. factoryName: '',
  636. equipmentDescribe: '',
  637. maintenanceSecond: '',
  638. filesList: [],
  639. })
  640. this.$u.route('/pages/device/FileDetails/selectMachine', {
  641. corpType: 'KH'
  642. });
  643. } else {
  644. this.pickerType.type = type
  645. this.pickerType.index = index
  646. this.$u.route('/pages/device/FileDetails/selectMachine', {
  647. corpType: 'KH'
  648. });
  649. }
  650. }
  651. },
  652. machineOtherFun(form) {
  653. this.form.corpEquipmentArchivesItemList[this.pickerType.index].cname = form.cname
  654. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].code = form.code
  655. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brand = form.brand
  656. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brandId = form.brandId
  657. this.form.corpEquipmentArchivesItemList[this.pickerType.index].specs = form.specs
  658. this.form.corpEquipmentArchivesItemList[this.pickerType.index].remarks = form.remarks
  659. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeId = form.goodsTypeId
  660. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeName = form.goodsTypeName
  661. this.form.corpEquipmentArchivesItemList[this.pickerType.index].maintenanceSecond = form.maintenanceSecond ?
  662. form.maintenanceSecond : null
  663. this.form.corpEquipmentArchivesItemList[this.pickerType.index].repairReportDate = form.repairReportDate
  664. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryId = form.factoryId ? form
  665. .factoryId : null
  666. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryName = form.factoryName ? form
  667. .factoryName : null
  668. this.form.corpEquipmentArchivesItemList[this.pickerType.index].categoryitem = form.categoryitem
  669. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].equipmentDescribe = form.cname
  670. this.pickerType.index = null
  671. },
  672. // 弹窗点击确认按钮
  673. pickerConfirm(val) {
  674. if (this.pickerType.type == 'KH') {
  675. this.form.corpId = val.value[0].id
  676. this.form.corpName = val.value[0].cname
  677. queryDetail({
  678. id: val.value[0].id
  679. }).then(res => {
  680. this.$set(this.form, 'address', res.data.corpsAddrList[0].detailedAddress)
  681. this.form.contacts = res.data.attn
  682. this.form.contactsTel = res.data.tel
  683. })
  684. } else if (this.pickerType.type == 'CP') {
  685. this.form.corpEquipmentArchivesItemList[this.pickerType.index].cname = val.value[0].cname
  686. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].code = val.value[0].code
  687. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brand = val.value[0].brand
  688. this.form.corpEquipmentArchivesItemList[this.pickerType.index].brandId = val.value[0].brandId
  689. this.form.corpEquipmentArchivesItemList[this.pickerType.index].specs = val.value[0].specs
  690. this.form.corpEquipmentArchivesItemList[this.pickerType.index].remarks = val.value[0].remarks
  691. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeId = val.value[0].goodsTypeId
  692. this.form.corpEquipmentArchivesItemList[this.pickerType.index].goodsTypeName = val.value[0]
  693. .goodsTypeName
  694. this.form.corpEquipmentArchivesItemList[this.pickerType.index].maintenanceSecond = val.value[0]
  695. .maintenanceSecond ? val.value[0].maintenanceSecond : null
  696. this.form.corpEquipmentArchivesItemList[this.pickerType.index].repairReportDate = val.value[0]
  697. .repairReportDate
  698. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryId = val.value[0].factoryId ? val
  699. .value[0].factoryId : null
  700. this.form.corpEquipmentArchivesItemList[this.pickerType.index].factoryName = val.value[0].factoryName ?
  701. val.value[0].factoryName : null
  702. this.form.corpEquipmentArchivesItemList[this.pickerType.index].categoryitem = val.value[0].categoryitem
  703. // this.form.corpEquipmentArchivesItemList[this.pickerType.index].equipmentDescribe = val.value[0].cname
  704. } else {}
  705. this.pickerShow = false
  706. },
  707. // 弹窗点击取消按钮
  708. pickerCancel() {
  709. this.pickerShow = false
  710. },
  711. // 日历弹窗的开启
  712. calendarShowfun(type, sort, index) {
  713. // if (date != null && date != "") {
  714. // console.log("赋值");
  715. // console.log(date);
  716. // this.optionDate = Date.parse(date);
  717. // console.log(this.optionDate);
  718. // }
  719. this.calendarType.type = type
  720. this.calendarType.sort = sort
  721. this.calendarType.index = index
  722. this.calendarShow = true
  723. },
  724. // 日历关闭触发
  725. calendarClose() {
  726. this.calendarShow = false
  727. },
  728. // 日历选择完成触发
  729. calendarConfirm(val) {
  730. // var timer = new Date(val.value)
  731. //
  732. // const year = timer.getFullYear()
  733. // const month = timer.getMonth() + 1 // 由于月份从0开始,因此需加1
  734. // const day = timer.getDate()
  735. // const hour = timer.getHours()
  736. // const minute = timer.getMinutes()
  737. // const second = timer.getSeconds()
  738. // var data = `${this.pad(year, 4)}-${this.pad(month)}-${this.pad(day)}`
  739. if (this.calendarType.type == 1) {
  740. if (this.calendarType.sort == 1) {
  741. this.form.signingDateStart = val[0]
  742. } else {
  743. this.form.signingDateEnd = val[0]
  744. }
  745. } else {
  746. if (this.calendarType.sort == 1) {
  747. this.form.corpEquipmentArchivesItemList[this.calendarType.index].exitDate = val[0]
  748. } else {
  749. this.form.corpEquipmentArchivesItemList[this.calendarType.index].maintenanceDate = val[0]
  750. }
  751. }
  752. this.calendarShow = false
  753. },
  754. pad(timeEl, total = 2, str = '0') {
  755. return timeEl.toString().padStart(total, str)
  756. },
  757. // 详情接口
  758. corpequipmentarchivesDetailfun() {
  759. corpequipmentarchivesDetail({
  760. id: this.id
  761. }).then(res => {
  762. this.form = res.data
  763. this.form.corpEquipmentArchivesItemList.map(item=>{
  764. item.maintenanceDate = item.maintenanceDate.slice(0,10)
  765. item.exitDate = item.exitDate.slice(0,10)
  766. })
  767. })
  768. },
  769. // 删除弹窗
  770. DeleteWindow(row, index) {
  771. this.EquipmentDeleteRow = row;
  772. this.EquipmentDeleteIndex = index;
  773. this.EquipmentDeleteConfirm = true;
  774. },
  775. // 删除设备
  776. DeleteDevicefun() {
  777. var row = this.EquipmentDeleteRow
  778. var index = this.EquipmentDeleteIndex
  779. if (row.id) {
  780. this.form.corpEquipmentArchivesItemList.splice(index, 1)
  781. this.corpequipmentarchivesitemRemovefun(row.id)
  782. } else {
  783. this.form.corpEquipmentArchivesItemList.splice(index, 1)
  784. }
  785. this.EquipmentDeleteRow = null;
  786. this.EquipmentDeleteIndex = -1;
  787. this.EquipmentDeleteConfirm = false;
  788. },
  789. // 删除接口
  790. corpequipmentarchivesitemRemovefun(id) {
  791. corpequipmentarchivesitemRemove({
  792. ids: id
  793. }).then(res => {
  794. this.$refs.uToast.show({
  795. type: 'success',
  796. message: '操作成功',
  797. })
  798. })
  799. },
  800. // 新增图片
  801. async afterRead(event, type, index) {
  802. // 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
  803. let lists = [].concat(event.file)
  804. console.log(event);
  805. console.log(lists, 394);
  806. if (type == 1) {
  807. let fileListLen = this.form.filesList.length
  808. lists.map((item) => {
  809. this.form.filesList.push({
  810. ...item,
  811. })
  812. })
  813. let sort = this.form.filesList.length
  814. for (let i = 0; i < lists.length; i++) {
  815. const result = await this.uploadFilePromise(lists[i].url)
  816. let item = this.form.filesList[fileListLen]
  817. this.form.filesList.splice(fileListLen, 1, Object.assign(item, {
  818. sort: sort,
  819. fileName: JSON.parse(result).data.originalName,
  820. url: JSON.parse(result).data.link
  821. }))
  822. fileListLen++
  823. }
  824. } else if (type == 2) {
  825. let fileListLen = this.form.corpEquipmentArchivesItemList[index].filesList.length
  826. lists.map((item) => {
  827. this.form.corpEquipmentArchivesItemList[index].filesList.push({
  828. ...item,
  829. })
  830. })
  831. let sort = this.form.corpEquipmentArchivesItemList[index].filesList.length
  832. for (let i = 0; i < lists.length; i++) {
  833. const result = await this.uploadFilePromise(lists[i].url)
  834. let item = this.form.corpEquipmentArchivesItemList[index].filesList[fileListLen]
  835. this.form.corpEquipmentArchivesItemList[index].filesList.splice(fileListLen, 1, Object.assign(
  836. item, {
  837. sort: sort,
  838. fileName: JSON.parse(result).data.originalName,
  839. url: JSON.parse(result).data.link
  840. }))
  841. fileListLen++
  842. }
  843. } else {}
  844. },
  845. // 上传附件接口
  846. uploadFilePromise(url) {
  847. return new Promise((resolve, reject) => {
  848. let a = uni.uploadFile({
  849. url: http.config.baseURL +
  850. '/blade-resource/oss/endpoint/put-file', // 仅为示例,非真实的接口地址
  851. filePath: url,
  852. name: 'file',
  853. formData: {
  854. user: 'test'
  855. },
  856. header: {
  857. // 客户端认证参数
  858. 'Authorization': 'Basic ' + Base64.encode(clientId + ':' + clientSecret),
  859. 'Blade-Auth': 'bearer ' + uni.getStorageSync('accessToken')
  860. },
  861. success: (res) => {
  862. setTimeout(() => {
  863. resolve(res.data)
  864. }, 1000)
  865. }
  866. });
  867. })
  868. },
  869. // 删除图片
  870. deletePic(e, type, index) {
  871. if (type == 1) {
  872. this.form.filesList.splice(e.index, 1)
  873. } else if (type == 2) {
  874. this.form.corpEquipmentArchivesItemList[index].filesList.splice(e.index, 1)
  875. } else {}
  876. }
  877. }
  878. }
  879. </script>
  880. <style lang="scss" scoped>
  881. .filedetails {
  882. padding: 20rpx;
  883. box-sizing: border-box;
  884. .listbox {
  885. width: 100%;
  886. .inputbox {
  887. display: flex;
  888. align-items: center;
  889. .shebetext {
  890. width: 140rpx;
  891. font-size: 32rpx;
  892. color: #215476;
  893. text-align: right;
  894. margin-right: 10rpx;
  895. }
  896. }
  897. .listbox_title {
  898. display: flex;
  899. align-items: center;
  900. justify-content: space-between;
  901. margin-bottom: 20rpx;
  902. .listbox_titleXh {
  903. font-size: 28rpx;
  904. background: #dd451b;
  905. width: 90rpx;
  906. height: 90rpx;
  907. color: #fff;
  908. text-align: center;
  909. line-height: 90rpx;
  910. border-radius: 50%;
  911. }
  912. .listbox_titleDe {
  913. font-size: 30rpx;
  914. border: 2rpx solid #dd451b;
  915. border-radius: 12rpx;
  916. padding: 5rpx 20rpx;
  917. color: #dd451b;
  918. }
  919. }
  920. .binahao {
  921. font-size: 30rpx;
  922. color: #101010;
  923. margin-bottom: 10rpx;
  924. }
  925. .bottombox {
  926. width: 100%;
  927. display: flex;
  928. align-content: center;
  929. .bottombox_img {
  930. // width: 35%;
  931. width: 220rpx;
  932. height: 220rpx;
  933. }
  934. .bottombox_text {
  935. margin-left: 20rpx;
  936. width: 65%;
  937. display: flex;
  938. align-items: center;
  939. justify-content: space-between;
  940. .bottombox_textleft {
  941. font-size: 30rpx;
  942. .bottombox_textTitle {
  943. font-size: 34rpx;
  944. color: #2d4a6a;
  945. font-weight: 500;
  946. margin-bottom: 20rpx;
  947. width: 400rpx;
  948. overflow: hidden;
  949. white-space: nowrap;
  950. text-overflow: ellipsis;
  951. }
  952. }
  953. .bottombox_textRight {}
  954. }
  955. }
  956. }
  957. }
  958. .cardBox {
  959. background: #fff;
  960. border-radius: 12rpx;
  961. width: 100%;
  962. padding: 20rpx 30rpx;
  963. box-sizing: border-box;
  964. display: flex;
  965. align-content: center;
  966. justify-content: space-between;
  967. margin-bottom: 20rpx;
  968. }
  969. .bottomButton {
  970. position: fixed;
  971. bottom: 0;
  972. width: 100%;
  973. padding: 20rpx 30rpx;
  974. background: #fff;
  975. display: flex;
  976. justify-content: center;
  977. align-items: center;
  978. box-sizing: border-box;
  979. z-index: 99;
  980. .savebutton {
  981. border-radius: 30rpx;
  982. // color: #3f7cef;
  983. color: #fff;
  984. font-size: 34rpx;
  985. // border: 2rpx solid #3f7cef;
  986. border: 2rpx solid #FD4B09;
  987. background: #FD4B09;
  988. padding: 10rpx 40rpx;
  989. font-weight: 500;
  990. }
  991. }
  992. image {
  993. width: 100%;
  994. }
  995. </style>