safetyCardScan.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951
  1. <!-- 安全检查扫一扫 实验室详情 -->
  2. <template>
  3. <view class="safetyCardScan">
  4. <view class="header">
  5. <view class="tabTitle">
  6. <view class="tabTitle_li" @tap="tabClick(index)" :key="index" v-for="(item,index) in tabText">
  7. <view class="tabTitle_text">
  8. <img :src="item.img">
  9. <view
  10. :id="pageType==index&&index==0?'fontColor-A':(pageType==1&&index==1?'fontColor-B':(pageType==2&&index==2?'fontColor-C':''))">
  11. {{item.name}}
  12. </view>
  13. </view>
  14. <view :class="{on:pageType==index}" class="tabTitle_across">
  15. <img :src="imagesUrl('commonality/img_xyzc_bg@1x.png')">
  16. </view>
  17. <view class="line"></view>
  18. </view>
  19. </view>
  20. </view>
  21. <view class="safetyCard" v-if="pageType==0">
  22. <view class="lab-info">
  23. <img class="lab-info-l" :src="imagesUrl('commonality/icon_aqjc_shiyanshi.png')">
  24. <view class="lab-info-c">
  25. <view class="lab-info-c-t">
  26. <view class="lab-info-c-t-l">{{newData.subName}}</view>
  27. <view class="lab-info-c-t-r"
  28. :style="'border:1rpx solid '+newData.levelColor+';background:'+newData.levelColorTow+';'">
  29. <text
  30. :style="'border-right:1rpx solid '+newData.levelColor+';color:'+newData.levelColor+';'">{{newData.levelName?newData.levelName:''}}</text>
  31. <text
  32. :style="'color:'+newData.levelColor+';'">{{newData.typeName?newData.typeName:''}}</text>
  33. </view>
  34. </view>
  35. <view class="lab-info-c-b">
  36. {{newData.roomNum?newData.roomNum:'-'}}房间&{{newData.buildName}}
  37. </view>
  38. </view>
  39. <view class="lab-info-r">{{newData.subArea?newData.subArea+'㎡':'未配置'}}</view>
  40. </view>
  41. <view class="liability-unit">
  42. <view>学院单位</view>
  43. <view>{{newData.deptName}}</view>
  44. </view>
  45. <view class="small-title-new" @click="unfoldPackUp('subAdminShowType')">
  46. <view>实验室负责人</view>
  47. <uni-icons :type="newData.subAdminShowType?'up':'down'" size="12" color='#A2A2A2'></uni-icons>
  48. </view>
  49. <view class="sub-head" v-if="newData.subAdminShowType">
  50. <view>{{newData.adminName}}</view>
  51. <view @click="callPhone(newData.adminPhone)">
  52. <img :src="imagesUrl('manage/icon_aqxxp_dh.png')">
  53. <view>{{newData.adminPhone}}</view>
  54. </view>
  55. </view>
  56. <view class="small-title-new" @click="unfoldPackUp('subAdminUserShowType')">
  57. <view>管理员</view>
  58. <uni-icons :type="newData.subAdminUserShowType?'up':'down'" size="12" color='#A2A2A2'></uni-icons>
  59. </view>
  60. <view style="border-bottom: 1rpx solid #E0E0E0;" v-if="newData.subAdminUserShowType">
  61. <view class="sub-head" v-for="(item,index) in newData.adminUserList" :key="index">
  62. <view>{{item.adminUserName}}</view>
  63. <view @click="callPhone(item.adminUserPhone)">
  64. <img :src="imagesUrl('manage/icon_aqxxp_dh.png')" v-if="item.adminUserPhone">
  65. <view>{{item.adminUserPhone?item.adminUserPhone:'--'}}</view>
  66. </view>
  67. </view>
  68. </view>
  69. <view class="small-title-new" @click="unfoldPackUp('adminShowType')">
  70. <view>安全员</view>
  71. <uni-icons :type="newData.adminShowType?'up':'down'" size="12" color='#A2A2A2'></uni-icons>
  72. </view>
  73. <view v-if="newData.adminShowType">
  74. <view class="sub-head" v-for="(item,index) in newData.safeUserList" :key="index">
  75. <view>{{item.safeUserName}}</view>
  76. <view @click="callPhone(item.safeUserPhone)">
  77. <img :src="imagesUrl('manage/icon_aqxxp_dh.png')" v-if="item.safeUserPhone">
  78. <view>{{item.safeUserPhone?item.safeUserPhone:'--'}}</view>
  79. </view>
  80. </view>
  81. </view>
  82. <view class="classify" v-for="(item,index) in newData.labInfoBrandModels" :key="index">
  83. <view v-if="item.privateList.length>0" class="small-title-new" @click="unfoldPackUp('list',index)">
  84. <view>{{item.brandName}}</view>
  85. <uni-icons :type="item.showType?'up':'down'" size="12" color='#A2A2A2'></uni-icons>
  86. </view>
  87. <view v-if="item.privateList.length>0 && item.brandType==1 && !item.isSpecial&&item.showType">
  88. <view class="small-items-new" v-for="(item2,index2) in item.privateList" :key="index2">
  89. <view>{{index2+1}}. </view>
  90. <view>{{item2.infoContent}}</view>
  91. </view>
  92. </view>
  93. <view v-if="item.privateList.length>0 && item.brandType==1 && item.isSpecial&&item.showType">
  94. <view class="small-items-new" v-for="(item2,index2) in item.privateList" :key="index2">
  95. <view></view>
  96. <view>{{item2.infoContent}}</view>
  97. </view>
  98. </view>
  99. <view v-if="item.privateList.length>0 && item.brandType==2&&item.showType">
  100. <view class="logotype-img-new">
  101. <img v-for="(item3,index3) in item.privateList" :key="index3" :src="baseUrl+item3.infoContent">
  102. </view>
  103. </view>
  104. </view>
  105. </view>
  106. <!-- <view class="position-button-box" v-if="pageType == 0">
  107. <img class="position-button-p-1" @click="goPage('securityCheck',true)"
  108. :src="imagesUrl('safetyCheck/icon_aqjc_anquanjiancha.png')">
  109. <img class="position-button-p-2" @click="goPage('snapshot','')"
  110. :src="imagesUrl('safetyCheck/icon_aqjc_suishoupai.png')">
  111. </view> -->
  112. <!-- 物联控制 -->
  113. <iotControl ref="iotControl" v-if="pageType == 1" :subjectData="subjectData"
  114. style="flex:1;display: flex;flex-direction: column;overflow: hidden;"></iotControl>
  115. <!-- 进出记录 -->
  116. <accessRecord v-if="pageType == 2" :subjectData="subjectData"
  117. style="flex:1;display: flex;flex-direction: column;overflow: hidden;"></accessRecord>
  118. <!-- 语音广播弹窗 -->
  119. <voiceBroadcast v-if="broadcastPage" :subjectData="subjectData"></voiceBroadcast>
  120. <!-- 空调弹窗 -->
  121. <airConditioning v-if="conditioningPage" :airConditioningData="airConditioningData"></airConditioning>
  122. <view class="shade-box" v-if="securityCheck">
  123. <view class="null-box" @click="goPage('securityCheck',false)"></view>
  124. <view class="shade_n">
  125. <view class="title">
  126. <view>请选择实验室</view>
  127. </view>
  128. <view class="batch">
  129. <view class="batch-li" @click="batchClickTow(item)" v-for="(item,index) in securityCheckList">
  130. <view class="batch-li-l">
  131. <text>{{item.planTitle}}-{{item.checkName}}</text>
  132. <text>{{item.subName}}{{item.roomNum?'('+item.roomNum+')':''}}</text>
  133. </view>
  134. <view class="batch-li-r">
  135. <img :src="imagesUrl('commonality/icon_wd_gd@1x.png')">
  136. </view>
  137. </view>
  138. </view>
  139. </view>
  140. </view>
  141. </view>
  142. </template>
  143. <script>
  144. import {
  145. pageRestrictVerify
  146. } from '@/utils/index'
  147. import iotControl from '@/pages_manage/views/laboratory/iotControl.vue'
  148. import accessRecord from '@/pages_manage/views/laboratory/accessRecord.vue'
  149. import voiceBroadcast from '@/pages_manage/views/laboratory/voiceBroadcast.vue'
  150. import airConditioning from '@/pages_manage/views/laboratory/airConditioning.vue'
  151. import {
  152. config
  153. } from '@/api/request/config.js'
  154. import {
  155. } from '@/pages/api/index.js'
  156. import {
  157. securityAppCheckPlanScanCode,
  158. } from '@/pages_safetyCheck/api/index.js'
  159. export default {
  160. name: "safetyCardScan",
  161. components: {
  162. iotControl,
  163. accessRecord,
  164. voiceBroadcast,
  165. airConditioning,
  166. },
  167. data() {
  168. return {
  169. baseUrl: config.base_url,
  170. pageType: 1,
  171. tabText: [{
  172. name: '安全信息牌',
  173. img: this.imagesUrl('safetyCheck/icon_sys_aqxxp@1x.png'),
  174. },
  175. {
  176. name: '监测控制',
  177. img: this.imagesUrl('safetyCheck/icon_sys_jckz@1x.png'),
  178. },
  179. {
  180. name: '进出记录',
  181. img: this.imagesUrl('safetyCheck/icon_sys_jcjl@1x.png'),
  182. },
  183. ],
  184. pageType: 0,
  185. newData: {
  186. adminName: '',
  187. adminPhone: '',
  188. safeUserList: [],
  189. labInfoBrandModels: [],
  190. },
  191. subjectData: null,
  192. identityData: uni.getStorageSync('identityData'),
  193. //语音广播弹窗
  194. broadcastPage: false,
  195. //空调弹窗
  196. conditioningPage: false,
  197. // 空调弹窗
  198. airConditioningData: null,
  199. securityCheck: false,
  200. securityCheckList:[],
  201. form: {},
  202. }
  203. },
  204. // 父页面
  205. onReachBottom() {
  206. uni.$emit('onReachBottom') // 设置监听事件
  207. },
  208. onPullDownRefresh() {
  209. uni.$emit('onPullDownRefresh') // 设置监听事件
  210. },
  211. onLoad(option) {
  212. // #ifdef WEB
  213. let newData = JSON.parse(option.infoData);
  214. // #endif
  215. // #ifdef MP-WEIXIN
  216. let newData = JSON.parse(decodeURIComponent(option.infoData));
  217. // #endif
  218. newData.subAdminShowType = true;
  219. newData.adminShowType = true;
  220. newData.subAdminUserShowType = true;
  221. if (newData.labInfoBrandModels) {
  222. for (let i = 0; i < newData.labInfoBrandModels.length; i++) {
  223. newData.labInfoBrandModels[i].showType = true;
  224. }
  225. }
  226. if (newData.levelColor) {
  227. newData.levelColorTow = this.hexToRgb(newData.levelColor, 0.2)
  228. }
  229. this.$nextTick(() => {
  230. this.$set(this, 'newData', newData);
  231. this.$set(this, 'subjectData', newData);
  232. this.$set(this, 'pageType', 0);
  233. })
  234. },
  235. onShow() {
  236. this.$set(this, 'securityCheck', false)
  237. },
  238. mounted() {
  239. },
  240. methods: {
  241. //十六进制颜色值和RGB格式转换
  242. hexToRgb(hex, opacity = 1) {
  243. // 去除#号
  244. var color = hex.replace("#", "");
  245. // 分割成红、绿、蓝三部分的16进制字符串
  246. var red = parseInt(color.substring(0, 2), 16);
  247. var green = parseInt(color.substring(2, 4), 16);
  248. var blue = parseInt(color.substring(4, 6), 16);
  249. return `RGB(${red}, ${green}, ${blue},${opacity})`;
  250. },
  251. //拨打电话
  252. callPhone(tel) {
  253. if(tel){
  254. uni.makePhoneCall({
  255. phoneNumber: tel
  256. })
  257. }
  258. },
  259. goVideoPage() {
  260. console.log('视频')
  261. let obj = {
  262. type: 4,
  263. subId: this.newData.subId,
  264. floorId:this.newData.floorId
  265. }
  266. uni.navigateTo({
  267. url: '/pages_manage/views/laboratory/videoPlayer?item=' + encodeURIComponent(JSON.stringify(
  268. obj))
  269. });
  270. },
  271. getIotControlData() {
  272. this.$refs['iotControl'].iotAppHardwareFindByType();
  273. },
  274. buttonClick(type, row) {
  275. let self = this;
  276. if (type == 'subDetail') {
  277. //实验室详情
  278. } else if (type == 'broadcastOpen') {
  279. //语音弹窗开启
  280. this.$set(this, 'broadcastPage', true);
  281. } else if (type == 'broadcastClose') {
  282. //语音弹窗关闭
  283. this.$set(this, 'broadcastPage', false);
  284. } else if (type == 'conditioningOpen') {
  285. //空调弹窗开启
  286. this.$set(this, 'airConditioningData', row);
  287. this.$set(this, 'conditioningPage', true);
  288. } else if (type == 'conditioningClose') {
  289. //空调弹窗关闭
  290. this.$set(this, 'conditioningPage', false);
  291. } else if (type == 'back') {
  292. this.$set(this, 'pageType', 2);
  293. }
  294. },
  295. //展开/收起操作
  296. unfoldPackUp(type, index) {
  297. if (type == 'subAdminShowType') {
  298. this.$set(this.newData, 'subAdminShowType', !this.newData.subAdminShowType);
  299. } else if (type == 'subAdminUserShowType') {
  300. this.$set(this.newData, 'subAdminUserShowType', !this.newData.subAdminUserShowType);
  301. } else if (type == 'adminShowType') {
  302. this.$set(this.newData, 'adminShowType', !this.newData.adminShowType);
  303. } else if (type == 'list') {
  304. this.$set(this.newData.labInfoBrandModels[index], 'showType', !this.newData.labInfoBrandModels[index]
  305. .showType);
  306. }
  307. },
  308. //顶部tab点击
  309. tabClick(index) {
  310. if (this.pageType != index) {
  311. this.$set(this, 'pageType', index);
  312. }
  313. },
  314. goPage(type, status) {
  315. if (!pageRestrictVerify(type)) {
  316. uni.showToast({
  317. title: '没有相关权限,请联系管理员',
  318. icon: "none",
  319. mask: true,
  320. duration: 2000
  321. });
  322. return
  323. } else if (type == 'securityCheck') {
  324. if(status){
  325. this.securityAppCheckPlanScanCode(this.newData.subId,);
  326. }else{
  327. this.$set(this,'securityCheck',false);
  328. }
  329. } else if (type == 'snapshot') {
  330. console.log(111)
  331. console.log(this.newData)
  332. this.$set(this.form, "subId", this.newData.subId)
  333. this.$set(this.form, "subName", this.newData.subName)
  334. this.$set(this.form, "subRoom", this.newData.roomNum)
  335. this.$set(this.form, "deptId", this.newData.deptId)
  336. this.$set(this.form, "deptName", this.newData.deptName)
  337. this.$set(this.form, "buildId", this.newData.buildId)
  338. this.$set(this.form, "buildName", this.newData.buildName)
  339. this.$set(this.form, "floorId", this.newData.floorId)
  340. this.$set(this.form, "floorName", this.newData.floorName)
  341. this.$set(this.form, "typeId", this.newData.typeId)
  342. this.$set(this.form, "classTypeNames", this.newData.typeName)
  343. this.$set(this.form, "levelId", this.newData.levelId)
  344. this.$set(this.form, "classLevelName", this.newData.levelName)
  345. uni.navigateTo({
  346. url: '/pages_safetyCheck/views/snapshotManage/snapshotList?form=' +
  347. encodeURIComponent(JSON.stringify(this.form))
  348. });
  349. }
  350. },
  351. //查询计划
  352. async securityAppCheckPlanScanCode(subId,planSetId) {
  353. let self = this;
  354. let checkCategory = null;
  355. if(uni.getStorageSync('identityData')){
  356. if(uni.getStorageSync('identityData').type=='collegeAdmin'){
  357. checkCategory=2
  358. }else if(uni.getStorageSync('identityData').type=='schoolAdmin'){
  359. checkCategory=1
  360. }
  361. }
  362. let obj = {
  363. subId:subId,
  364. checkCategory:checkCategory,
  365. };
  366. if(planSetId){
  367. obj.planSetId = planSetId;
  368. }
  369. const {
  370. data
  371. } = await securityAppCheckPlanScanCode(obj);
  372. if (data.code == 200) {
  373. if(data.data[0]){
  374. if(data.data[1]){
  375. //多个
  376. self.$set(self,'securityCheckList',data.data);
  377. self.$set(self,'securityCheck',true);
  378. }else{
  379. //单个
  380. let infoData = data.data[0];
  381. infoData.pageType = 0;
  382. uni.navigateTo({
  383. url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' + encodeURIComponent(
  384. JSON.stringify(infoData))
  385. });
  386. }
  387. }else{
  388. //没有
  389. uni.showToast({
  390. title: '该实验室暂无检查计划!',
  391. icon: "none",
  392. mask: true,
  393. duration: 2000
  394. });
  395. }
  396. }
  397. },
  398. batchClickTow(row) {
  399. let infoData = row;
  400. infoData.pageType = 0;
  401. uni.navigateTo({
  402. url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' + encodeURIComponent(
  403. JSON.stringify(infoData))
  404. });
  405. },
  406. }
  407. }
  408. </script>
  409. <style lang="stylus" scoped>
  410. .safetyCardScan {
  411. height: 100%;
  412. display: flex;
  413. flex-direction: column;
  414. overflow: hidden;
  415. #fontColor-A {
  416. color: #00DEDE;
  417. }
  418. #fontColor-B {
  419. color: #FF8C00;
  420. }
  421. #fontColor-C {
  422. color: #0083FD;
  423. }
  424. .header {
  425. height: 192rpx;
  426. width: 100%;
  427. // position: fixed;
  428. // top: 0rpx;
  429. // z-index: 100;
  430. background: #fff;
  431. .tabTitle {
  432. width: 750rpx;
  433. height: 188rpx;
  434. display flex;
  435. justify-content: flex-start;
  436. align-items: center;
  437. border-bottom: 4rpx solid #F5F5F5;
  438. .tabTitle_li {
  439. height: 188rpx;
  440. flex: 1;
  441. position: relative;
  442. text-align center;
  443. .tabTitle_text {
  444. display: flex;
  445. justify-content: center;
  446. flex-direction: column;
  447. align-items: center;
  448. >img {
  449. width: 80rpx;
  450. height: 80rpx;
  451. margin-top: 20rpx;
  452. }
  453. >view:nth-of-type(1) {
  454. font-size: 30rpx;
  455. color: #333333;
  456. line-height: 42rpx;
  457. text-align: left;
  458. margin-top: 10rpx;
  459. }
  460. >view:nth-of-type(2) {
  461. font-size: 24rpx;
  462. color: #666666;
  463. line-height: 34rpx;
  464. text-align: left;
  465. }
  466. position: relative;
  467. &.on {}
  468. }
  469. .line {
  470. width: 2rpx;
  471. height: 40rpx;
  472. background: #D8D8D8;
  473. position: absolute;
  474. top: 40%;
  475. }
  476. .tabTitle_across {
  477. /* width: 50rpx;
  478. height: 4rpx;
  479. background: #0183FA;
  480. border-radius: 2rpx; */
  481. margin-left: 38%;
  482. margin-top: 12rpx;
  483. display none;
  484. >img {
  485. width: 40rpx;
  486. height: 26rpx;
  487. }
  488. &.on {
  489. display block;
  490. }
  491. }
  492. }
  493. }
  494. }
  495. /* 安全信息牌 */
  496. .safetyCard {
  497. flex:1;
  498. overflow-y: scroll;
  499. padding-bottom: 150rpx;
  500. .lab-info {
  501. background: #FFFFFF;
  502. display: flex;
  503. justify-content: space-between;
  504. .lab-info-l {
  505. width: 80rpx;
  506. height: 80rpx;
  507. background: #0183FA;
  508. border-radius: 10rpx 10rpx 10rpx 10rpx;
  509. margin-left: 30rpx;
  510. margin-top: 30rpx;
  511. }
  512. .lab-info-c {
  513. width: 500rpx;
  514. margin: 24rpx 30rpx 0 20rpx;
  515. .lab-info-c-t {
  516. display: flex;
  517. justify-content: space-between;
  518. .lab-info-c-t-l {
  519. font-size: 30rpx;
  520. color: #333333;
  521. line-height: 42rpx;
  522. text-align: left;
  523. overflow: hidden;
  524. text-overflow: ellipsis;
  525. white-space: nowrap;
  526. }
  527. .lab-info-c-t-r {
  528. display: flex;
  529. justify-content: flex-start;
  530. background: rgba(255, 0, 0, 0.2);
  531. border-radius: 10rpx 10rpx 10rpx 10rpx;
  532. border: 2rpx solid #FF0000;
  533. width: 200rpx;
  534. height: 40rpx;
  535. margin-left: 10rpx;
  536. >text {
  537. display: inline-block;
  538. flex: 1;
  539. text-align: center;
  540. font-size: 24rpx;
  541. color: #FF0000;
  542. line-height: 40rpx;
  543. text-align: center;
  544. overflow: hidden;
  545. text-overflow: ellipsis;
  546. white-space: nowrap;
  547. }
  548. >text:nth-of-type(1) {
  549. border-right: 2rpx solid #FF0000;
  550. }
  551. >text:nth-of-type(2) {}
  552. }
  553. }
  554. .lab-info-c-b {
  555. font-size: 30rpx;
  556. color: #666666;
  557. line-height: 42rpx;
  558. text-align: left;
  559. margin-top: 10rpx;
  560. overflow: hidden;
  561. text-overflow: ellipsis;
  562. white-space: nowrap;
  563. }
  564. }
  565. .lab-info-r {
  566. width: 100rpx;
  567. height: 150rpx;
  568. background: rgba(1, 131, 250, 0.2);
  569. border-radius: 0rpx 0rpx 0rpx 0rpx;
  570. font-size: 28rpx;
  571. color: #0183FA;
  572. line-height: 150rpx;
  573. text-align: center;
  574. }
  575. }
  576. .liability-unit {
  577. width: 750rpx;
  578. height: 80rpx;
  579. background: #FFFFFF;
  580. border-bottom: 1rpx solid #E0E0E0;
  581. padding: 0 30rpx;
  582. box-sizing: border-box;
  583. display: flex;
  584. justify-content: space-between;
  585. margin-top: 14rpx;
  586. >view:nth-of-type(1) {
  587. font-size: 30rpx;
  588. color: #333333;
  589. line-height: 80rpx;
  590. text-align: left;
  591. }
  592. >view:nth-of-type(2) {
  593. font-size: 30rpx;
  594. color: #666666;
  595. line-height: 80rpx;
  596. text-align: left;
  597. }
  598. }
  599. .small-title {
  600. width: 750rpx;
  601. height: 80rpx;
  602. background: #FFFFFF;
  603. border-bottom: 1rpx solid #E0E0E0;
  604. padding: 0 30rpx;
  605. box-sizing: border-box;
  606. display: flex;
  607. justify-content: space-between;
  608. align-items: center;
  609. >view {
  610. font-size: 30rpx;
  611. color: #333333;
  612. line-height: 80rpx;
  613. text-align: left;
  614. }
  615. >img {
  616. width: 24rpx;
  617. height: 12rpx;
  618. }
  619. }
  620. .sub-head {
  621. width: 750rpx;
  622. height: 80rpx;
  623. background: #fff;
  624. padding: 0 30rpx;
  625. box-sizing: border-box;
  626. display: flex;
  627. justify-content: space-between;
  628. align-items: center;
  629. border-bottom: 1rpx solid #E0E0E0;
  630. >view:nth-of-type(1) {
  631. font-family: PingFang SC;
  632. font-weight: 500;
  633. font-size: 30rpx;
  634. color: #666666;
  635. line-height: 30rpx;
  636. }
  637. >view:nth-of-type(2) {
  638. display: flex;
  639. justify-content: flex-end;
  640. align-items: center;
  641. >img {
  642. width: 34rpx;
  643. height: 34rpx;
  644. margin-right: 14rpx;
  645. }
  646. >view {
  647. font-family: PingFang SC;
  648. font-weight: 500;
  649. font-size: 30rpx;
  650. color: #0183FA;
  651. line-height: 30rpx;
  652. }
  653. }
  654. }
  655. .sub-head:last-child {
  656. border-bottom: none;
  657. }
  658. .small-title-new {
  659. width: 750rpx;
  660. height: 80rpx;
  661. background: #FFFFFF;
  662. border-bottom: 1rpx solid #E0E0E0;
  663. padding: 0 30rpx;
  664. box-sizing: border-box;
  665. display: flex;
  666. justify-content: space-between;
  667. align-items: center;
  668. >view {
  669. font-size: 30rpx;
  670. color: #333333;
  671. line-height: 80rpx;
  672. text-align: left;
  673. }
  674. >img {
  675. width: 24rpx;
  676. height: 12rpx;
  677. }
  678. }
  679. .classify {
  680. .small-items-new {
  681. padding-left: 20rpx;
  682. box-sizing: border-box;
  683. background: #fff;
  684. display: flex;
  685. justify-content: flex-start;
  686. padding: 30rpx;
  687. box-sizing: border-box;
  688. border-bottom: 1rpx solid #E0E0E0;
  689. >view:nth-of-type(1) {
  690. color: #999999;
  691. font-weight: 500;
  692. font-size: 28rpx;
  693. margin-right: 12rpx;
  694. line-height: 34rpx;
  695. }
  696. >view:nth-of-type(2) {
  697. display: block;
  698. font-family: PingFang SC;
  699. font-weight: 500;
  700. font-size: 28rpx;
  701. line-height: 34rpx;
  702. color: #999999;
  703. }
  704. }
  705. .logotype-img-new {
  706. padding: 26rpx 0 34rpx 0;
  707. box-sizing: border-box;
  708. background: #fff;
  709. >img {
  710. display: inline-block;
  711. width: 86rpx;
  712. height: 114rpx;
  713. margin-left: 30rpx;
  714. margin-bottom: 20rpx;
  715. }
  716. }
  717. .small-items {
  718. padding-left: 20rpx;
  719. box-sizing: border-box;
  720. background: #fff;
  721. display: flex;
  722. justify-content: flex-start;
  723. padding: 20rpx;
  724. box-sizing: border-box;
  725. >view:nth-of-type(1) {
  726. color: #999999;
  727. font-weight: 500;
  728. font-size: 28rpx;
  729. margin-right: 12rpx;
  730. line-height: 34rpx;
  731. }
  732. >view:nth-of-type(2) {
  733. display: block;
  734. font-family: PingFang SC;
  735. font-weight: 500;
  736. font-size: 28rpx;
  737. line-height: 34rpx;
  738. color: #999999;
  739. }
  740. }
  741. .logotype {
  742. width: 750rpx;
  743. height: 100rpx;
  744. font-family: PingFang SC;
  745. font-weight: 500;
  746. font-size: 32rpx;
  747. color: #333333;
  748. line-height: 100rpx;
  749. padding-left: 20rpx;
  750. box-sizing: border-box;
  751. background: #0183FA;
  752. color: #fff;
  753. }
  754. .logotype-img {
  755. padding: 26rpx 0 34rpx 0;
  756. box-sizing: border-box;
  757. background: #fff;
  758. >img {
  759. display: inline-block;
  760. width: 86rpx;
  761. height: 114rpx;
  762. margin-left: 30rpx;
  763. margin-bottom: 20rpx;
  764. }
  765. }
  766. }
  767. }
  768. .position-button-box {
  769. position: fixed;
  770. bottom: 40rpx;
  771. display: flex;
  772. justify-content: center;
  773. >img {
  774. width: 160rpx;
  775. height: 160rpx;
  776. }
  777. .position-button-p-1 {
  778. margin-left: 174rpx;
  779. margin-right: 120rpx;
  780. }
  781. .position-button-p-2 {}
  782. }
  783. .shade-box {
  784. height: 100%;
  785. width: 100%;
  786. position: fixed;
  787. display: flex;
  788. flex-direction: column;
  789. z-index: 200;
  790. background: rgba(0, 0, 0, 0.2);
  791. top: 0;
  792. .null-box {
  793. flex: 1;
  794. }
  795. .shade_n {
  796. position: absolute;
  797. bottom: 0;
  798. left: 0;
  799. width: 750rpx;
  800. height: 466rpx;
  801. background: #FFFFFF;
  802. border-radius: 20rpx 20rpx 0rpx 0rpx;
  803. overflow-y: auto;
  804. .title {
  805. display: flex;
  806. justify-content: space-between;
  807. align-items: center;
  808. padding: 0 50rpx 0 284rpx;
  809. box-sizing: border-box;
  810. border-bottom: 1rpx solid #E0E0E0;
  811. >view {
  812. font-size: 30rpx;
  813. color: #3D3D3D;
  814. line-height: 90rpx;
  815. text-align: left;
  816. }
  817. >img {
  818. width: 24rpx;
  819. height: 12rpx;
  820. }
  821. }
  822. .batch {
  823. padding: 0 30rpx;
  824. box-sizing: border-box;
  825. .batch-li {
  826. display: flex;
  827. justify-content: space-between;
  828. align-items: center;
  829. border-bottom: 1rpx solid #E0E0E0;
  830. padding: 20rpx 0 16rpx 0rpx;
  831. box-sizing: border-box;
  832. .batch-li-l {
  833. >text:nth-of-type(1) {
  834. display: block;
  835. font-size: 30rpx;
  836. color: #333333;
  837. line-height: 42rpx;
  838. text-align: left;
  839. }
  840. >text:nth-of-type(2) {
  841. display: block;
  842. font-size: 28rpx;
  843. color: #666666;
  844. line-height: 39rpx;
  845. text-align: left;
  846. margin-top: 6rpx;
  847. }
  848. }
  849. .batch-li-r {
  850. font-size: 28rpx;
  851. color: #666666;
  852. line-height: 39rpx;
  853. text-align: left;
  854. display: flex;
  855. justify-content: flex-start;
  856. align-items: center;
  857. >img {
  858. width: 24rpx;
  859. height: 24rpx;
  860. margin-left: 9rpx;
  861. }
  862. }
  863. }
  864. }
  865. }
  866. }
  867. }
  868. </style>