<template>
  <div>
    <van-nav-bar :title="title" left-text="返回" @click-left="$route_back" left-arrow></van-nav-bar>
    <div class="body_com has_header">
      <van-cell-group>
        <EmployeeSelectorCell title="选择管理范围" v-model="employee_list" :max="0"></EmployeeSelectorCell>
      </van-cell-group>
      <div style="padding: 0.32rem">
        <van-button type="info" block @click="set_power_range">保存</van-button>
      </div>
    </div>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import EmployeeSelectorCell from '@/components/common/EmployeeSelectorCell'
  import Vue from 'vue'
  import {Dialog} from 'vant'
  Vue.use(Dialog)
  export default {
    // 数据
    data(){
      return {
        title: '设置用户管理范围',
        employee_list: [],
        git_id: this.$route.query.employee_id
      }
    },
    // 组件
    components: {
      EmployeeSelectorCell
    },
    // 方法
    methods:{
      // 加载
      showLoading () {
        this.$toast.loading({
          loadingType: "spinner",
          message: '正在处理'
        })
      },
      set_power_range(){
        let self = this
        self.showLoading()
        if(self.employee_list.id){
          Dialog.confirm({
            title: '提示',
            message: '列表为空，你确定要删除吗?'
          }).then(() => {
            self.sub_data()
          }).catch(() => {
            // on cancel
          });
        }else{
          self.sub_data()
        }
      },
      sub_data(){
        let self = this, arr_id = []
        self.employee_list.forEach(v => {
          arr_id.push(v.id)
        });
        let data = {
          employee_id: self.git_id,
          id: arr_id
        }
        request('post','/api/employee/scope', data).then((res) => {
          if(res.data.code == 1){
            self.$toast.clear()
            self.$toast(res.data.msg)
          }else{
            self.$toast.clear()
            self.$toast(res.data.msg)
          }
        }).catch((e) => {
          self.$toast.clear()
        })
      }
    },
  };
</script>
<style scoped>
.body_com{height: calc(100% - 1rem); position: relative;}
</style>
