manageWorkbench.vue 27 KB

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