examineAddTow.vue 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858
  1. <!-- 开始检查 -->
  2. <template>
  3. <view id="startChecking">
  4. <scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
  5. <viwe class="list">
  6. <view class="title">不符合项</view>
  7. <view class="check-for-big-box" v-for="(item,index) in form.checkHazardDtoList" :key="index">
  8. <view class="grade">
  9. <view class="grade_l">隐患等级:</view>
  10. <picker @change="gradeChange(item,$event)" :value="gradeIndex" :range="gradeArray" class="scope_r">
  11. <view class="grade_r">
  12. <view>{{item.hazardLevel==0?'一般隐患':(item.hazardLevel==1?'重大隐患':'问题管理')}}</view>
  13. <img src="@/images/Version3.3.3/icon_06.png">
  14. </view>
  15. </picker>
  16. </view>
  17. <view class="project" v-if="checkOptionList.length>0">
  18. <view class="project_l">检查项目:</view>
  19. <uni-data-picker :ellipsis="false" :localdata="checkOptionList[index]" :map="{text:'name',value:'id'}"
  20. popup-title="请选择所属目录" @change="(e)=>onchange(e,index)" @nodeclick="onnodeclick()"
  21. ref="uniDataPicker" :addType="true" :addIndex="index">
  22. <view class="project_r">{{item.hazardCheckName?item.hazardCheckName:'请选择检查项'}}</view>
  23. </uni-data-picker>
  24. </view>
  25. <view class="point">
  26. <view class="point_l">检查要点:</view>
  27. <textarea class="point_r" type="text" v-model="item.hazardCheckPoint" maxlength="50" placeholder="未查到此项检查要点,可在此输入添加" placeholder-style="font-size:28rpx;color:#999;"></textarea>
  28. </view>
  29. <view class="check-for-input-max-box">
  30. <view class="left-title-p">隐患描述:</view>
  31. <textarea type="text" v-model="item.hazardDescribe" maxlength="50" placeholder="请输入隐患描述" placeholder-style="font-size:28rpx;color:#999;"></textarea>
  32. </view>
  33. <view class="check-for-img-max-box">
  34. <view class="left-title-p">隐患照片(最多上传5张):</view>
  35. <view class="right-img-box">
  36. <view class="img-box" v-for="(imgItem,imgIndex) in item.uploadDtoList" :key="imgIndex">
  37. <img class="img-data" :src="configURL+imgItem.fileUrl">
  38. <img class="position-img" src="@/pages_manage/images/icon_ssp_closure.png" @click="delImg(index,imgIndex)">
  39. </view>
  40. <img class="add-button" src="@/pages_manage/images/icon_07.png" @click="selectImage(item)" v-if="item.uploadDtoList.length<5">
  41. </view>
  42. </view>
  43. <view class="voice">
  44. <view class="voice_t">
  45. <view class="voice_t_l">语音备注:</view>
  46. <img class="voice_t_r" src="@/images/Version3.3.3/icon_ksjc_yysr.png" @longpress.stop="recordButton(item,$event)" @touchmove.stop="cancelButton" @touchend.stop="sendButton(item,$event)">
  47. </view>
  48. <view class="voice_b" v-for="(voiceItem,voiceIndex) in item.voiceRemark" :key="voiceIndex">
  49. <view class="voice_b_l" @tap="voicePlay(voiceItem.url)"><img class="add-button" src="@/pages_manage/images/icon_yyt.png"/>{{voiceItem.times}}″</view>
  50. <img class="voice_b_r" src="@/pages_manage/images/Version2.3/icon_sczl_sc.png" @tap="voiceDele(index,voiceIndex)"/>
  51. </view>
  52. </view>
  53. <view class="check-for-big-box-position-img-box" v-if="form.checkHazardDtoList.length>1" @click="delDetailsList(index)">
  54. <img src="@/pages_manage/images/icon_ssp_closure.png">
  55. </view>
  56. </view>
  57. <view class="add-for-item-p" @click="addDanger()">+ 新增隐患项</view>
  58. </viwe>
  59. </scroll-view>
  60. <view class="bottom_btn">
  61. <view class="bottom_btn_li" @click="goMinButton(index)" v-for="(item,index) in bottomBtnList" :key="index">{{item}}</view>
  62. </view>
  63. </view>
  64. </template>
  65. <script>
  66. const myaudio = uni.createInnerAudioContext();
  67. import { config } from '@/api/request/config.js'
  68. import {checkOptionListNew,treeDepselect,checkManageAdd} from '@/api/index.js'
  69. export default {
  70. name: "startChecking",
  71. data() {
  72. return {
  73. configURL:config.base_url,
  74. id:"",
  75. //页面子状态
  76. minPageType:1,
  77. //临时存储隐患信息ID
  78. hiddenDangerIdList:[],
  79. //数据
  80. form:{
  81. id:'',
  82. checkPlanId:'',
  83. manageStatus:'',//保存1 提交2
  84. subId:'',//实验室
  85. subjectName:'',
  86. title:'',//计划标题
  87. deptId:'',//学院
  88. collegeName:'',
  89. buildId:'',//楼栋
  90. buildName:'',
  91. checkType:'',// 检查类型(1校院巡查 2实验室自查)
  92. checkResult:'1',// 检查结果 0不符合 1符合
  93. rectifyDeadline:'',//整改期限
  94. rectifyNotice:'1',//整改通知(1整改告知书 2整改通知书)
  95. checkHazardDtoList:[
  96. {
  97. voiceRemark:[],//语音备忘存储
  98. hazardLevel:'0',//隐患等级
  99. hazardCheckCode:'', //检查项目code序号
  100. hazardCheckName:'', //检查项目名称
  101. hazardCheckPro:'', //最后一级的id
  102. hazardCheckPoint:'',// 检查要点
  103. hazardDescribe:'', //隐患描述
  104. uploadDtoList:[],//隐患照片
  105. }
  106. ],
  107. },
  108. inspectionUnit:"",
  109. inspectionUnitArray:[],
  110. inspectionUnitArrayData:[],
  111. //搜索回调列表
  112. searchList:[],
  113. searchNullType:true,
  114. //检查项
  115. checkOptionList:[],
  116. //新增检查项
  117. openIndex:"",
  118. open:false,
  119. jcxSstkMs:[],
  120. jcxSstkNum:'',
  121. //临时数据组
  122. temporaryIdList:[],
  123. //添加项 目录
  124. uniPicker:"请选择所属目录",
  125. //滑动记录
  126. startPoint:{},
  127. liveType:false,
  128. sendLock: true, //发送锁,当为true时上锁,false时解锁发送
  129. recorderManager : wx.getRecorderManager(),
  130. temporaryData:[],
  131. gradeIndex :0,
  132. gradeArray:['一般隐患','重大隐患','问题管理'],
  133. bottomBtnList:['上一步','保存','提交'],
  134. }
  135. },
  136. onLoad(option) {
  137. if(option.form){
  138. this.form=JSON.parse(decodeURIComponent(option.form));
  139. }
  140. },
  141. onShow() {
  142. this.getCheckOptionList();
  143. },
  144. methods: {
  145. //隐患等级
  146. gradeChange(item,e){
  147. item.hazardLevel=e.target.value
  148. },
  149. //语音备忘播放
  150. async voicePlay(item){
  151. myaudio.src = config.base_url+item;
  152. myaudio.play();
  153. },
  154. //语音备忘删除
  155. async voiceDele(index,voiceIndex){
  156. let self = this;
  157. uni.showModal({
  158. title: '',
  159. cancelColor:'#999999',
  160. confirmColor:'#FF6E6E',
  161. content: '确定删除此语音吗?',
  162. success (res) {
  163. if (res.confirm) {
  164. console.log('用户点击确定')
  165. self.form.checkHazardDtoList[index].voiceRemark.splice(voiceIndex,1);
  166. self.$forceUpdate();
  167. } else if (res.cancel) {
  168. console.log('用户点击取消')
  169. }
  170. }
  171. })
  172. },
  173. //录制
  174. recordButton(item,e){
  175. console.log("按下")
  176. let self = this;
  177. if(item.voiceRemark.length>=5){
  178. uni.showToast({
  179. title: '语音备忘最多只能上传5条',
  180. icon:"none",
  181. mask:true,
  182. duration: 2000
  183. });
  184. return
  185. }
  186. this.liveType=true;
  187. console.log('录制',e)
  188. this.startPoint = e.touches[0];//记录长按时开始点信息,后面用于计算上划取消时手指滑动的距离。
  189. const options = {
  190. duration: 60000,
  191. sampleRate: 16000,
  192. numberOfChannels: 1,
  193. encodeBitRate: 48000,
  194. format: 'mp3',
  195. frameSize: 50
  196. }
  197. this.recorderManager.start(options);//开始录音
  198. this.recorderManager.onStart(() => {
  199. console.log('recorder start')
  200. })
  201. this.recorderManager.onError((res) => {
  202. console.log(res);
  203. })
  204. wx.showToast({
  205. title: "正在录音,上划取消发送",
  206. icon: "none",
  207. duration: 60000//先定义个60秒,后面可以手动调用wx.hideToast()隐藏
  208. });
  209. this.sendLock = false;//长按时是不上锁的。
  210. },
  211. //取消
  212. cancelButton(e){
  213. console.log("移动")
  214. let self = this;
  215. this.liveType=false;
  216. console.log('取消',e)
  217. let moveLenght = e.touches[e.touches.length - 1].clientY - this.startPoint.clientY; //移动距离
  218. if (Math.abs(moveLenght) > 50) {
  219. wx.showToast({
  220. title: "松开手指,取消发送",
  221. icon: "none",
  222. duration: 60000
  223. });
  224. this.sendLock = true;//触发了上滑取消发送,上锁
  225. } else {
  226. wx.showToast({
  227. title: "正在录音,上划取消发送",
  228. icon: "none",
  229. duration: 60000
  230. });
  231. this.sendLock = false;//上划距离不足,依然可以发送,不上锁
  232. }
  233. },
  234. //发送
  235. sendButton(item,e){
  236. console.log("松开")
  237. let self = this;
  238. this.liveType=false;
  239. console.log('发送',e)
  240. wx.hideToast();//结束录音、隐藏Toast提示框
  241. this.recorderManager.stop();//结束录音
  242. this.recorderManager.onStop((res) => {
  243. if(!this.sendLock){
  244. this.uploadVoice(item,res.duration,res.tempFilePath);
  245. }
  246. console.log('停止录音', res.tempFilePath)
  247. console.log("sendLock",this.sendLock);
  248. })
  249. },
  250. //上传MP3
  251. async uploadVoice(item,times,tempFilePaths){
  252. var self = this;
  253. uni.uploadFile({
  254. url: config.base_url+'/base/file/upload', //仅为示例,非真实的接口地址
  255. header:{'Authorization':uni.getStorageSync('token')},
  256. filePath: tempFilePaths,
  257. name: 'file',
  258. formData: {
  259. 'user': 'test'
  260. },
  261. success: (uploadFileRes) => {
  262. let res = JSON.parse(uploadFileRes.data);
  263. if(res.code == 200){
  264. console.log("上传成功",res)
  265. console.log(item)
  266. let seconds = Math.round((parseInt(times) % (1000 * 60)) / 1000);
  267. item.voiceRemark.push({'times':seconds,'url':res.data.url})
  268. console.log(JSON.stringify(self.voice))
  269. //self.textParseUrlIps(res.data.url);
  270. // self.newData.imgList.push(res.data.url);
  271. }else{
  272. uni.showToast({
  273. title: res.msg,
  274. icon:"none",
  275. mask:true,
  276. duration: 2000
  277. });
  278. }
  279. },
  280. fail: err => {
  281. uni.hideLoading()
  282. },
  283. complete: () => {
  284. }
  285. });
  286. },
  287. /**************************检查项***************************/
  288. //获取检查项
  289. async getCheckOptionList() {
  290. const {data} = await checkOptionListNew();
  291. if(data.code == 200){
  292. let list = this.getTreeData(data.data);
  293. this.checkOptionList.push(JSON.parse(JSON.stringify(list)));
  294. }
  295. },
  296. getTreeData(data){
  297. for(var i=0;i<data.length>0;i++){
  298. if(data[i].children == null||data[i].children.length<=0){
  299. // children若为空数组,则将children设为undefined
  300. data[i].children = undefined;
  301. }else {
  302. // children若不为空数组,则继续 递归调用 本方法
  303. this.getTreeData(data[i].children);
  304. }
  305. }
  306. return data;
  307. },
  308. /**************************搜索项***************************/
  309. //搜索特定检查项
  310. async searchClick(text,index){
  311. console.log("搜索text",text);
  312. console.log("搜索index",index);
  313. const {data} = await checkOptionListNew({'searchValue':text});
  314. if(data.code == 200){
  315. if(data.data[0]){
  316. let list = JSON.parse(JSON.stringify(this.checkOptionList));
  317. list[index] = this.getTreeData(data.data);
  318. this.$set(this,'checkOptionList',JSON.parse(JSON.stringify(list)))
  319. console.log('this.$refs.uniDataPicker',this.$refs.uniDataPicker)
  320. this.$refs.uniDataPicker[index].show();
  321. }else{
  322. uni.showToast({
  323. title: '未找到相关检查项',
  324. icon:"none",
  325. mask:true,
  326. duration: 2000
  327. });
  328. }
  329. }
  330. },
  331. //重置检查项
  332. async resetClick(index){
  333. console.log("重置index",index);
  334. const {data} = await checkOptionListNew();
  335. if(data.code == 200){
  336. let list = JSON.parse(JSON.stringify(this.checkOptionList));
  337. list[index] = this.getTreeData(data.data);
  338. this.$set(this,'checkOptionList',JSON.parse(JSON.stringify(list)))
  339. this.$refs.uniDataPicker[index].show();
  340. }
  341. },
  342. //选中固有检查项(新)
  343. onchange(e,index) {
  344. let self = this;
  345. //hazardCheckCode:'', //检查项目code序号
  346. //hazardCheckName:'', //检查项目名称
  347. //hazardCheckPro:'', //最后一级的id
  348. let jcxSstkNum=this.getTreeName(this.checkOptionList[0],e.detail.value[e.detail.value.length-1].value)
  349. this.$set(this.form.checkHazardDtoList[index],'hazardCheckPro',e.detail.value[e.detail.value.length-1].value);
  350. this.$set(this.form.checkHazardDtoList[index],'hazardCheckCode',jcxSstkNum);
  351. this.$set(this.form.checkHazardDtoList[index],'hazardCheckName',e.detail.value[e.detail.value.length-1].text);
  352. },
  353. //根据id查找父元素
  354. getTreeName(list,id){
  355. let _this=this
  356. for (let i = 0; i < list.length; i++) {
  357. let a=list[i]
  358. if(a.id===id){
  359. return a.code
  360. }else{
  361. if(a.children && a.children.length>0){
  362. let res=_this.getTreeName(a.children,id)
  363. if(res){
  364. return res
  365. }
  366. }
  367. }
  368. }
  369. },
  370. onnodeclick(node) {},
  371. // 图片上传
  372. selectImage(item) {
  373. let self = this;
  374. if(item.uploadDtoList.length>4){
  375. uni.showToast({
  376. title: '最多上传5张图片',
  377. icon:"none",
  378. mask:true,
  379. duration: 2000
  380. });
  381. return
  382. }
  383. wx.chooseImage({
  384. count: 1,
  385. sizeType: ["original", "compressed"],
  386. sourceType: ["album", "camera"],
  387. success: function(res) {
  388. let tempFilePaths = res.tempFilePaths[0];
  389. self.uploadImg(tempFilePaths,item);
  390. }
  391. });
  392. },
  393. async uploadImg(tempFilePaths,item){
  394. var self = this;
  395. uni.showLoading({
  396. title: '上传中',
  397. mask: true
  398. });
  399. uni.uploadFile({
  400. url: config.base_url+'/base/file/upload', //仅为示例,非真实的接口地址
  401. header:{'Authorization':uni.getStorageSync('token')},
  402. filePath: tempFilePaths,
  403. name: 'file',
  404. formData: {
  405. 'user': 'test'
  406. },
  407. success: (uploadFileRes) => {
  408. let res = JSON.parse(uploadFileRes.data);
  409. if(res.code == 200){
  410. item.uploadDtoList.push({'fileUrl':res.data.url,'fileName':res.data.name});
  411. console.log(res.data.url)
  412. }else{
  413. uni.showToast({
  414. title: res.msg,
  415. icon:"none",
  416. mask:true,
  417. duration: 2000
  418. });
  419. }
  420. },
  421. fail: err => {},
  422. complete: () => {
  423. uni.hideLoading()
  424. }
  425. });
  426. },
  427. //删除图片
  428. delImg(index,minIndex){
  429. this.form.checkHazardDtoList[index].uploadDtoList.splice(minIndex,1);
  430. this.$forceUpdate();
  431. },
  432. //添加隐患
  433. addDanger(){
  434. if(this.form.checkHazardDtoList.length>19){
  435. uni.showToast({
  436. title: '最多添加20个隐患',
  437. icon:"none",
  438. mask:true,
  439. duration: 2000
  440. });
  441. return
  442. }
  443. let obj = {
  444. voiceRemark:[],//语音备忘存储
  445. hazardLevel:'0',//隐患等级
  446. hazardCheckCode:'', //检查项目code序号
  447. hazardCheckName:'', //检查项目名称
  448. hazardCheckPro:'', //最后一级的id
  449. hazardCheckPoint:'',// 检查要点
  450. hazardDescribe:'', //隐患描述
  451. uploadDtoList:[],//隐患照片
  452. }
  453. this.form.checkHazardDtoList.push(obj);
  454. this.getCheckOptionList();
  455. this.$forceUpdate();
  456. },
  457. //删除隐患
  458. delDetailsList(index){
  459. this.hiddenDangerIdList.push(this.form.checkHazardDtoList[index].id)
  460. this.form.checkHazardDtoList.splice(index,1);
  461. this.$forceUpdate();
  462. },
  463. //子页面切换
  464. goMinButton(index){
  465. let self = this;
  466. if(index == 0){
  467. uni.redirectTo({
  468. url: '/pages/pages_safetyExamine/examineManage/examineAdd?form='+encodeURIComponent(JSON.stringify(this.form))
  469. });
  470. }else if(index == 1 || index == 2){
  471. this.form.manageStatus=index;//1保存 2提交
  472. for(let i=0;i<self.form.checkHazardDtoList.length;i++){
  473. let num = i+1;
  474. if(!self.form.checkHazardDtoList[i].hazardCheckName){
  475. uni.showToast({
  476. title: '第'+num+'未选择隐患项',
  477. icon:"none",
  478. mask:true,
  479. duration: 2000
  480. });
  481. return
  482. }else if(!self.form.checkHazardDtoList[i].hazardDescribe && self.form.checkHazardDtoList[i].voiceRemark.length<=0){
  483. uni.showToast({
  484. title: '请输入第'+num+'项隐患描述!',
  485. icon:"none",
  486. mask:true,
  487. duration: 2000
  488. });
  489. return
  490. }
  491. }
  492. this.submitForm();
  493. }
  494. },
  495. //提交
  496. async submitForm(){
  497. let _this = this;
  498. const {data} = await checkManageAdd(_this.form);
  499. if(data.code == 200){
  500. uni.showToast({
  501. title: '提交成功',
  502. icon:"none",
  503. mask:true,
  504. duration: 2000
  505. });
  506. uni.redirectTo({
  507. url: '/pages/pages_safetyExamine/examineManage/examineList?form='+encodeURIComponent(JSON.stringify(this.form))
  508. });
  509. }
  510. },
  511. }
  512. }
  513. </script>
  514. <style lang="stylus" scoped>
  515. #startChecking{
  516. height:100%;
  517. .info-max-box{
  518. flex: 1;
  519. overflow: scroll;
  520. padding: 20rpx 0rpx 128rpx;
  521. box-sizing: border-box;
  522. }
  523. .list{
  524. .title{
  525. width: 690rpx;
  526. height: 100rpx;
  527. background: #FFFFFF;
  528. border-radius: 20rpx;
  529. margin: 20rpx 30rpx;
  530. font-size: 30rpx;
  531. font-family: PingFang SC-Medium, PingFang SC;
  532. font-weight: 400;
  533. color: #333333;
  534. line-height: 100rpx;
  535. padding-left: 24rpx;
  536. box-sizing: border-box;
  537. }
  538. .check-for-big-box{
  539. width 690rpx;
  540. //padding-top:30rpx;
  541. margin:0 30rpx 20rpx;
  542. background #fff
  543. border-radius:20rpx;
  544. overflow hidden
  545. position relative;
  546. padding:30rpx;
  547. box-sizing border-box;
  548. /* 隐患等级 */
  549. .grade{
  550. display: flex;
  551. justify-content: flex-start;
  552. .grade_l{
  553. width: 158rpx;
  554. text-align: left;
  555. font-size: 30rpx;
  556. font-family: PingFang SC-Medium, PingFang SC;
  557. font-weight: 400;
  558. color: #333333;
  559. line-height: 80rpx;
  560. }
  561. .grade_r{
  562. width: 480rpx;
  563. height: 80rpx;
  564. border-radius: 10rpx;
  565. border: 1rpx solid #E0E0E0;
  566. display: flex;
  567. justify-content: flex-start;
  568. align-items: center;
  569. padding-left: 20rpx;
  570. box-sizing: border-box;
  571. >view{
  572. flex:1;
  573. line-height:80rpx;
  574. font-size: 30rpx;
  575. font-family: PingFang SC-Medium, PingFang SC;
  576. font-weight: 400;
  577. color: #333333;
  578. line-height: 80rpx;
  579. }
  580. >img{
  581. width: 14rpx;
  582. height: 8rpx;
  583. margin-right: 30rpx;
  584. }
  585. }
  586. }
  587. /* 检查项目 */
  588. .project{
  589. .project_l{
  590. width: 158rpx;
  591. text-align: left;
  592. font-size: 30rpx;
  593. font-family: PingFang SC-Medium, PingFang SC;
  594. font-weight: 400;
  595. color: #333333;
  596. line-height: 80rpx;
  597. margin-top: 24rpx;
  598. }
  599. .project_r{
  600. width: 630rpx;
  601. height: 80rpx;
  602. border-radius: 10rpx;
  603. border: 1rpx solid #E0E0E0;
  604. display: flex;
  605. justify-content: flex-start;
  606. align-items: center;
  607. padding-left: 20rpx;
  608. box-sizing: border-box;
  609. }
  610. }
  611. /* 检查要点 */
  612. .point{
  613. .point_l{
  614. width: 158rpx;
  615. text-align: left;
  616. font-size: 30rpx;
  617. font-family: PingFang SC-Medium, PingFang SC;
  618. font-weight: 400;
  619. color: #333333;
  620. line-height: 80rpx;
  621. }
  622. .point_r{
  623. width: 630rpx;
  624. height: 158rpx;
  625. border-radius: 20rpx 20rpx 20rpx 20rpx;
  626. opacity: 1;
  627. border: 1rpx solid #E0E0E0;
  628. padding: 20rpx 14rpx;
  629. box-sizing: border-box;
  630. font-size: 30rpx;
  631. font-family: PingFang SC-Medium, PingFang SC;
  632. font-weight: 400;
  633. color: #333333;
  634. line-height: 34rpx;
  635. }
  636. }
  637. /* 隐患描述 */
  638. .check-for-input-max-box{
  639. .left-title-p{
  640. width:150rpx;
  641. line-height:80rpx;
  642. text-align right
  643. font-size:30rpx;
  644. }
  645. textarea{
  646. width: 630rpx;
  647. height: 158rpx;
  648. border-radius: 20rpx 20rpx 20rpx 20rpx;
  649. border: 1rpx solid #E0E0E0;
  650. padding: 20rpx 14rpx;
  651. box-sizing: border-box;
  652. font-size: 30rpx;
  653. font-family: PingFang SC-Medium, PingFang SC;
  654. font-weight: 400;
  655. color: #333333;
  656. line-height: 34rpx;
  657. }
  658. }
  659. /* 隐患照片 */
  660. .check-for-img-max-box{
  661. .left-title-p{
  662. width: 100%;
  663. text-align: left;
  664. font-size: 30rpx;
  665. font-family: PingFang SC-Medium, PingFang SC;
  666. font-weight: 400;
  667. color: #333333;
  668. line-height: 80rpx;
  669. }
  670. .right-img-box{
  671. .img-box{
  672. display inline-block;
  673. height:200rpx;
  674. width:200rpx;
  675. position relative
  676. margin:0 14rpx 20rpx 0;
  677. border-radius 10rpx;
  678. overflow hidden;
  679. .img-data{
  680. height:200rpx;
  681. width:200rpx;
  682. }
  683. .position-img{
  684. position absolute
  685. right:0;
  686. top:0;
  687. width:36rpx;
  688. height:36rpx;
  689. }
  690. }
  691. .img-box:nth-of-type(3n+3){
  692. margin-right: 0rpx;
  693. }
  694. .add-button{
  695. margin:0 20rpx 20rpx 0;
  696. border-radius 10rpx;
  697. overflow hidden;
  698. display inline-block
  699. height:200rpx;
  700. width:200rpx;
  701. }
  702. }
  703. }
  704. /* 语音备注 */
  705. .voice{
  706. .voice_t{
  707. height: 80rpx;
  708. display: flex;
  709. justify-content: space-between;
  710. align-items: center;
  711. .voice_t_l{
  712. font-size: 30rpx;
  713. font-family: PingFang SC-Medium, PingFang SC;
  714. font-weight: 400;
  715. color: #333333;
  716. line-height: 80rpx;
  717. }
  718. .voice_t_r{
  719. width: 170rpx;
  720. height: 50rpx;
  721. }
  722. }
  723. .voice_b{
  724. display flex;
  725. justify-content flex-start;
  726. align-items center;
  727. margin-bottom :30rpx;
  728. .voice_b_l{
  729. width: 400rpx;
  730. height: 40rpx;
  731. background:rgba(88,175,255,0.3);
  732. border-radius: 10rpx;
  733. display flex;
  734. justify-content flex-start;
  735. align-items center;
  736. >img{
  737. width: 18rpx;
  738. height: 24rpx;
  739. margin-left:16rpx;
  740. margin-right :20rpx;
  741. }
  742. }
  743. .voice_b_r{
  744. width: 28rpx;
  745. height: 28rpx;
  746. margin-left:20rpx;
  747. }
  748. }
  749. }
  750. .check-for-button-max-box{
  751. display flex
  752. margin-top:30rpx;
  753. margin-bottom:20rpx;
  754. .left-title-p{
  755. width:150rpx;
  756. line-height:88rpx;
  757. text-align right
  758. font-size:30rpx;
  759. }
  760. .button-text-p{
  761. border:1rpx solid #E0E0E0;
  762. width:440rpx;
  763. height:80rpx;
  764. border-radius:10rpx;
  765. line-height :80rpx;
  766. color: #A2A2A2
  767. padding:0 20rpx;
  768. font-size:28rpx;
  769. display:block;
  770. overflow:hidden;
  771. text-overflow:ellipsis;
  772. white-space:nowrap;
  773. }
  774. }
  775. .check-for-big-box-position-img-box{
  776. position absolute
  777. top:0;
  778. right:0;
  779. width:60rpx;
  780. height:60rpx;
  781. img{
  782. width:36rpx;
  783. height:36rpx;
  784. margin:12rpx;
  785. }
  786. }
  787. }
  788. /* 添加隐患项 */
  789. .add-for-item-p{
  790. width:690rpx;
  791. height:100rpx;
  792. border:4rpx dashed #0183FA;
  793. font-size: 30rpx;
  794. font-family: PingFang SC-Medium, PingFang SC;
  795. font-weight: 400;
  796. color: #0183FA;
  797. line-height: 100rpx;
  798. text-align center;
  799. border-radius:20rpx;
  800. margin:40rpx auto 100rpx;
  801. }
  802. }
  803. .bottom_btn{
  804. width: 690rpx;
  805. height: 90rpx;
  806. background: #0183FA;
  807. border-radius: 10rpx 10rpx 10rpx 10rpx;
  808. display: flex;
  809. justify-content: flex-start;
  810. position: fixed;
  811. left: 30rpx;
  812. bottom: 20rpx;
  813. .bottom_btn_li{
  814. flex: 1;
  815. font-size: 30rpx;
  816. font-family: PingFang SC-Medium, PingFang SC;
  817. font-weight: 400;
  818. color: #FFFFFF;
  819. line-height: 90rpx;
  820. text-align: center;
  821. position: relative;
  822. }
  823. .bottom_btn_li::after{
  824. content:'';
  825. position: absolute;
  826. top: 20rpx;
  827. right:0rpx;
  828. width: 1rpx;
  829. height: 60rpx;
  830. background: #D8D8D8;
  831. }
  832. .bottom_btn_li:nth-of-type(3)::after{
  833. display: none;
  834. }
  835. }
  836. }
  837. </style>