FileDetails.vue 35 KB

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