<template>
	<view class="container flex flex_column">
		<view class="md-scroll">
			<view class="userInfo">
				设置<text>{{userInfo.name}}</text>为新的负责人后，您将不再是门店负责人，
				请为自己选择一个新的岗位
			</view>
			 <view class="check-order-list">
				<u-radio-group wrap @change="radioGroupChange">
					<u-radio 
						v-model="item.checked" 
						v-for="(item, index) in roleList" :key="item.id" 
						:name="item.id"
					>
					<view class="u-name">
						{{item.name}}
					</view>
					</u-radio>
				</u-radio-group>
			 </view>
			 <view style="padding:0 30upx 30upx;">
				 <u-empty :src="`/static/nodata.png`" icon-size="180" :text="noDataText" img-width="120" v-if="roleList.length==0 && status!='loading'" mode="list"></u-empty>
			 </view>
		</view>
		<view class="footer">
			<u-button @click="save" :loading="loading" :throttle-time="100" :custom-style="{ background: '#066cff', color: '#fff',width:'400rpx' }" shape="circle" type="info">
				确定
			</u-button>
		</view>
	</view>
</template>

<script>
	import { getRoleList } from '@/api/powerRole-md.js'
	import {saveEmployee,setManager} from '@/api/employee'
	export default{
		data(){
			return{
				status: 'loadmore',
				noDataText: '暂无数据',
				// 查询参数
				queryParam: {
				  isEnable: '1'
				},
				formData:{},
				pageSize: 100,
				pageNo: 1,
				roleList:[],
				checked:true,
				nowId: '',	 // 当前员工 id
				loading:false,
				total:''	,// 获取数据总数
				userInfo: null,
				adminId: null
			}
		},
		onLoad(opts) {
			this.userInfo = this.$store.state.vuex_nowStaffData
			this.adminId = opts.adminId
			this.getRoleList()
		},
		methods:{
			radioGroupChange(e){
				this.formData.roleIds = e;
				const roleNames = this.roleList.find(item => item.id == e);
				this.formData.roleNames = roleNames?roleNames.name:'';
			},
			// 获取列表数据
			getRoleList(){
				let _this = this
				this.status = "loading"
				getRoleList({isEnable: '1'}).then(res => {
					uni.hideLoading()
					_this.roleList = res.data || []
					_this.noDataText = res.message
					_this.status = "loadmore"
				})
			},
			//  保存
			save(name){
				if(!this.formData.roleIds){
					uni.showToast({icon: 'none', title: '请选择岗位'})
				}else{
					this.loading = true
					// 先更换负责人
					setManager({id: this.userInfo.id}).then(res => {
					  console.log(res)
					  if (res.status == 200){
						  this.saveRole()
					  }else{
						  uni.showToast({
						  	title:res.message
						  })
						  this.loading = false
					  }
					})
				}
			},
			// 设置岗位
			saveRole(){
				this.formData.id = this.adminId
				saveEmployee(this.formData).then(res=>{
					console.log(res)
					if(res.status == 200){
						uni.showToast({icon: 'none', title:'保存成功'})
						this.quitOut()
					}else{
						uni.showToast({icon: 'none', title: res.message})
					}
					this.loading = false
				})
			},
			quitOut(){
				this.$store.dispatch('userLogout');
				uni.redirectTo({
					 url: '/pages/login/login?showModal=1'
				});
			}
		}
	}
</script>

<style lang="less">
	.container{
		width:100%;
		height: 100vh;
		background: #ffffff;
		.md-scroll{
			flex-grow: 1;
			overflow: auto;
			.userInfo{
				padding: 20upx 50upx;
				text-align: center;
				text{
					color: coral;
				}
			}
			.check-order-list{
				padding: 10upx 20upx;
				u-radio{
					> view{
						background: #ffffff;
						border-radius: 20upx;
						box-shadow: 1px 1px 3px #EEEEEE;
						border:1px solid #eee;
						margin: 10rpx 0;
						padding: 20rpx;
						>view:last-child{
							flex-grow: 1;
						}
					}
				}
			}
		}
		.footer{
			padding: 0.6rem;
			background: #ffffff;
		}
	}
</style>
