manageWorkbench.vue 26 KB

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