examineAddTow.vue 27 KB

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