<template>
  <div>
    <p class="edit_page_title">{{adminGuild_type==='add'?'添加公会账号':'编辑公会账号'}}</p>
    <div>
      <Form ref="editGuild" :model="editGuild" :rules="guild_rule" :label-width="120" class="add-adminguild-form">
        <FormItem  label="公会名称" prop="guild_name">
          <Input v-model="editGuild.guild_name" type="text" placeholder="请输入公会名称" class="wid_347" />
        </FormItem>
        <FormItem  label="绑定平台" prop="platform">
          <Select v-model="editGuild.platform" multiple placeholder="选择绑定平台" class="wid_347 fl zd1" filterable>
            <Option v-for="(item,index) in platformList" :value="item.id.toString()" :key="index" >{{item.name}}</Option>
          </Select>
          <p class="form_tap_text" v-if="platformList.length<1"><router-link to="/admin_list" class="jump">去开通平台</router-link></p>
          <p class="form_tap_text" v-if="adminGuild_type==='edit'">选择公会所属的平台</p>
          <div class="clear"></div>
        </FormItem>
        <FormItem  label="商务专员" prop="commissioner_id">
          <Select v-model="editGuild.commissioner_id" placeholder="选择商务专员" class="wid_347 fl zd1" filterable>
            <Option v-for="(item,index) in salelist" :value="item.id.toString()" :key="index">{{item.name}}</Option>
          </Select>
          <p class="form_tap_text">选择公会所属的商务专员</p>
          <div class="clear"></div>
        </FormItem>
        <template v-if="adminGuild_type==='edit' && manager.name">
        <FormItem  label="公会团长">
          <p>{{manager.name}}</p>
        </FormItem>
        <FormItem  label="公会团长姓名">
          <p>{{manager.realname}}</p>
        </FormItem>
        <FormItem  label="公会团长手机">
          <p>{{manager.mobile}}</p>
        </FormItem>
        </template>
        <FormItem prop class="form_btn" label="旗下推广员数量" v-if="adminGuild_type==='edit'">
          <p class="wid_347 fl zd1 a_text" @click="isGuildSale=true">{{editGuild.promote_count}}</p>
          <p class="form_tap_text">无法修改，根据推广员所属公会自动显示</p>
          <div class="clear"></div>
        </FormItem>
        <FormItem  label="创建时间">
          <p>{{editGuild.create_time?editGuild.create_time:createtime}}</p>
        </FormItem>
        <FormItem class="form_btn">
          <Button type="primary" :disabled="!is_canclick" :class="is_canclick?'':'disable_btn'"  @click="editGuildinfo()">{{adminGuild_type==='add'?'添加':'保存'}}</Button>
          <Button class="mar_L_15 return_btn" @click="return_last">返回</Button>
        </FormItem>
      </Form>
    </div>
    <guildSale :isGuildSale.sync="isGuildSale" :gname='gname' :gnum='gnum' :gid='guildId'></guildSale>
  </div>
</template>
<script>
import guildSale from "@@/user/guild_sale_detail";
export default {
  name: "edit_adminGuild",
  props: {
    adminGuild_type: String,
    guildId:Number,
    pindex:Number,
    gname:String,
    gnum:Number,
  },
  components:{guildSale},
  data() {
    const confirmName = (rule, value, cb) => {
      let reg = /^[\u2E80-\u9FFF]+$/;
      if(value===''){
        cb()
      }else if (!reg.test(value)) {
        cb(new Error("姓名格式错误"));
      } else if (value.length > 25 || value.length < 2) {
        cb(new Error("姓名长度需要在2-25个字符之间"));
      } else{
        cb();
      }
    };
    const confirmCity = (rule, value, cb) => {
      if (value === "") {
        cb(new Error("请选择开户城市"));
      } else if (this.cit === "") {
        cb(new Error("请选择开户城市"));
      } else if (this.cou === "") {
        cb(new Error("请选择开户城市"));
      } else {
        cb();
      }
    };
    const confirmBankName = (rule, value, cb) => {
      let reg = /^([1-9]{1})(\d{15}|\d{18})$/;
      if (!reg.test(value)) {
        cb(new Error("卡号格式错误"));
      } else {
        cb();
      }
    };
    return {
      isGuildSale:false,
      editGuild: {
        guild_name: "",
        platform: [],
        commissioner_id: "",
        promote_count:0,
        create_time: ''
      },
      mList:[],
      platformList:[],
      salelist: [],
      guild_rule: {
        guild_name:[
          { required: true, message: "请输入工会名称", trigger: "blur" }
        ],
        platform: [
          {
            type: 'array',
            required: true,
            message: "请选择绑定平台",
            trigger: "change"
          }
        ],
      },
      presidentList: [],
      manager: {}
    };
  },
  computed: {
    createtime() {
      let today = new Date();
      let datetime =
        today.getFullYear() +
        "-" +
        Number(today.getMonth() + 1) +
        "-" +
        today.getDate() +
        " " +
        today.getHours() +
        ":" +
        today.getMinutes() +
        ":" +
        today.getSeconds();
      return datetime;
    },
    is_canclick() {
      let arr = !!this.editGuild.platform && !!this.editGuild.guild_name
      return arr === true;
    },
  },
  methods: {
      // 获取商务专员下拉框
      getSaleSelectList() {
        this.$api.getSaleSelectList().then(data => {
          if (data.code === 200) {
            this.salelist = data.data;
          } else {
            this.$Message.info(data.msg);
          }
        });
      },
      // 获取平台列表
      getPlatformSelectList() {
        this.$api.getPlatformSelectList().then(data => {
          if (data.code == 200) {
            this.platformList = data.data
          } else {
            this.platformList = []
          }
        })
      },
      getAdminGuildDetail(id) {
        this.$api.getAdminGuildDetail({
          id
        }).then(data => {
          if (data) {
            this.editGuild.commissioner_id = data.commissioner_id ? data.commissioner_id.toString() : ''
            if (data.platform_ids) {
              this.editGuild.platform = data.platform_ids ? data.platform_ids.split(',') : []
            }
            this.editGuild.guild_name = data.studio_name
            this.editGuild.promote_count = data.promote_count
            this.editGuild.create_time = data.create_time
            this.manager = {
              name: data.manager_name,
              realname: data.realname,
              mobile:data.mobile
            }
          }
        })
      },
      // 日期选择
      datachange(date) {
        this.addGuild.creat_time = date;
      },
      // 修改
      editGuildinfo() {
        let guildrule = false;
        this.$refs["editGuild"].validate(valid => {
          if(valid){
            guildrule = true;
          }
        });
        let platform_ids=''
        if(!!this.editGuild.platform){
          for(let i in this.editGuild.platform){
            if(Number(i)===Number(this.editGuild.platform.length)-1){
              platform_ids+=this.editGuild.platform[i]
            }else{
              platform_ids+=this.editGuild.platform[i]+','
            }
          }
        }
        let params = {
          name:this.editGuild.guild_name,
          manager_id: this.editGuild.manager_id,
          commissioner_id: this.editGuild.commissioner_id,
          platform_ids:platform_ids,
        };
        if (!!this.guildId && this.adminGuild_type === 'edit') {
          params.id=this.guildId
        }
        if (guildrule) {
          let api = this.adminGuild_type === "add" ? "addGuildInfo" : "editGuildInfo";
          this.$api[api]({...params}).then(data => {
            if (data.code === 200) {
              this.$Message.info(data.msg);
              this.$emit("reuturn_last",this.pindex);
            } else {
              this.$Message.info(data.msg);
            }
          });
        }
      },
      // 返回
      return_last() {
        this.$emit("reuturn_last",this.pindex);
      },
      // 公会团长列表
      getPresident() {
        this.$api.getManagerSelectList({role_id: 3})
          .then(response => {
            this.presidentList = response.data
          })
      }
    },
    mounted(){
      this.getSaleSelectList();
      this.getPlatformSelectList();
    },
    created() {
      this.$nextTick(()=>{
        if (!!this.guildId && this.adminGuild_type === 'edit') {
          this.getPresident();
          this.getAdminGuildDetail(this.guildId)
        }
      })
    },
  };
</script>
<style>
.ivu-form-item-error .ivu-input-icon {
  color: #80848f !important;
}
.disable_btn {
  background: #e2e2e2 !important;
  border-color: rgba(224, 224, 224, 1) !important;
  color: rgba(51, 51, 51, 1) !important;
}
</style>
