equipmentinspectionreport.vue 56 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808
  1. <template>
  2. <view class="container">
  3. <uni-nav-bar dark :fixed="true" backgroundColor="#3F9EFF" statusBar="false" left-icon="left" left-text="返回"
  4. @clickLeft="toBack">
  5. <view style="width: 100%;display: flex;flex-direction: row;justify-content: center;align-items: center;">
  6. <text style="color: white;font-size: 1rem;">{{title}}</text>
  7. </view>
  8. </uni-nav-bar>
  9. <uni-forms ref="baseForm">
  10. <view class="uni-form-item view-flex-rs" style="margin-top: 0px;">
  11. <uSection title="巡检总结情况" titleFontSize="0.8rem" type="line" style="width: 100%;">
  12. <uni-forms-item style="padding-left: 10px;padding-right:10px">
  13. <uni-easyinput label="总结说明" type="textarea" v-model="baseInfo.reportDesc"
  14. placeholder="请输入总结说明" />
  15. </uni-forms-item>
  16. <uGroup title="总体设施设备图片" margin-top="0px">
  17. <view class="view-flex-rs" style="margin-top: 0px;">
  18. <view class="view-flex-cc" style="width: 120px;">
  19. <view class="img-container">
  20. <view class="note-image-box">
  21. <view v-if="baseInfo.photo1Take" class="note-image-item">
  22. <view class="close-icon" @click="onBasePhoto1DeleteClick()">
  23. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  24. </view>
  25. <view class="image-box">
  26. <image :src="toOss(baseInfo.photo1Url)" mode="widthFix"></image>
  27. </view>
  28. </view>
  29. <view v-else class="note-image-item" @click="getBasePhoto1()">
  30. <view class="image-box">
  31. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  32. </view>
  33. </view>
  34. </view>
  35. </view>
  36. </view>
  37. <view class="view-flex-cc" style="width: 120px;">
  38. <view class="img-container">
  39. <view class="note-image-box">
  40. <view v-if="baseInfo.photo2Take" class="note-image-item">
  41. <view class="close-icon" @click="onBasePhoto2DeleteClick()">
  42. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  43. </view>
  44. <view class="image-box">
  45. <image :src="toOss(baseInfo.photo2Url)" mode="widthFix"></image>
  46. </view>
  47. </view>
  48. <view v-else class="note-image-item" @click="getBasePhoto2()">
  49. <view class="image-box">
  50. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  51. </view>
  52. </view>
  53. </view>
  54. </view>
  55. </view>
  56. </view>
  57. </uGroup>
  58. </uSection>
  59. </view>
  60. <uSection title="RTU设备" type="line" titleFontSize="0.8rem" style="width: 100%;">
  61. <uGroup margin-top="0">
  62. <uni-forms-item label="品牌" label-width="130px" required>
  63. <uni-easyinput v-model="rtuInfo.rtuBrandText" placeholder="请录入品牌" />
  64. </uni-forms-item>
  65. <uni-forms-item label="型号" label-width="130px" required>
  66. <uni-easyinput v-model="rtuInfo.rtuModelText" placeholder="请录入型号" />
  67. </uni-forms-item>
  68. <uni-forms-item label="更换时间" label-width="130px" required>
  69. <uni-datetime-picker type="date" :clear-icon="false" v-model="rtuInfo.rtuReplaceDate" />
  70. </uni-forms-item>
  71. <uni-forms-item label="上报省市县" label-width="130px" required>
  72. <checkbox-group @change="datagramToCheckboxChange">
  73. <label style="margin-right: 10px;font-size: 0.7rem;"
  74. v-for="(item, index) in datagramIp.items" :key="item.id">
  75. <checkbox v-if="item.checked" :value="item.id" checked="true" />
  76. <checkbox v-else :value="item.id" />
  77. {{item.dictValue}}
  78. </label>
  79. </checkbox-group>
  80. </uni-forms-item>
  81. <uni-forms-item label="运行状态" label-width="130px" required>
  82. <radio-group @change="onRtuStatusRadioChange"
  83. style="display: flex;flex-direction: row;justify-content: flex-start;">
  84. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  85. v-for="(item, index) in rtuInfo.runStatus.items" :key="item.id">
  86. <view>
  87. <radio :value="item.id" :checked="index === rtuInfo.runStatus.current" />
  88. </view>
  89. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  90. </label>
  91. </radio-group>
  92. </uni-forms-item>
  93. <uni-forms-item>
  94. <uni-easyinput label="备注说明" type="textarea" v-model="rtuInfo.remark" placeholder="请输入备注说明" />
  95. </uni-forms-item>
  96. </uGroup>
  97. <uGroup title="RTU图片" margin-top="0px">
  98. <view class="view-flex-rs" style="margin-top: 0px;">
  99. <view class="view-flex-cc" style="width: 120px;">
  100. <view class="img-container">
  101. <view class="note-image-box">
  102. <view v-if="rtuInfo.photoTake" class="note-image-item">
  103. <view class="close-icon" @click="onRtuPhotoDeleteClick()">
  104. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  105. </view>
  106. <view class="image-box">
  107. <image :src="toOss(rtuInfo.photoUrl)" mode="widthFix"></image>
  108. </view>
  109. </view>
  110. <view v-else class="note-image-item" @click="getRtuPhoto()">
  111. <view class="image-box">
  112. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  113. </view>
  114. </view>
  115. </view>
  116. </view>
  117. </view>
  118. </view>
  119. </uGroup>
  120. </uSection>
  121. <view class="uni-form-item">
  122. <uSection title="雨量传感器" type="line" titleFontSize="0.8rem" style="width: 100%;">
  123. <uGroup margin-top="0">
  124. <uni-forms-item label="是否有雨量计" label-width="130px" required>
  125. <radio-group @change="onRainActiveRadioChange"
  126. style="display: flex;flex-direction: row;justify-content: flex-start;">
  127. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  128. v-for="(item, index) in rainSensorInfo.active.items" :key="item.id">
  129. <view>
  130. <radio :value="item.id" :checked="index === rainSensorInfo.active.current" />
  131. </view>
  132. <view style="font-size: 12px;">{{item.dictValue}}</view>
  133. </label>
  134. </radio-group>
  135. </uni-forms-item>
  136. <uni-forms-item label="品牌" label-width="130px" required>
  137. <uni-easyinput v-model="rainSensorInfo.rainSensorBrandText" placeholder="请录入品牌" />
  138. </uni-forms-item>
  139. <uni-forms-item label="型号" label-width="130px" required>
  140. <uni-easyinput v-model="rainSensorInfo.rainSensorModelText" placeholder="请录入型号" />
  141. </uni-forms-item>
  142. <uni-forms-item label="更换时间" label-width="130px" required>
  143. <uni-datetime-picker type="date" :clear-icon="false"
  144. v-model="rainSensorInfo.rainSensorReplaceDate" />
  145. </uni-forms-item>
  146. <uni-forms-item label="运行状态" label-width="130px" required>
  147. <radio-group @change="onRainSensorStatusRadioChange" class="view-flex-rs">
  148. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  149. v-for="(item, index) in rainSensorInfo.runStatus.items" :key="item.id">
  150. <view>
  151. <radio :value="item.id" :checked="index === rainSensorInfo.runStatus.current" />
  152. </view>
  153. <view style="font-size: 12px;">{{item.dictValue}}</view>
  154. </label>
  155. </radio-group>
  156. </uni-forms-item>
  157. <uni-forms-item>
  158. <uni-easyinput label="备注说明" type="textarea" v-model="rainSensorInfo.remark"
  159. placeholder="请输入备注说明" />
  160. </uni-forms-item>
  161. </uGroup>
  162. <uGroup title="雨量传感器图片" margin-top="0px">
  163. <view class="view-flex-rs" style="margin-top: 0px;">
  164. <view class="view-flex-cc" style="width: 120px;">
  165. <view class="img-container">
  166. <view class="note-image-box">
  167. <view v-if="rainSensorInfo.photoTake" class="note-image-item">
  168. <view class="close-icon" @click="onRainPhotoDeleteClick()">
  169. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  170. </view>
  171. <view class="image-box">
  172. <image :src="toOss(rainSensorInfo.photoUrl)" mode="widthFix"></image>
  173. </view>
  174. </view>
  175. <view v-else class="note-image-item" @click="getRainSensorPhoto()">
  176. <view class="image-box">
  177. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  178. </view>
  179. </view>
  180. </view>
  181. </view>
  182. </view>
  183. </view>
  184. </uGroup>
  185. </uSection>
  186. </view>
  187. <view class="uni-form-item">
  188. <uSection title="水位传感器" type="line" titleFontSize="0.8rem" style="width: 100%;">
  189. <uGroup margin-top="0">
  190. <uni-forms-item label="是否有水位计" label-width="130px" required>
  191. <radio-group @change="onWaterActiveRadioChange" class="view-flex-rs">
  192. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  193. v-for="(item, index) in waterSensorInfo.active.items" :key="item.id">
  194. <view>
  195. <radio :value="item.id" :checked="index === waterSensorInfo.active.current" />
  196. </view>
  197. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  198. </label>
  199. </radio-group>
  200. </uni-forms-item>
  201. <uni-forms-item label="品牌" label-width="130px" required>
  202. <uni-easyinput v-model="waterSensorInfo.waterSensorBrandText" placeholder="请录入品牌" />
  203. </uni-forms-item>
  204. <uni-forms-item label="型号" label-width="130px" required>
  205. <uni-easyinput v-model="waterSensorInfo.waterSensorModelText" placeholder="请录入型号" />
  206. </uni-forms-item>
  207. <uni-forms-item label="更换时间" label-width="130px" required>
  208. <uni-datetime-picker type="date" :clear-icon="false"
  209. v-model="waterSensorInfo.waterSensorReplaceDate" />
  210. </uni-forms-item>
  211. <uni-forms-item label="类型" label-width="130px" required>
  212. <radio-group @change="onWaterSensorTypeRadioChange" class="view-flex-rs">
  213. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  214. v-for="(item, index) in waterLevelSensorType.items" :key="item.id">
  215. <view>
  216. <radio :value="item.id" :checked="index === waterLevelSensorType.current" />
  217. </view>
  218. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  219. </label>
  220. </radio-group>
  221. </uni-forms-item>
  222. <uni-forms-item label="运行状态" label-width="130px" required>
  223. <radio-group @change="onWaterSensorStatusRadioChange" class="view-flex-rs">
  224. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  225. v-for="(item, index) in waterSensorInfo.runStatus.items" :key="item.id">
  226. <view>
  227. <radio :value="item.id"
  228. :checked="index === waterSensorInfo.runStatus.current" />
  229. </view>
  230. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  231. </label>
  232. </radio-group>
  233. </uni-forms-item>
  234. <uni-forms-item>
  235. <uni-easyinput label="备注说明" type="textarea" v-model="waterSensorInfo.remark"
  236. placeholder="请输入备注说明" />
  237. </uni-forms-item>
  238. </uGroup>
  239. <uGroup title="水位传感器图片" margin-top="0px">
  240. <view class="view-flex-rs" style="margin-top: 0px;">
  241. <view class="view-flex-cc" style="width: 120px;">
  242. <view class="img-container">
  243. <view class="note-image-box">
  244. <view v-if="waterSensorInfo.photoTake" class="note-image-item">
  245. <view class="close-icon" @click="onWaterPhotoDeleteClick()">
  246. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  247. </view>
  248. <view class="image-box">
  249. <image :src="toOss(waterSensorInfo.photoUrl)" mode="widthFix"></image>
  250. </view>
  251. </view>
  252. <view v-else class="note-image-item" @click="getWaterSensorPhoto()">
  253. <view class="image-box">
  254. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  255. </view>
  256. </view>
  257. </view>
  258. </view>
  259. </view>
  260. </view>
  261. </uGroup>
  262. </uSection>
  263. </view>
  264. <view class="uni-form-item">
  265. <uSection title="墒情传感器" type="line" titleFontSize="0.8rem" style="width: 100%;">
  266. <uGroup margin-top="0">
  267. <uni-forms-item label="是否有墒情传感器" label-width="130px" required>
  268. <radio-group @change="onGroundActiveRadioChange" class="view-flex-rs">
  269. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  270. v-for="(item, index) in groundSensorInfo.active.items" :key="item.id">
  271. <view>
  272. <radio :value="item.id" :checked="index === groundSensorInfo.active.current" />
  273. </view>
  274. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  275. </label>
  276. </radio-group>
  277. </uni-forms-item>
  278. <uni-forms-item label="品牌" label-width="130px" required>
  279. <uni-easyinput v-model="groundSensorInfo.groundSensorBrandText" placeholder="请录入品牌" />
  280. </uni-forms-item>
  281. <uni-forms-item label="型号" label-width="130px" required>
  282. <uni-easyinput v-model="groundSensorInfo.groundSensorModelText" placeholder="请录入型号" />
  283. </uni-forms-item>
  284. <uni-forms-item label="更换时间" label-width="130px" required>
  285. <uni-datetime-picker type="date" :clear-icon="false"
  286. v-model="groundSensorInfo.groundSensorReplaceDate" />
  287. </uni-forms-item>
  288. <uni-forms-item label="类型" label-width="130px" required>
  289. <radio-group @change="onGroundSensorTypeRadioChange" class="view-flex-rs">
  290. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  291. v-for="(item, index) in groundSensorType.items" :key="item.id">
  292. <view>
  293. <radio :value="item.id" :checked="index === groundSensorType.current" />
  294. </view>
  295. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  296. </label>
  297. </radio-group>
  298. </uni-forms-item>
  299. <uni-forms-item label="运行状态" label-width="130px" required>
  300. <radio-group @change="onGroundSensorStatusRadioChange" class="view-flex-rs">
  301. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  302. v-for="(item, index) in groundSensorInfo.runStatus.items" :key="item.id">
  303. <view>
  304. <radio :value="item.id"
  305. :checked="index === groundSensorInfo.runStatus.current" />
  306. </view>
  307. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  308. </label>
  309. </radio-group>
  310. </uni-forms-item>
  311. <uni-forms-item>
  312. <uni-easyinput label="备注说明" type="textarea" v-model="groundSensorInfo.remark"
  313. placeholder="请输入备注说明" />
  314. </uni-forms-item>
  315. </uGroup>
  316. <uGroup title="墒情传感器图片" margin-top="0px">
  317. <view class="view-flex-rs" style="margin-top: 0px;">
  318. <view class="view-flex-cc" style="width: 120px;">
  319. <view class="img-container">
  320. <view class="note-image-box">
  321. <view v-if="groundSensorInfo.photoTake" class="note-image-item">
  322. <view class="close-icon" @click="onGroundPhotoDeleteClick()">
  323. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  324. </view>
  325. <view class="image-box">
  326. <image :src="toOss(groundSensorInfo.photoUrl)" mode="widthFix"></image>
  327. </view>
  328. </view>
  329. <view v-else class="note-image-item" @click="getGroundSensorPhoto()">
  330. <view class="image-box">
  331. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  332. </view>
  333. </view>
  334. </view>
  335. </view>
  336. </view>
  337. </view>
  338. </uGroup>
  339. </uSection>
  340. </view>
  341. <view class="uni-form-item">
  342. <uSection title="供电系统" type="line" titleFontSize="0.8rem" style="width: 100%;">
  343. <uGroup margin-top="0">
  344. <uni-forms-item label="蓄电池容量(AH)" label-width="130px" required>
  345. <uni-easyinput v-model="powerInfo.batteryModel" placeholder="请录入容量" />
  346. </uni-forms-item>
  347. <uni-forms-item label="蓄电池更换时间" label-width="130px" required>
  348. <uni-datetime-picker type="date" :clear-icon="false"
  349. v-model="powerInfo.batteryReplaceDate" />
  350. </uni-forms-item>
  351. <uni-forms-item label="太阳能板功率(W)" label-width="130px" required>
  352. <uni-easyinput v-model="powerInfo.sunPowerModel" placeholder="请录入功率" />
  353. </uni-forms-item>
  354. <uni-forms-item label="太阳能板更换时间" label-width="130px" required>
  355. <uni-datetime-picker type="date" :clear-icon="false"
  356. v-model="powerInfo.sunPowerReplaceDate" />
  357. </uni-forms-item>
  358. <uni-forms-item label="运行状态" label-width="130px" required>
  359. <radio-group @change="onPowerStatusRadioChange" class="view-flex-rs">
  360. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  361. v-for="(item, index) in powerInfo.runStatus.items" :key="item.id">
  362. <view>
  363. <radio :value="item.id" :checked="index === powerInfo.runStatus.current" />
  364. </view>
  365. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  366. </label>
  367. </radio-group>
  368. </uni-forms-item>
  369. <uni-forms-item>
  370. <uni-easyinput label="备注说明" type="textarea" v-model="powerInfo.remark"
  371. placeholder="请输入备注说明" />
  372. </uni-forms-item>
  373. </uGroup>
  374. <uGroup title="供电系统图片" margin-top="0px">
  375. <view class="view-flex-rs" style="margin-top: 0px;">
  376. <view class="view-flex-cc" style="width: 120px;">
  377. <view class="img-container">
  378. <view class="note-image-box">
  379. <view v-if="powerInfo.batteryPhotoTake" class="note-image-item">
  380. <view class="close-icon" @click="onBatteryPhotoDeleteClick()">
  381. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  382. </view>
  383. <view class="image-box">
  384. <image :src="toOss(powerInfo.batteryPhotoUrl)" mode="widthFix"></image>
  385. </view>
  386. </view>
  387. <view v-else class="note-image-item" @click="getBatteryPhoto()">
  388. <view class="image-box">
  389. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  390. </view>
  391. </view>
  392. </view>
  393. </view>
  394. </view>
  395. <view class="view-flex-cc" style="width: 120px;">
  396. <view class="img-container">
  397. <view class="note-image-box">
  398. <view v-if="powerInfo.sunPhotoTake" class="note-image-item">
  399. <view class="close-icon" @click="onSunPowerPhotoDeleteClick()">
  400. <uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
  401. </view>
  402. <view class="image-box">
  403. <image :src="toOss(powerInfo.sunPhotoUrl)" mode="widthFix"></image>
  404. </view>
  405. </view>
  406. <view v-else class="note-image-item" @click="getSunPowerPhoto()">
  407. <view class="image-box">
  408. <uni-icons type="plusempty" size="50" color="#eee"></uni-icons>
  409. </view>
  410. </view>
  411. </view>
  412. </view>
  413. </view>
  414. </view>
  415. </uGroup>
  416. </uSection>
  417. </view>
  418. <view class="uni-form-item">
  419. <uSection title="4G移动网络" type="line" titleFontSize="0.8rem" style="width: 100%;">
  420. <uGroup margin-top="0">
  421. <uni-forms-item label="是否使用4G移动网络" label-width="130px" required>
  422. <radio-group @change="onNetworkActiveRadioChange" class="view-flex-rs">
  423. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  424. v-for="(item, index) in networkInfo.active.items" :key="item.id">
  425. <view>
  426. <radio :value="item.id" :checked="index === networkInfo.active.current" />
  427. </view>
  428. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  429. </label>
  430. </radio-group>
  431. </uni-forms-item>
  432. <uni-forms-item label="SIM卡号" label-width="130px" required>
  433. <uni-easyinput v-model="networkInfo.simCcid" placeholder="请录入请录入SIM卡号" />
  434. </uni-forms-item>
  435. <uni-forms-item label="开卡单位" label-width="130px" required>
  436. <uni-easyinput v-model="networkInfo.simPay" placeholder="请录入SIM卡开卡单位" />
  437. </uni-forms-item>
  438. <uni-forms-item label="缴费截止时间" label-width="130px" required>
  439. <uni-datetime-picker type="date" :clear-icon="false" v-model="networkInfo.simPayEndDate" />
  440. </uni-forms-item>
  441. <uni-forms-item label="运行状态" label-width="130px" required>
  442. <radio-group @change="onNetworkStatusRadioChange" class="view-flex-rs">
  443. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  444. v-for="(item, index) in networkInfo.runStatus.items" :key="item.id">
  445. <view>
  446. <radio :value="item.id" :checked="index === networkInfo.runStatus.current" />
  447. </view>
  448. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  449. </label>
  450. </radio-group>
  451. </uni-forms-item>
  452. <uni-forms-item>
  453. <uni-easyinput label="备注说明" type="textarea" v-model="networkInfo.remark"
  454. placeholder="请输入备注说明" />
  455. </uni-forms-item>
  456. </uGroup>
  457. </uSection>
  458. </view>
  459. <view class="uni-form-item">
  460. <uSection title="北斗通讯" type="line" titleFontSize="0.8rem" style="width: 100%;">
  461. <uGroup margin-top="0">
  462. <uni-forms-item label="是否使用北斗网络" label-width="130px" required>
  463. <radio-group @change="onSatelliteActiveRadioChange" class="view-flex-rs">
  464. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  465. v-for="(item, index) in satelliteInfo.active.items" :key="item.id">
  466. <view>
  467. <radio :value="item.id" :checked="index === satelliteInfo.active.current" />
  468. </view>
  469. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  470. </label>
  471. </radio-group>
  472. </uni-forms-item>
  473. <uni-forms-item label="通讯模式" label-width="130px" required>
  474. <radio-group @change="onSatelliteModelRadioChange" class="view-flex-rs">
  475. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  476. v-for="(item, index) in satelliteModel.items" :key="item.id">
  477. <view>
  478. <radio :value="item.id" :checked="index === satelliteModel.current" />
  479. </view>
  480. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  481. </label>
  482. </radio-group>
  483. </uni-forms-item>
  484. <uni-forms-item label="运行状态" label-width="130px" required>
  485. <radio-group @change="onSatelliteStatusRadioChange" class="view-flex-rs">
  486. <label style="margin-right: 20px;width:80px;" class="view-flex-rs"
  487. v-for="(item, index) in satelliteInfo.runStatus.items" :key="item.id">
  488. <view>
  489. <radio :value="item.id" :checked="index === satelliteInfo.runStatus.current" />
  490. </view>
  491. <view style="font-size: 0.7rem;">{{item.dictValue}}</view>
  492. </label>
  493. </radio-group>
  494. </uni-forms-item>
  495. <uni-forms-item>
  496. <uni-easyinput label="备注说明" type="textarea" v-model="satelliteInfo.remark"
  497. placeholder="请输入备注说明" />
  498. </uni-forms-item>
  499. </uGroup>
  500. </uSection>
  501. </view>
  502. </uni-forms>
  503. <view class="footer">
  504. <view class="control">
  505. <view style="display: flex;flex-direction: row;justify-content: flex-start;">
  506. <view
  507. style="display:flex;flex-direction: row;justify-content: center;width: 90px;height:28px;margin-right: 10px;border-radius:7px;background-color:lightblue"
  508. @click="toSave()">
  509. <view style="display:flex;flex-direction: column;justify-content: center;">
  510. <uIcons class="input-uni-icon" type="gear" size="18" color="#999" />
  511. </view>
  512. <view style="display:flex;flex-direction: column;justify-content: center;padding-left:5px;">
  513. <text style="color:black;font-size:0.6rem">暂存</text>
  514. </view>
  515. </view>
  516. <view
  517. style="display:flex;flex-direction: row;justify-content: center;width: 90px;height:28px;margin-right: 10px;border-radius:7px;background-color:lightpink"
  518. @click="toSubmit()">
  519. <view style="display:flex;flex-direction: column;justify-content: center;">
  520. <uIcons class="input-uni-icon" type="location" size="18" color="#999" />
  521. </view>
  522. <view style="display:flex;flex-direction: column;justify-content: center;padding-left:5px;">
  523. <text style="color:black;font-size:0.6rem">立即提交</text>
  524. </view>
  525. </view>
  526. </view>
  527. </view>
  528. </view>
  529. <!-- <u-gap height="70"></u-gap> -->
  530. </view>
  531. </template>
  532. <script>
  533. import http from '@/http/api.js';
  534. import {
  535. pathToBase64,
  536. base64ToPath
  537. } from '@/js_sdk/mmmm-image-tools/index.js';
  538. import {
  539. oss,
  540. devUrl,
  541. prodUrl
  542. } from '@/common/setting';
  543. import uNavBar from '@/uni_modules/uni-nav-bar/components/uni-nav-bar/uni-nav-bar.vue'
  544. import uDataPicker from '@/uni_modules/uni-data-picker/components/uni-data-picker/uni-data-picker.vue'
  545. import uGroup from '@/uni_modules/uni-group/uni-group.vue'
  546. import uSection from '@/uni_modules/uni-section/uni-section.vue'
  547. import uPagination from '@/uni_modules/uni-pagination/components/uni-pagination/uni-pagination.vue'
  548. import uBreadcrumb from '@/uni_modules/uni-breadcrumb/components/uni-breadcrumb/uni-breadcrumb.vue'
  549. import uList from '@/uni_modules/uni-list/components/uni-list/uni-list.vue'
  550. import uListItem from '@/uni_modules/uni-list/components/uni-list-item/uni-list-item.vue'
  551. import uIcons from '@/uni_modules/uni-icons/components/uni-icons/uni-icons.vue'
  552. import uCard from '@/uni_modules/uni-card/components/uni-card/uni-card.vue'
  553. export default {
  554. components: {
  555. uNavBar,
  556. uDataPicker,
  557. uPagination,
  558. uBreadcrumb,
  559. uList,
  560. uListItem,
  561. uIcons,
  562. uGroup,
  563. uSection,
  564. uCard,
  565. },
  566. onLoad(options) {
  567. this.rtuCode = options.rtuCode;
  568. this.baseURL = process.env.NODE_ENV === 'development' ? devUrl : prodUrl;
  569. //初始化巡检填报字典
  570. this.getReportDict();
  571. //查询计划信息
  572. //this.getPlanInfo();
  573. },
  574. data() {
  575. return {
  576. pattern: {
  577. color: '#7A7E83',
  578. backgroundColor: '#fff',
  579. selectedColor: '#007AFF',
  580. buttonColor: '#007AFF',
  581. iconColor: '#fff'
  582. },
  583. content: [{
  584. iconPath: '/static/images/user/c6.png',
  585. selectedIconPath: '/static/images/user/c6.png',
  586. text: '提交',
  587. active: false
  588. },
  589. {
  590. iconPath: '/static/images/user/c5.png',
  591. selectedIconPath: '/static/images/user/c5.png',
  592. text: '保存',
  593. active: false
  594. }
  595. ],
  596. baseURL: '',
  597. rtuCode: '',
  598. //planInfo: {},
  599. waterLevelSensorType: {
  600. items: [],
  601. current: 0,
  602. },
  603. groundSensorType: {
  604. items: [],
  605. current: 0,
  606. },
  607. satelliteModel: {
  608. items: [],
  609. current: 0,
  610. },
  611. datagramIp: {
  612. items: [{
  613. 'id': '0',
  614. 'checked': false,
  615. 'dictValue': '发往县'
  616. }, {
  617. 'id': '1',
  618. 'checked': false,
  619. 'dictValue': '发往市'
  620. }, {
  621. 'id': '2',
  622. 'checked': false,
  623. 'dictValue': '发往省'
  624. }],
  625. current: 0,
  626. },
  627. baseInfo: {
  628. reportDesc: '',
  629. photo1Url: '',
  630. photo1Take: false,
  631. photo2Url: '',
  632. photo2Take: false
  633. },
  634. rtuInfo: {
  635. remark: '',
  636. rtuBrand: '',
  637. rtuBrandText: '',
  638. rtuModel: '',
  639. rtuModelText: '',
  640. rtuReplaceDate: null,
  641. datagramTo: [{
  642. text: '发往县',
  643. value: 0
  644. }, {
  645. text: '发往市',
  646. value: 1
  647. }, {
  648. text: '发往省',
  649. value: 2
  650. }],
  651. selectedDatagramTo: [],
  652. datagramToLevel1: 0,
  653. datagramToLevel2: 0,
  654. datagramToLevel3: 0,
  655. photoUrl: '',
  656. photoTake: false,
  657. runStatus: {
  658. items: [{
  659. 'id': '0',
  660. 'dictValue': '正常'
  661. }, {
  662. 'id': '1',
  663. 'dictValue': '故障'
  664. }],
  665. current: 0,
  666. },
  667. },
  668. rainSensorInfo: {
  669. rainSensorBrand: '',
  670. rainSensorModel: '',
  671. rainSensorBrandText: '',
  672. rainSensorModelText: '',
  673. rainSensorReplaceDate: null,
  674. remark: '',
  675. photoUrl: '',
  676. photoTake: false,
  677. active: {
  678. items: [{
  679. 'id': '0',
  680. 'dictValue': '有'
  681. }, {
  682. 'id': '1',
  683. 'dictValue': '无'
  684. }],
  685. current: 0,
  686. },
  687. runStatus: {
  688. items: [{
  689. 'id': '0',
  690. 'dictValue': '正常'
  691. }, {
  692. 'id': '1',
  693. 'dictValue': '故障'
  694. }],
  695. current: 0,
  696. },
  697. },
  698. waterSensorInfo: {
  699. waterSensorBrand: '',
  700. waterSensorModel: '',
  701. waterSensorBrandText: '',
  702. waterSensorModelText: '',
  703. waterSensorType: '',
  704. waterSensorReplaceDate: null,
  705. remark: '',
  706. photoUrl: '',
  707. photoTake: false,
  708. active: {
  709. items: [{
  710. 'id': '0',
  711. 'dictValue': '有'
  712. }, {
  713. 'id': '1',
  714. 'dictValue': '无'
  715. }],
  716. current: 0,
  717. },
  718. runStatus: {
  719. items: [{
  720. 'id': '0',
  721. 'dictValue': '正常'
  722. }, {
  723. 'id': '1',
  724. 'dictValue': '故障'
  725. }],
  726. current: 0,
  727. },
  728. },
  729. groundSensorInfo: {
  730. groundSensorBrand: '',
  731. groundSensorModel: '',
  732. groundSensorBrandText: '',
  733. groundSensorModelText: '',
  734. groundSensorType: '',
  735. groundSensorReplaceDate: null,
  736. remark: '',
  737. photoUrl: '',
  738. photoTake: false,
  739. active: {
  740. items: [{
  741. 'id': '0',
  742. 'dictValue': '有'
  743. }, {
  744. 'id': '1',
  745. 'dictValue': '无'
  746. }],
  747. current: 0,
  748. },
  749. runStatus: {
  750. items: [{
  751. 'id': '0',
  752. 'dictValue': '正常'
  753. }, {
  754. 'id': '1',
  755. 'dictValue': '故障'
  756. }],
  757. current: 0,
  758. },
  759. },
  760. powerInfo: {
  761. batteryModel: '',
  762. batteryReplaceDate: null,
  763. sunPowerModel: '',
  764. sunPowerReplaceDate: null,
  765. batteryPhotoUrl: '',
  766. batteryPhotoTake: false,
  767. sunPhotoUrl: '',
  768. sunPhotoTake: false,
  769. remark: '',
  770. active: {
  771. items: [{
  772. 'id': '0',
  773. 'dictValue': '有'
  774. }, {
  775. 'id': '1',
  776. 'dictValue': '无'
  777. }],
  778. current: 0,
  779. },
  780. runStatus: {
  781. items: [{
  782. 'id': '0',
  783. 'dictValue': '正常'
  784. }, {
  785. 'id': '1',
  786. 'dictValue': '故障'
  787. }],
  788. current: 0,
  789. },
  790. },
  791. networkInfo: {
  792. simCcid: '',
  793. simPay: '',
  794. simPayEndDate: null,
  795. remark: '',
  796. active: {
  797. items: [{
  798. 'id': '0',
  799. 'dictValue': '有'
  800. }, {
  801. 'id': '1',
  802. 'dictValue': '无'
  803. }],
  804. current: 0,
  805. },
  806. runStatus: {
  807. items: [{
  808. 'id': '0',
  809. 'dictValue': '正常'
  810. }, {
  811. 'id': '1',
  812. 'dictValue': '故障'
  813. }],
  814. current: 0,
  815. },
  816. },
  817. satelliteInfo: {
  818. satelliteModel: '',
  819. remark: '',
  820. active: {
  821. items: [{
  822. 'id': '0',
  823. 'dictValue': '有'
  824. }, {
  825. 'id': '1',
  826. 'dictValue': '无'
  827. }],
  828. current: 0,
  829. },
  830. runStatus: {
  831. items: [{
  832. 'id': '0',
  833. 'dictValue': '正常'
  834. }, {
  835. 'id': '1',
  836. 'dictValue': '故障'
  837. }],
  838. current: 0,
  839. },
  840. },
  841. localImageList: [],
  842. uploadImageList: [],
  843. title: '巡检信息填报',
  844. desc: '',
  845. }
  846. },
  847. computed: {
  848. getIcon() {
  849. return path => {
  850. return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
  851. }
  852. },
  853. },
  854. onShow() {
  855. },
  856. created() {
  857. },
  858. methods: {
  859. toOss(path) {
  860. return oss + path;
  861. },
  862. toBack() {
  863. uni.navigateBack({
  864. delta: 1
  865. })
  866. },
  867. toSubmit() {
  868. var formdata = {};
  869. // formdata['planId'] = this.planId;
  870. formdata['rtuCode'] = this.rtuCode;
  871. formdata['reportDesc'] = this.baseInfo.reportDesc;
  872. if (this.baseInfo.photo1Take) {
  873. formdata['basePhoto1Take'] = 1;
  874. formdata['basePhoto1Url'] = this.baseInfo.photo1Url;
  875. } else {
  876. formdata['basePhoto1Take'] = 0;
  877. }
  878. if (this.baseInfo.photo2Take) {
  879. formdata['basePhoto2Take'] = 1;
  880. formdata['basePhoto2Url'] = this.baseInfo.photo2Url;
  881. } else {
  882. formdata['basePhoto2Take'] = 0;
  883. }
  884. formdata['rtuStatus'] = this.rtuInfo.runStatus.current;
  885. formdata['rtuBrand'] = this.rtuInfo.rtuBrandText;
  886. formdata['rtuModel'] = this.rtuInfo.rtuModelText;
  887. formdata['rtuReplaceDate'] = this.rtuInfo.rtuReplaceDate;
  888. formdata['datagramToLevel1'] = this.rtuInfo.datagramToLevel1;
  889. formdata['datagramToLevel2'] = this.rtuInfo.datagramToLevel2;
  890. formdata['datagramToLevel3'] = this.rtuInfo.datagramToLevel3;
  891. formdata['rtuDesc'] = this.rtuInfo.remark;
  892. if (this.rtuInfo.photoTake) {
  893. formdata['rtuPhotoTake'] = 1;
  894. formdata['rtuPhotoUrl'] = this.rtuInfo.photoUrl;
  895. } else {
  896. formdata['rtuPhotoTake'] = 0;
  897. }
  898. if (this.rainSensorInfo.active.current === 0) {
  899. formdata['rainSensorActive'] = 1;
  900. formdata['rainSensorBrand'] = this.rainSensorInfo.rainSensorBrandText;
  901. formdata['rainSensorModel'] = this.rainSensorInfo.rainSensorModelText;
  902. formdata['rainSensorReplaceDate'] = this.rainSensorInfo.rainSensorReplaceDate;
  903. formdata['rainSensorDesc'] = this.rainSensorInfo.remark;
  904. formdata['rainSensorStatus'] = this.rainSensorInfo.runStatus.current;
  905. if (this.rainSensorInfo.photoTake) {
  906. formdata['rainSensorPhotoTake'] = 1;
  907. formdata['rainSensorPhotoUrl'] = this.rainSensorInfo.photoUrl;
  908. } else {
  909. formdata['rainSensorPhotoTake'] = 0;
  910. }
  911. } else {
  912. formdata['rainSensorActive'] = 0;
  913. }
  914. if (this.waterSensorInfo.active.current === 0) {
  915. formdata['waterLevelSensorActive'] = 1;
  916. formdata['waterSensorType'] = this.waterLevelSensorType.items[this.waterLevelSensorType.current].id;
  917. formdata['waterSensorBrand'] = this.waterSensorInfo.waterSensorBrandText;
  918. formdata['waterSensorModel'] = this.waterSensorInfo.waterSensorModelText;
  919. formdata['waterSensorReplaceDate'] = this.waterSensorInfo.waterSensorReplaceDate;
  920. formdata['waterSensorDesc'] = this.waterSensorInfo.remark;
  921. formdata['waterLevelSensorStatus'] = this.waterSensorInfo.runStatus.current;
  922. if (this.waterSensorInfo.photoTake) {
  923. formdata['waterSensorPhotoTake'] = 1;
  924. formdata['waterSensorPhotoUrl'] = this.waterSensorInfo.photoUrl;
  925. } else {
  926. formdata['waterSensorPhotoTake'] = 0;
  927. }
  928. } else {
  929. formdata['waterLevelSensorActive'] = 0;
  930. }
  931. if (this.groundSensorInfo.active.current === 0) {
  932. formdata['groundWaterSensorActive'] = 1;
  933. formdata['groundSensorType'] = this.groundSensorType.items[this.groundSensorType.current].id;
  934. formdata['groundWaterSensorStatus'] = this.groundSensorInfo.runStatus.current;
  935. formdata['groundSensorBrand'] = this.groundSensorInfo.groundSensorBrandText;
  936. formdata['groundSensorModel'] = this.groundSensorInfo.groundSensorModelText;
  937. formdata['groundSensorReplaceDate'] = this.groundSensorInfo.groundSensorReplaceDate;
  938. formdata['groundSensorDesc'] = this.groundSensorInfo.remark;
  939. if (this.groundSensorInfo.photoTake) {
  940. formdata['groundSensorPhotoTake'] = 1;
  941. formdata['groundSensorPhotoUrl'] = this.groundSensorInfo.photoUrl;
  942. } else {
  943. formdata['groundSensorPhotoTake'] = 0;
  944. }
  945. } else {
  946. formdata['groundWaterSensorActive'] = 0;
  947. }
  948. formdata['batteryModel'] = this.powerInfo.batteryModel;
  949. formdata['batteryReplaceDate'] = this.powerInfo.batteryReplaceDate;
  950. formdata['sunPowerModel'] = this.powerInfo.sunPowerModel;
  951. formdata['sunPowerReplaceDate'] = this.powerInfo.sunPowerReplaceDate;
  952. formdata['powerStatus'] = this.powerInfo.runStatus.current;
  953. formdata['powerDesc'] = this.powerInfo.remark;
  954. if (this.powerInfo.batteryPhotoTake) {
  955. formdata['batteryPhotoTake'] = 1;
  956. formdata['batteryPhotoUrl'] = this.powerInfo.batteryPhotoUrl;
  957. } else {
  958. formdata['batteryPhotoTake'] = 0;
  959. }
  960. if (this.powerInfo.sunPhotoTake) {
  961. formdata['sunPhotoTake'] = 1;
  962. formdata['sunPhotoUrl'] = this.powerInfo.sunPhotoUrl;
  963. } else {
  964. formdata['sunPhotoTake'] = 0;
  965. }
  966. if (this.networkInfo.active.current === 0) {
  967. formdata['networkActive'] = 1;
  968. formdata['simCcid'] = this.networkInfo.simCcid;
  969. formdata['simPay'] = this.networkInfo.simPay;
  970. formdata['simPayEndDate'] = this.networkInfo.simPayEndDate;
  971. formdata['networkStatus'] = this.networkInfo.runStatus.current;
  972. formdata['networkDesc'] = this.networkInfo.remark;
  973. } else {
  974. formdata['networkActive'] = 0;
  975. }
  976. if (this.satelliteInfo.active.current === 0) {
  977. formdata['satelliteActive'] = 1;
  978. formdata['satelliteModel'] = this.satelliteModel.items[this.satelliteModel.current].id;
  979. formdata['satelliteStatus'] = this.satelliteInfo.runStatus.current;
  980. formdata['satelliteDesc'] = this.satelliteInfo.remark;
  981. } else {
  982. formdata['satelliteActive'] = 0;
  983. }
  984. var that = this;
  985. http.request({
  986. url: '/galaxy-test/equipment/inspection/report/save',
  987. method: 'POST',
  988. data: formdata
  989. }).then(res => {
  990. if (res.success) {
  991. uni.showModal({
  992. content: '填报信息已成功提交',
  993. showCancel: false,
  994. success(res) {
  995. if (res.confirm) {
  996. uni.navigateBack();
  997. }
  998. }
  999. });
  1000. } else {
  1001. uni.showModal({
  1002. content: '' + res.msg,
  1003. showCancel: false
  1004. });
  1005. }
  1006. }).catch(err => {
  1007. console.log(err)
  1008. })
  1009. },
  1010. toSave() {
  1011. },
  1012. rtuReplaceDateClick(e) {
  1013. console.log('maskClick事件:', e);
  1014. },
  1015. rainSensorReplaceDateClick(e) {
  1016. console.log('maskClick事件:', e);
  1017. },
  1018. waterSensorReplaceDateClick(e) {
  1019. console.log('maskClick事件:', e);
  1020. },
  1021. groundSensorReplaceDateClick(e) {
  1022. console.log('maskClick事件:', e);
  1023. },
  1024. batteryReplaceDateClick(e) {
  1025. console.log('maskClick事件:', e);
  1026. },
  1027. sunPowerReplaceDateClick(e) {
  1028. console.log('maskClick事件:', e);
  1029. },
  1030. simPayEndDateClick(e) {
  1031. console.log('maskClick事件:', e);
  1032. },
  1033. dateFormat(dt) {
  1034. var text = "" + dt.getFullYear();
  1035. text += "-";
  1036. text += ((dt.getMonth() + 1) < 10) ? ("0" + (dt.getMonth() + 1)) : (dt
  1037. .getMonth() +
  1038. 1);
  1039. text += "-";
  1040. text += dt.getDate() < 10 ? "0" + dt.getDate() : dt.getDate();
  1041. text += " ";
  1042. text += dt.getHours() < 10 ? "0" + dt.getHours() : dt.getHours();
  1043. text += ":";
  1044. text += dt.getMinutes() < 10 ? "0" + dt.getMinutes() : dt.getMinutes();
  1045. text += ":";
  1046. text += dt.getSeconds() < 10 ? "0" + dt.getSeconds() : dt.getSeconds();
  1047. return text;
  1048. },
  1049. getReportDict() {
  1050. var that = this;
  1051. var waterLevelSensorTypeDictList = [];
  1052. //查询水位计
  1053. http.request({
  1054. url: '/galaxy-system/dict-biz/dictionary?code=water_level_sensor_type',
  1055. method: 'GET'
  1056. }).then(res => {
  1057. console.log(res.data)
  1058. if (res.data != null) {
  1059. const dictLength = res.data['length'];
  1060. for (var i = 0; i < dictLength; i++) {
  1061. let dict = res.data['' + i];
  1062. waterLevelSensorTypeDictList.push(dict);
  1063. }
  1064. that.waterLevelSensorType.items = waterLevelSensorTypeDictList;
  1065. }
  1066. }).catch(err => {
  1067. console.log(err)
  1068. })
  1069. var groundSensorTypeDictList = [];
  1070. //查询墒情传感器类型
  1071. http.request({
  1072. url: '/galaxy-system/dict-biz/dictionary?code=ground_water_sensor_type',
  1073. method: 'GET'
  1074. }).then(res => {
  1075. console.log(res.data)
  1076. if (res.data != null) {
  1077. const dictLength = res.data['length'];
  1078. for (var i = 0; i < dictLength; i++) {
  1079. let dict = res.data['' + i];
  1080. groundSensorTypeDictList.push(dict);
  1081. }
  1082. that.groundSensorType.items = groundSensorTypeDictList;
  1083. }
  1084. }).catch(err => {
  1085. console.log(err)
  1086. })
  1087. //查询北斗模式
  1088. var satelliteModelDictList = [];
  1089. http.request({
  1090. url: '/galaxy-system/dict-biz/dictionary?code=satellite_model',
  1091. method: 'GET'
  1092. }).then(res => {
  1093. console.log(res.data)
  1094. if (res.data != null) {
  1095. const dictLength = res.data['length'];
  1096. for (var i = 0; i < dictLength; i++) {
  1097. let dict = res.data['' + i];
  1098. satelliteModelDictList.push(dict);
  1099. }
  1100. that.satelliteModel.items = satelliteModelDictList;
  1101. }
  1102. }).catch(err => {
  1103. console.log(err)
  1104. })
  1105. },
  1106. // getPlanInfo() {
  1107. // var that = this;
  1108. // var postData = {};
  1109. // postData['id'] = this.planId;
  1110. // http.request({
  1111. // url: '/galaxy-test/equipment/inspection/plan/detail',
  1112. // method: 'GET',
  1113. // data: postData
  1114. // }).then(res => {
  1115. // console.log(res)
  1116. // if (res.data != null) {
  1117. // that.planInfo = res.data;
  1118. // }
  1119. // }).catch(err => {
  1120. // console.log(err)
  1121. // })
  1122. // },
  1123. onBasePhoto1DeleteClick() {
  1124. this.baseInfo.photo1Take = false;
  1125. },
  1126. onBasePhoto2DeleteClick() {
  1127. this.baseInfo.photo2Take = false;
  1128. },
  1129. onRtuPhotoDeleteClick() {
  1130. this.rtuInfo.photoTake = false;
  1131. },
  1132. onRainPhotoDeleteClick() {
  1133. this.rainSensorInfo.photoTake = false;
  1134. },
  1135. onWaterPhotoDeleteClick() {
  1136. this.waterSensorInfo.photoTake = false;
  1137. },
  1138. onGroundPhotoDeleteClick() {
  1139. this.groundSensorInfo.photoTake = false;
  1140. },
  1141. onBatteryPhotoDeleteClick() {
  1142. this.powerInfo.batteryPhotoTake = false;
  1143. },
  1144. onSunPowerPhotoDeleteClick() {
  1145. this.powerInfo.sunPhotoTake = false;
  1146. },
  1147. onRainActiveRadioChange: function(evt) {
  1148. for (let i = 0; i < this.rainSensorInfo.active.items.length; i++) {
  1149. if (this.rainSensorInfo.active.items[i].id === evt.detail.value) {
  1150. this.rainSensorInfo.active.current = i;
  1151. break;
  1152. }
  1153. }
  1154. },
  1155. onWaterActiveRadioChange: function(evt) {
  1156. for (let i = 0; i < this.waterSensorInfo.active.items.length; i++) {
  1157. if (this.waterSensorInfo.active.items[i].id === evt.detail.value) {
  1158. this.waterSensorInfo.active.current = i;
  1159. break;
  1160. }
  1161. }
  1162. },
  1163. onGroundActiveRadioChange: function(evt) {
  1164. for (let i = 0; i < this.groundSensorInfo.active.items.length; i++) {
  1165. if (this.groundSensorInfo.active.items[i].id === evt.detail.value) {
  1166. this.groundSensorInfo.active.current = i;
  1167. break;
  1168. }
  1169. }
  1170. },
  1171. onNetworkActiveRadioChange: function(evt) {
  1172. for (let i = 0; i < this.networkInfo.active.items.length; i++) {
  1173. if (this.networkInfo.active.items[i].id === evt.detail.value) {
  1174. this.networkInfo.active.current = i;
  1175. break;
  1176. }
  1177. }
  1178. },
  1179. onSatelliteActiveRadioChange: function(evt) {
  1180. for (let i = 0; i < this.satelliteInfo.active.items.length; i++) {
  1181. if (this.satelliteInfo.active.items[i].id === evt.detail.value) {
  1182. this.satelliteInfo.active.current = i;
  1183. break;
  1184. }
  1185. }
  1186. },
  1187. onWaterSensorTypeRadioChange: function(evt) {
  1188. for (let i = 0; i < this.waterLevelSensorType.items.length; i++) {
  1189. if (this.waterLevelSensorType.items[i].id === evt.detail.value) {
  1190. this.waterLevelSensorType.current = i;
  1191. break;
  1192. }
  1193. }
  1194. },
  1195. onGroundSensorTypeRadioChange: function(evt) {
  1196. for (let i = 0; i < this.groundSensorType.items.length; i++) {
  1197. if (this.groundSensorType.items[i].id === evt.detail.value) {
  1198. this.groundSensorType.current = i;
  1199. break;
  1200. }
  1201. }
  1202. },
  1203. onSatelliteModelRadioChange: function(evt) {
  1204. for (let i = 0; i < this.satelliteModel.items.length; i++) {
  1205. if (this.satelliteModel.items[i].id === evt.detail.value) {
  1206. this.satelliteModel.current = i;
  1207. break;
  1208. }
  1209. }
  1210. },
  1211. datagramToCheckboxChange: function(evt) {
  1212. console.log(evt)
  1213. this.rtuInfo.datagramToLevel1 = 0;
  1214. this.rtuInfo.datagramToLevel2 = 0;
  1215. this.rtuInfo.datagramToLevel3 = 0;
  1216. for (let i = 0; i < this.evt.detail.value.length; i++) {
  1217. let c = this.evt.detail.value[i];
  1218. if (c === '0') {
  1219. this.rtuInfo.datagramToLevel1 = 1;
  1220. } else if (c === '1') {
  1221. this.rtuInfo.datagramToLevel2 = 1;
  1222. } else if (c === '2') {
  1223. this.rtuInfo.datagramToLevel3 = 1;
  1224. }
  1225. }
  1226. },
  1227. onRtuStatusRadioChange: function(evt) {
  1228. for (let i = 0; i < this.rtuInfo.runStatus.items.length; i++) {
  1229. if (this.rtuInfo.runStatus.items[i].id === evt.detail.value) {
  1230. this.rtuInfo.runStatus.current = i;
  1231. break;
  1232. }
  1233. }
  1234. },
  1235. onRainSensorStatusRadioChange: function(evt) {
  1236. for (let i = 0; i < this.rainSensorInfo.runStatus.items.length; i++) {
  1237. if (this.rainSensorInfo.runStatus.items[i].id === evt.detail.value) {
  1238. this.rainSensorInfo.runStatus.current = i;
  1239. break;
  1240. }
  1241. }
  1242. },
  1243. onWaterSensorStatusRadioChange: function(evt) {
  1244. for (let i = 0; i < this.waterSensorInfo.runStatus.items.length; i++) {
  1245. if (this.waterSensorInfo.runStatus.items[i].id === evt.detail.value) {
  1246. this.waterSensorInfo.runStatus.current = i;
  1247. break;
  1248. }
  1249. }
  1250. },
  1251. onGroundSensorStatusRadioChange: function(evt) {
  1252. for (let i = 0; i < this.groundSensorInfo.runStatus.items.length; i++) {
  1253. if (this.groundSensorInfo.runStatus.items[i].id === evt.detail.value) {
  1254. this.groundSensorInfo.runStatus.current = i;
  1255. break;
  1256. }
  1257. }
  1258. },
  1259. onPowerStatusRadioChange: function(evt) {
  1260. for (let i = 0; i < this.powerInfo.runStatus.items.length; i++) {
  1261. if (this.powerInfo.runStatus.items[i].id === evt.detail.value) {
  1262. this.powerInfo.runStatus.current = i;
  1263. break;
  1264. }
  1265. }
  1266. },
  1267. onNetworkStatusRadioChange: function(evt) {
  1268. for (let i = 0; i < this.networkInfo.runStatus.items.length; i++) {
  1269. if (this.networkInfo.runStatus.items[i].id === evt.detail.value) {
  1270. this.networkInfo.runStatus.current = i;
  1271. break;
  1272. }
  1273. }
  1274. },
  1275. onSatelliteStatusRadioChange: function(evt) {
  1276. for (let i = 0; i < this.satelliteInfo.runStatus.items.length; i++) {
  1277. if (this.satelliteInfo.runStatus.items[i].id === evt.detail.value) {
  1278. this.satelliteInfo.runStatus.current = i;
  1279. break;
  1280. }
  1281. }
  1282. },
  1283. uploadPhotoCallback(path, photoIndex) {
  1284. if (photoIndex === 'basePhoto1') {
  1285. this.baseInfo.photo1Url = path;
  1286. this.baseInfo.photo1Take = true;
  1287. } else if (photoIndex === 'basePhoto2') {
  1288. this.baseInfo.photo2Url = path;
  1289. this.baseInfo.photo2Take = true;
  1290. } else if (photoIndex === 'rtu') {
  1291. this.rtuInfo.photoUrl = path;
  1292. this.rtuInfo.photoTake = true;
  1293. } else if (photoIndex === 'rain') {
  1294. this.rainSensorInfo.photoUrl = path;
  1295. this.rainSensorInfo.photoTake = true;
  1296. } else if (photoIndex === 'water') {
  1297. this.waterSensorInfo.photoUrl = path;
  1298. this.waterSensorInfo.photoTake = true;
  1299. } else if (photoIndex === 'ground') {
  1300. this.groundSensorInfo.photoUrl = path;
  1301. this.groundSensorInfo.photoTake = true;
  1302. } else if (photoIndex === 'battery') {
  1303. this.powerInfo.batteryPhotoUrl = path;
  1304. this.powerInfo.batteryPhotoTake = true;
  1305. } else if (photoIndex === 'sun') {
  1306. this.powerInfo.sunPhotoUrl = path;
  1307. this.powerInfo.sunPhotoTake = true;
  1308. }
  1309. },
  1310. uploadPhoto(imagePath, photoIndex) {
  1311. var that = this;
  1312. console.log("accessToken:" + uni.getStorageSync('accessToken'));
  1313. console.log("path " + imagePath);
  1314. uni.showLoading({
  1315. title: '上传中'
  1316. });
  1317. uni.uploadFile({
  1318. url: this.baseURL +
  1319. '/galaxy-resource/oss/endpoint/put-file-attach?Blade-Auth=' +
  1320. uni.getStorageSync('accessToken'),
  1321. fileType: 'image',
  1322. filePath: imagePath,
  1323. name: 'file',
  1324. success: (uploadFileRes) => {
  1325. if (uploadFileRes.statusCode == 200) {
  1326. let data = JSON.parse(uploadFileRes.data);
  1327. if (data.success) {
  1328. let path = data.data['name'];
  1329. console.log("paht " + path);
  1330. that.uploadPhotoCallback(path, photoIndex);
  1331. }
  1332. }
  1333. },
  1334. fail: (err) => {
  1335. console.log(err);
  1336. reject('err')
  1337. },
  1338. complete() {
  1339. uni.hideLoading()
  1340. }
  1341. });
  1342. },
  1343. getBasePhoto1() {
  1344. var that = this;
  1345. uni.chooseImage({
  1346. sourceType: ['album', 'camera'],
  1347. success: (res) => {
  1348. const len = res.tempFilePaths.length;
  1349. if (len === 1) {
  1350. res.tempFilePaths.forEach(path => {
  1351. that.uploadPhoto(path, 'basePhoto1');
  1352. })
  1353. } else {
  1354. uni.showModal({
  1355. content: '只能选择一张图片,请确认!',
  1356. showCancel: false
  1357. });
  1358. }
  1359. }
  1360. })
  1361. },
  1362. getBasePhoto2() {
  1363. var that = this;
  1364. uni.chooseImage({
  1365. sourceType: ['album', 'camera'],
  1366. success: (res) => {
  1367. const len = res.tempFilePaths.length;
  1368. if (len === 1) {
  1369. res.tempFilePaths.forEach(path => {
  1370. that.uploadPhoto(path, 'basePhoto2');
  1371. })
  1372. } else {
  1373. uni.showModal({
  1374. content: '只能选择一张图片,请确认!',
  1375. showCancel: false
  1376. });
  1377. }
  1378. }
  1379. })
  1380. },
  1381. getRtuPhoto() {
  1382. var that = this;
  1383. uni.chooseImage({
  1384. sourceType: ['album', 'camera'],
  1385. success: (res) => {
  1386. const len = res.tempFilePaths.length;
  1387. if (len === 1) {
  1388. res.tempFilePaths.forEach(path => {
  1389. that.uploadPhoto(path, 'rtu');
  1390. })
  1391. } else {
  1392. uni.showModal({
  1393. content: '只能选择一张图片,请确认!',
  1394. showCancel: false
  1395. });
  1396. }
  1397. }
  1398. })
  1399. },
  1400. getRainSensorPhoto() {
  1401. var that = this;
  1402. uni.chooseImage({
  1403. sourceType: ['album', 'camera'],
  1404. success: (res) => {
  1405. const len = res.tempFilePaths.length;
  1406. if (len === 1) {
  1407. res.tempFilePaths.forEach(path => {
  1408. that.uploadPhoto(path, 'rain');
  1409. })
  1410. } else {
  1411. uni.showModal({
  1412. content: '只能选择一张图片,请确认!',
  1413. showCancel: false
  1414. });
  1415. }
  1416. }
  1417. })
  1418. },
  1419. getWaterSensorPhoto() {
  1420. var that = this;
  1421. uni.chooseImage({
  1422. sourceType: ['album', 'camera'],
  1423. success: (res) => {
  1424. const len = res.tempFilePaths.length;
  1425. if (len === 1) {
  1426. res.tempFilePaths.forEach(path => {
  1427. that.uploadPhoto(path, 'water');
  1428. })
  1429. } else {
  1430. uni.showModal({
  1431. content: '只能选择一张图片,请确认!',
  1432. showCancel: false
  1433. });
  1434. }
  1435. }
  1436. })
  1437. },
  1438. getGroundSensorPhoto() {
  1439. var that = this;
  1440. uni.chooseImage({
  1441. sourceType: ['album', 'camera'],
  1442. success: (res) => {
  1443. const len = res.tempFilePaths.length;
  1444. if (len === 1) {
  1445. res.tempFilePaths.forEach(path => {
  1446. that.uploadPhoto(path, 'ground');
  1447. })
  1448. } else {
  1449. uni.showModal({
  1450. content: '只能选择一张图片,请确认!',
  1451. showCancel: false
  1452. });
  1453. }
  1454. }
  1455. })
  1456. },
  1457. getBatteryPhoto() {
  1458. var that = this;
  1459. uni.chooseImage({
  1460. sourceType: ['album', 'camera'],
  1461. success: (res) => {
  1462. const len = res.tempFilePaths.length;
  1463. if (len === 1) {
  1464. res.tempFilePaths.forEach(path => {
  1465. that.uploadPhoto(path, 'battery');
  1466. })
  1467. } else {
  1468. uni.showModal({
  1469. content: '只能选择一张图片,请确认!',
  1470. showCancel: false
  1471. });
  1472. }
  1473. }
  1474. })
  1475. },
  1476. getSunPowerPhoto() {
  1477. var that = this;
  1478. uni.chooseImage({
  1479. sourceType: ['album', 'camera'],
  1480. success: (res) => {
  1481. const len = res.tempFilePaths.length;
  1482. if (len === 1) {
  1483. res.tempFilePaths.forEach(path => {
  1484. that.uploadPhoto(path, 'sun');
  1485. })
  1486. } else {
  1487. uni.showModal({
  1488. content: '只能选择一张图片,请确认!',
  1489. showCancel: false
  1490. });
  1491. }
  1492. }
  1493. })
  1494. },
  1495. onSaveClick(e) {
  1496. if ((this.projectInfo.projectId != null && this.projectInfo.projectId.length > 0) &&
  1497. (this.checkAreaDict.id != null && this.checkAreaDict.id.length > 0) &&
  1498. (this.checkItemTypeDict.id != null && this.checkItemTypeDict.id.length > 0) &&
  1499. (this.checkItemLabelDict.id != null && this.checkItemLabelDict.id.length > 0) &&
  1500. (this.checkStandardDict.id != null && this.checkStandardDict.id.length > 0)) {
  1501. try {
  1502. var data = {};
  1503. data['failureHiddenDangerDesc'] = this.failureHiddenDangerDesc;
  1504. data['failureCheckPointDesc'] = this.failureCheckPointDesc;
  1505. data['failureCorrectiveSuggest'] = this.failureCorrectiveSuggest;
  1506. data['failureCheckNo'] = this.checkNo;
  1507. data['failureProjectId'] = this.projectInfo.projectId;
  1508. data['failureCheckArea'] = this.checkAreaDict.id;
  1509. data['failureCheckHiddenDangerType'] = this.checkItemTypeDict.id;
  1510. data['failureCheckHiddenDanger'] = this.checkItemLabelDict.id;
  1511. data['failureCheckHiddenDangerItemPoint'] = this.checkStandardDict.id;
  1512. data['failureCheckHiddenDangerStandard'] = this.checkItemStandardBasisDict.id;
  1513. data['failureHiddenDangerLevel'] = this.hiddenDangerRadio.items[this.hiddenDangerRadio.current]
  1514. .id;
  1515. data['failureCorrectivePlanTime'] = this.planTimeRadio.items[this.planTimeRadio.current]
  1516. .id;
  1517. data['createTime'] = this.dateFormat(new Date());
  1518. data['createUserName'] = this.userInfo1.nick_name;
  1519. this.saveLocalFiles();
  1520. console.log("save " + data);
  1521. var list = uni.getStorageSync('check_report_storage_index');
  1522. if (list != null && list.length > 0) {
  1523. list.push(this.checkNo);
  1524. uni.setStorageSync('check_report_storage_index', list);
  1525. uni.setStorageSync('check_report_storage_' + this.checkNo, data);
  1526. } else {
  1527. list = [];
  1528. list.push(this.checkNo);
  1529. uni.setStorageSync('check_report_storage_index', list);
  1530. uni.setStorageSync('check_report_storage_' + this.checkNo, data);
  1531. }
  1532. var that = this;
  1533. uni.showModal({
  1534. title: '流程确认',
  1535. content: '请选择复制或继续检查',
  1536. cancelText: '复制检查单',
  1537. confirmText: '继续检查',
  1538. success: function(res) {
  1539. if (res.confirm) {
  1540. that.onContinunClick();
  1541. } else if (res.cancel) {
  1542. that.onCopyClick();
  1543. }
  1544. }
  1545. });
  1546. } catch (e) {
  1547. console.log(e)
  1548. uni.showModal({
  1549. content: '保存失败!',
  1550. showCancel: false
  1551. });
  1552. }
  1553. } else {
  1554. uni.showModal({
  1555. content: '请检查必填项',
  1556. showCancel: false
  1557. });
  1558. }
  1559. },
  1560. formReset: function(e) {
  1561. console.log('清空数据')
  1562. },
  1563. }
  1564. }
  1565. </script>
  1566. <style>
  1567. /* page {
  1568. background-color: rgb(240, 242, 244);
  1569. } */
  1570. </style>
  1571. <style lang="scss" scoped>
  1572. .cell-hover-class {
  1573. background-color: rgb(235, 237, 238);
  1574. }
  1575. .view-flex-rs {
  1576. display: flex;
  1577. flex-direction: row;
  1578. justify-content: flex-start;
  1579. align-items: center;
  1580. }
  1581. .view-flex-rc {
  1582. display: flex;
  1583. flex-direction: row;
  1584. justify-content: center;
  1585. align-items: center;
  1586. }
  1587. .view-flex-re {
  1588. display: flex;
  1589. flex-direction: row;
  1590. justify-content: flex-end;
  1591. align-items: center;
  1592. }
  1593. .view-flex-cs {
  1594. display: flex;
  1595. flex-direction: column;
  1596. justify-content: flex-start;
  1597. }
  1598. .view-flex-cc {
  1599. display: flex;
  1600. flex-direction: column;
  1601. justify-content: center;
  1602. }
  1603. .view-flex-ce {
  1604. display: flex;
  1605. flex-direction: column;
  1606. justify-content: flex-end;
  1607. }
  1608. .line-body {
  1609. padding-left: 10px;
  1610. padding-right: 10px;
  1611. }
  1612. .required-star {
  1613. color: #FF0000;
  1614. font-size: 15px;
  1615. width: 20px;
  1616. text-align: center;
  1617. padding-left: 0px;
  1618. padding-right: 2px;
  1619. }
  1620. .item-title {
  1621. color: #909399;
  1622. font-size: 15px;
  1623. }
  1624. .mline-text {
  1625. padding-left: 2px;
  1626. width: 100%;
  1627. /* background-color:#909399; */
  1628. height: 70px;
  1629. border: 1px solid #FF5A5F;
  1630. border-radius: 5px;
  1631. }
  1632. .footer {
  1633. position: fixed;
  1634. bottom: 0;
  1635. left: 0;
  1636. right: 0;
  1637. z-index: 1;
  1638. height: 100rpx;
  1639. padding: 20rpx;
  1640. box-sizing: border-box;
  1641. display: flex;
  1642. align-items: center;
  1643. justify-content: flex-end;
  1644. background-color: #ffffff;
  1645. .ipt {
  1646. width: 380rpx;
  1647. height: 77rpx;
  1648. background: #f7f7f7;
  1649. border-radius: 38px;
  1650. padding: 0 37rpx;
  1651. box-sizing: border-box;
  1652. margin-right: 20rpx;
  1653. }
  1654. .control {
  1655. flex: 1;
  1656. display: flex;
  1657. align-items: center;
  1658. justify-content: flex-end;
  1659. .block {
  1660. display: flex;
  1661. align-items: center;
  1662. justify-content: center;
  1663. flex: 1;
  1664. }
  1665. .icon {
  1666. height: auto;
  1667. }
  1668. .c {
  1669. width: 41rpx;
  1670. margin-right: 10rpx;
  1671. }
  1672. .s {
  1673. width: 36rpx;
  1674. }
  1675. .t {
  1676. width: 31rpx;
  1677. }
  1678. }
  1679. }
  1680. .container {
  1681. padding: 0 0 100rpx;
  1682. }
  1683. .u-cell-icon {
  1684. width: 36rpx;
  1685. height: 36rpx;
  1686. margin-right: 8rpx;
  1687. }
  1688. .slot-box {
  1689. /* #ifndef APP-NVUE */
  1690. display: flex;
  1691. /* #endif */
  1692. flex-direction: row;
  1693. align-items: center;
  1694. }
  1695. .slot-image {
  1696. /* #ifndef APP-NVUE */
  1697. display: block;
  1698. /* #endif */
  1699. margin-right: 10px;
  1700. width: 30px;
  1701. height: 30px;
  1702. }
  1703. .slot-text {
  1704. flex: 1;
  1705. font-size: 14px;
  1706. color: #4cd964;
  1707. margin-right: 10px;
  1708. }
  1709. .img-container {
  1710. margin-bottom: 0px;
  1711. width: 100px;
  1712. height: 100px;
  1713. .note-image-box {
  1714. margin-top: 0px;
  1715. display: flex;
  1716. flex-wrap: wrap;
  1717. padding: 10px;
  1718. .note-image-item {
  1719. position: relative;
  1720. width: 100%;
  1721. height: 0;
  1722. padding-top: 100%;
  1723. box-sizing: border-box;
  1724. // background-color: #18B566;
  1725. .close-icon {
  1726. display: flex;
  1727. justify-content: center;
  1728. align-items: center;
  1729. position: absolute;
  1730. right: 0px;
  1731. top: 0px;
  1732. width: 22px;
  1733. height: 22px;
  1734. border-radius: 50%;
  1735. background-color: #d5d5d5;
  1736. z-index: 2;
  1737. }
  1738. .image-box {
  1739. display: flex;
  1740. justify-content: center;
  1741. align-items: center;
  1742. position: absolute;
  1743. top: 5px;
  1744. right: 5px;
  1745. border: 5px;
  1746. left: 5px;
  1747. border: 1px #eee solid;
  1748. border-radius: 5px;
  1749. overflow: hidden;
  1750. width: 98%;
  1751. height: 98%;
  1752. }
  1753. }
  1754. }
  1755. }
  1756. .input-body {
  1757. background-color: #fff;
  1758. padding: 10px;
  1759. }
  1760. </style>