manageWorkbench.vue 27 KB

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