shuju_ui/qs_zhaoshang/pages/work/xminquiry.vue

<template>
	<view class="xmbox navbar">
		<!-- 自定义头部 -->
		<view class="pfixed">
			<uni-nav-bar  left-icon="left" fixed="true" :border='border'   statusBar='true' :rightText="checkPermi(['projectV2:dept:list'])?'历史记录':''" title="项目分派" rightWidth='180rpx' @clickRight="clickRight" @clickLeft='getBack'/>
			
			<view class=" topfixed">
				<view class="flexcc flex1" :class="tabidx==0?'act':''" @click="getTab(0)"><view class="tab f16 c6 flexc">要素部门</view></view>
				<view class="flexcc flex1" :class="tabidx==1?'act':''" @click="getTab(1)"><view class="tab f16 c6 flexc">承接地</view></view>
				<view class="flexcc flex1" :class="tabidx==2?'act':''" @click="getTab(2)"><view class="tab f16 c6 flexc">招商引荐单位</view></view>
			</view>
		</view>
		<!-- 站位的 -->
		<uni-nav-bar  left-icon="left" :border='border'   statusBar='true' />
		<view class='zhanline'></view>
		<!-- 要素部门 -->
		<view class="xmmain" v-show="tabidx==0">
			<uni-data-checkbox :wrap='true'   :map="map"   selectedTextColor='#343434' multiple v-model="cityvalue" :localdata="cityrange" @change="checkboxChangecity"></uni-data-checkbox>
		</view>
		<!-- 承接地 单选-->
		<view class="xmmain" v-show="tabidx==1">
			<uni-data-checkbox :wrap='true'  :map="map"  selectedTextColor='#343434'  v-model="adrvalue" :localdata="adrrange" @change="checkboxChangeadr" ></uni-data-checkbox>
		</view>
		<!-- 市直中心 -->
		<view class="xmmain" v-show="tabidx==2">
			<bartree-picker ref="treePicker" :multiple='true' @select-change="selectChange" title="选择招商引荐单位"
        :localdata="localdata" valueKey="id" textKey="label" childrenKey="children"></bartree-picker>
		</view>
		<view class="pfixedb flexc">
			<view class="flex0 xmbtn f17 cof4 btn1" @click="allChoose" v-if="tabidx==0">全选</view>
			<view class="flex0 xmbtn f17 cof4 btn1" @click="getChoose" v-else>清除</view>
			<view class="flex1 xmbtn f17 cf btn2" @click="getConfirm">确认</view>
		</view>
		<!-- 弹窗 -->
		<view class="bgbox" @click="getClose" v-if="hisflag"></view>
		<view class="fixedbox flexdc" style="padding: 48rpx 0 0;" v-if="hisflag">
			<image :src="closeimg" class="choseimg" @click="getClose"></image>
			<view class="top mb20">历史记录</view>
				<!-- 步骤条 -->
				<view class="steps" v-if="hisdeptList.length">
					<view class="lssteplist" v-for="(ite,idx) in hisdeptList" :key='idx'>
						<view class="stepcir"></view>
						<view class="flex1">
							<!-- <view class="mb20">
								<view class="f16 c34 fw mb10 lh22">历史预审时间</view>
								<view class="f14 c6">{{ite.deptType}}</view>
							</view> -->
							<view class="mb10 flexcj">
								<view class="f16 c34 fw lh22 flex0">部门名称</view>
								<view class="f15 c6">{{ite.deptName}}</view>
							</view>
							<view class="mb10 flexcj">
								<view class="f16 c34 fw lh22 flex0">审核结果</view>
								<view class="f15 c6 f500" v-if="ite.shjg==1">待审核</view>
								<view class="f15 c6 f500" v-if="ite.shjg==2">已通过</view>
								<view class="f15 c6 f500" v-if="ite.shjg==3">未通过</view>
							</view>
							<view v-if="ite.shyj" class="flexcj">
								<view class="f16 c34 fw flex0">审核意见</view>
								<view class="f15 c6">{{ite.shyj}}</view>
							</view>
						</view>
					</view>
				</view>
				<no-data :notxt='notxt' :padtop="padtop" v-else></no-data>
		</view>
	</view>
</template>

<script>
	
	import {gettreeselect,getfgwtreeFn} from "@/api/system/user.js"
	import { getCommonXszp,getdeptList } from '@/api/work/clue.js'
	import noData from "@/components/nodata/nodata.vue"
	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
	import bartreePicker from "@/components/ba-tree-picker/ba-tree-picker.vue"
	import config from '@/config.js';
	const baseUrl = config.baseUrl;
	export default{
		components:{
			noData,bartreePicker
		},
		data(){
			return{
				tabidx:0,
				border:false,
				
				cityallChecked:false,
				adrallChecked:false,
				map:{text:'label',value:'id'},
				xmId:'',
				xmbh:'',
				xmmc:'',
				deptId:this.$store.state.user.deptId,
				closeimg:require('@/static/images/close.png'),
				notxt:'暂无历史记录',
				padtop:40,
				hisflag:false,
				cityvalue: [],
				adrvalue: '',
				cityrange: [],
				adrrange: [],
				hisdeptList:[],
				selectValue:[],//市值部门
				citycheckArr:[],//选中的要素部门
				adrcheckArr:'',//选中的承接地
				localdata:[],//市值单位
			}
		},
		onLoad(e) {
			var newObj=JSON.parse(decodeURIComponent(e.data))
			this.xmId=newObj.xmId;
			this.xmbh=newObj.xmbh;
			this.xmmc=newObj.xmmc;
			// this.adrrange=this.localdata[0];
			this.gettreeselect()
		},
		methods:{
			checkPermi, checkRole,
			getdeptList(){
				var params={
					xmbh:this.xmbh,
					xmId:this.xmId,
					isDel:'Y',
					deptType:'1,2,3'
				}
				getdeptList(params).then(res=>{
					if(res.code==200){
						this.hisdeptList=res.rows;
						// if(res.rows.length){
						// 	var newArr=res.rows;
						// 	var newArrs=[];
						// 	newArr.forEach(ite=>{
						// 		newArrs.push(ite.deptName)
						// 	})
						// 	console.log(newArrs,8)
						// }

						// console.log(this.hisdeptList,7)
					}else{
						this.$toast(res.msg)
					}
					
				})
			},
			selectChange(e){
				this.selectValue=e
			},
			gettreeselect(){
				// 市值部门102  承接地103
				//线下 218   线上211
				var url=baseUrl;
				var parentId=''
				if(url.indexOf('https://qszs.qs163.cn')!=-1){
					parentId=211
				}else{
					parentId=218
				}
				var params={
					parentId:parentId
				}
				getfgwtreeFn(params).then(res=>{
					if(res.code==200){
						if(res.data&&res.data.length){
							this.localdata=res.data;
							var neArr=res.data
							for(var i=0;i<neArr.length;i++){
								if(neArr[i].id=='201'){
									this.cityrange=neArr[i].children
								}
								if(neArr[i].id=='103'){
									this.adrrange=neArr[i].children
								}
							}
						}
						
						// this.list=res.rows
					}else{
						this.$toast(res.msg)
					}
				})
			},
			getTab(idx){
				this.tabidx=idx
			},
			getBack(){
				uni.navigateBack({
					delta:1
				})
			},
			clickRight(){
				if(checkPermi(['projectV2:dept:list'])){
					this.hisflag=true;
					this.getdeptList()
				}else{
					return
				}
			},
			getClose(){
				this.hisflag=false
			},
			checkboxChangecity(e){
				console.log(e)
				this.citycheckArr=e.detail.data;
				// this.checkedArr = e.detail.value;
				// 如果选择的数组中有值，并且长度等于列表的长度，就是全选
				if(this.cityvalue.length>0 && this.cityvalue.length==this.cityrange.length){
					this.cityallChecked=true;
				}else{
					this.cityallChecked=false;
				}
			},
			checkboxChangeadr(e){
				this.adrcheckArr=e.detail.data;
			},
			getChoose(){
				this.adrvalue='';
				this.adrcheckArr='';
			},
			// 全选事件
			allChoose(e){
				if(this.cityallChecked){
					this.cityallChecked=false;
					this.cityvalue=[];
					this.citycheckArr=[];
				}else{
					this.cityallChecked=true;
					for(let item of this.cityrange){
						let itemVal=Number(item.id);
						if(!this.cityvalue.includes(itemVal)){
							this.cityvalue.push(itemVal);
							this.citycheckArr.push(item);
						}
					}	
				}
				// if(this.tabidx==0){
					
				// }else{
				// 	if(this.adrallChecked){
				// 		this.adrallChecked=false;
				// 		this.adrvalue=[];
				// 	}else{
				// 		this.adrallChecked=true;
				// 		for(let item of this.adrrange){
				// 			let itemVal=Number(item.value);
				// 			if(!this.adrvalue.includes(itemVal)){
				// 				this.adrvalue.push(itemVal);
				// 			}
				// 		}	
				// 	}
				// }
			},
			getConfirm(){
				
				// selectValue:[],//市值部门
				// citycheckArr:[],//选中的要素部门
				// adrcheckArr:'',//选中的承接地
				var ysbmList=[];
				var cjdList=[];
				var yjdwList=[];
				var citycheckArr=this.citycheckArr;
				var adrcheckArr=this.adrcheckArr||'';
				var yjdwcheckArr=this.selectValue||[];
				if(!adrcheckArr){
					this.$toast('请选择分派承接地')
					return
				}
				// 要素部门，
				citycheckArr.forEach((ite,idx)=>{
					var obj={}
					obj.deptId=ite.id;
					obj.deptName=ite.label;
					obj.xmId=this.xmId;
					obj.xmbh=this.xmbh;
					obj.xmmc=this.xmmc;
					ysbmList[idx]=obj
				})
				// 承接地
				var cityobj={}
				cityobj.deptId=adrcheckArr.id;
				cityobj.deptName=adrcheckArr.label;
				cityobj.xmId=this.xmId;
				cityobj.xmbh=this.xmbh;
				cityobj.xmmc=this.xmmc;
				cjdList.push(cityobj)
				// 引荐单位
				yjdwcheckArr.forEach((ite,idx)=>{
					var obj=ite;
					obj.xmId=this.xmId;
					obj.xmbh=this.xmbh;
					obj.xmmc=this.xmmc;
					yjdwList[idx]=obj;
				})
				var params={
					xmId:this.xmId,
					xmbh:this.xmbh,
					xmmc:this.xmmc,
					ysbmList:ysbmList,
					cjdList:cjdList,
					yjdwList:yjdwList
				}
				// console.log(params)
				// return
				getCommonXszp(params).then(res=>{
					if(res.code==200){
						this.$toast('分派成功')
						setTimeout(function(){
							uni.$emit('refreshdata');
							uni.navigateBack({delta: 1});
						},1200)
						
					}else{
						this.$toast(res.msg)
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.topfixed{display: flex;align-items: center;
	.act .tab::after{width: 100%;height: 6rpx;background: #FE5706;content: '';position: absolute;left: 0;right: 0;bottom: 0;}
	.act .tab{color: #333333;}
	.tab{position: relative;height: 90rpx;}
}	
.xmbox{padding-top: 90rpx;background:#ffffff;padding-bottom: 120rpx;min-height: 100vh;box-sizing: border-box;}
.zhanline{height: 24rpx;background-color: #F2F2F2;}
.xmmain{background: #ffffff;padding-left: 48rpx;}
.xmmain /deep/ .uni-data-checklist .checklist-group .checklist-box{padding: 44rpx 0;border-bottom: 2rpx solid  #E5E5E5;margin: 0;
  &:last-of-type{border-bottom: none;}}
 
 .xmmain /deep/ .uni-data-checklist .checklist-group .checklist-box .checklist-text{color: #343434;font-size: 34rpx;font-weight: bold;}
.xmmain /deep/ .uni-data-checklist .checklist-group .checklist-box .checkbox__inner{margin-right: 40rpx;}
.xmmain  /deep/ .uni-data-checklist .checklist-group .checklist-box.is--default.is-checked .checkbox__inner{border-color: #FF440B; background-color: #FF440B;}
 .xmmain /deep/ .uni-data-checklist .checklist-group .checklist-box.is--default.is-checked .checklist-text{color: #343434;}
.xmbtn{height: 100rpx;display: flex;align-items: center;justify-content: center;
 &.btn1{width: 200rpx;}
 &.btn2{background-color: $uni-color-fa;}
}
</style>