LNGStation.vue 30 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042
  1. <template>
  2. <view>
  3. <image src="https://cczdsz.cn/app/images//background-from.png" class="background"></image>
  4. <view class="project-content">
  5. <u-form :model="form" :rules="rules" ref="form">
  6. <view class="small-title">输配站</view>
  7. <u-form-item borderBottom label="名称"ref="item1">
  8. <u-input v-model="form.name" :disabled="type==1"></u-input>
  9. </u-form-item>
  10. <view class="small-title">储存罐</view>
  11. <u-form-item borderBottom ref="item1">
  12. <view>压力表</view>
  13. <u-input v-model="WarningColumnInformation" disabled placeholder="请上传压力表照片"></u-input>
  14. <view class="" style="display: flex; flex-wrap: wrap; margin: 0 55rpx;">
  15. <image src="https://cczdsz.cn/app/images//chooseimg.png" mode=""
  16. style="width: 190rpx; height: 190rpx; margin: 0 12rpx; " @click="pressureGaugechoose()" v-if="type!=1">
  17. </image>
  18. <view v-for="(item,index) in pressureGaugeimgymxs" :key="index" style="position: relative;">
  19. <view v-if="item.type == 'image'">
  20. <image :src="item.url" mode="" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"
  21. @click="pressureGaugeshowPhoto(index)">
  22. </image>
  23. </view>
  24. <view v-else>
  25. <video :src="item" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"></video>
  26. </view>
  27. <view @click="pressureGaugeremove(index)"
  28. style="position: absolute; top: 0; right: 14rpx; border-radius: 50%; background-color: #FF0000;">
  29. <u-icon name="close" color="#FFFFFF" size="35" v-if="type!=1"></u-icon>
  30. </view>
  31. </view>
  32. </view>
  33. </u-form-item>
  34. <u-form-item borderBottom ref="item1">
  35. <view>液位计</view>
  36. <u-input v-model="WarningColumnInformation" disabled placeholder="请上传液位计照片"></u-input>
  37. <view class="" style="display: flex; flex-wrap: wrap; margin: 0 55rpx;">
  38. <image src="https://cczdsz.cn/app/images//chooseimg.png" mode=""
  39. style="width: 190rpx; height: 190rpx; margin: 0 12rpx; " @click="LevelGaugechoose()" v-if="type!=1">
  40. </image>
  41. <view v-for="(item,index) in LevelGaugeimgymxs" :key="index" style="position: relative;">
  42. <view v-if="item.type == 'image'">
  43. <image :src="item.url" mode="" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"
  44. @click="LevelGaugeshowPhoto(index)">
  45. </image>
  46. </view>
  47. <view v-else>
  48. <video :src="item" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"></video>
  49. </view>
  50. <view @click="LevelGaugeremove(index)"
  51. style="position: absolute; top: 0; right: 14rpx; border-radius: 50%; background-color: #FF0000;">
  52. <u-icon name="close" color="#FFFFFF" size="35" v-if="type!=1"></u-icon>
  53. </view>
  54. </view>
  55. </view>
  56. </u-form-item>
  57. <u-form-item borderBottom ref="item1">
  58. <view>流量计</view>
  59. <u-input v-model="WarningColumnInformation" disabled placeholder="请上传流量计照片"></u-input>
  60. <view class="" style="display: flex; flex-wrap: wrap; margin: 0 55rpx;">
  61. <image src="https://cczdsz.cn/app/images//chooseimg.png" mode=""
  62. style="width: 190rpx; height: 190rpx; margin: 0 12rpx; " @click="choose()" v-if="type!=1">
  63. </image>
  64. <view v-for="(item,index) in imgymxs" :key="index" style="position: relative;">
  65. <view v-if="item.type == 'image'">
  66. <image :src="item.url" mode="" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"
  67. @click="showPhoto(index)">
  68. </image>
  69. </view>
  70. <view v-else>
  71. <video :src="item" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"></video>
  72. </view>
  73. <view @click="remove(index)"
  74. style="position: absolute; top: 0; right: 14rpx; border-radius: 50%; background-color: #FF0000;">
  75. <u-icon name="close" color="#FFFFFF" size="35" v-if="type!=1"></u-icon>
  76. </view>
  77. </view>
  78. </view>
  79. </u-form-item>
  80. <!-- <u-form-item label="路段名称" borderBottom ref="item1" labelWidth="140">
  81. <u-input v-model="form.sectionName" :disabled="type==1" borderBottom @click="showbuilding= true&&type!=1"
  82. placeholder="请输入路段名称"></u-input>
  83. </u-form-item>
  84. <u-form-item label="抽检米数" labelWidth="140" borderBottom ref="item1">
  85. <u-input v-model="form.samplingMeterCount" :disabled="type==1" borderBottom @click="showbuilding= true&&type!=1"
  86. placeholder="请输入抽检米数" @input="checksamplingMeterCount()"></u-input>
  87. </u-form-item> -->
  88. <view class="small-title">输送管道</view>
  89. <u-form-item label=" " labelWidth="0" borderBottom ref="item1">
  90. <u-radio-group v-model="form.pipeline" :disabled="type==1">
  91. <u-radio @change="confirm"
  92. v-for="(item, index) in typelist.Pipeline"
  93. :key="index" :name="item.dictValue">
  94. {{item.dictLabel}}
  95. </u-radio>
  96. </u-radio-group>
  97. </u-form-item>
  98. <view class="small-title">气化器</view>
  99. <u-form-item label="维护" labelWidth="140" borderBottom ref="item1">
  100. <u-radio-group v-model="form.maintain" :disabled="type==1">
  101. <u-radio @change="maintainconfirm"
  102. v-for="(item, index) in typelist.maintain"
  103. :key="index" :name="item.dictValue">
  104. {{item.dictLabel}}
  105. </u-radio>
  106. </u-radio-group>
  107. <u-input v-model="maintain" v-show="form.maintain==2" placeholder="请输入其他" @blur='maintainblur' :disabled="type==1"></u-input>
  108. </u-form-item>
  109. <view class="small-title">安全设施</view>
  110. <u-form-item label="报警器" labelWidth="140" borderBottom ref="item1">
  111. <u-radio-group v-model="form.alarm" :disabled="type==1">
  112. <u-radio @change="Alarmconfirm"
  113. v-for="(item, index) in typelist.safety_facilities"
  114. :key="index" :name="item.dictValue">
  115. {{item.dictLabel}}
  116. </u-radio>
  117. </u-radio-group>
  118. <u-input v-model="Alarm" v-show="showAlarm" placeholder="请输入其他" @blur='Alarmblur' :disabled="type==1"></u-input>
  119. </u-form-item>
  120. <u-form-item label="紧急切断阀" labelWidth="140" borderBottom ref="item1">
  121. <u-radio-group v-model="form.emergency" :disabled="type==1">
  122. <u-radio @change="emergencyconfirm"
  123. v-for="(item, index) in typelist.safety_facilities"
  124. :key="index" :name="item.dictValue">
  125. {{item.dictLabel}}
  126. </u-radio>
  127. </u-radio-group>
  128. <u-input v-model="emergency" v-show="showemergency" placeholder="请输入其他" @blur='emergencyblur' :disabled="type==1"></u-input>
  129. </u-form-item>
  130. <u-form-item label="消防器材" labelWidth="140" borderBottom ref="item1">
  131. <u-radio-group v-model="form.fireEquipment" :disabled="type==1">
  132. <u-radio @change="fireEquipmentconfirm"
  133. v-for="(item, index) in typelist.safety_facilities"
  134. :key="index" :name="item.dictValue">
  135. {{item.dictLabel}}
  136. </u-radio>
  137. </u-radio-group>
  138. <u-input v-model="fireEquipment" v-show="showfireEquipment" placeholder="请输入其他" @blur='fireEquipmentblur' :disabled="type==1"></u-input>
  139. </u-form-item>
  140. <!-- <u-form-item label="发现时间" labelWidth="140" borderBottom ref="item1">
  141. <u-input v-model="form.findTime" borderBottom placeholder="请选择接警时间" disabled
  142. @click="showtime=true&&type!=1"></u-input>
  143. <u-picker v-model="showtime" mode="time" :params="params" @confirm="time()"></u-picker>
  144. </u-form-item>
  145. <u-form-item borderBottom ref="item1">
  146. <view>巡检照片</view>
  147. <u-input v-model="WarningColumnInformation" disabled placeholder="请上传巡检照片"></u-input>
  148. <view class="" style="display: flex; flex-wrap: wrap; margin: 0 55rpx;">
  149. <image src="https://cczdsz.cn/app/images//chooseimg.png" mode=""
  150. style="width: 190rpx; height: 190rpx; margin: 0 12rpx; " @click="choose()" v-if="type!=1">
  151. </image>
  152. <view v-for="(item,index) in imgymxs" :key="index" style="position: relative;">
  153. <view v-if="item.type == 'image'">
  154. <image :src="item.url" mode="" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"
  155. @click="showPhoto(index)">
  156. </image>
  157. </view>
  158. <view v-else>
  159. <video :src="item" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"></video>
  160. </view>
  161. <view @click="remove(index)"
  162. style="position: absolute; top: 0; right: 14rpx; border-radius: 50%; background-color: #FF0000;">
  163. <u-icon name="close" color="#FFFFFF" size="35" v-if="type!=1"></u-icon>
  164. </view>
  165. </view>
  166. </view>
  167. </u-form-item> -->
  168. <!-- <u-form-item borderBottom ref="item1">
  169. <view>备注</view>
  170. <u-input v-model="form.remark" type="textarea" placeholder="请输入备注" :disabled="type==1"></u-input>
  171. </u-form-item> -->
  172. </u-form>
  173. <u-button style="background: #2d95f4;color: #fff;border-radius: 20rpx;margin-top: 20px;" @click="save()" v-if="type!=1"
  174. type='primary'>确认上传</u-button>
  175. </view>
  176. </view>
  177. </template>
  178. <script>
  179. import service from '@/api/index.js'
  180. export default {
  181. data() {
  182. return {
  183. repairType: [{
  184. label: '施工问题',
  185. value: 1
  186. }, {
  187. label: '施工问题',
  188. value: 2
  189. }, ],
  190. showrepairType: false,
  191. action: this.$HTTP.webUrl + `/obs`,
  192. headers: {
  193. MAuthorization: "wxBearer " + uni.getStorageSync('token')
  194. },
  195. url: [],
  196. params: {
  197. year: true,
  198. month: true,
  199. day: true,
  200. hour: true,
  201. minute: true,
  202. second: false
  203. },
  204. uploading: false,
  205. showmaintain:false,
  206. showtime:false,
  207. imgArr: [],
  208. imgymxs: [],
  209. pressureGaugeimgArr:[],
  210. pressureGaugeimgymxs:[],
  211. LevelGaugeimgArr: [],
  212. LevelGaugeimgymxs: [],
  213. progress: 0, //图片或视频上传百分比
  214. form: {pipeline:0,maintain:0,alarm:0,fireEquipment:0,emergency:0},
  215. typelist: [],
  216. causesOfFamageLabel: null,
  217. dictlist: ['Pipeline','maintain','safety_facilities'],
  218. buildingName: null,
  219. unit: null,
  220. unitName: null,
  221. showbuilding: false,
  222. showunit: false,
  223. buildingList: [],
  224. unitList: [],
  225. type: 2,
  226. id: null,
  227. community: null,
  228. createBy:null,
  229. maintain:null,
  230. fireEquipment:null,
  231. Alarm:null,
  232. emergency:null,
  233. showAlarm:null,
  234. showfireEquipment:null,
  235. showemergency:null
  236. }
  237. },
  238. onLoad(e) {
  239. // this.building = e.building
  240. // this.buildingName = e.buildingName
  241. // this.community = e.community
  242. // this.unitName = e.unitName
  243. // this.unit = e.unit
  244. this.id = e.id
  245. this.type = e.type
  246. console.log(e)
  247. this.getdictsysinfo()
  248. uni.setNavigationBarTitle({
  249. title: '输配站巡查'
  250. });
  251. uni.setNavigationBarColor({
  252. frontColor: '#ffffff',
  253. backgroundColor: '#2d95f4',
  254. })
  255. // if (this.type != 1) {
  256. // this.getBuildingList()
  257. // }
  258. this.getUserName()
  259. },
  260. methods: {
  261. time(e) {
  262. console.log(`${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`)
  263. this.form.findTime = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`
  264. },
  265. maintainblur()
  266. {
  267. this.form.maintain=this.maintain
  268. },
  269. fireEquipmentblur()
  270. {
  271. this.form.fireEquipment=this.fireEquipment
  272. },
  273. Alarmblur()
  274. {
  275. this.form.alarm=this.Alarm
  276. },
  277. emergencyblur()
  278. {
  279. this.form.emergency=this.emergency
  280. },
  281. checksamplingMeterCount(e) {
  282. console.log(e)
  283. //正则表达试
  284. e = (e.match(/^\d*(\.?\d{0,10})/g)[0]) || null
  285. //重新赋值给input
  286. this.$nextTick(() => {
  287. this.form.samplingMeterCount= e
  288. })
  289. },
  290. getUserName(){
  291. service.getUserName().then(res=>{
  292. this.userId=res.id
  293. this.createBy=res.name
  294. })
  295. },
  296. showPhoto(index) {
  297. uni.previewImage({
  298. current: index,
  299. urls: this.imgArr,
  300. })
  301. },
  302. pressureGaugeshowPhoto(index) {
  303. uni.previewImage({
  304. current: index,
  305. urls: this.pressureGaugeimgArr,
  306. })
  307. },
  308. LevelGaugeshowPhoto(index) {
  309. uni.previewImage({
  310. current: index,
  311. urls: this.LevelGaugeimgArr,
  312. })
  313. },
  314. // showPhotos(index) {
  315. // uni.previewImage({
  316. // current: index,
  317. // urls: this.photo,
  318. // })
  319. // },
  320. // buildingconfirm(e) {
  321. // this.buildingName = e[0].label
  322. // this.building = e[0].value
  323. // console.log(this.building)
  324. // //this.getUnitList(e[0].value)
  325. // },
  326. // unitconfirm(e) {
  327. // this.unitName = e[0].label
  328. // this.unit = e[0].value
  329. // },
  330. // getBuildingList() {
  331. // const _this = this
  332. // service.getBuildingList({
  333. // areaId: this.community
  334. // }).then(res => {
  335. // _this.buildingList = res
  336. // })
  337. // },
  338. // getUnitList(building) {
  339. // const _this = this
  340. // service.getUnitList({
  341. // buildingId: building
  342. // }).then(res => {
  343. // _this.unitList = res
  344. // })
  345. // },
  346. save() {
  347. let _this = this
  348. this.form.flowMeter = this.imgArr
  349. this.form.levelGauge=this.LevelGaugeimgArr
  350. this.form.pressureGauge=this.pressureGaugeimgArr
  351. // if(this.building==null)
  352. // {
  353. // uni.showToast({
  354. // title: '请选择楼栋',
  355. // icon: 'none'
  356. // })
  357. // return
  358. // }
  359. if(this.imgArr.length==0)
  360. {
  361. uni.showToast({
  362. title: '请上传图片或视频!',
  363. icon: 'none'
  364. })
  365. return
  366. }
  367. // this.form.buildingId = this.building
  368. // this.form.communityId=this.community
  369. this.form.userId=this.userId
  370. this.form.createBy=this.userId
  371. service.savetransmissionStation(this.form).then(res => {
  372. console.log(res)
  373. _this.$UTILS.showPrompt('上报成功!')
  374. // setTimeout(() => {
  375. // console.log('跳')
  376. // uni.switchTab({
  377. // url: '/pages/index/index'
  378. // })
  379. // }, 2000)
  380. this.form={pipeline:0,maintain:0,alarm:0,fireEquipment:0,emergency:0}
  381. // this.buildingName=''
  382. this.imgArr=[]
  383. this.imgymxs=[]
  384. this.LevelGaugeimgArr=[]
  385. this.pressureGaugeimgArr=[]
  386. this.LevelGaugeimgymxs=[]
  387. this.pressureGaugeimgymxs=[]
  388. this.maintain=null
  389. this.Alarm=null
  390. this.fireEquipment=null
  391. this.emergency=null
  392. this.showAlarm=false
  393. this.showemergency=false
  394. this.showfireEquipment=false
  395. this.showmaintain=false
  396. })
  397. },
  398. getdictsysinfo() {
  399. let _this = this
  400. service.getDictInfoList({
  401. type: this.dictlist
  402. }).then(res => {
  403. if (this.type == 1) {
  404. let _this = this
  405. console.log(this.id)
  406. service.gettransmissionStation(this.id).then(res => {
  407. // console.log(_this.typelist)
  408. // _this.buildingName = res.buildingName
  409. // _this.unitName = res.unitName
  410. // let list = []
  411. // list = _this.typelist.find_problem
  412. // list.forEach((item) => {
  413. // if (item.dictValue == res.findProblem) {
  414. // _this.causesOfFamageLabel = item.dictLabel
  415. // }
  416. // })
  417. if (null != res.flowMeter) {
  418. res.flowMeter.forEach(item => {
  419. let url = {}
  420. url.url = item
  421. url.type = 'image'
  422. this.imgymxs.push(url)
  423. })
  424. }
  425. if (null != res.levelGauge) {
  426. res.levelGauge.forEach(item => {
  427. let url = {}
  428. url.url = item
  429. url.type = 'image'
  430. this.LevelGaugeimgymxs.push(url)
  431. })
  432. }
  433. if (null != res.pressureGauge) {
  434. res.pressureGauge.forEach(item => {
  435. let url = {}
  436. url.url = item
  437. url.type = 'image'
  438. this.pressureGaugeimgymxs.push(url)
  439. })
  440. }
  441. this.form = res
  442. if(this.form.Alarm!=0)
  443. {
  444. this.showAlarm=true
  445. this.Alarm=this.form.alarm
  446. this.form.alarm=1
  447. }
  448. if(this.form.emergency!=0)
  449. {
  450. this.showemergency=true
  451. this.emergency=this.form.emergency
  452. this.form.emergency=1
  453. }
  454. if(this.form.fireEquipment!=0)
  455. {
  456. this.showfireEquipment=true
  457. this.fireEquipment=this.form.fireEquipment
  458. this.form.fireEquipment=1
  459. }
  460. if(this.form.maintain!=0||this.form.maintain!=1)
  461. {
  462. this.showmaintain=true
  463. this.maintain=this.form.maintain
  464. this.form.maintain=2
  465. }
  466. // this.form = res
  467. console.log(this.form)
  468. })
  469. }
  470. _this.typelist = res
  471. })
  472. },
  473. confirm(e) {
  474. this.form.pipeline =e
  475. },
  476. emergencyconfirm(e) {
  477. if(e==1)
  478. {
  479. this.showemergency=true
  480. this.form.emergency=null
  481. }else
  482. {
  483. this.form.emergency =e
  484. this.showemergency=false
  485. }
  486. },
  487. maintainconfirm(e) {
  488. if(e==2)
  489. {
  490. this.showmaintain=true
  491. this.form.maintain=null
  492. }else
  493. {
  494. this.form.maintain =e
  495. this.showmaintain=false
  496. }
  497. console.log(e)
  498. },
  499. fireEquipmentconfirm(e) {
  500. if(e==1)
  501. {
  502. this.showfireEquipment=true
  503. this.form.fireEquipment =null
  504. }else
  505. {
  506. this.form.fireEquipment =e
  507. this.showfireEquipment=false
  508. }
  509. },
  510. Alarmconfirm(e) {
  511. if(e==1)
  512. {
  513. this.showAlarm=true
  514. this.form.Alarm =null
  515. }else
  516. {
  517. this.form.Alarm =e
  518. this.showAlarm=false
  519. }
  520. },
  521. pressureGaugechoose()
  522. {
  523. let _this = this;
  524. uni.showActionSheet({
  525. title: '上传',
  526. itemList: ['图片', '视频'],
  527. success: (res) => {
  528. // console.log(res)
  529. if (res.tapIndex == 0) {
  530. this.pressureGaugeimage()
  531. } else {
  532. this.pressureGaugevideo()
  533. }
  534. }
  535. })
  536. },
  537. LevelGaugechoose()
  538. {
  539. let _this = this;
  540. uni.showActionSheet({
  541. title: '上传',
  542. itemList: ['图片', '视频'],
  543. success: (res) => {
  544. // console.log(res)
  545. if (res.tapIndex == 0) {
  546. this.LevelGaugeimage()
  547. } else {
  548. this.LevelGaugevideo()
  549. }
  550. }
  551. })
  552. },
  553. choose() {
  554. let _this = this;
  555. uni.showActionSheet({
  556. title: '上传',
  557. itemList: ['图片', '视频'],
  558. success: (res) => {
  559. // console.log(res)
  560. if (res.tapIndex == 0) {
  561. this.chooseimage()
  562. } else {
  563. this.choosevideo()
  564. }
  565. }
  566. })
  567. },
  568. chooseimage() {
  569. console.log('图片')
  570. let _this = this;
  571. uni.chooseImage({
  572. sourceType: ['camera'],
  573. success(resp) {
  574. console.log('res--uni.chooseMedia', resp);
  575. resp.tempFiles.forEach((item, index) => {
  576. const task = uni.uploadFile({
  577. url: _this.$HTTP.webUrl + `/obs`,
  578. filePath: item.path,
  579. name: 'file',
  580. formData: {},
  581. header: _this.headers,
  582. success: res => {
  583. // 判断是否json字符串,将其转为json格式
  584. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(
  585. res.data) : res.data;
  586. if (![200, 201, 204].includes(res.statusCode)) {
  587. // this.uploadError(index, data);
  588. _this.$UTILS.showPrompt('选取失败!')
  589. } else {
  590. // 上传成功
  591. // this.lists[index].response = data;
  592. // this.lists[index].progress = 100;
  593. // this.lists[index].error = false;
  594. // this.$emit('on-success', data, index, this.lists, this
  595. // .index);
  596. if (_this.progress === 100) {
  597. // console.log('_this.progress', _this.progress)
  598. // console.log('data----', data)
  599. // console.log('res--', res)
  600. _this.imgymxs.push({
  601. url: data.data.url,
  602. type: 'image'
  603. })
  604. _this.imgArr.push(data.data.url)
  605. // console.log('imgArr', _this.imgArr)
  606. _this.$UTILS.showPrompt('选取成功!')
  607. }
  608. }
  609. },
  610. fail: e => {
  611. _this.$UTILS.showPrompt('选取失败!')
  612. this.uploadError(index, e);
  613. },
  614. complete: res => {
  615. _this.uploading = false;
  616. // _this.uploadFile(index + 1);
  617. // this.$emit('on-change', res, index, this.lists, this
  618. // .index);
  619. }
  620. });
  621. task.onProgressUpdate(res => {
  622. // if (res.progress > 0) {
  623. // this.lists[index].progress = res.progress;
  624. // this.$emit('on-progress', res, index, this.lists, this.index);
  625. // }
  626. _this.progress = res.progress;
  627. console.log('onProgressUpdate', res)
  628. uni.showLoading({
  629. title: '选取中'
  630. })
  631. });
  632. })
  633. },
  634. })
  635. },
  636. choosevideo() {
  637. let _this = this;
  638. console.log('视频')
  639. uni.chooseVideo({
  640. sourceType: ['camera'],
  641. maxDuration: 30,
  642. success(resp) {
  643. const task = uni.uploadFile({
  644. url: _this.$HTTP.webUrl + `/obs`,
  645. filePath: resp.tempFilePath,
  646. name: 'file',
  647. formData: {},
  648. header: _this.headers,
  649. success: res => {
  650. // 判断是否json字符串,将其转为json格式
  651. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(res.data) :
  652. res.data;
  653. if (![200, 201, 204].includes(res.statusCode)) {
  654. this.uploadError(index, data);
  655. } else {
  656. // 上传成功
  657. // this.lists[index].response = data;
  658. // this.lists[index].progress = 100;
  659. // this.lists[index].error = false;
  660. // this.$emit('on-success', data, index, this.lists, this
  661. // .index);
  662. if (_this.progress === 100) {
  663. console.log('_this.progress', _this.progress)
  664. console.log('data----', data)
  665. console.log('res--', res)
  666. // _this.imgArr.push(data.data.url)
  667. _this.imgymxs.push({
  668. url: data.data.url,
  669. type: 'video'
  670. })
  671. _this.imgArr.push(data.data.url)
  672. console.log('imgArr', _this.imgArr)
  673. _this.$UTILS.showPrompt('选取成功!')
  674. }
  675. }
  676. },
  677. fail: e => {
  678. _this.$UTILS.showPrompt('选取失败!')
  679. this.uploadError(index, e);
  680. },
  681. complete: res => {
  682. uni.hideLoading();
  683. _this.uploading = false;
  684. // _this.uploadFile(index + 1);
  685. // this.$emit('on-change', res, index, this.lists, this
  686. // .index);
  687. }
  688. });
  689. task.onProgressUpdate(res => {
  690. // if (res.progress > 0) {
  691. // this.lists[index].progress = res.progress;
  692. // this.$emit('on-progress', res, index, this.lists, this.index);
  693. // }
  694. _this.progress = res.progress;
  695. console.log('onProgressUpdate', res)
  696. uni.showLoading({
  697. title: '选取中'
  698. })
  699. });
  700. },
  701. })
  702. },
  703. remove(index) {
  704. uni.showModal({
  705. title: '提示',
  706. content: '是否删除该图片或视频?',
  707. success: (res) => {
  708. if (res.confirm) {
  709. this.imgArr.splice(index, 1);
  710. this.imgymxs.splice(index, 1);
  711. console.log('this.imgarr', this.imgArr)
  712. }
  713. }
  714. })
  715. },
  716. pressureGaugeimage() {
  717. console.log('图片')
  718. let _this = this;
  719. uni.chooseImage({
  720. sourceType: ['camera'],
  721. success(resp) {
  722. console.log('res--uni.chooseMedia', resp);
  723. resp.tempFiles.forEach((item, index) => {
  724. const task = uni.uploadFile({
  725. url: _this.$HTTP.webUrl + `/obs`,
  726. filePath: item.path,
  727. name: 'file',
  728. formData: {},
  729. header: _this.headers,
  730. success: res => {
  731. // 判断是否json字符串,将其转为json格式
  732. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(
  733. res.data) : res.data;
  734. if (![200, 201, 204].includes(res.statusCode)) {
  735. // this.uploadError(index, data);
  736. _this.$UTILS.showPrompt('选取失败!')
  737. } else {
  738. // 上传成功
  739. // this.lists[index].response = data;
  740. // this.lists[index].progress = 100;
  741. // this.lists[index].error = false;
  742. // this.$emit('on-success', data, index, this.lists, this
  743. // .index);
  744. if (_this.progress === 100) {
  745. // console.log('_this.progress', _this.progress)
  746. // console.log('data----', data)
  747. // console.log('res--', res)
  748. _this.pressureGaugeimgymxs.push({
  749. url: data.data.url,
  750. type: 'image'
  751. })
  752. _this.pressureGaugeimgArr.push(data.data.url)
  753. // console.log('imgArr', _this.imgArr)
  754. _this.$UTILS.showPrompt('选取成功!')
  755. }
  756. }
  757. },
  758. fail: e => {
  759. _this.$UTILS.showPrompt('选取失败!')
  760. this.uploadError(index, e);
  761. },
  762. complete: res => {
  763. _this.uploading = false;
  764. // _this.uploadFile(index + 1);
  765. // this.$emit('on-change', res, index, this.lists, this
  766. // .index);
  767. }
  768. });
  769. task.onProgressUpdate(res => {
  770. // if (res.progress > 0) {
  771. // this.lists[index].progress = res.progress;
  772. // this.$emit('on-progress', res, index, this.lists, this.index);
  773. // }
  774. _this.progress = res.progress;
  775. console.log('onProgressUpdate', res)
  776. uni.showLoading({
  777. title: '选取中'
  778. })
  779. });
  780. })
  781. },
  782. })
  783. },
  784. pressureGaugevideo() {
  785. let _this = this;
  786. console.log('视频')
  787. uni.chooseVideo({
  788. sourceType: ['camera'],
  789. maxDuration: 30,
  790. success(resp) {
  791. const task = uni.uploadFile({
  792. url: _this.$HTTP.webUrl + `/obs`,
  793. filePath: resp.tempFilePath,
  794. name: 'file',
  795. formData: {},
  796. header: _this.headers,
  797. success: res => {
  798. // 判断是否json字符串,将其转为json格式
  799. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(res.data) :
  800. res.data;
  801. if (![200, 201, 204].includes(res.statusCode)) {
  802. this.uploadError(index, data);
  803. } else {
  804. // 上传成功
  805. // this.lists[index].response = data;
  806. // this.lists[index].progress = 100;
  807. // this.lists[index].error = false;
  808. // this.$emit('on-success', data, index, this.lists, this
  809. // .index);
  810. if (_this.progress === 100) {
  811. console.log('_this.progress', _this.progress)
  812. console.log('data----', data)
  813. console.log('res--', res)
  814. // _this.imgArr.push(data.data.url)
  815. _this.pressureGaugeimgymxs.push({
  816. url: data.data.url,
  817. type: 'video'
  818. })
  819. _this.pressureGaugeimgArr.push(data.data.url)
  820. console.log('imgArr', _this.imgArr)
  821. _this.$UTILS.showPrompt('选取成功!')
  822. }
  823. }
  824. },
  825. fail: e => {
  826. _this.$UTILS.showPrompt('选取失败!')
  827. this.uploadError(index, e);
  828. },
  829. complete: res => {
  830. uni.hideLoading();
  831. _this.uploading = false;
  832. // _this.uploadFile(index + 1);
  833. // this.$emit('on-change', res, index, this.lists, this
  834. // .index);
  835. }
  836. });
  837. task.onProgressUpdate(res => {
  838. // if (res.progress > 0) {
  839. // this.lists[index].progress = res.progress;
  840. // this.$emit('on-progress', res, index, this.lists, this.index);
  841. // }
  842. _this.progress = res.progress;
  843. console.log('onProgressUpdate', res)
  844. uni.showLoading({
  845. title: '选取中'
  846. })
  847. });
  848. },
  849. })
  850. },
  851. pressureGaugeremove(index) {
  852. uni.showModal({
  853. title: '提示',
  854. content: '是否删除该图片或视频?',
  855. success: (res) => {
  856. if (res.confirm) {
  857. this.pressureGaugeimgArr.splice(index, 1);
  858. this.pressureGaugeimgymxs.splice(index, 1);
  859. console.log('this.imgarr', this.pressureGaugeimgArr)
  860. }
  861. }
  862. })
  863. },
  864. LevelGaugeimage() {
  865. console.log('图片')
  866. let _this = this;
  867. uni.chooseImage({
  868. sourceType: ['camera'],
  869. success(resp) {
  870. console.log('res--uni.chooseMedia', resp);
  871. resp.tempFiles.forEach((item, index) => {
  872. const task = uni.uploadFile({
  873. url: _this.$HTTP.webUrl + `/obs`,
  874. filePath: item.path,
  875. name: 'file',
  876. formData: {},
  877. header: _this.headers,
  878. success: res => {
  879. // 判断是否json字符串,将其转为json格式
  880. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(
  881. res.data) : res.data;
  882. if (![200, 201, 204].includes(res.statusCode)) {
  883. // this.uploadError(index, data);
  884. _this.$UTILS.showPrompt('选取失败!')
  885. } else {
  886. // 上传成功
  887. // this.lists[index].response = data;
  888. // this.lists[index].progress = 100;
  889. // this.lists[index].error = false;
  890. // this.$emit('on-success', data, index, this.lists, this
  891. // .index);
  892. if (_this.progress === 100) {
  893. // console.log('_this.progress', _this.progress)
  894. // console.log('data----', data)
  895. // console.log('res--', res)
  896. _this.LevelGaugeimgymxs.push({
  897. url: data.data.url,
  898. type: 'image'
  899. })
  900. _this.LevelGaugeimgArr.push(data.data.url)
  901. // console.log('imgArr', _this.imgArr)
  902. _this.$UTILS.showPrompt('选取成功!')
  903. }
  904. }
  905. },
  906. fail: e => {
  907. _this.$UTILS.showPrompt('选取失败!')
  908. this.uploadError(index, e);
  909. },
  910. complete: res => {
  911. _this.uploading = false;
  912. // _this.uploadFile(index + 1);
  913. // this.$emit('on-change', res, index, this.lists, this
  914. // .index);
  915. }
  916. });
  917. task.onProgressUpdate(res => {
  918. // if (res.progress > 0) {
  919. // this.lists[index].progress = res.progress;
  920. // this.$emit('on-progress', res, index, this.lists, this.index);
  921. // }
  922. _this.progress = res.progress;
  923. console.log('onProgressUpdate', res)
  924. uni.showLoading({
  925. title: '选取中'
  926. })
  927. });
  928. })
  929. },
  930. })
  931. },
  932. LevelGaugevideo() {
  933. let _this = this;
  934. console.log('视频')
  935. uni.chooseVideo({
  936. sourceType: ['camera'],
  937. maxDuration: 30,
  938. success(resp) {
  939. const task = uni.uploadFile({
  940. url: _this.$HTTP.webUrl + `/obs`,
  941. filePath: resp.tempFilePath,
  942. name: 'file',
  943. formData: {},
  944. header: _this.headers,
  945. success: res => {
  946. // 判断是否json字符串,将其转为json格式
  947. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(res.data) :
  948. res.data;
  949. if (![200, 201, 204].includes(res.statusCode)) {
  950. this.uploadError(index, data);
  951. } else {
  952. // 上传成功
  953. // this.lists[index].response = data;
  954. // this.lists[index].progress = 100;
  955. // this.lists[index].error = false;
  956. // this.$emit('on-success', data, index, this.lists, this
  957. // .index);
  958. if (_this.progress === 100) {
  959. console.log('_this.progress', _this.progress)
  960. console.log('data----', data)
  961. console.log('res--', res)
  962. // _this.imgArr.push(data.data.url)
  963. _this.LevelGaugeimgymxs.push({
  964. url: data.data.url,
  965. type: 'video'
  966. })
  967. _this.LevelGaugeimgArr.push(data.data.url)
  968. console.log('imgArr', _this.imgArr)
  969. _this.$UTILS.showPrompt('选取成功!')
  970. }
  971. }
  972. },
  973. fail: e => {
  974. _this.$UTILS.showPrompt('选取失败!')
  975. this.uploadError(index, e);
  976. },
  977. complete: res => {
  978. uni.hideLoading();
  979. _this.uploading = false;
  980. // _this.uploadFile(index + 1);
  981. // this.$emit('on-change', res, index, this.lists, this
  982. // .index);
  983. }
  984. });
  985. task.onProgressUpdate(res => {
  986. // if (res.progress > 0) {
  987. // this.lists[index].progress = res.progress;
  988. // this.$emit('on-progress', res, index, this.lists, this.index);
  989. // }
  990. _this.progress = res.progress;
  991. console.log('onProgressUpdate', res)
  992. uni.showLoading({
  993. title: '选取中'
  994. })
  995. });
  996. },
  997. })
  998. },
  999. LevelGaugeremove(index) {
  1000. uni.showModal({
  1001. title: '提示',
  1002. content: '是否删除该图片或视频?',
  1003. success: (res) => {
  1004. if (res.confirm) {
  1005. this.LevelGaugeimgArr.splice(index, 1);
  1006. this.LevelGaugeimgymxs.splice(index, 1);
  1007. console.log('this.imgarr', this.LevelGaugeimgArr)
  1008. }
  1009. }
  1010. })
  1011. },
  1012. },
  1013. }
  1014. </script>
  1015. <style>
  1016. .project-content {
  1017. padding: 10rpx 20rpx;
  1018. border-radius: 20rpx;
  1019. background: #fff;
  1020. width: 90%;
  1021. margin: 0 auto;
  1022. }
  1023. .background {
  1024. z-index: -1;
  1025. position: fixed;
  1026. width: 100%;
  1027. height: 100%;
  1028. background-size: 100% 100%;
  1029. }
  1030. .small-title {
  1031. font-size: 38rpx;
  1032. color: #2d95f4;
  1033. margin: 20rpx 0;
  1034. }
  1035. </style>