GRegulatingBoxMaintenance.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706
  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="top">
  7. <u-icon class="top-icon" name="map-fill"></u-icon>
  8. <u-form-item label=" " borderBottom ref="item1" placeholder=" " labelWidth="20" label-align="left">
  9. <u-input v-model="form.name" disabled placeholder=" " disabled trim="false"></u-input>
  10. </u-form-item>
  11. <u-icon class="top-icon" name="calendar"></u-icon>
  12. <u-form-item label=" " borderBottom ref="item1" placeholder=" " labelWidth="20">
  13. <u-input v-model="time" disabled style="font-size: 2rpx" length='30px' trim="true"
  14. placeholder=" "></u-input>
  15. </u-form-item>
  16. </view>
  17. <view style="flex-flow: row;display: flex; justify-content: flex-end;">
  18. <view class="small-title">调压箱 </view>
  19. <view class="small-title" style="margin-left: auto;" @click="BoxDetails()">详情<u-icon name="arrow-right"></u-icon></view>
  20. </view>
  21. <u-form-item label="名称" borderBottom ref="item1" placeholder="请输入名称" labelWidth="140">
  22. <u-input v-model="form.name" length='20px' placeholder="请输入名称"
  23. type="digit" :clearable="false" disabled></u-input>
  24. </u-form-item>
  25. <u-form-item label="管理所" borderBottom ref="item1" labelWidth="140">
  26. <u-input v-model="AdministrativeOfficeLabel" placeholder="请输入管理所名称"
  27. disabled borderBottom @click="showadministrativeOffice= true "></u-input>
  28. <!-- <u-select v-model="showadministrativeOffice" :list="AdministrativeOfficeList" label-name="name"
  29. value-name="value" @confirm="AdministrativeOffice()" disabled> </u-select>
  30. <u-icon slot="right" name="arrow-right"></u-icon> -->
  31. </u-form-item>
  32. <u-form-item label="编号" borderBottom ref="item1" labelWidth="140">
  33. <u-input v-model="form.number" placeholder="请输入编号" disabled></u-input>
  34. </u-form-item>
  35. <u-form-item label="维护项目" labelWidth="140" borderBottom ref="item1">
  36. <u-checkbox-group @change="changeconfirm" >
  37. <u-checkbox
  38. v-for="(item, index) in typelist.regulating_box_maintenance"
  39. :key="index"
  40. v-model="item.default"
  41. :name="item.dictValue">
  42. {{item.dictLabel}}
  43. </u-checkbox>
  44. </u-checkbox-group>
  45. </u-form-item>
  46. <u-form-item borderBottom ref="item1">
  47. <view>照片</view>
  48. <u-input v-model="WarningColumnInformation" disabled placeholder="请上传巡检照片"></u-input>
  49. <view class="" style="display: flex; flex-wrap: wrap; margin: 0 55rpx;">
  50. <image src="https://cczdsz.cn/app/images/chooseimg.png" mode=""
  51. style="width: 190rpx; height: 190rpx; margin: 0 12rpx; " @click="choose()" >
  52. </image>
  53. <view v-for="(item,index) in imgymxs" :key="index" style="position: relative;">
  54. <view v-if="item.type == 'image'">
  55. <image :src="item.url" mode="" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"
  56. @click="showPhoto(index)">
  57. </image>
  58. </view>
  59. <view v-else>
  60. <video :src="item" style="width: 190rpx; height: 190rpx; margin: 0 20rpx;"></video>
  61. </view>
  62. <view @click="remove(index)"
  63. style="position: absolute; top: 0; right: 14rpx; border-radius: 50%; background-color: #FF0000;">
  64. <u-icon name="close" color="#FFFFFF" size="35" ></u-icon>
  65. </view>
  66. </view>
  67. </view>
  68. </u-form-item>
  69. <!-- <u-form-item borderBottom ref="item1">
  70. <view>备注</view>
  71. <u-input v-model="form.remarks" type="textarea" placeholder="请输入备注" ></u-input>
  72. </u-form-item> -->
  73. </u-form>
  74. <u-button style="background: #2d95f4;color: #fff;border-radius: 20rpx;" @click="save()"
  75. type='primary' v-if="type!=1">确认上传</u-button>
  76. <u-button style="background: #2d95f4;color: #fff;border-radius: 20rpx;" @click="update()"
  77. type='primary' v-else>确认修改</u-button>
  78. </view>
  79. <view>
  80. <u-popup v-model="showBoxDetails" height= "400px" border-radius="14" mode=bottom closeable=true close-icon-color="#000000">
  81. <image src="https://cczdsz.cn/app/images/background.png" class="background"></image>
  82. <view>
  83. <u-form :model="boxform" ref="boxform">
  84. <view style="text-align:center; font-size: 40rpx;">调压箱详情</view>
  85. <view class="project-content" style="margin-top: 20px;">
  86. <u-form-item label="管理所" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  87. <u-input v-model="AdministrativeOfficeLabel" disabled></u-input>
  88. </u-form-item>
  89. <u-form-item label="编号" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  90. <u-input v-model="boxform.number" placeholder=" " disabled></u-input>
  91. </u-form-item>
  92. <u-form-item label="名称" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  93. <u-input v-model="boxform.name" placeholder=" " disabled></u-input>
  94. </u-form-item>
  95. <u-form-item label="性质" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  96. <u-input v-model="boxform.nature" placeholder=" " disabled></u-input>
  97. </u-form-item>
  98. <u-form-item label="类型" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  99. <u-input v-model="boxform.type" placeholder=" " disabled></u-input>
  100. </u-form-item>
  101. <u-form-item label="路数" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  102. <u-input v-model="boxform.numberOfRoutes" placeholder=" " disabled></u-input>
  103. </u-form-item>
  104. <u-form-item label="性质" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  105. <u-input v-model="boxform.nature" placeholder=" " disabled></u-input>
  106. </u-form-item>
  107. <u-form-item label="总户数" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  108. <u-input v-model="pressureRegulatingBoxDetailsBo.totalNumberOfHousehold" placeholder=" " disabled></u-input>
  109. </u-form-item>
  110. <u-form-item label="调压箱位置" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  111. <u-input v-model="pressureRegulatingBoxDetailsBo.positionOfPressureRegulatingBox" placeholder=" " disabled></u-input>
  112. </u-form-item>
  113. <u-form-item label="控制范围" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  114. <u-input v-model="pressureRegulatingBoxDetailsBo.controlRange" placeholder=" " disabled></u-input>
  115. </u-form-item>
  116. <u-form-item label="接收时间" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  117. <u-input v-model="pressureRegulatingBoxDetailsBo.receivingTime" placeholder=" " disabled></u-input>
  118. </u-form-item>
  119. <u-form-item label="阀井位置" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  120. <u-input v-model="pressureRegulatingBoxDetailsBo.valveWellPosition" placeholder=" " disabled></u-input>
  121. </u-form-item>
  122. <u-form-item label="阀井钥匙形状" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  123. <u-input v-model="pressureRegulatingBoxDetailsBo.valveWellKeyShape" placeholder=" " disabled></u-input>
  124. </u-form-item>
  125. <u-form-item label="厂家" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  126. <u-input v-model="pressureRegulatingBoxDetailsBo.manufacturer" placeholder=" " disabled></u-input>
  127. </u-form-item>
  128. <u-form-item label="流量" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  129. <u-input v-model="pressureRegulatingBoxDetailsBo.flow" placeholder=" " disabled></u-input>
  130. </u-form-item>
  131. <u-form-item label="进口管径" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  132. <u-input v-model="pressureRegulatingBoxDetailsBo.importPipeDiameter" placeholder=" " disabled></u-input>
  133. </u-form-item>
  134. <u-form-item label="出口管径" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  135. <u-input v-model="pressureRegulatingBoxDetailsBo.outletPipeDiameter" placeholder=" " disabled></u-input>
  136. </u-form-item>
  137. <u-form-item label="旁通管径" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  138. <u-input v-model="pressureRegulatingBoxDetailsBo.bypassPipeDiameter" placeholder=" " disabled></u-input>
  139. </u-form-item>
  140. <u-form-item label="调压器" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  141. <u-input v-model="pressureRegulatingBoxDetailsBo.voltageRegulator" placeholder=" " disabled></u-input>
  142. </u-form-item>
  143. <u-form-item label="设施规格型号" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  144. <u-input v-model="pressureRegulatingBoxDetailsBo.facilitySpecificationsAndModels" placeholder=" " disabled></u-input>
  145. </u-form-item>
  146. <u-form-item label="入口压力" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  147. <u-input v-model="pressureRegulatingBoxDetailsBo.inletPressure" placeholder=" " disabled></u-input>
  148. </u-form-item>
  149. <u-form-item label="出口压力" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  150. <u-input v-model="pressureRegulatingBoxDetailsBo.outletPressure" placeholder=" " disabled></u-input>
  151. </u-form-item>
  152. <u-form-item label="切断压力" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  153. <u-input v-model="pressureRegulatingBoxDetailsBo.cutOffPressure" placeholder=" " disabled></u-input>
  154. </u-form-item>
  155. <u-form-item label="放散压力" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  156. <u-input v-model="pressureRegulatingBoxDetailsBo.releasePressure" placeholder=" " disabled></u-input>
  157. </u-form-item>
  158. <u-form-item label="出厂编号" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  159. <u-input v-model="pressureRegulatingBoxDetailsBo.factoryNumber" placeholder=" " disabled></u-input>
  160. </u-form-item>
  161. <u-form-item label="出厂日期" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  162. <u-input v-model="pressureRegulatingBoxDetailsBo.factoryDate" placeholder=" " disabled></u-input>
  163. </u-form-item>
  164. <u-form-item label="主电源位置" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  165. <u-input v-model="pressureRegulatingBoxDetailsBo.mainPowerSupplyPosition" placeholder=" " disabled></u-input>
  166. </u-form-item>
  167. <u-form-item label="备注" borderBottom ref="item1" placeholder=" " labelWidth="200" >
  168. <u-input v-model="inspectionFrequency" placeholder=" " disabled></u-input>
  169. </u-form-item>
  170. <u-form-item label=" " labelWidth="0" borderBottom ref="item1">
  171. <u-input v-model="boxform.remark" type="textarea" borderBottom placeholder="请填写备注信息内容"
  172. ></u-input>
  173. </u-form-item>
  174. </view>
  175. </u-form>
  176. </view>
  177. </u-popup>
  178. </view>
  179. </view>
  180. </template>
  181. <script>
  182. import service from '@/api/index.js'
  183. export default {
  184. data() {
  185. return {
  186. showBoxDetails:false,
  187. repairType: [{
  188. label: '施工问题',
  189. value: 1
  190. }, {
  191. label: '施工问题',
  192. value: 2
  193. }, ],
  194. showrepairType: false,
  195. action: this.$HTTP.webUrl + `/obs`,
  196. headers: {
  197. MAuthorization: "wxBearer " + uni.getStorageSync('token')
  198. },
  199. url: [],
  200. params: {
  201. year: true,
  202. month: true,
  203. day: true,
  204. hour: true,
  205. minute: true,
  206. second: false
  207. },
  208. uploading: false,
  209. time:null,
  210. showtime:false,
  211. imgArr: [],
  212. imgymxs: [],
  213. progress: 0, //图片或视频上传百分比
  214. form: {
  215. findProblem:1
  216. },
  217. typelist: [],
  218. causesOfFamageLabel: null,
  219. dictlist: ['regulating_box_maintenance'],
  220. teamName: null,
  221. team:null,
  222. unit: null,
  223. unitName: null,
  224. showbuilding: false,
  225. showunit: false,
  226. buildingList: [],
  227. unitList: [],
  228. type: 2,
  229. id: null,
  230. community: null,
  231. createBy:null,
  232. name:null,
  233. administrativeOffice:null,
  234. AdministrativeOfficeLabel:null,
  235. AdministrativeOfficeList:[],
  236. maintenanceItem:[],
  237. managementOfficeId:null,
  238. boxform:{},
  239. pressureRegulatingBoxDetailsBo:{}
  240. }
  241. },
  242. onLoad(e) {
  243. // this.building = e.building
  244. // this.buildingName = e.buildingName
  245. // this.community = e.community
  246. // this.unitName = e.unitName
  247. // this.unit = e.unit
  248. this.id = e.id
  249. this.type = e.type
  250. this.administrativeOffice=e.managementOffice
  251. this.form.administrativeOffice=e.managementOffice
  252. this.form.name=e.name
  253. this.name=e.name
  254. this.form.number=e.number
  255. this.managementOfficeId=e.managementOfficeId
  256. this.code=e.number
  257. console.log(e)
  258. this.name=e.name
  259. let time1 = new Date()
  260. console.log(time1.toLocaleString())
  261. var year = time1.getFullYear(); //得到年份
  262. var month = time1.getMonth() + 1; //得到月份
  263. var date = time1.getDate(); //得到日期
  264. var hours = time1.getHours(); //获取系统时
  265. var Min = time1.getMinutes(); //分
  266. this.type = e.type
  267. this.id = e.id
  268. this.time = year + "/" + month + "/" + date + "-" + hours + ":" + Min
  269. this.getdictsysinfo()
  270. uni.setNavigationBarTitle({
  271. title: '调压箱维护'
  272. });
  273. uni.setNavigationBarColor({
  274. frontColor: '#ffffff',
  275. backgroundColor: '#2d95f4',
  276. })
  277. // if (this.type != 1) {
  278. // this.getBuildingList()
  279. // }
  280. this.getUserName()
  281. },
  282. methods: {
  283. BoxDetails()
  284. {
  285. service.getpressureRegulatingBox(this.managementOfficeId).then(res=>{
  286. this.boxform=res
  287. this.pressureRegulatingBoxDetailsBo = res.pressureRegulatingBoxDetailsVo[0];
  288. this.showBoxDetails=true
  289. })
  290. },
  291. getAdministrativeOffice(userId){
  292. service.getAdministrativeOffice({userId:userId}).then(res=>{
  293. this.AdministrativeOfficeList=res
  294. console.log(this.administrativeOffice)
  295. if(this.type!=1)
  296. {
  297. this.AdministrativeOfficeLabel=this.AdministrativeOfficeList.filter(item=>item.value==this.administrativeOffice)[0].name
  298. }
  299. })
  300. },
  301. time(e) {
  302. console.log(`${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`)
  303. this.form.createTime = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`
  304. },
  305. // checksamplingMeterCount(e) {
  306. // console.log(e)
  307. // //正则表达试
  308. // e = (e.match(/^\d*(\.?\d{0,10})/g)[0]) || null
  309. // //重新赋值给input
  310. // this.$nextTick(() => {
  311. // this.form.samplingMeterCount= e
  312. // })
  313. // },
  314. getUserName(){
  315. service.getUserName().then(res=>{
  316. this.userId=res.id
  317. this.createBy=res.name
  318. this.getAdministrativeOffice(res.id)
  319. })
  320. },
  321. // showPhoto(index) {
  322. // uni.previewImage({
  323. // current: index,
  324. // urls: this.imgArr,
  325. // })
  326. // },
  327. // showPhotos(index) {
  328. // uni.previewImage({
  329. // current: index,
  330. // urls: this.photo,
  331. // })
  332. // },
  333. changeconfirm(e) {
  334. console.log(e)
  335. this.maintenanceItem=e
  336. this.form.maintenanceItem=e.join(',')
  337. // this.teamName = e[0].label
  338. // this.team = e[0].value
  339. // this.form.team=e[0].value
  340. // console.log(this.team)
  341. //this.getUnitList(e[0].value)
  342. },
  343. // unitconfirm(e) {
  344. // this.unitName = e[0].label
  345. // this.unit = e[0].value
  346. // },
  347. // getBuildingList() {
  348. // const _this = this
  349. // service.getBuildingList({
  350. // areaId: this.community
  351. // }).then(res => {
  352. // _this.buildingList = res
  353. // })
  354. // },
  355. // getUnitList(building) {
  356. // const _this = this
  357. // service.getUnitList({
  358. // buildingId: building
  359. // }).then(res => {
  360. // _this.unitList = res
  361. // })
  362. // },
  363. update()
  364. {
  365. let _this = this
  366. this.form.photoList = this.imgArr
  367. // if(this.building==null)
  368. // {
  369. // uni.showToast({
  370. // title: '请选择楼栋',
  371. // icon: 'none'
  372. // })
  373. // return
  374. // }
  375. if(this.imgArr.length==0)
  376. {
  377. uni.showToast({
  378. title: '请上传图片或视频!',
  379. icon: 'none'
  380. })
  381. return
  382. }
  383. this.form.pressureStatus = null
  384. // this.form.buildingId = this.building
  385. // this.form.communityId=this.community
  386. this.form.userId=this.userId
  387. this.form.createBy=this.userId
  388. service.updateregulatingBoxMaintenance(this.form).then(res => {
  389. console.log(res)
  390. _this.$UTILS.showPrompt('修改成功!')
  391. // setTimeout(() => {
  392. // console.log('跳')
  393. // uni.switchTab({
  394. // url: '/pages/index/index'
  395. // })
  396. // }, 2000)
  397. //this.form={isNormalInspection:1}
  398. // this.buildingName=''
  399. // this.imgArr=[]
  400. // this.imgymxs=[]
  401. })
  402. },
  403. save() {
  404. let _this = this
  405. this.form.photoList = this.imgArr
  406. // if(this.building==null)
  407. // {
  408. // uni.showToast({
  409. // title: '请选择楼栋',
  410. // icon: 'none'
  411. // })
  412. // return
  413. // }
  414. if(this.imgArr.length==0)
  415. {
  416. uni.showToast({
  417. title: '请上传图片或视频!',
  418. icon: 'none'
  419. })
  420. return
  421. }
  422. // this.form.buildingId = this.building
  423. // this.form.communityId=this.community
  424. this.form.userId=this.userId
  425. this.form.createBy=this.userId
  426. this.form.parentId=this.managementOfficeId
  427. this.form.team=this.team
  428. service.setregulatingBoxMaintenance(this.form).then(res => {
  429. console.log(res)
  430. _this.$UTILS.showPrompt('上报成功!')
  431. // setTimeout(() => {
  432. // console.log('跳')
  433. // uni.switchTab({
  434. // url: '/pages/index/index'
  435. // })
  436. // }, 2000)
  437. this.form={number:this.code,administrativeOffice:this.administrativeOffice,name:this.name}
  438. let yesandnolist=[]
  439. this.typelist.regulating_box_maintenance .forEach(item=>{
  440. item.default=false
  441. yesandnolist.push(item)
  442. })
  443. this.typelist.regulating_box_maintenance=yesandnolist
  444. // this.buildingName=''
  445. this.imgArr=[]
  446. this.imgymxs=[]
  447. })
  448. },
  449. getdictsysinfo() {
  450. let _this = this
  451. service.getDictInfoList({
  452. type: this.dictlist
  453. }).then(res => {
  454. _this.typelist = res
  455. if (this.type == 1) {
  456. let _this = this
  457. console.log(this.id)
  458. service.getregulatingBoxMaintenance(this.id).then(res => {
  459. // console.log(_this.typelist)
  460. // _this.buildingName = res.buildingName
  461. // _this.unitName = res.unitName
  462. // let list = []
  463. // list = _this.typelist.find_problem
  464. // list.forEach((item) => {
  465. // if (item.dictValue == res.findProblem) {
  466. // _this.causesOfFamageLabel = item.dictLabel
  467. // }
  468. // })
  469. if (null != res.photoList) {
  470. res.photoList.forEach(item => {
  471. let url = {}
  472. url.url = item
  473. url.type = 'image'
  474. this.imgymxs.push(url)
  475. this.imgArr.push(item)
  476. })
  477. }
  478. this.teamName=this.name
  479. this.time=res.createTime
  480. this.form = res
  481. this.maintenanceItem=res.maintenanceItem.split(',')
  482. let yesandnolist=[]
  483. this.typelist.regulating_box_maintenance .forEach(item=>{
  484. item.default=this.maintenanceItem.includes(item.dictValue)
  485. yesandnolist.push(item)
  486. })
  487. this.administrativeOffice=res.administrativeOffice
  488. this.name=res.name
  489. this.code=res.code
  490. this.AdministrativeOfficeLabel=this.AdministrativeOfficeList.filter(item=>item.value==this.administrativeOffice)[0].name
  491. this.typelist.regulating_box_maintenance=yesandnolist
  492. this.managementOfficeId=this.form.parentId
  493. })
  494. }
  495. console.log(res)
  496. })
  497. },
  498. confirm(e) {
  499. this.form.findProblem =e
  500. },
  501. choose() {
  502. let _this = this;
  503. uni.showActionSheet({
  504. title: '上传',
  505. itemList: ['图片', '视频'],
  506. success: (res) => {
  507. // console.log(res)
  508. if (res.tapIndex == 0) {
  509. this.chooseimage()
  510. } else {
  511. this.choosevideo()
  512. }
  513. }
  514. })
  515. },
  516. chooseimage() {
  517. console.log('图片')
  518. let _this = this;
  519. uni.chooseImage({
  520. sourceType: ['camera'],
  521. success(resp) {
  522. console.log('res--uni.chooseMedia', resp);
  523. resp.tempFiles.forEach((item, index) => {
  524. const task = uni.uploadFile({
  525. url: _this.$HTTP.webUrl + `/obs`,
  526. filePath: item.path,
  527. name: 'file',
  528. formData: {},
  529. header: _this.headers,
  530. success: res => {
  531. // 判断是否json字符串,将其转为json格式
  532. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(
  533. res.data) : res.data;
  534. if (![200, 201, 204].includes(res.statusCode)) {
  535. // this.uploadError(index, data);
  536. _this.$UTILS.showPrompt('选取失败!')
  537. } else {
  538. // 上传成功
  539. // this.lists[index].response = data;
  540. // this.lists[index].progress = 100;
  541. // this.lists[index].error = false;
  542. // this.$emit('on-success', data, index, this.lists, this
  543. // .index);
  544. if (_this.progress === 100) {
  545. // console.log('_this.progress', _this.progress)
  546. // console.log('data----', data)
  547. // console.log('res--', res)
  548. _this.imgymxs.push({
  549. url: data.data.url,
  550. type: 'image'
  551. })
  552. _this.imgArr.push(data.data.url)
  553. // console.log('imgArr', _this.imgArr)
  554. _this.$UTILS.showPrompt('选取成功!')
  555. }
  556. }
  557. },
  558. fail: e => {
  559. _this.$UTILS.showPrompt('选取失败!')
  560. this.uploadError(index, e);
  561. },
  562. complete: res => {
  563. _this.uploading = false;
  564. // _this.uploadFile(index + 1);
  565. // this.$emit('on-change', res, index, this.lists, this
  566. // .index);
  567. }
  568. });
  569. task.onProgressUpdate(res => {
  570. // if (res.progress > 0) {
  571. // this.lists[index].progress = res.progress;
  572. // this.$emit('on-progress', res, index, this.lists, this.index);
  573. // }
  574. _this.progress = res.progress;
  575. console.log('onProgressUpdate', res)
  576. uni.showLoading({
  577. title: '选取中'
  578. })
  579. });
  580. })
  581. },
  582. })
  583. },
  584. choosevideo() {
  585. let _this = this;
  586. console.log('视频')
  587. uni.chooseVideo({
  588. sourceType: ['camera'],
  589. maxDuration: 30,
  590. success(resp) {
  591. const task = uni.uploadFile({
  592. url: _this.$HTTP.webUrl + `/obs`,
  593. filePath: resp.tempFilePath,
  594. name: 'file',
  595. formData: {},
  596. header: _this.headers,
  597. success: res => {
  598. // 判断是否json字符串,将其转为json格式
  599. let data = _this.$u.test.jsonString(res.data) ? JSON.parse(res.data) :
  600. res.data;
  601. if (![200, 201, 204].includes(res.statusCode)) {
  602. this.uploadError(index, data);
  603. } else {
  604. // 上传成功
  605. // this.lists[index].response = data;
  606. // this.lists[index].progress = 100;
  607. // this.lists[index].error = false;
  608. // this.$emit('on-success', data, index, this.lists, this
  609. // .index);
  610. if (_this.progress === 100) {
  611. console.log('_this.progress', _this.progress)
  612. console.log('data----', data)
  613. console.log('res--', res)
  614. // _this.imgArr.push(data.data.url)
  615. _this.imgymxs.push({
  616. url: data.data.url,
  617. type: 'video'
  618. })
  619. _this.imgArr.push(data.data.url)
  620. console.log('imgArr', _this.imgArr)
  621. _this.$UTILS.showPrompt('选取成功!')
  622. }
  623. }
  624. },
  625. fail: e => {
  626. _this.$UTILS.showPrompt('选取失败!')
  627. this.uploadError(index, e);
  628. },
  629. complete: res => {
  630. uni.hideLoading();
  631. _this.uploading = false;
  632. // _this.uploadFile(index + 1);
  633. // this.$emit('on-change', res, index, this.lists, this
  634. // .index);
  635. }
  636. });
  637. task.onProgressUpdate(res => {
  638. // if (res.progress > 0) {
  639. // this.lists[index].progress = res.progress;
  640. // this.$emit('on-progress', res, index, this.lists, this.index);
  641. // }
  642. _this.progress = res.progress;
  643. console.log('onProgressUpdate', res)
  644. uni.showLoading({
  645. title: '选取中'
  646. })
  647. });
  648. },
  649. })
  650. },
  651. remove(index) {
  652. uni.showModal({
  653. title: '提示',
  654. content: '是否删除该图片或视频?',
  655. success: (res) => {
  656. if (res.confirm) {
  657. this.imgArr.splice(index, 1);
  658. this.imgymxs.splice(index, 1);
  659. console.log('this.imgarr', this.imgArr)
  660. }
  661. }
  662. })
  663. },
  664. }
  665. }
  666. </script>
  667. <style>
  668. .project-content {
  669. padding: 10rpx 20rpx;
  670. border-radius: 20rpx;
  671. background: #fff;
  672. width: 90%;
  673. margin: 0 auto;
  674. }
  675. .background {
  676. z-index: -1;
  677. position: fixed;
  678. width: 100%;
  679. height: 100%;
  680. background-size: 100% 100%;
  681. }
  682. .top {
  683. display: flex;
  684. align-items: center;
  685. justify-content: space-between;
  686. }
  687. .top-icon {
  688. font-size: 40rpx;
  689. color: #2d95f4;
  690. }
  691. .small-title {
  692. font-size: 38rpx;
  693. color: #2d95f4;
  694. margin: 20rpx 0;
  695. }
  696. </style>