bottomSheet.vue 29 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781
  1. <template>
  2. <view class="share">
  3. <view :class="{'share-box': shareState}" @click="handleHiddenShare">
  4. </view>
  5. <view class="share-item" :class="{'share-show': shareState}">
  6. <view class="share-to">
  7. <text style="font-size: 14px;color: #000;">{{title}}</text>
  8. </view>
  9. <scroll-view scroll-y="true" class="scroll-Y">
  10. <view class="uni-list-cell" hover-class="uni-list-cell-hover" v-for="(value, key) in historyList"
  11. :key="key">
  12. <view class="uni-media-list">
  13. <view class="uni-media-list-body" style="margin-left: 15px;">
  14. <view v-if="title=='拆旧管'">
  15. <view class="uni-media-list-text-top">
  16. <view class="tit-text">腐蚀等级:</view>
  17. {{value.zEngineeringMaterialBo[0].corrosionLevel}}
  18. </view>
  19. <view class="uni-media-list-text-top">
  20. <view class="tit-text">施工时间:</view>{{value.createTime}}
  21. </view>
  22. </view>
  23. <view v-if="title=='打孔'">
  24. <!-- <view class="uni-media-list-text-top">
  25. <view class="tit-text">孔距:</view>{{value.zEngineeringMaterialBo[0].corrosionLevel}}
  26. </view> -->
  27. <view class="uni-media-list-text-top">
  28. <view class="tit-text">施工时间:</view>{{value.createTime}}
  29. </view>
  30. </view>
  31. <view
  32. v-if="title=='立杠'||title=='表后管'||title=='挂表'||title=='阀管'||title=='报警器'||title=='切断阀'">
  33. <view class="uni-media-list-text-top" v-show="title=='阀管'">
  34. <view class="tit-text">上门类型:</view>{{value.zEngineeringMaterialBo[0].visitType}}
  35. </view>
  36. <view class="uni-media-list-text-top" v-show="title=='阀管'">
  37. <view class="tit-text">自闭阀厂家:</view>
  38. {{value.zEngineeringMaterialBo[0].selfClosingValveType}}
  39. </view>
  40. <view class="uni-media-list-text-top" v-show="title=='立杠'||title=='表后管'||title=='阀管'">
  41. <view class="tit-text">材质:</view>
  42. {{value.zEngineeringMaterialBo[0].materialQualityName}}
  43. </view>
  44. <view class="uni-media-list-text-top" v-show="title=='立杠'||title=='表后管'||title=='阀管'">
  45. <view class="tit-text">规格:</view>
  46. {{value.zEngineeringMaterialBo[0].specificationsName}}
  47. </view>
  48. <view class="uni-media-list-text-top" v-show="title=='挂表'">
  49. <view class="tit-text">品牌:</view>{{value.zEngineeringMaterialBo[0].brand}}
  50. </view>
  51. <view class="uni-media-list-text-top" v-show="title=='报警器'||title=='切断阀'">
  52. <view class="tit-text">厂家:</view>{{value.zEngineeringMaterialBo[0].brand}}
  53. </view>
  54. <view class="uni-media-list-text-top" v-show="title=='立杠'||title=='表后管'">
  55. <view class="tit-text">数量:</view>{{value.zEngineeringMaterialBo[0].number}}
  56. </view>
  57. <view class="uni-media-list-text-top">
  58. <view class="tit-text">施工时间:</view>{{value.createTime}}
  59. </view>
  60. </view>
  61. <view
  62. v-if="title=='开挖前'||title=='开挖后'||title=='焊口照片'||title=='隐蔽工程'||title=='除锈刷油'||title=='打磨'||title=='管道施工记录'||title=='调压柜'||title=='阀井'||title=='焊接'">
  63. <view class="uni-media-list-text-top">
  64. <view class="tit-text">施工时间:</view>{{value.constructTime}}
  65. </view>
  66. <view class="uni-media-list-text-top">
  67. <view class="uni-common-mt" style="width: 100%;">
  68. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  69. #000;margin-top: 5px;">施工内容:</text>
  70. <view style="width: 100%;padding-right: 20rpx;box-sizing: border-box;">
  71. <textarea class="textarea" maxlength="255" :disabled="true"
  72. placeholder-style="padding: 10rpx;"
  73. style="width: 100%;height: 100%;border: 1rpx solid #cccccc; border-radius: 15rpx;padding: 10rpx;line-height:normal;"
  74. auto-height>{{value.remark}}</textarea>
  75. </view>
  76. </view>
  77. </view>
  78. </view>
  79. <view v-if="title=='回填'">
  80. <view class="uni-media-list-text-top">
  81. <view class="tit-text">施工时间:</view>{{value.constructTime}}
  82. </view>
  83. <view class="uni-media-list-text-top">
  84. <view class="uni-common-mt" style="width: 100%;">
  85. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  86. #000;margin-top: 5px;">施工内容:</text>
  87. <view style="width: 100%;padding-right: 20rpx;box-sizing: border-box;">
  88. <textarea class="textarea" maxlength="255" :disabled="true"
  89. placeholder-style="padding: 10rpx;"
  90. style="width: 100%;height: 100%;border: 1rpx solid #cccccc; border-radius: 15rpx;padding: 10rpx;line-height:normal;"
  91. auto-height>{{value.remark}}</textarea>
  92. </view>
  93. </view>
  94. </view>
  95. <view class="uni-media-list-text-top">
  96. <view class="tit-text">负责人:</view>
  97. <text>{{value.constructUser}}</text>
  98. </view>
  99. <view class="uni-media-list-text-top">
  100. <view class="tit-text">负责人联系电话:</view>
  101. <text>{{value.constructPhone}}</text>
  102. </view>
  103. <view class="uni-common-mt" style="width: 100%;">
  104. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  105. #000;margin-top: 5px; margin-left: 8px;">石粉回填照片:</text>
  106. </view>
  107. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  108. <view v-for="(item,index) in value.stonePowder" :key="index"
  109. style="position: relative;">
  110. <view
  111. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  112. <image :src="item" mode=""
  113. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  114. @click="showPhoto(index,value.stonePowder)">
  115. </image>
  116. </view>
  117. <view v-else>
  118. <video :src="item"
  119. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  120. </view>
  121. </view>
  122. </view>
  123. <view class="uni-common-mt" style="width: 100%;">
  124. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  125. #000;margin-top: 5px;margin-left: 8px;">警示带铺设照片:</text>
  126. </view>
  127. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  128. <view v-for="(item,index) in value.warningtTape" :key="index"
  129. style="position: relative;">
  130. <view
  131. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  132. <image :src="item" mode=""
  133. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  134. @click="showPhoto(index,value.warningtTape)">
  135. </image>
  136. </view>
  137. <view v-else>
  138. <video :src="item"
  139. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  140. </view>
  141. </view>
  142. </view>
  143. <view class="uni-common-mt" style="width: 100%;">
  144. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  145. #000;margin-top: 5px;margin-left: 8px;">回填后照片:</text>
  146. </view>
  147. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  148. <view v-for="(item,index) in value.photosAfter" :key="index"
  149. style="position: relative;">
  150. <view
  151. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  152. <image :src="item" mode=""
  153. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  154. @click="showPhoto(index,value.photosAfter)">
  155. </image>
  156. </view>
  157. <view v-else>
  158. <video :src="item"
  159. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  160. </view>
  161. </view>
  162. </view>
  163. </view>
  164. <view v-if="title=='底腿'">
  165. <view class="uni-media-list-text-top">
  166. <view class="tit-text">施工时间:</view>{{value.constructTime}}
  167. </view>
  168. <view class="uni-media-list-text-top">
  169. <view class="uni-common-mt" style="width: 100%;">
  170. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  171. #000;margin-top: 5px;">施工内容:</text>
  172. <view style="width: 100%;padding-right: 20rpx;box-sizing: border-box;">
  173. <textarea class="textarea" maxlength="255" :disabled="true"
  174. placeholder-style="padding: 10rpx;"
  175. style="width: 100%;height: 100%;border: 1rpx solid #cccccc; border-radius: 15rpx;padding: 10rpx;line-height:normal;"
  176. auto-height>{{value.zEngineeringMaterialBo[0].remark}}</textarea>
  177. </view>
  178. </view>
  179. </view>
  180. <view class="uni-media-list-text-top">
  181. <view class="tit-text">施工位置:</view>
  182. <text style="margin-right: 10px;">{{value.constructAddre}}</text>
  183. 第{{value.zEngineeringMaterialBo[0].number}}根
  184. </view>
  185. <view class="uni-media-list-text-top">
  186. <view class="tit-text">负责人:</view>
  187. <text>{{value.constructUser}}</text>
  188. </view>
  189. <view class="uni-media-list-text-top">
  190. <view class="tit-text">负责人联系电话:</view>
  191. <text>{{value.constructPhone}}</text>
  192. </view>
  193. <view class="uni-common-mt" style="width: 100%;">
  194. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  195. #000;margin-top: 5px; margin-left: 8px;">开挖前照片:</text>
  196. </view>
  197. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  198. <view v-for="(item,index) in value.beforeBottom" :key="index"
  199. style="position: relative;">
  200. <view
  201. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  202. <image :src="item" mode=""
  203. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  204. @click="showPhoto(index,value.beforeBottom)">
  205. </image>
  206. </view>
  207. <view v-else>
  208. <video :src="item"
  209. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  210. </view>
  211. </view>
  212. </view>
  213. <view class="uni-common-mt" style="width: 100%;">
  214. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  215. #000;margin-top: 5px;margin-left: 8px;">下沟照片:</text>
  216. </view>
  217. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  218. <view v-for="(item,index) in value.legBackfilling" :key="index"
  219. style="position: relative;">
  220. <view
  221. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  222. <image :src="item" mode=""
  223. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  224. @click="showPhoto(index,value.legBackfilling)">
  225. </image>
  226. </view>
  227. <view v-else>
  228. <video :src="item"
  229. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  230. </view>
  231. </view>
  232. </view>
  233. <view class="uni-common-mt" style="width: 100%;">
  234. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  235. #000;margin-top: 5px;margin-left: 8px;">回填照片:</text>
  236. </view>
  237. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  238. <view v-for="(item,index) in value.inferiorSulcus" :key="index"
  239. style="position: relative;">
  240. <view
  241. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  242. <image :src="item" mode=""
  243. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  244. @click="showPhoto(index,value.inferiorSulcus)">
  245. </image>
  246. </view>
  247. <view v-else>
  248. <video :src="item"
  249. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  250. </view>
  251. </view>
  252. </view>
  253. <view class="uni-common-mt" style="width: 100%;">
  254. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  255. #000;margin-top: 5px; margin-left: 8px;">安装完成照片:</text>
  256. </view>
  257. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  258. <view v-for="(item,index) in value.onTheDitch" :key="index"
  259. style="position: relative;">
  260. <view
  261. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  262. <image :src="item" mode=""
  263. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  264. @click="showPhoto(index,value.onTheDitch)">
  265. </image>
  266. </view>
  267. <view v-else>
  268. <video :src="item"
  269. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  270. </view>
  271. </view>
  272. </view>
  273. </view>
  274. <view v-else-if="title=='调压柜'">
  275. <view class="uni-media-list-text-top">
  276. <view class="tit-text">负责人:</view>
  277. <text>{{value.constructUser}}</text>
  278. </view>
  279. <view class="uni-media-list-text-top">
  280. <view class="tit-text">负责人联系电话:</view>
  281. <text>{{value.constructPhone}}</text>
  282. </view>
  283. <view class="uni-common-mt" style="width: 100%;">
  284. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  285. #000;margin-top: 5px;margin-left: 8px;">调压箱名牌照片:</text>
  286. </view>
  287. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  288. <view v-for="(item,index) in value.boxBrand" :key="index"
  289. style="position: relative;">
  290. <view
  291. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  292. <image :src="item" mode=""
  293. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  294. @click="showPhoto(index,value.boxBrand)">
  295. </image>
  296. </view>
  297. <view v-else>
  298. <video :src="item"
  299. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  300. </view>
  301. </view>
  302. </view>
  303. <view class="uni-common-mt" style="width: 100%;">
  304. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  305. #000;margin-top: 5px;margin-left: 8px;">调压箱内石粉回填照片:</text>
  306. </view>
  307. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  308. <view v-for="(item,index) in value.stonePowder" :key="index"
  309. style="position: relative;">
  310. <view
  311. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  312. <image :src="item" mode=""
  313. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  314. @click="showPhoto(index,value.stonePowder)">
  315. </image>
  316. </view>
  317. <view v-else>
  318. <video :src="item"
  319. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  320. </view>
  321. </view>
  322. </view>
  323. <view class="uni-common-mt" style="width: 100%;">
  324. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  325. #000;margin-top: 5px;margin-left: 8px;">调压箱防雷接地照片:</text>
  326. </view>
  327. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  328. <view v-for="(item,index) in value.lightning" :key="index"
  329. style="position: relative;">
  330. <view
  331. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  332. <image :src="item" mode=""
  333. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  334. @click="showPhoto(index,value.lightning)">
  335. </image>
  336. </view>
  337. <view v-else>
  338. <video :src="item"
  339. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  340. </view>
  341. </view>
  342. </view>
  343. <view class="uni-common-mt" style="width: 100%;">
  344. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  345. #000;margin-top: 5px;margin-left: 8px;">调压箱底腿连接照片:</text>
  346. </view>
  347. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  348. <view v-for="(item,index) in value.bottomLeg" :key="index"
  349. style="position: relative;">
  350. <view
  351. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  352. <image :src="item" mode=""
  353. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  354. @click="showPhoto(index,value.bottomLeg)">
  355. </image>
  356. </view>
  357. <view v-else>
  358. <video :src="item"
  359. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  360. </view>
  361. </view>
  362. </view>
  363. <view class="uni-common-mt" style="width: 100%;">
  364. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  365. #000;margin-top: 5px;margin-left: 8px;">调压箱护栏及地面硬化(远景)照片:</text>
  366. </view>
  367. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  368. <view v-for="(item,index) in value.groundHardening" :key="index"
  369. style="position: relative;">
  370. <view
  371. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  372. <image :src="item" mode=""
  373. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  374. @click="showPhoto(index,value.groundHardening)">
  375. </image>
  376. </view>
  377. <view v-else>
  378. <video :src="item"
  379. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  380. </view>
  381. </view>
  382. </view>
  383. </view>
  384. <view v-else-if="title=='阀井'">
  385. <view class="uni-media-list-text-top">
  386. <view class="tit-text">负责人:</view>
  387. <text>{{value.constructUser}}</text>
  388. </view>
  389. <view class="uni-media-list-text-top">
  390. <view class="tit-text">负责人联系电话:</view>
  391. <text>{{value.constructPhone}}</text>
  392. </view>
  393. <view class="uni-common-mt" style="width: 100%;">
  394. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  395. #000;margin-top: 5px;margin-left: 8px;">套管照片:</text>
  396. </view>
  397. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  398. <view v-for="(item,index) in value.cannula" :key="index"
  399. style="position: relative;">
  400. <view
  401. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  402. <image :src="item" mode=""
  403. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  404. @click="showPhoto(index,value.cannula)">
  405. </image>
  406. </view>
  407. <view v-else>
  408. <video :src="item"
  409. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  410. </view>
  411. </view>
  412. </view>
  413. <view class="uni-common-mt" style="width: 100%;">
  414. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  415. #000;margin-top: 5px;margin-left: 8px;">内壁抹灰照片:</text>
  416. </view>
  417. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  418. <view v-for="(item,index) in value.wallPlaster" :key="index"
  419. style="position: relative;">
  420. <view
  421. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  422. <image :src="item" mode=""
  423. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  424. @click="showPhoto(index,value.wallPlaster)">
  425. </image>
  426. </view>
  427. <view v-else>
  428. <video :src="item"
  429. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  430. </view>
  431. </view>
  432. </view>
  433. <view class="uni-common-mt" style="width: 100%;">
  434. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  435. #000;margin-top: 5px;margin-left: 8px;">防护网照片:</text>
  436. </view>
  437. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  438. <view v-for="(item,index) in value.protectiveNet" :key="index"
  439. style="position: relative;">
  440. <view
  441. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  442. <image :src="item" mode=""
  443. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  444. @click="showPhoto(index,value.protectiveNet)">
  445. </image>
  446. </view>
  447. <view v-else>
  448. <video :src="item"
  449. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  450. </view>
  451. </view>
  452. </view>
  453. <view class="uni-common-mt" style="width: 100%;">
  454. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  455. #000;margin-top: 5px;margin-left: 8px;">八角照片:</text>
  456. </view>
  457. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  458. <view v-for="(item,index) in value.starAnise" :key="index"
  459. style="position: relative;">
  460. <view
  461. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  462. <image :src="item" mode=""
  463. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  464. @click="showPhoto(index,value.starAnise)">
  465. </image>
  466. </view>
  467. <view v-else>
  468. <video :src="item"
  469. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  470. </view>
  471. </view>
  472. </view>
  473. </view>
  474. <!-- <view v-if="title=='管道施工记录'">
  475. <view class="uni-media-list-text-top">
  476. <view class="tit-text">负责人:</view>
  477. <text>{{value.constructUser}}</text>
  478. </view>
  479. <view class="uni-media-list-text-top">
  480. <view class="tit-text">负责人联系电话:</view>
  481. <text>{{value.constructPhone}}</text>
  482. </view>
  483. <view class="uni-media-list-text-top">
  484. <view class="tit-text">施工时间:</view>{{value.constructTime}}
  485. </view>
  486. <view class="uni-common-mt" style="width: 100%;">
  487. <text class="uni-title uni-common-pl" style=" font-size: 13px;color:
  488. #000;margin-top: 5px;margin-left: 8px;">照片:</text>
  489. </view>
  490. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  491. <view v-for="(item,index) in value.zEngiineeringPhotoBoList" :key="index"
  492. style="position: relative;">
  493. <view
  494. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  495. <image :src="item" mode=""
  496. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  497. @click="showPhoto(index,value.zEngiineeringPhotoBoList)">
  498. </image>
  499. </view>
  500. <view v-else>
  501. <video :src="item"
  502. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  503. </view>
  504. </view>
  505. </view>
  506. </view> -->
  507. <view v-else>
  508. <view class="uni-media-list-text-top">
  509. <view class="tit-text">负责人:</view>
  510. <text>{{value.constructUser}}</text>
  511. </view>
  512. <view class="uni-media-list-text-top">
  513. <view class="tit-text">负责人联系电话:</view>
  514. <text>{{value.constructPhone}}</text>
  515. </view>
  516. <view class="" style="display: flex; flex-wrap: wrap;margin-top: 10px;">
  517. <view v-for="(item,index) in value.zEngiineeringPhotoBoList" :key="index"
  518. style="position: relative;">
  519. <view
  520. v-if="item.substring(item.length - 3) == 'png' || item.substring(item.length - 3) == 'jpg' || item.substring(item.length - 3) == 'jpeg'">
  521. <image :src="item" mode=""
  522. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
  523. @click="showPhoto(index,value.zEngiineeringPhotoBoList)">
  524. </image>
  525. </view>
  526. <view v-else>
  527. <video :src="item"
  528. style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"></video>
  529. </view>
  530. </view>
  531. </view>
  532. </view>
  533. </view>
  534. </view>
  535. </view>
  536. </scroll-view>
  537. </view>
  538. </view>
  539. </template>
  540. <script>
  541. export default {
  542. props: {
  543. data: {
  544. type: Object,
  545. default: {}
  546. },
  547. },
  548. created() {
  549. this.getParamsData();
  550. },
  551. watch: {
  552. data(data) {
  553. this.getParamsData();
  554. }
  555. },
  556. data() {
  557. return {
  558. outPutData: {},
  559. historyList: [], //历史数据
  560. historyPhotoList: [], //历史图片数据
  561. shareState: false,
  562. title: '',
  563. };
  564. },
  565. methods: {
  566. showPhoto(index, list) {
  567. uni.previewImage({
  568. current: index,
  569. urls: list,
  570. })
  571. },
  572. getParamsData() {
  573. var selectData = this.data;
  574. this.outPutData = selectData;
  575. this.title = selectData.zEngineeringNodeBo.type;
  576. this.historyList = selectData.zEngineeringNodeBo.zEngineeringInfoBoList;
  577. //this.historyPhotoList = selectData.zEngineeringNodeBo.zEngineeringInfoBoList.zEngiineeringPhotoBoList;
  578. },
  579. // 显示分享
  580. handleShowShare() {
  581. this.shareState = true;
  582. },
  583. // 隐藏分享
  584. handleHiddenShare() {
  585. this.shareState = false;
  586. }
  587. }
  588. }
  589. </script>
  590. <style lang="scss">
  591. .uni-media-list-body {
  592. border: 1px solid #eee;
  593. border-radius: 40rpx;
  594. margin: 10rpx 30rpx 20rpx;
  595. padding: 10rpx 0 40rpx;
  596. box-shadow: 0 0 5px #eee;
  597. }
  598. .share {
  599. width: 100%;
  600. height: 100%;
  601. }
  602. .tit-text {
  603. color: #4f535a;
  604. margin-right: 20rpx;
  605. }
  606. .normal-text {}
  607. .cz-style {
  608. background: #e8f4f9;
  609. margin: 20rpx;
  610. padding: 10rpx;
  611. border-radius: 20rpx;
  612. border: 1px solid #d4e3f0;
  613. }
  614. .uni-media-list-text-top {
  615. font-size: 14px;
  616. color: #696969;
  617. padding: 20rpx 20rpx;
  618. border-bottom: 1px solid #eee;
  619. display: flex;
  620. align-items: center;
  621. }
  622. .share-box {
  623. width: 100%;
  624. height: 100%;
  625. position: fixed;
  626. top: 0rpx;
  627. left: 0rpx;
  628. bottom: 0rpx;
  629. right: 0rpx;
  630. background-color: rgba(0, 0, 0, 0.4);
  631. transition: .3s;
  632. z-index: 999;
  633. }
  634. // 进入分享动画
  635. .share-show {
  636. transition: all 0.3s ease;
  637. transform: translateY(0%) !important;
  638. border-radius: 20px 20px 0px 0px;
  639. }
  640. .scroll-Y {
  641. height: 58vh;
  642. }
  643. // 离开分享动画
  644. .share-item {
  645. position: fixed;
  646. left: 0;
  647. bottom: 0;
  648. width: 100%;
  649. height: 70%;
  650. background-color: #FFFFFF;
  651. transition: all 0.3s ease;
  652. transform: translateY(100%);
  653. z-index: 1999;
  654. .share-to {
  655. width: 100%;
  656. height: 30px;
  657. display: flex;
  658. justify-content: center;
  659. margin: 30rpx 0;
  660. align-items: center;
  661. // &::after {
  662. // content: '';
  663. // width: 240rpx;
  664. // height: 0rpx;
  665. // border-top: 1px solid #E4E7ED;
  666. // -webkit-transform: scaleY(0.5);
  667. // transform: scaleY(0.5);
  668. // margin-left: 30rpx;
  669. // }
  670. // &::before {
  671. // content: '';
  672. // width: 240rpx;
  673. // height: 0rpx;
  674. // border-top: 1px solid #E4E7ED;
  675. // -webkit-transform: scaleY(0.5);
  676. // transform: scaleY(0.5);
  677. // margin-right: 30rpx;
  678. // }
  679. }
  680. .content {
  681. width: 100%;
  682. height: auto;
  683. display: flex;
  684. flex-wrap: wrap;
  685. .block {
  686. width: 100%;
  687. display: flex;
  688. flex-direction: column;
  689. justify-content: center;
  690. align-items: left;
  691. height: auto;
  692. image {
  693. width: 80rpx;
  694. height: 80rpx;
  695. }
  696. text {
  697. margin-top: 16rpx;
  698. font-size: 28rpx;
  699. color: #606266;
  700. }
  701. }
  702. }
  703. .cancel {
  704. width: 100%;
  705. height: 3rem;
  706. display: flex;
  707. justify-content: center;
  708. align-items: center;
  709. border-top: 1rpx solid #E4E7ED;
  710. }
  711. }
  712. </style>