manageWorkbench.vue 27 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010
  1. <!-- 管理端工作台 -->
  2. <template>
  3. <view class="manage-workbench">
  4. <!-- <img class="top-big-img" src="@/images/Version2.2/ing_bg_banner.png"> -->
  5. <img class="top-big-img" :src="homepageBanner">
  6. <top-warn></top-warn>
  7. <view class="min-icon-button-box" style="margin-bottom: 0;">
  8. <view @click="goPage('casuallyPat')">
  9. <img src="@/images/Version2.2/icon_sy_ssp.png">
  10. <view>随手拍</view>
  11. </view>
  12. <view @click="goPage('safetyInspect')">
  13. <img src="@/images/Version2.2/icon_sy_aqjc.png">
  14. <view>安全检查</view>
  15. </view>
  16. <!-- <view class="position-button" style="position: relative;" v-if="buttonArray[1]">
  17. <picker @change="buttonChange" :range-key="'name'" :value="id" :range="buttonArray">
  18. <img src="@/images/Version2.2/icon_sy_aqjc.png">
  19. <view>安全检查</view>
  20. <view v-if="userInfo.list>0" style="position: absolute;top:40rpx;right:56rpx;height:15rpx;width:15rpx;border-radius:50%;background: red;"></view>
  21. </picker>
  22. </view>
  23. <view style="position: relative;" @click="goCheckPage" v-if="!buttonArray[1]">
  24. <img src="@/images/Version2.2/icon_sy_aqjc.png">
  25. <view>安全检查</view>
  26. <view v-if="userInfo.list>0" style="position: absolute;top:40rpx;right:56rpx;height:15rpx;width:15rpx;border-radius:50%;background: red;"></view>
  27. </view> -->
  28. <view @click="goPage('photoInspection')">
  29. <img src="@/images/icon_dzt_pzjc.png">
  30. <view>拍照检查</view>
  31. </view>
  32. <view @click="goPage('accessQualification')">
  33. <img src="@/images/Version2.2/icon_sy_zrsq.png">
  34. <view>准入审核</view>
  35. </view>
  36. <view @click="goPage('gas')">
  37. <img src="@/images/Version3.0/icon_sy_qpgl.png">
  38. <view>气瓶管理</view>
  39. </view>
  40. <view @click="goPage('none')">
  41. <img src="@/images/Version3.0/icon_sy_hxp.png">
  42. <view>化学品管理</view>
  43. </view>
  44. <view @click="goPage('none')">
  45. <img src="@/images/Version3.0/icon_sy_tzsb.png">
  46. <view>特种设备</view>
  47. </view>
  48. <view @click="goPage('none')">
  49. <img src="@/images/Version3.0/icon_sy_aqxx.png">
  50. <view>安全档案</view>
  51. </view>
  52. <!-- <view @click="goPage('alarm')">
  53. <img src="@/images/Version2.2/icon_sy_aqbj.png">
  54. <view>安全报警</view>
  55. </view> -->
  56. </view>
  57. <!-- <view class="min-icon-button-box" style="margin-top: 0;"> -->
  58. <!-- <view @click="goPage('emergencyEvacuation')">
  59. <img src="@/images/Version2.3/icon_sy_yjss.png">
  60. <view>应急疏散</view>
  61. </view> -->
  62. <!-- </view> -->
  63. <view class=big-icon-button-box>
  64. <!-- 安全报警 -->
  65. <img src="@/images/Version2.3/button_1.png" @click="goPage('alarm')">
  66. <!-- 应急疏散 -->
  67. <img src="@/images/Version2.3/button_2.png" @click="goPage('emergencyEvacuation')">
  68. </view>
  69. <!-- 分级管控 -->
  70. <view class="grading">
  71. <img class="grading_l" src="@/images/icon_sy_fjgk.png"/>
  72. <view class="grading_c">分级管控</view>
  73. <view class="grading_r" @click="goPage('grading')">{{gradingCount>0?gradingCount+'项工作待完成':''}}<img src="@/images/icon_wdwg_gd.png"/></view>
  74. </view>
  75. <view class="for-title-p" @click="goSecurityAlertList" v-if="alarmList[0]">
  76. <img class="left-img" src="@/images/Version2.2/icon_aqbj.png">
  77. <view class="name-view">安全报警</view>
  78. <view class="num-view">{{securityAlertNum}}</view>
  79. <view class="null-view"></view>
  80. <img class="right-img" src="@/images/icon_04.png">
  81. </view>
  82. <view class="for-max-box-one" v-if="alarmList[0]">
  83. <view class="for-box" v-for="(item,index) in alarmList" :key="index">
  84. <view class="title-box">
  85. <view :style="'border:1rpx solid '+item.subDiyVo.fiedColor+';background:#fff;color:'+item.subDiyVo.fiedColor+';'">{{item.subDiyVo.levelName}}</view>
  86. <view>{{item.subDiyVo.name}}</view>
  87. </view>
  88. <view class="address-box"><span>{{item.subDiyVo.typeName}}</span>{{item.subDiyVo.deptName}}</view>
  89. <view class="address-box-two">
  90. <img src="@/images/icon_14.png">
  91. <view>{{item.subDiyVo.subAddrrStr}}</view>
  92. </view>
  93. <view class="for-img-box">
  94. <view class="for-img-min-box" v-for="(minItem,index) in item.sensorSet" :key="index">
  95. <img src="@/images/icon_15.png">
  96. <view>{{minItem}}</view>
  97. </view>
  98. </view>
  99. <view class="button-view" @click="laboratoryInfo(item)">查看详情</view>
  100. </view>
  101. </view>
  102. <view class="for-title-p" v-if="dataList[0]">
  103. <img class="left-img" src="@/images/Version2.2/icon_sy_wdsys.png">
  104. <view class="name-view">我的实验室</view>
  105. </view>
  106. <view class="for-max-box" v-if="dataList[0]">
  107. <img class="null-img" v-if="!dataList[0]" src="@/images/null-data-1.png">
  108. <view class="for-box" v-for="(item,index) in dataList" :key="index" @click="laboratoryInfoOne(item)">
  109. <view class="title-box">
  110. <view :style="'border:1rpx solid '+item.fiedColor+';background:#fff;color:'+item.fiedColor+';'">{{item.levelName}}</view>
  111. <view>{{item.name}}</view>
  112. <img src="@/images/icon_04.png">
  113. </view>
  114. <view class="address-box"><span>{{item.typeName}}</span>{{item.deptName}}</view>
  115. <view class="address-box-two">
  116. <img src="@/images/icon_14.png">
  117. <view>{{item.subAddrrStr}}</view>
  118. </view>
  119. </view>
  120. </view>
  121. <tab-bar></tab-bar>
  122. </view>
  123. </template>
  124. <script>
  125. import $mqtt from '@/utils/mqtt.min.js';
  126. import { config } from '@/api/request/config.js'
  127. import { appReceivePhotoNote,getApprovalCount,subject_class,getSafeWarnList,laboratoryInfo,laboratoryList,getLoginUserInfo,outSubjectPhoto,gradingControl} from '@/api/index.js'
  128. import { tabBar } from '@/component/tabBar.vue'
  129. import { topWarn } from '@/component/topWarn.vue'
  130. export default {
  131. components: {
  132. tabBar,
  133. topWarn
  134. },
  135. data() {
  136. return {
  137. //随手拍数量
  138. appReceivePhotoNoteNum:0,
  139. //准入数量
  140. passedNum:"",
  141. subject_classData:[],
  142. securityAlertNum:"",
  143. //MQTT请求参数
  144. mtopic:"lab/bigview",
  145. mtopicOne:"lab/function/data",
  146. msg:"",
  147. client:{},
  148. //报警数据
  149. alarmList:[],
  150. //实验室数据
  151. dataList:[],
  152. //用户信息数据(用来决定是否可以跳转检查项)
  153. userInfo:{
  154. isadmin:null,
  155. ischeck:null,
  156. list:null,
  157. },
  158. buttonArray:[],
  159. gradingCount:0,//分级管控未完成总数
  160. homepageBanner:uni.getStorageSync('homepageBanner'),
  161. }
  162. },
  163. created() {
  164. },
  165. mounted(){
  166. this.appReceivePhotoNote();
  167. this.getApprovalCount();
  168. this.subject_class();
  169. this.laboratoryList();
  170. this.getSafeWarnList();
  171. this.getLoginUserInfo();
  172. this.getGrading();
  173. //监听报警信息
  174. getApp().watch(this.getSafeWarnList,'mqttAlarmData');
  175. //监听传感器信息
  176. getApp().watch(this.getMqttSensorData,'mqttSensorData');
  177. },
  178. methods: {
  179. //跳转选择器
  180. buttonChange(e){
  181. /* if(this.buttonArray[e.detail.value].id == 1){
  182. //检查记录
  183. uni.navigateTo({
  184. url: '/pages_manage/workbench/securityCheck/inspectionRecords'
  185. });
  186. }else if(this.buttonArray[e.detail.value].id == 2){
  187. //问题整改
  188. uni.navigateTo({
  189. url: '/pages_manage/workbench/problemRectification/rectifyList'
  190. });
  191. } */
  192. },
  193. //暂无提示
  194. goCheckPage(){
  195. if(this.userInfo.isadmin){
  196. uni.navigateTo({
  197. url: '/pages_manage/workbench/problemRectification/rectifyList'
  198. });
  199. }else if(this.userInfo.ischeck == 1){
  200. uni.navigateTo({
  201. url: '/pages_manage/workbench/securityCheck/inspectionRecords'
  202. });
  203. }else{
  204. uni.showToast({
  205. title: '您没有该权限',
  206. icon:"none",
  207. mask:true,
  208. duration: 2000
  209. });
  210. }
  211. },
  212. //监听传感器信息
  213. getMqttSensorData(val){
  214. console.log("val",val);
  215. let self = this;
  216. // console.log('页面获取的-传感器信息',val)
  217. if(val.subId){
  218. for(let i=0;i<self.dataList.length;i++){
  219. if(self.dataList[i].id == val.subId){
  220. self.$set(self.dataList[i],'sensorFunctionList',val.functionStatuses);
  221. }
  222. }
  223. }
  224. },
  225. //获取分级管控未完成总数
  226. async getGrading(){
  227. let obj = {
  228. }
  229. const {data} = await gradingControl(obj)
  230. if(data.code==200){
  231. this.gradingCount=data.count;
  232. }
  233. },
  234. async getLoginUserInfo(){
  235. const {data} = await getLoginUserInfo();
  236. if(data.code == 200){
  237. this.userInfo = data.data;
  238. let list = [];
  239. if(data.data.isadmin){
  240. //实验室负责人
  241. let obj = {
  242. id:"1",
  243. name:"检查记录",
  244. }
  245. list.push(obj)
  246. }
  247. if(data.data.ischeck == 1){
  248. //检查者
  249. let obj = {
  250. id:"2",
  251. name:"问题整改",
  252. }
  253. list.push(obj)
  254. }
  255. this.$set(this,'buttonArray',list);
  256. }
  257. },
  258. //获取报警信息详情
  259. async laboratoryInfo(item){
  260. const {data} = await laboratoryInfo(item.subDiyVo.id);
  261. if(data.code == 200){
  262. console.log("data",data)
  263. let obj = data.data[0];
  264. obj.subClassVO = item.subDiyVo.subClassVO;
  265. obj.name = item.subDiyVo.name;
  266. obj.subTypeLable = item.subDiyVo.subTypeLable;
  267. obj.deptName = item.subDiyVo.deptName;
  268. obj.subAddrrStr = item.subDiyVo.subAddrrStr;
  269. uni.navigateTo({
  270. url: '/pages_manage/workbench/laboratory/laboratoryInfo?item='+encodeURIComponent(JSON.stringify(obj))+'&deptId='+obj.deptId
  271. });
  272. }
  273. },
  274. //获取实验室详情
  275. async laboratoryInfoOne(item){
  276. const {data} = await laboratoryInfo(item.id);
  277. if(data.code == 200){
  278. let obj = data.data[0];
  279. obj.subClassVO = item.subClassVO;
  280. obj.name = item.name;
  281. obj.subTypeLable = item.subTypeLable;
  282. obj.deptName = item.deptName;
  283. obj.subAddrrStr = item.subAddrrStr;
  284. obj.sensorFunctionList = item.sensorFunctionList;
  285. uni.navigateTo({
  286. url: '/pages_manage/workbench/laboratory/laboratoryInfo?item='+encodeURIComponent(JSON.stringify(obj))+'&deptId='+item.deptId
  287. });
  288. }
  289. },
  290. //获取报警信息列表
  291. async getSafeWarnList(){
  292. let obj = {
  293. pageNum:1,
  294. pageSize:1,
  295. count:0,
  296. groupStatus:1,
  297. };
  298. const {data} = await getSafeWarnList(obj);
  299. if(data.code == 200){
  300. this.alarmList = data.rows;
  301. if(data.rows[0]){
  302. this.securityAlertNum = data.rows[0].todayHappenCount;
  303. }else{
  304. this.securityAlertNum = 0;
  305. }
  306. }
  307. },
  308. //获取实验室列表
  309. async laboratoryList(){
  310. let self = this;
  311. let obj = {
  312. deptId:this.facultyIndex?this.facultyList[this.facultyIndex].deptId:'',
  313. subDept:this.subjectIndex?this.subjectList[this.subjectIndex].dictValue:'',
  314. level:this.levelIndex?this.levelList[this.levelIndex].dictValue:'',
  315. };
  316. const {data} = await laboratoryList(obj);
  317. if(data.code == 200){
  318. for(let o=0;o<data.data.length;o++){
  319. if(data.data[o].labHardwareVOList){
  320. data.data[o].hardwareList = [];
  321. for(let i=0;i<data.data[o].labHardwareVOList.length;i++){
  322. if(data.data[o].labHardwareVOList[i].hardwareTypeEnum.code == 4 &&data.data[o].labHardwareVOList[i].hardwareNUM){
  323. if(data.data[o].hardwareNUM){
  324. data.data[o].hardwareNUM = data.data[o].hardwareNUM + ',' + data.data[o].labHardwareVOList[i].hardwareNUM
  325. }else{
  326. data.data[o].hardwareNUM = data.data[o].labHardwareVOList[i].hardwareNUM
  327. }
  328. }else{
  329. let obj = {
  330. name:"",
  331. type:"",
  332. };
  333. obj.name = data.data[o].labHardwareVOList[i].hardwareTypeEnum.hardwareTypeName
  334. obj.type = data.data[o].labHardwareVOList[i].state.code;
  335. obj.id = data.data[o].labHardwareVOList[i].id;
  336. data.data[o].hardwareList.push(obj);
  337. }
  338. }
  339. }
  340. }
  341. this.dataList = data.data;
  342. let list = [];
  343. let obj = {
  344. type:"lab/function/data",
  345. idList:[],
  346. }
  347. let objOne = {
  348. type:"lab/bigview",
  349. }
  350. for(let i=0;i<self.dataList.length;i++){
  351. let num = 0;
  352. for(let o=0;o<obj.idList.length;o++){
  353. if(obj.idList[o] == self.dataList[i].id){
  354. num++
  355. }
  356. }
  357. if(num == 0){
  358. obj.idList.push(self.dataList[i].id)
  359. }
  360. }
  361. list.push(obj);
  362. list.push(objOne);
  363. list.push({type:"lab/bigview",});
  364. list.push({type:"lab/exit/line",});
  365. getApp().appMqttOn(1,list);
  366. }
  367. },
  368. //获取输入数量
  369. async getApprovalCount(){
  370. const {data} = await getApprovalCount()
  371. if(data.code == 200){
  372. this.passedNum = data.data.passed + '人已获得';
  373. }
  374. },
  375. //获取管理员工作台随手拍数量数据
  376. async appReceivePhotoNote(){
  377. const {data} = await appReceivePhotoNote();
  378. if(data.code == 200){
  379. this.appReceivePhotoNoteNum = data.data.photoCount;
  380. }
  381. },
  382. //获取学科字典
  383. async subject_class(){
  384. const {data} = await subject_class();
  385. if(data.code == 200){
  386. this.subject_classData = data.data;
  387. }
  388. },
  389. //去安全警报
  390. goSecurityAlertList(){
  391. uni.navigateTo({
  392. url: '/pages_manage/workbench/securityAlert/securityAlertList',//安全警报
  393. });
  394. },
  395. //页面跳转
  396. goPage(type){
  397. if(type=='casuallyPat'){
  398. uni.navigateTo({
  399. url: '/pages/casuallyPat',//随手拍
  400. });
  401. }else if(type=='receiveCasuallyPat'){//收到随手拍
  402. uni.navigateTo({
  403. url: '/pages_manage/workbench/receiveCasuallyPat/receiveCasuallyPat',
  404. });
  405. }else if(type=='accessQualification'){//收到随手拍
  406. uni.navigateTo({
  407. url: '/pages_manage/workbench/accessQualification/accessQualification',
  408. });
  409. }else if(type == 'safetyInspect'){//安全检查
  410. uni.navigateTo({
  411. url: '/pages_manage/workbench/securityCheck/safetyInspect',//安全警报
  412. });
  413. }
  414. else if(type == 'alarm'){
  415. uni.navigateTo({
  416. url: '/pages_manage/workbench/securityAlert/securityAlertList',//安全警报
  417. });
  418. }else if(type == 'emergencyEvacuation'){
  419. uni.navigateTo({
  420. url: '/pages/emergencyEvacuationBig',//安全警报
  421. });
  422. }else if(type == 'photoInspection'){
  423. this.outSubjectPhoto();
  424. }else if(type == 'grading'){
  425. uni.navigateTo({
  426. url: '/pages/gradingControl/gradingControl',//分级管控
  427. });
  428. }else if(type == 'gas'){//气瓶管理
  429. uni.navigateTo({
  430. url: '/pages_manage/gasManage/gasManage',
  431. });
  432. }else if(type == 'none'){
  433. uni.showToast({
  434. title: '暂未开放',
  435. icon:"none",
  436. mask:true,
  437. duration: 2000
  438. });
  439. }
  440. },//获取拍照检查配置
  441. async outSubjectPhoto(){
  442. const {data} = await outSubjectPhoto();
  443. if(data.code == 200){
  444. if(data.data == null){
  445. //需要检查(重新填写)
  446. let obj = {
  447. sub:"实验室照片",
  448. subUrl:"",
  449. garbage:"垃圾桶清理后照片",
  450. garbageUrl:"",
  451. dangerous:"使用危险设备照片(选填)",
  452. dangerousUrl:"",
  453. sourceRisk:"危险源设备使用登记本照片(选填)",
  454. sourceRiskUrl:"",
  455. };
  456. uni.navigateTo({
  457. url: '/pages_student/workbench/photoInspection?newData='+encodeURIComponent(JSON.stringify(obj)),
  458. });
  459. }else if(data.data == false){
  460. //不需要检查
  461. uni.showToast({
  462. title: '暂无检查数据',
  463. icon:"none",
  464. mask:true,
  465. duration: 2000
  466. });
  467. }else{
  468. //需要检查(修改内容)
  469. let obj = {
  470. id:data.data.id,
  471. sub:"实验室照片",
  472. subUrl:data.data.subUrl,
  473. garbage:"垃圾桶清理后照片",
  474. garbageUrl:data.data.garbageUrl,
  475. dangerous:"使用危险设备照片(选填)",
  476. dangerousUrl:data.data.dangerousUrl,
  477. sourceRisk:"危险源设备使用登记本照片(选填)",
  478. sourceRiskUrl:data.data.sourceRiskUrl,
  479. };
  480. uni.navigateTo({
  481. url: '/pages_student/workbench/photoInspection?newData='+encodeURIComponent(JSON.stringify(obj)),
  482. });
  483. }
  484. }
  485. },
  486. },
  487. beforeDestroy(){
  488. //断开mqtt连接
  489. getApp().offMQTT();
  490. //删除报警监听
  491. getApp().deleteAlarmWatch();
  492. //删除传感器监听
  493. getApp().deleteSensorWatch();
  494. console.log("beforeDestroy");
  495. }
  496. }
  497. </script>
  498. <style lang="stylus" scoped>
  499. .manage-workbench{
  500. height:100%;
  501. width:100%;
  502. overflow-y:scroll;
  503. .top-big-img{
  504. height:342rpx;
  505. width:750rpx;
  506. }
  507. .min-icon-button-box{
  508. display flex;
  509. justify-content: flex-start;
  510. flex-wrap: wrap;
  511. width:710rpx;
  512. margin:20rpx;
  513. background :#ffffff;
  514. border-radius:20rpx;
  515. padding-bottom: 20rpx;
  516. view{
  517. width: 176rpx;
  518. img{
  519. height:75rpx;
  520. width:75rpx;
  521. margin:30rpx auto 10rpx;
  522. }
  523. view{
  524. text-align center
  525. font-size:24rpx;
  526. }
  527. }
  528. }
  529. .big-icon-button-box{
  530. display flex;
  531. margin:20rpx;
  532. img{
  533. width:350rpx;
  534. height:150rpx;
  535. }
  536. img:nth-child(2){
  537. margin-left:10rpx;
  538. }
  539. }
  540. /* 分级管控 */
  541. .grading{
  542. width :712rpx;
  543. height :80rpx;
  544. background: #FFFFFF;
  545. border-radius: 20rpx;
  546. margin-left:20rpx;
  547. margin-bottom :20rpx;
  548. display:flex;
  549. justify-content :flex-start;
  550. align-items :center;
  551. .grading_l{
  552. width :34rpx;
  553. height :34rpx;
  554. margin-left:16rpx;
  555. }
  556. .grading_c{
  557. font-size: 28rpx;
  558. font-family: PingFang SC;
  559. font-weight: 500;
  560. color: #333333;
  561. margin-left:16rpx;
  562. }
  563. .grading_r{
  564. width :504rpx;
  565. height :80rpx;
  566. font-size: 26rpx;
  567. font-family: PingFang SC;
  568. font-weight: 500;
  569. color: #EE3A3A;
  570. display :flex;
  571. justify-content :flex-end;
  572. align-items: center;
  573. >img{
  574. width: 20rpx;
  575. height: 20rpx;
  576. margin-left :20rpx;
  577. margin-top :8rpx;
  578. }
  579. }
  580. }
  581. .top-max-box{
  582. height:300rpx;
  583. .top-min-box{
  584. display: flex
  585. margin:20rpx;
  586. .left-box{
  587. background #fff
  588. height:130rpx;
  589. width:345rpx;
  590. border-radius: 10px;
  591. display flex
  592. .left-img{
  593. height:80rpx;
  594. width:80rpx;
  595. margin:25rpx 30rpx;
  596. }
  597. view{
  598. line-height:130rpx;
  599. font-size: 28rpx;
  600. color:#333;
  601. flex:1;
  602. }
  603. .right-img{
  604. width:20rpx;
  605. height:20rpx;
  606. margin:55rpx 30rpx 0 0;
  607. }
  608. }
  609. .right-box{
  610. background #fff
  611. height:130rpx;
  612. width:345rpx;
  613. margin-left:20rpx;
  614. border-radius: 10rpx;
  615. display flex
  616. .left-img{
  617. height:80rpx;
  618. width:80rpx;
  619. margin:25rpx 30rpx;
  620. }
  621. .right-min-view{
  622. flex:1;
  623. .right-min-title{
  624. line-height:28rpx;
  625. font-size: 28rpx;
  626. margin-top:32rpx;
  627. color: #333333;
  628. }
  629. .right-bottom-min-box{
  630. display flex
  631. view{
  632. flex:1;
  633. text-align right
  634. margin:25rpx 14rpx 0 0;
  635. font-size: 22rpx;
  636. color: #999999;
  637. line-height: 22rpx;
  638. }
  639. img{
  640. width:20rpx;
  641. height:20rpx;
  642. margin:27rpx 80rpx 0 0;
  643. }
  644. }
  645. }
  646. }
  647. }
  648. .bottom-min-box{
  649. background #fff
  650. height:130rpx;
  651. width:710rpx;
  652. border-radius: 10px;
  653. margin:0 20rpx;
  654. display flex
  655. .left-img{
  656. height:80rpx;
  657. width:80rpx;
  658. margin:25rpx 30rpx;
  659. }
  660. view{
  661. flex:1;
  662. line-height:130rpx;
  663. }
  664. view:nth-child(2){
  665. font-size: 28rpx;
  666. color:#333;
  667. }
  668. view:nth-child(3){
  669. text-align right
  670. font-size: 22rpx;
  671. color:#999;
  672. margin-right:12rpx;
  673. }
  674. .right-img{
  675. width:20rpx;
  676. height:20rpx;
  677. margin:55rpx 30rpx 0 0;
  678. }
  679. }
  680. }
  681. .for-title-p{
  682. border-top-left-radius 20rpx
  683. border-top-right-radius 20rpx
  684. background #fff
  685. padding-left:25rpx;
  686. display flex
  687. margin:0 20rpx;
  688. border-bottom:1rpx solid #e0e0e0;
  689. .left-img{
  690. height:34rpx;
  691. width:34rpx;
  692. margin:22rpx 10rpx 0 0;
  693. }
  694. .name-view{
  695. line-height:77rpx;
  696. font-size:30rpx;
  697. color:#333;
  698. }
  699. .num-view{
  700. width:28rpx;
  701. height:28rpx;
  702. font-size:20rpx;
  703. background:#EE3A3A;
  704. border-radius:50%;
  705. text-align :center;
  706. line-height:24rpx;
  707. color:#fff;
  708. margin:26rpx 0 0 10rpx;
  709. }
  710. .null-view{
  711. flex:1;
  712. }
  713. .right-img{
  714. height:20rpx;
  715. width:10rpx;
  716. margin:28rpx 19rpx 0 0;
  717. }
  718. }
  719. .for-max-box-one{
  720. margin:0 20rpx;
  721. border-bottom-left-radius 20rpx
  722. border-bottom-right-radius 20rpx
  723. .for-box:nth-child(1){
  724. border-top:none;
  725. }
  726. .for-box{
  727. border-top:4rpx solid #dedede;
  728. background #fff
  729. margin-bottom:20rpx;
  730. overflow: hidden
  731. .title-box{
  732. margin:20rpx 20rpx 0;
  733. display flex
  734. view:nth-child(1){
  735. height:40rpx;
  736. line-height:40rpx;
  737. font-size:20rpx;
  738. border-radius:10rpx;
  739. padding:0 20rpx;
  740. color:#fff;
  741. margin-right:20rpx;
  742. }
  743. view:nth-child(2){
  744. line-height:42rpx;
  745. font-size:30rpx;
  746. color:#333;
  747. max-width:600rpx;
  748. flex:1;
  749. }
  750. .colorA{
  751. background:#aa2315;
  752. }
  753. .colorB{
  754. background:#ff9b09;
  755. }
  756. .colorC{
  757. background:#3ea3e9;
  758. }
  759. .colorD{
  760. background:#3ea34c;
  761. }
  762. }
  763. .address-box{
  764. margin:20rpx 20rpx;
  765. font-size:26rpx;
  766. color:#999999;
  767. span{
  768. margin-right:60rpx;
  769. }
  770. }
  771. .address-box-two{
  772. display flex
  773. margin:0 20rpx 20rpx 20rpx;
  774. img{
  775. width:28rpx;
  776. height:30rpx;
  777. margin-right:18rpx;
  778. }
  779. view{
  780. line-height:30rpx;
  781. font-size:24rpx;
  782. color:#999999;
  783. }
  784. }
  785. .for-img-box{
  786. border-top:1rpx solid #e0e0e0;
  787. margin:0 20rpx;
  788. .for-img-min-box{
  789. display flex
  790. img{
  791. width:30rpx;
  792. height:27rpx;
  793. margin-top:24rpx;
  794. margin-right:10rpx;
  795. }
  796. view{
  797. line-height:74rpx;
  798. text-align center
  799. font-size:28rpx;
  800. color:#EE3A3A;
  801. }
  802. }
  803. }
  804. .button-view{
  805. margin:0 20rpx;
  806. border-top:1rpx dashed #e0e0e0;
  807. line-height:90rpx;
  808. text-align :center;
  809. font-size:26rpx;
  810. color:#333;
  811. }
  812. }
  813. .get-null-box{
  814. height:100rpx;
  815. line-height:100rpx;
  816. color:#999;
  817. text-align center
  818. }
  819. }
  820. .for-max-box{
  821. margin:0 20rpx 120rpx;
  822. background: #fff
  823. overflow: hidden
  824. border-bottom-left-radius 20rpx
  825. border-bottom-right-radius 20rpx
  826. .null-img{
  827. display block
  828. width:276rpx;
  829. height:321rpx;
  830. margin:40rpx auto;
  831. }
  832. .for-box:nth-child(1){
  833. border-top:none;
  834. }
  835. .for-box{
  836. border-top:4rpx solid #dedede;
  837. overflow hidden
  838. background #ffffff
  839. margin-bottom:20rpx;
  840. .title-box{
  841. margin:20rpx 20rpx 0;
  842. display flex
  843. view:nth-child(1){
  844. height:40rpx;
  845. line-height:40rpx;
  846. font-size:20rpx;
  847. border-radius:10rpx;
  848. padding:0 20rpx;
  849. color:#fff;
  850. margin-right:20rpx;
  851. }
  852. view:nth-child(2){
  853. line-height:42rpx;
  854. font-size:30rpx;
  855. color:#333;
  856. max-width:600rpx;
  857. flex:1;
  858. }
  859. img{
  860. width:12rpx;
  861. height:20rpx;
  862. margin-top:11rpx;
  863. }
  864. .colorA{
  865. background:#aa2315;
  866. }
  867. .colorB{
  868. background:#ff9b09;
  869. }
  870. .colorC{
  871. background:#3ea3e9;
  872. }
  873. .colorD{
  874. background:#3ea34c;
  875. }
  876. }
  877. .address-box{
  878. margin:20rpx 20rpx;
  879. font-size:26rpx;
  880. color:#999999;
  881. span{
  882. margin-right:60rpx;
  883. }
  884. }
  885. .address-box-two{
  886. display flex
  887. margin:0 20rpx 20rpx 20rpx;
  888. img{
  889. width:28rpx;
  890. height:30rpx;
  891. margin-right:18rpx;
  892. }
  893. view{
  894. line-height:30rpx;
  895. font-size:24rpx;
  896. color:#999999;
  897. }
  898. }
  899. .text-box{
  900. /*border-top:1rpx dashed #e0e0e0;*/
  901. border-top:1rpx solid #E0E0E0;
  902. padding:0 20rpx;
  903. /*
  904. overflow-x:scroll;
  905. overflow-y:hidden;
  906. white-space: nowrap;
  907. */
  908. .min-box{
  909. display inline-block
  910. /*padding:0 30rpx 0 10rpx;*/
  911. width:355rpx;
  912. .min-min-box{
  913. display: flex
  914. img{
  915. width:30rpx;
  916. height:27rpx;
  917. margin-top:24rpx;
  918. margin-right:10rpx;
  919. }
  920. view{
  921. line-height:74rpx;
  922. text-align center
  923. font-size:28rpx;
  924. color:#333;
  925. }
  926. .colorA{
  927. color:#EE3A3A;
  928. }
  929. }
  930. }
  931. }
  932. .sensor-max-box{
  933. margin:0 20rpx;
  934. border-top:1rpx solid #e0e0e0;
  935. border-bottom:1rpx solid #e0e0e0;
  936. display flex
  937. .for-sensor-box{
  938. flex:1;
  939. display flex
  940. font-size:28rpx;
  941. line-height:94rpx;
  942. view{
  943. margin-left:20rpx;
  944. font-size:25rpx;
  945. line-height:94rpx;
  946. color:#0183FA;
  947. }
  948. }
  949. }
  950. .button-max-box{
  951. .button-box{
  952. display flex
  953. view:nth-child(1){
  954. flex:1;
  955. line-height:90rpx;
  956. color:#333333;
  957. margin-left:30rpx;
  958. font-size:28rpx;
  959. }
  960. view:nth-child(2){
  961. width:142rpx;
  962. line-height:42rpx;
  963. border:4rpx solid #0183FA;
  964. border-radius:25rpx;
  965. color: #0183FA;
  966. font-size: 30rpx;
  967. text-align center;
  968. margin:20rpx 20rpx 20rpx 0;
  969. }
  970. }
  971. .for-button-box{
  972. display flex
  973. view{
  974. flex:1;
  975. line-height:90rpx;
  976. color:#333333;
  977. margin-left:30rpx;
  978. font-size:28rpx;
  979. }
  980. img{
  981. height:50rpx;
  982. width:100rpx;
  983. margin:20rpx 20rpx 20rpx 0;
  984. }
  985. view:nth-child(2){
  986. text-align right
  987. color:#999;
  988. margin-right:30rpx;
  989. }
  990. }
  991. }
  992. }
  993. }
  994. }
  995. </style>