dangerList.vue 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541
  1. <!-- 安全检查-安全隐患 -->
  2. <template>
  3. <view class="examine">
  4. <view class="header">
  5. <view class="tabTitle_tow">
  6. <view class="tabTitle_tow_li" @tap="tabClickTow(index)" :key="index" v-for="(item,index) in tabTextTow">
  7. <view :class="{on:curTabTow==index}" class="tabTitle_tow_text">{{item}}</view>
  8. <view :class="{on:curTabTow==index}" class="tabTitle_tow_across"></view>
  9. </view>
  10. </view>
  11. <view class="lab_title">
  12. <picker @change="collegeChange" :value="collegeIndex" :range="collegeArray" class="lab_title_l">
  13. <view class="lab_title_l_n">
  14. <view>{{getData.deptName?getData.deptName:'选择学院'}}</view>
  15. <img src="@/pages_safetyExamine/images/icon_06.png">
  16. </view>
  17. </picker>
  18. <view class="lab_title_r">
  19. <input type="text" v-model="getData.searchValue" placeholder="请输入实验室名称" name="search" @confirm='searchBtn' confirm-type='search' maxlength="50" placeholder-style="color: #CCCCCC;font-size:26rpx;">
  20. <view v-if="getData.searchValue>0" class="lab_title_r_btn" @click="clearBtn">
  21. <img src="@/pages_safetyExamine/images/clear.png"/>
  22. </view>
  23. </view>
  24. </view>
  25. </view>
  26. <scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
  27. <view class="list_three">
  28. <view class="list_three_li" v-for="(item,index) in dataList" :key="index" @click="handleClick(item,'detail')">
  29. <view class="list_three_li_t">
  30. <view class="list_three_li_t_l">
  31. <img v-if="item.checkRange==1" src="@/pages_safetyExamine/images/icon_xyxc_qx.png"/>
  32. <img v-if="item.checkRange==2" src="@/pages_safetyExamine/images/icon_xyxc_xy.png"/>
  33. <img v-if="item.checkRange==3" src="@/pages_safetyExamine/images/icon_xyxc_sys.png"/>
  34. <text></text>
  35. </view>
  36. <view class="list_three_li_t_c">{{item.subRoom}}</view>
  37. <view class="list_three_li_t_c2" v-if="item.overdueStatus==1">已逾期</view>
  38. <view class="list_three_li_t_r"></view>
  39. </view>
  40. <view class="list_three_li_m">
  41. <view class="list_three_li_m_t">{{item.title}}</view>
  42. <view class="list_three_li_m_b">
  43. <text class="green_color" v-if="item.rectifyStatus==1">已完成</text>
  44. <text class="blue_color" v-if="item.rectifyStatus==2">待整改</text>
  45. <text class="orange_color" v-if="item.rectifyStatus==3">待复核</text>
  46. <text class="gray_color" v-if="item.rectifyStatus==4">暂无法整改</text>
  47. <text>{{item.hazardType==1?'校院巡查':'实验室自查'}}-{{item.checkCategory==1?'综合检查':'专项检查'}}</text>
  48. <text>{{item.collegeName}}</text>
  49. </view>
  50. </view>
  51. <view class="list_three_li_b">整改期限:{{item.rectifyDeadline}}</view>
  52. </view>
  53. </view>
  54. <img class="null-img" v-if="!dataList[0]" src="@/images/basicsModules/null-data-1.png">
  55. </scroll-view>
  56. </view>
  57. </template>
  58. <script>
  59. import { config } from '@/api/request/config.js'
  60. import {checkHazardAppList,conditionCollegeInfo} from '@/api/apiDemo/index.js'
  61. export default {
  62. name: "rectifyList",
  63. components: {
  64. },
  65. data() {
  66. return {
  67. pageType:0,
  68. //列表请求参数
  69. getData:{
  70. pageNum:1,
  71. pageSize:20,
  72. hazardType:'1',//1是院校巡查,2是实验室自查
  73. rectifyStatus:'',//1已完成 2待整改 3待复核 4 暂无法整改
  74. searchValue:'',
  75. },
  76. tabTextTow:['全部','待整改','待复核','已完成','暂无法整改'],
  77. curTabTow:0,
  78. form:{
  79. name:'',
  80. type:'校院巡查',
  81. startTime:'',
  82. endTime:'',
  83. inspectScope:[],
  84. tiemQuickList:[],
  85. scopeIndex:'',
  86. seleteListLab:[],
  87. patrolIndex:'',
  88. seleteListMember:[],
  89. },
  90. collegeList:[{name:'学院名称',type:false},{name:'学院名称',type:false},{name:'学院名称',type:false},{name:'学院名称',type:false},{name:'学院名称',type:false},{name:'学院名称',type:false},],
  91. collegeIndex :0,
  92. collegeArray:[],
  93. dataList:[],
  94. }
  95. },
  96. onLoad(option) {
  97. if(option.form){
  98. this.form=JSON.parse(decodeURIComponent(option.form));
  99. }
  100. if(option.pageType==1){
  101. uni.setNavigationBarTitle({
  102. title:'校院巡查隐患'
  103. })
  104. this.getData.hazardType=option.pageType;
  105. }else if(option.pageType==2){
  106. uni.setNavigationBarTitle({
  107. title:'实验室自查隐患'
  108. })
  109. this.getData.hazardType=option.pageType;
  110. }
  111. },
  112. onShow() {
  113. },
  114. mounted(){
  115. this.dataList=[];
  116. this.getList();
  117. this.conditionCollegeInfo();
  118. },
  119. methods: {
  120. //顶部tab点击
  121. tabClickTow(index) {
  122. this.curTabTow = index;
  123. this.getData.pageNum=1;
  124. this.getData.searchValue='';
  125. this.getData.deptId='';
  126. this.getData.deptName='';
  127. this.dataList=[];
  128. if(index==0){
  129. this.getData.rectifyStatus='';
  130. }else if(index==1){//待整改
  131. this.getData.rectifyStatus=2;
  132. }else if(index==2){//待复核
  133. this.getData.rectifyStatus=3;
  134. }else if(index==3){//已完成
  135. this.getData.rectifyStatus=1;
  136. }else if(index==4){//暂无法整改
  137. this.getData.rectifyStatus=4;
  138. }
  139. this.getList()
  140. },
  141. //选择学院
  142. collegeChange(e){
  143. this.collegeIndex = e.target.value;
  144. this.getData.deptId=this.collegeList[e.target.value].deptId
  145. this.getData.deptName=this.collegeList[e.target.value].deptName
  146. this.dataList=[];
  147. this.getList();
  148. },
  149. //实验室搜索
  150. searchBtn(){
  151. this.dataList=[];
  152. this.getList();
  153. },
  154. //清除
  155. clearBtn(){
  156. this.getData.pageNum=1;
  157. this.collegeIndex=0;
  158. this.getData.deptId='';
  159. this.getData.deptName='';
  160. this.getData.searchValue='';
  161. this.dataList=[];
  162. this.getList();
  163. },
  164. //滚动事件
  165. scrollGet(){
  166. let self=this;
  167. if(self.total/self.getData.pageSize<=self.getData.pageNum){
  168. console.log('没有更多数据!')
  169. }else{
  170. setTimeout(function(){
  171. self.getData.pageNum += 1;
  172. self.getList();
  173. },1000)
  174. }
  175. },
  176. //查询学院列表
  177. async conditionCollegeInfo(){
  178. let _this = this;
  179. const {data} = await conditionCollegeInfo();
  180. if(data.code == 200){
  181. data.data.forEach(function(item){
  182. item.type=false;
  183. })
  184. _this.collegeList=data.data;
  185. //检查管理
  186. for(let i=0;i<data.data.length;i++){
  187. _this.collegeArray.push(data.data[i].deptName)
  188. }
  189. }
  190. },
  191. handleClick(row,doType){
  192. let self=this;
  193. if( doType=='subBtn'){//
  194. }else if(doType=='detail'){//详情
  195. uni.redirectTo({
  196. url: '/pages_safetyExamine/dangerManage/dangerDetail?item='+encodeURIComponent(JSON.stringify(row))
  197. })
  198. }
  199. },
  200. async getList(){
  201. let self = this;
  202. const {data} = await checkHazardAppList(this.getData);
  203. if(data.code==200){
  204. this.dataList=[...this.dataList,...data.data.records]
  205. this.total=data.data.total;
  206. }
  207. },
  208. }
  209. }
  210. </script>
  211. <style lang="stylus" scoped>
  212. .examine{
  213. height:100%;
  214. display flex;
  215. // padding: 0 30rpx;
  216. // box-sizing: border-box;
  217. padding-bottom: 20rpx;
  218. box-sizing: border-box;
  219. .blue_color{
  220. color: #0183FA;
  221. border: 1rpx solid #0183FA;
  222. }
  223. .red_color{
  224. color: #FF4545;
  225. border: 1rpx solid #FF4545;
  226. }
  227. .green_color{
  228. color: #1FA50D;
  229. border: 1rpx solid #1FA50D;
  230. }
  231. .orange_color{
  232. color: #FA8E1B;
  233. border: 1rpx solid #FA8E1B;
  234. }
  235. .gray_color{
  236. color: #A2A2A2;
  237. border: 1rpx solid #A2A2A2;
  238. }
  239. .null-img{
  240. display block
  241. width:276rpx;
  242. height:321rpx;
  243. margin:100rpx 0 0 274rpx;
  244. }
  245. .info-max-box{
  246. flex: 1;
  247. overflow: scroll;
  248. padding: 220rpx 0rpx 0;
  249. box-sizing: border-box;
  250. }
  251. /* 切换按钮 */
  252. .header{
  253. width:100%;
  254. position: fixed;
  255. top: 0rpx;
  256. z-index: 100;
  257. .tabTitle_tow{
  258. width:100%;
  259. height: 100rpx;
  260. background: #fff;
  261. display flex;
  262. justify-content: flex-start;
  263. align-items: center;
  264. border-bottom: 1rpx solid #E0E0E0;
  265. .tabTitle_tow_li{
  266. position: relative;
  267. width:152rpx;
  268. text-align center;
  269. .tabTitle_tow_text{
  270. display: inline-block;
  271. font-size: 30rpx;
  272. font-family: PingFang SC;
  273. font-weight: 500;
  274. color: #333333;
  275. line-height: 46rpx;
  276. position: relative;
  277. &.on{
  278. color:#0183FA;
  279. }
  280. }
  281. .tabTitle_tow_across{
  282. width: 50rpx;
  283. height: 4rpx;
  284. background: #0183FA;
  285. border-radius: 2rpx;
  286. margin-left: 50rpx;
  287. display none;
  288. &.on{
  289. display block;
  290. }
  291. }
  292. }
  293. }
  294. .lab_title{
  295. width: 750rpx;
  296. height: 100rpx;
  297. background: #FFFFFF;
  298. padding: 20rpx 30rpx;
  299. box-sizing: border-box;
  300. display: flex;
  301. justify-content: flex-start;
  302. .lab_title_l{
  303. width: 250rpx;
  304. height: 60rpx;
  305. margin-right: 20rpx;
  306. .lab_title_l_n{
  307. width: 250rpx;
  308. height: 60rpx;
  309. border-radius: 10rpx;
  310. border: 1rpx solid #E0E0E0;
  311. display: flex;
  312. justify-content: flex-start;
  313. align-items: center;
  314. >view{
  315. flex:1;
  316. line-height:60rpx;
  317. margin-left:20rpx;
  318. color: #999999;
  319. font-size:28rpx;
  320. white-space: nowrap;
  321. overflow: hidden;
  322. text-overflow: ellipsis;
  323. }
  324. >img{
  325. width: 14rpx;
  326. height: 8rpx;
  327. margin-right: 30rpx;
  328. }
  329. }
  330. }
  331. .lab_title_r{
  332. width: 420rpx;
  333. height: 60rpx;
  334. position:relative;
  335. border-radius: 10rpx;
  336. border: 1rpx solid #E0E0E0;
  337. .lab_title_r_btn{
  338. width: 60rpx;
  339. height: 60rpx
  340. position: absolute;
  341. top: 0rpx;
  342. right:0rpx;
  343. z-index: 100;
  344. >img{
  345. width: 20rpx;
  346. height: 20rpx;
  347. position: absolute;
  348. top: 20rpx;
  349. left: 24rpx;
  350. }
  351. }
  352. >input{
  353. width: 274rpx;
  354. height: 60rpx;
  355. position: absolute;
  356. top: 0rpx;
  357. left: 60rpx;
  358. }
  359. .clear{
  360. width: 60rpx;
  361. height: 60rpx;
  362. position: absolute;
  363. top: 0rpx;
  364. right:20rpx;
  365. font-size: 30rpx;
  366. font-family: PingFang SC-Medium, PingFang SC;
  367. font-weight: 400;
  368. color: #0183FA;
  369. line-height: 60rpx;
  370. }
  371. }
  372. }
  373. }
  374. .list_three{
  375. padding: 0 30rpx;
  376. box-sizing: border-box;
  377. .list_three_li{
  378. position: relative;
  379. width: 690rpx;
  380. height: 320rpx;
  381. background: #fff;
  382. border-radius: 10rpx;
  383. overflow: hidden;
  384. margin-bottom: 20rpx;
  385. .list_three_li_t{
  386. width: 100%;
  387. position: absolute;
  388. left: 0;
  389. top: 0;
  390. .list_three_li_t_l{
  391. >img{
  392. width: 70rpx;
  393. height: 70rpx;
  394. }
  395. >text{
  396. position: absolute;
  397. left: -15rpx;
  398. top: 76rpx;
  399. display: inline-block;
  400. width: 30rpx;
  401. height: 30rpx;
  402. background: #F5F5F5;
  403. border-radius: 15rpx;
  404. }
  405. }
  406. .list_three_li_t_c{
  407. width: 580rpx;
  408. height: 110rpx;
  409. position: absolute;
  410. left: 30rpx;
  411. top: 0;
  412. font-size: 30rpx;
  413. font-family: PingFang SC-Medium, PingFang SC;
  414. font-weight: 400;
  415. color: #333333;
  416. line-height: 110rpx;
  417. border-bottom: 1rpx dashed #D8D8D8;
  418. overflow: hidden;
  419. text-overflow:ellipsis;
  420. white-space: nowrap;
  421. padding-right: 60rpx;
  422. box-sizing: border-box;
  423. }
  424. .list_three_li_t_c2{
  425. position: absolute;
  426. right: 20rpx;
  427. top: 38rpx;
  428. width: 120rpx;
  429. height: 40rpx;
  430. font-size: 28rpx;
  431. font-family: PingFang SC-Medium, PingFang SC;
  432. font-weight: 400;
  433. color: #FF5757;
  434. line-height: 40rpx;
  435. border: 1rpx solid #FF5757;
  436. border-radius: 6rpx;
  437. text-align: center;
  438. }
  439. .list_three_li_t_r{
  440. position: absolute;
  441. right:-15rpx;
  442. top: 76rpx;
  443. width: 30rpx;
  444. height: 30rpx;
  445. background:#F5F5F5;
  446. border-radius: 15rpx;
  447. }
  448. }
  449. .list_three_li_m{
  450. position: absolute;
  451. top: 110rpx;
  452. left: 0;
  453. width: 690rpx;
  454. height: 158rpx;
  455. padding-left: 30rpx;
  456. box-sizing: border-box;
  457. .list_three_li_m_t{
  458. font-size: 28rpx;
  459. font-family: PingFang SC-Medium, PingFang SC;
  460. font-weight: 400;
  461. color: #666666;
  462. line-height: 40rpx;
  463. margin-top:22rpx;
  464. overflow: hidden;
  465. text-overflow:ellipsis;
  466. white-space: nowrap;
  467. }
  468. .list_three_li_m_b{
  469. margin-top:26rpx;
  470. >text:nth-of-type(1){
  471. font-size: 26rpx;
  472. font-family: PingFang SC-Medium, PingFang SC;
  473. font-weight: 400;
  474. line-height: 40rpx;
  475. border-radius: 6rpx;
  476. padding: 0 20rpx;
  477. margin-right: 14rpx;
  478. }
  479. >text:nth-of-type(2){
  480. font-size: 26rpx;
  481. font-family: PingFang SC-Medium, PingFang SC;
  482. font-weight: 400;
  483. color: #0183FA;
  484. line-height: 40rpx;
  485. padding: 0 8rpx;
  486. border-radius: 6rpx;
  487. background: rgba(1,131,250,0.1);
  488. margin-right: 24rpx;
  489. }
  490. >text:nth-of-type(3){
  491. display: inline-block;
  492. width: 180rpx;
  493. font-size: 26rpx;
  494. font-family: PingFang SC-Medium, PingFang SC;
  495. font-weight: 400;
  496. color: #333333;
  497. line-height: 26rpx;
  498. overflow: hidden;
  499. text-overflow:ellipsis;
  500. white-space: nowrap;
  501. }
  502. }
  503. }
  504. .list_three_li_b{
  505. height: 60rpx;
  506. width: 100%;
  507. position: absolute;
  508. top: 258rpx;
  509. left: 0;
  510. font-size: 28rpx;
  511. font-family: PingFang SC-Medium, PingFang SC;
  512. font-weight: 400;
  513. color: #666666;
  514. line-height: 60rpx;
  515. padding-left: 28rpx;
  516. box-sizing: border-box;
  517. }
  518. }
  519. }
  520. }
  521. </style>