examineAddTow.vue 27 KB

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