patrolPlanAddLab.vue 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336
  1. <!-- 安全检查-发起巡查计划-选择实验室 -->
  2. <template>
  3. <view class="examine">
  4. <scroll-view scroll-y @scrolltolower="scrollGet" class="info-max-box">
  5. <view>
  6. <view class="lab_title">
  7. <picker @change="collegeChange" :value="collegeIndex" :range="collegeArray" class="lab_title_l">
  8. <view class="lab_title_l_n">
  9. <view>{{getData.deptName?getData.deptName:'选择学院'}}</view>
  10. <img src="@/images/Version3.3.3/icon_06.png">
  11. </view>
  12. </picker>
  13. <view class="lab_title_r">
  14. <view class="lab_title_r_btn" @click="searchBtn">
  15. <img src="@/images/Version3.3.3/icon_aqjc_ss.png"/>
  16. </view>
  17. <input type="text" v-model="getData.searchValue" placeholder="请输入实验室名称" maxlength="50" placeholder-style="color: #CCCCCC;font-size:26rpx;">
  18. <view class="clear" @click="clearBtn">清除</view>
  19. </view>
  20. </view>
  21. <view class="list">
  22. <view class="list_li" v-for="(item,index) in dataList" :key="index" @click="labSelete(index)">
  23. <text :class="item.type?'color_B':'color_A'">{{item.subjectName}}-{{item.roomNumber}}</text>
  24. <img v-if="item.type" src="@/images/Version3.3.3/icon_xzwt_xz.png">
  25. </view>
  26. </view>
  27. </view>
  28. </scroll-view>
  29. <view class="bottom_btn" @click="submitForm">保存</view>
  30. </view>
  31. </template>
  32. <script>
  33. import { config } from '@/api/request/config.js'
  34. import {conditionCollegeInfo,conditionSubjectInfo} from '@/api/index.js'
  35. export default {
  36. name: "rectifyList",
  37. components: {
  38. },
  39. data() {
  40. return {
  41. pageType:0,
  42. //列表请求参数
  43. getData:{
  44. pageNum:1,
  45. pageSize:20,
  46. deptId:'',//学院id
  47. deptName:'',
  48. searchValue:'',
  49. selectedSubIds:[],
  50. subIds:[],
  51. },
  52. total:0,
  53. collegeIndex :0,
  54. collegeArray:[],
  55. collegeList:[],
  56. dataList:[],
  57. seleteListLab:[],//临时存储选中的
  58. form:{},
  59. }
  60. },
  61. onLoad(option) {
  62. this.form=JSON.parse(decodeURIComponent(option.form));
  63. if(this.form.seleteListLab.length>0){
  64. this.seleteListLab=this.form.seleteListLab;
  65. }
  66. },
  67. onShow() {
  68. },
  69. mounted(){
  70. this.conditionCollegeInfo();
  71. this.getList();
  72. },
  73. methods: {
  74. //滚动事件
  75. scrollGet(){
  76. let self=this;
  77. if(self.total/self.getData.pageSize<=self.getData.pageNum){
  78. console.log('没有更多数据!')
  79. }else{
  80. setTimeout(function(){
  81. self.getData.pageNum += 1;
  82. self.getList();
  83. },1000)
  84. }
  85. },
  86. //选择学院
  87. collegeChange(e){
  88. this.collegeIndex = e.target.value;
  89. this.getData.deptId=this.collegeList[e.target.value].deptId
  90. this.getData.deptName=this.collegeList[e.target.value].deptName
  91. this.dataList=[];
  92. this.getList();
  93. },
  94. //点击选择实验室
  95. labSelete(index){
  96. this.dataList[index].type = !this.dataList[index].type
  97. if(this.dataList[index].type){//判断是选中还是取消
  98. if(this.seleteListLab.length>0){
  99. if(this.seleteListLab.findIndex((item)=>item.subId===this.dataList[index].subId) ==-1){//等于-1说明数组里没有当前选中元素,可以添加
  100. this.seleteListLab.push(this.dataList[index])
  101. }
  102. }else{
  103. this.seleteListLab.push(this.dataList[index])
  104. }
  105. }else{
  106. this.seleteListLab.splice(this.seleteListLab.indexOf(this.dataList[index]),1);
  107. }
  108. },
  109. //实验室搜索
  110. searchBtn(){
  111. this.dataList=[];
  112. this.getList();
  113. },
  114. //清除
  115. clearBtn(){
  116. this.getData.pageNum=1;
  117. this.collegeIndex=0;
  118. this.getData.deptId='';
  119. this.getData.deptName='';
  120. this.getData.searchValue='';
  121. this.dataList=[];
  122. this.getList();
  123. },
  124. handleClick(doType){
  125. let self=this;
  126. if( doType=='subBtn'){//保存数据
  127. }
  128. },
  129. //实验室-保存
  130. async submitForm(){
  131. let _this = this;
  132. let subIds=[];
  133. this.$set(this.form,'subjectNum', this.seleteListLab.length)
  134. if(this.seleteListLab.length>0){
  135. this.seleteListLab.forEach(function(item){
  136. subIds.push(item.subId)
  137. })
  138. this.$set(this.form,'subId', subIds.join(','))
  139. }
  140. uni.redirectTo({
  141. url: '/pages/pages_safetyExamine/patrolPlan/patrolPlanAdd?form='+encodeURIComponent(JSON.stringify(this.form))
  142. });
  143. },
  144. //查询学院列表
  145. async conditionCollegeInfo(){
  146. let _this = this;
  147. const {data} = await conditionCollegeInfo();
  148. if(data.code == 200){
  149. for(let i=0;i<data.data.length;i++){
  150. _this.collegeArray.push(data.data[i].deptName)
  151. }
  152. _this.collegeList=data.data;
  153. console.log()
  154. }
  155. },
  156. async getList(){
  157. let _this = this;
  158. const {data} = await conditionSubjectInfo(_this.getData);
  159. if(data.code==200){
  160. data.rows.forEach(function(item){
  161. item.type=false;
  162. })
  163. this.dataList=[...this.dataList,...data.rows]
  164. this.total=data.total;
  165. if(this.seleteListLab.length>0){//如果有选中的数据
  166. for(let i=0;i<this.dataList.length;i++){
  167. if(this.seleteListLab.findIndex((item)=>item.id===this.dataList[i].id) !=-1){//不等于-1说明数组里有当前元素,可以改为选中
  168. this.dataList[i].type=true;
  169. }else{
  170. }
  171. }
  172. }
  173. }
  174. }
  175. }
  176. }
  177. </script>
  178. <style lang="stylus" scoped>
  179. .examine{
  180. height:100%;
  181. display flex;
  182. .info-max-box{
  183. flex: 1;
  184. overflow: scroll;
  185. padding: 120rpx 0rpx 30rpx;
  186. box-sizing: border-box;
  187. }
  188. .lab_title{
  189. width: 750rpx;
  190. height: 100rpx;
  191. background: #FFFFFF;
  192. position: fixed;
  193. top: 0;
  194. padding: 10rpx 30rpx;
  195. box-sizing: border-box;
  196. display: flex;
  197. justify-content: flex-start;
  198. .lab_title_l{
  199. width: 250rpx;
  200. height: 80rpx;
  201. margin-right: 20rpx;
  202. .lab_title_l_n{
  203. width: 250rpx;
  204. height: 80rpx;
  205. border-radius: 10rpx;
  206. border: 1rpx solid #E0E0E0;
  207. display: flex;
  208. justify-content: flex-start;
  209. align-items: center;
  210. >view{
  211. flex:1;
  212. line-height:80rpx;
  213. margin-left:20rpx;
  214. color: #999999;
  215. font-size:28rpx;
  216. white-space: nowrap;
  217. overflow: hidden;
  218. text-overflow: ellipsis;
  219. }
  220. >img{
  221. width: 14rpx;
  222. height: 8rpx;
  223. margin-right: 30rpx;
  224. }
  225. }
  226. }
  227. .lab_title_r{
  228. width: 420rpx;
  229. height: 80rpx;
  230. position:relative;
  231. border-radius: 10rpx;
  232. border: 1rpx solid #E0E0E0;
  233. .lab_title_r_btn{
  234. width: 60rpx;
  235. height: 80rpx
  236. position: absolute;
  237. top: 0rpx;
  238. left:0rpx;
  239. >img{
  240. width: 20rpx;
  241. height: 20rpx;
  242. position: absolute;
  243. top: 30rpx;
  244. left: 24rpx;
  245. }
  246. }
  247. >input{
  248. width: 274rpx;
  249. height: 80rpx;
  250. position: absolute;
  251. top: 0rpx;
  252. left: 60rpx;
  253. }
  254. .clear{
  255. width: 60rpx;
  256. height: 80rpx
  257. position: absolute;
  258. top: 0rpx;
  259. right:20rpx;
  260. font-size: 30rpx;
  261. font-family: PingFang SC-Medium, PingFang SC;
  262. font-weight: 400;
  263. color: #0183FA;
  264. line-height: 80rpx;
  265. }
  266. }
  267. }
  268. .list{
  269. background: #FFFFFF;
  270. border-radius: 20rpx 20rpx 0rpx 0rpx;
  271. padding: 0 30rpx;
  272. box-sizing: border-box;
  273. margin: 0 30rpx;
  274. .list_li{
  275. display: flex;
  276. justify-content:space-between;
  277. align-items: center;
  278. height: 80rpx;
  279. border-bottom: 1rpx solid #E0E0E0;
  280. >text{
  281. font-size: 28rpx;
  282. font-family: PingFang SC-Medium, PingFang SC;
  283. font-weight: 400;
  284. line-height: 80rpx;
  285. overflow: hidden;
  286. text-overflow:ellipsis;
  287. white-space: nowrap;
  288. }
  289. >img{
  290. width: 24rpx;
  291. height: 16rpx;
  292. margin-right: 14rpx;
  293. }
  294. }
  295. .list_li:last-child{
  296. border: none;
  297. }
  298. .color_A{
  299. color: #333333;
  300. }
  301. .color_B{
  302. color: #0183FA;
  303. }
  304. }
  305. .bottom_btn{
  306. position: fixed;
  307. bottom: 26rpx;
  308. left: 30rpx;
  309. font-size: 30rpx;
  310. font-family: PingFang SC-Medium, PingFang SC;
  311. font-weight: 400;
  312. color: #FFFFFF;
  313. line-height: 90rpx;
  314. width: 690rpx;
  315. height: 90rpx;
  316. background: #0183FA;
  317. border-radius: 20rpx;
  318. text-align: center;
  319. }
  320. }
  321. </style>