safetyCardScan.vue 23 KB

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