safetyCardScan.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934
  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. }
  251. uni.navigateTo({
  252. url: '/pages_manage/views/laboratory/videoPlayer?item=' + encodeURIComponent(JSON.stringify(
  253. obj))
  254. });
  255. },
  256. getIotControlData() {
  257. this.$refs['iotControl'].iotAppHardwareFindByType();
  258. },
  259. buttonClick(type, row) {
  260. let self = this;
  261. if (type == 'subDetail') {
  262. //实验室详情
  263. } else if (type == 'broadcastOpen') {
  264. //语音弹窗开启
  265. this.$set(this, 'broadcastPage', true);
  266. } else if (type == 'broadcastClose') {
  267. //语音弹窗关闭
  268. this.$set(this, 'broadcastPage', false);
  269. } else if (type == 'conditioningOpen') {
  270. //空调弹窗开启
  271. this.$set(this, 'airConditioningData', row);
  272. this.$set(this, 'conditioningPage', true);
  273. } else if (type == 'conditioningClose') {
  274. //空调弹窗关闭
  275. this.$set(this, 'conditioningPage', false);
  276. } else if (type == 'back') {
  277. this.$set(this, 'pageType', 2);
  278. }
  279. },
  280. //展开/收起操作
  281. unfoldPackUp(type, index) {
  282. if (type == 'subAdminShowType') {
  283. this.$set(this.newData, 'subAdminShowType', !this.newData.subAdminShowType);
  284. } else if (type == 'adminShowType') {
  285. this.$set(this.newData, 'adminShowType', !this.newData.adminShowType);
  286. } else if (type == 'list') {
  287. this.$set(this.newData.labInfoBrandModels[index], 'showType', !this.newData.labInfoBrandModels[index]
  288. .showType);
  289. }
  290. },
  291. //顶部tab点击
  292. tabClick(index) {
  293. if (this.pageType != index) {
  294. this.$set(this, 'pageType', index);
  295. }
  296. },
  297. goPage(type, status) {
  298. if (!pageRestrictVerify(type)) {
  299. uni.showToast({
  300. title: '没有相关权限,请联系管理员',
  301. icon: "none",
  302. mask: true,
  303. duration: 2000
  304. });
  305. return
  306. } else if (type == 'securityCheck') {
  307. if(status){
  308. this.securityAppCheckPlanScanCode(this.newData.subId,);
  309. }else{
  310. this.$set(this,'securityCheck',false);
  311. }
  312. } else if (type == 'snapshot') {
  313. console.log(111)
  314. console.log(this.newData)
  315. this.$set(this.form, "subId", this.newData.subId)
  316. this.$set(this.form, "subName", this.newData.subName)
  317. this.$set(this.form, "subRoom", this.newData.roomNum)
  318. this.$set(this.form, "deptId", this.newData.deptId)
  319. this.$set(this.form, "deptName", this.newData.deptName)
  320. this.$set(this.form, "buildId", this.newData.buildId)
  321. this.$set(this.form, "buildName", this.newData.buildName)
  322. this.$set(this.form, "floorId", this.newData.floorId)
  323. this.$set(this.form, "floorName", this.newData.floorName)
  324. this.$set(this.form, "typeId", this.newData.typeId)
  325. this.$set(this.form, "classTypeNames", this.newData.typeName)
  326. this.$set(this.form, "levelId", this.newData.levelId)
  327. this.$set(this.form, "classLevelName", this.newData.levelName)
  328. uni.navigateTo({
  329. url: '/pages_safetyCheck/views/snapshotManage/snapshotList?form=' +
  330. encodeURIComponent(JSON.stringify(this.form))
  331. });
  332. }
  333. },
  334. //查询计划
  335. async securityAppCheckPlanScanCode(subId,planSetId) {
  336. let self = this;
  337. let checkCategory = null;
  338. if(uni.getStorageSync('identityData')){
  339. if(uni.getStorageSync('identityData').type=='collegeAdmin'){
  340. checkCategory=2
  341. }else if(uni.getStorageSync('identityData').type=='schoolAdmin'){
  342. checkCategory=1
  343. }
  344. }
  345. let obj = {
  346. subId:subId,
  347. checkCategory:checkCategory,
  348. };
  349. if(planSetId){
  350. obj.planSetId = planSetId;
  351. }
  352. const {
  353. data
  354. } = await securityAppCheckPlanScanCode(obj);
  355. if (data.code == 200) {
  356. if(data.data[0]){
  357. if(data.data[1]){
  358. //多个
  359. self.$set(self,'securityCheckList',data.data);
  360. self.$set(self,'securityCheck',true);
  361. }else{
  362. //单个
  363. let infoData = data.data[0];
  364. infoData.pageType = 0;
  365. uni.navigateTo({
  366. url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' + encodeURIComponent(
  367. JSON.stringify(infoData))
  368. });
  369. }
  370. }else{
  371. //没有
  372. uni.showToast({
  373. title: '该实验室暂无检查计划!',
  374. icon: "none",
  375. mask: true,
  376. duration: 2000
  377. });
  378. }
  379. }
  380. },
  381. batchClickTow(row) {
  382. let infoData = row;
  383. infoData.pageType = 0;
  384. uni.navigateTo({
  385. url: '/pages_safetyCheck/views/itemsManage/hiddenDangerItems?infoData=' + encodeURIComponent(
  386. JSON.stringify(infoData))
  387. });
  388. },
  389. }
  390. }
  391. </script>
  392. <style lang="stylus" scoped>
  393. .safetyCardScan {
  394. height: 100%;
  395. display: flex;
  396. flex-direction: column;
  397. overflow: hidden;
  398. #fontColor-A {
  399. color: #00DEDE;
  400. }
  401. #fontColor-B {
  402. color: #FF8C00;
  403. }
  404. #fontColor-C {
  405. color: #0083FD;
  406. }
  407. .header {
  408. height: 192rpx;
  409. width: 100%;
  410. // position: fixed;
  411. // top: 0rpx;
  412. // z-index: 100;
  413. background: #fff;
  414. .tabTitle {
  415. width: 750rpx;
  416. height: 188rpx;
  417. display flex;
  418. justify-content: flex-start;
  419. align-items: center;
  420. border-bottom: 4rpx solid #F5F5F5;
  421. .tabTitle_li {
  422. height: 188rpx;
  423. flex: 1;
  424. position: relative;
  425. text-align center;
  426. .tabTitle_text {
  427. display: flex;
  428. justify-content: center;
  429. flex-direction: column;
  430. align-items: center;
  431. >img {
  432. width: 80rpx;
  433. height: 80rpx;
  434. margin-top: 20rpx;
  435. }
  436. >view:nth-of-type(1) {
  437. font-size: 30rpx;
  438. color: #333333;
  439. line-height: 42rpx;
  440. text-align: left;
  441. margin-top: 10rpx;
  442. }
  443. >view:nth-of-type(2) {
  444. font-size: 24rpx;
  445. color: #666666;
  446. line-height: 34rpx;
  447. text-align: left;
  448. }
  449. position: relative;
  450. &.on {}
  451. }
  452. .line {
  453. width: 2rpx;
  454. height: 40rpx;
  455. background: #D8D8D8;
  456. position: absolute;
  457. top: 40%;
  458. }
  459. .tabTitle_across {
  460. /* width: 50rpx;
  461. height: 4rpx;
  462. background: #0183FA;
  463. border-radius: 2rpx; */
  464. margin-left: 38%;
  465. margin-top: 12rpx;
  466. display none;
  467. >img {
  468. width: 40rpx;
  469. height: 26rpx;
  470. }
  471. &.on {
  472. display block;
  473. }
  474. }
  475. }
  476. }
  477. }
  478. /* 安全信息牌 */
  479. .safetyCard {
  480. flex:1;
  481. overflow-y: scroll;
  482. padding-bottom: 150rpx;
  483. .lab-info {
  484. background: #FFFFFF;
  485. display: flex;
  486. justify-content: space-between;
  487. .lab-info-l {
  488. width: 80rpx;
  489. height: 80rpx;
  490. background: #0183FA;
  491. border-radius: 10rpx 10rpx 10rpx 10rpx;
  492. margin-left: 30rpx;
  493. margin-top: 30rpx;
  494. }
  495. .lab-info-c {
  496. width: 500rpx;
  497. margin: 24rpx 30rpx 0 20rpx;
  498. .lab-info-c-t {
  499. display: flex;
  500. justify-content: space-between;
  501. .lab-info-c-t-l {
  502. font-size: 30rpx;
  503. color: #333333;
  504. line-height: 42rpx;
  505. text-align: left;
  506. overflow: hidden;
  507. text-overflow: ellipsis;
  508. white-space: nowrap;
  509. }
  510. .lab-info-c-t-r {
  511. display: flex;
  512. justify-content: flex-start;
  513. background: rgba(255, 0, 0, 0.2);
  514. border-radius: 10rpx 10rpx 10rpx 10rpx;
  515. border: 2rpx solid #FF0000;
  516. width: 200rpx;
  517. height: 40rpx;
  518. margin-left: 10rpx;
  519. >text {
  520. display: inline-block;
  521. flex: 1;
  522. text-align: center;
  523. font-size: 24rpx;
  524. color: #FF0000;
  525. line-height: 40rpx;
  526. text-align: center;
  527. overflow: hidden;
  528. text-overflow: ellipsis;
  529. white-space: nowrap;
  530. }
  531. >text:nth-of-type(1) {
  532. border-right: 2rpx solid #FF0000;
  533. }
  534. >text:nth-of-type(2) {}
  535. }
  536. }
  537. .lab-info-c-b {
  538. font-size: 30rpx;
  539. color: #666666;
  540. line-height: 42rpx;
  541. text-align: left;
  542. margin-top: 10rpx;
  543. overflow: hidden;
  544. text-overflow: ellipsis;
  545. white-space: nowrap;
  546. }
  547. }
  548. .lab-info-r {
  549. width: 100rpx;
  550. height: 150rpx;
  551. background: rgba(1, 131, 250, 0.2);
  552. border-radius: 0rpx 0rpx 0rpx 0rpx;
  553. font-size: 28rpx;
  554. color: #0183FA;
  555. line-height: 150rpx;
  556. text-align: center;
  557. }
  558. }
  559. .liability-unit {
  560. width: 750rpx;
  561. height: 80rpx;
  562. background: #FFFFFF;
  563. border-bottom: 1rpx solid #E0E0E0;
  564. padding: 0 30rpx;
  565. box-sizing: border-box;
  566. display: flex;
  567. justify-content: space-between;
  568. margin-top: 14rpx;
  569. >view:nth-of-type(1) {
  570. font-size: 30rpx;
  571. color: #333333;
  572. line-height: 80rpx;
  573. text-align: left;
  574. }
  575. >view:nth-of-type(2) {
  576. font-size: 30rpx;
  577. color: #666666;
  578. line-height: 80rpx;
  579. text-align: left;
  580. }
  581. }
  582. .small-title {
  583. width: 750rpx;
  584. height: 80rpx;
  585. background: #FFFFFF;
  586. border-bottom: 1rpx solid #E0E0E0;
  587. padding: 0 30rpx;
  588. box-sizing: border-box;
  589. display: flex;
  590. justify-content: space-between;
  591. align-items: center;
  592. >view {
  593. font-size: 30rpx;
  594. color: #333333;
  595. line-height: 80rpx;
  596. text-align: left;
  597. }
  598. >img {
  599. width: 24rpx;
  600. height: 12rpx;
  601. }
  602. }
  603. .sub-head {
  604. width: 750rpx;
  605. height: 80rpx;
  606. background: #fff;
  607. padding: 0 30rpx;
  608. box-sizing: border-box;
  609. display: flex;
  610. justify-content: space-between;
  611. align-items: center;
  612. border-bottom: 1rpx solid #E0E0E0;
  613. >view:nth-of-type(1) {
  614. font-family: PingFang SC;
  615. font-weight: 500;
  616. font-size: 30rpx;
  617. color: #666666;
  618. line-height: 30rpx;
  619. }
  620. >view:nth-of-type(2) {
  621. display: flex;
  622. justify-content: flex-end;
  623. align-items: center;
  624. >img {
  625. width: 34rpx;
  626. height: 34rpx;
  627. margin-right: 14rpx;
  628. }
  629. >view {
  630. font-family: PingFang SC;
  631. font-weight: 500;
  632. font-size: 30rpx;
  633. color: #0183FA;
  634. line-height: 30rpx;
  635. }
  636. }
  637. }
  638. .sub-head:last-child {
  639. border-bottom: none;
  640. }
  641. .small-title-new {
  642. width: 750rpx;
  643. height: 80rpx;
  644. background: #FFFFFF;
  645. border-bottom: 1rpx solid #E0E0E0;
  646. padding: 0 30rpx;
  647. box-sizing: border-box;
  648. display: flex;
  649. justify-content: space-between;
  650. align-items: center;
  651. >view {
  652. font-size: 30rpx;
  653. color: #333333;
  654. line-height: 80rpx;
  655. text-align: left;
  656. }
  657. >img {
  658. width: 24rpx;
  659. height: 12rpx;
  660. }
  661. }
  662. .classify {
  663. .small-items-new {
  664. padding-left: 20rpx;
  665. box-sizing: border-box;
  666. background: #fff;
  667. display: flex;
  668. justify-content: flex-start;
  669. padding: 30rpx;
  670. box-sizing: border-box;
  671. border-bottom: 1rpx solid #E0E0E0;
  672. >view:nth-of-type(1) {
  673. color: #999999;
  674. font-weight: 500;
  675. font-size: 28rpx;
  676. margin-right: 12rpx;
  677. line-height: 34rpx;
  678. }
  679. >view:nth-of-type(2) {
  680. display: block;
  681. font-family: PingFang SC;
  682. font-weight: 500;
  683. font-size: 28rpx;
  684. line-height: 34rpx;
  685. color: #999999;
  686. }
  687. }
  688. .logotype-img-new {
  689. padding: 26rpx 0 34rpx 0;
  690. box-sizing: border-box;
  691. background: #fff;
  692. >img {
  693. display: inline-block;
  694. width: 86rpx;
  695. height: 114rpx;
  696. margin-left: 30rpx;
  697. margin-bottom: 20rpx;
  698. }
  699. }
  700. .small-items {
  701. padding-left: 20rpx;
  702. box-sizing: border-box;
  703. background: #fff;
  704. display: flex;
  705. justify-content: flex-start;
  706. padding: 20rpx;
  707. box-sizing: border-box;
  708. >view:nth-of-type(1) {
  709. color: #999999;
  710. font-weight: 500;
  711. font-size: 28rpx;
  712. margin-right: 12rpx;
  713. line-height: 34rpx;
  714. }
  715. >view:nth-of-type(2) {
  716. display: block;
  717. font-family: PingFang SC;
  718. font-weight: 500;
  719. font-size: 28rpx;
  720. line-height: 34rpx;
  721. color: #999999;
  722. }
  723. }
  724. .logotype {
  725. width: 750rpx;
  726. height: 100rpx;
  727. font-family: PingFang SC;
  728. font-weight: 500;
  729. font-size: 32rpx;
  730. color: #333333;
  731. line-height: 100rpx;
  732. padding-left: 20rpx;
  733. box-sizing: border-box;
  734. background: #0183FA;
  735. color: #fff;
  736. }
  737. .logotype-img {
  738. padding: 26rpx 0 34rpx 0;
  739. box-sizing: border-box;
  740. background: #fff;
  741. >img {
  742. display: inline-block;
  743. width: 86rpx;
  744. height: 114rpx;
  745. margin-left: 30rpx;
  746. margin-bottom: 20rpx;
  747. }
  748. }
  749. }
  750. }
  751. .position-button-box {
  752. position: fixed;
  753. bottom: 40rpx;
  754. display: flex;
  755. justify-content: center;
  756. >img {
  757. width: 160rpx;
  758. height: 160rpx;
  759. }
  760. .position-button-p-1 {
  761. margin-left: 174rpx;
  762. margin-right: 120rpx;
  763. }
  764. .position-button-p-2 {}
  765. }
  766. .shade-box {
  767. height: 100%;
  768. width: 100%;
  769. position: fixed;
  770. display: flex;
  771. flex-direction: column;
  772. z-index: 200;
  773. background: rgba(0, 0, 0, 0.2);
  774. top: 0;
  775. .null-box {
  776. flex: 1;
  777. }
  778. .shade_n {
  779. position: absolute;
  780. bottom: 0;
  781. left: 0;
  782. width: 750rpx;
  783. height: 466rpx;
  784. background: #FFFFFF;
  785. border-radius: 20rpx 20rpx 0rpx 0rpx;
  786. overflow-y: auto;
  787. .title {
  788. display: flex;
  789. justify-content: space-between;
  790. align-items: center;
  791. padding: 0 50rpx 0 284rpx;
  792. box-sizing: border-box;
  793. border-bottom: 1rpx solid #E0E0E0;
  794. >view {
  795. font-size: 30rpx;
  796. color: #3D3D3D;
  797. line-height: 90rpx;
  798. text-align: left;
  799. }
  800. >img {
  801. width: 24rpx;
  802. height: 12rpx;
  803. }
  804. }
  805. .batch {
  806. padding: 0 30rpx;
  807. box-sizing: border-box;
  808. .batch-li {
  809. display: flex;
  810. justify-content: space-between;
  811. align-items: center;
  812. border-bottom: 1rpx solid #E0E0E0;
  813. padding: 20rpx 0 16rpx 0rpx;
  814. box-sizing: border-box;
  815. .batch-li-l {
  816. >text:nth-of-type(1) {
  817. display: block;
  818. font-size: 30rpx;
  819. color: #333333;
  820. line-height: 42rpx;
  821. text-align: left;
  822. }
  823. >text:nth-of-type(2) {
  824. display: block;
  825. font-size: 28rpx;
  826. color: #666666;
  827. line-height: 39rpx;
  828. text-align: left;
  829. margin-top: 6rpx;
  830. }
  831. }
  832. .batch-li-r {
  833. font-size: 28rpx;
  834. color: #666666;
  835. line-height: 39rpx;
  836. text-align: left;
  837. display: flex;
  838. justify-content: flex-start;
  839. align-items: center;
  840. >img {
  841. width: 24rpx;
  842. height: 24rpx;
  843. margin-left: 9rpx;
  844. }
  845. }
  846. }
  847. }
  848. }
  849. }
  850. }
  851. </style>