<template>
  <el-drawer
    size="70%"
    append-to-body
    :title="title"
    :visible.sync="drawer"
    :wrapperClosable="false"
    :close-on-click-modal="false"
    :close-on-press-escape="false"

    @closed="closed"
  >
    <avue-form
      class="copy-form"
      :option="option"
      v-model="obj"
      ref="form"
      @submit="submit"
    >
      <template slot="cityId" slot-scope="{ disabled }">
        <jl-city-cascader
          :disabled="disabled"
          filterable
          v-model="obj.cityId"
          placeholder="请选择 工作地址"
        ></jl-city-cascader>
      </template>

      <template slot-scope="{ disabled }" slot="skillIds">
        <skill-select
          ref="skillSelect"
          :canSelect="!disabled"
          :selectedSkills="selectedSkills"
          :id="obj.worktypeIds"
          @add-skill="addSkill"
          @clear-validator="clearValidator('skillIds')"
        ></skill-select>
      </template>

      <template slot-scope="{ disabled }" slot="address">
        <select-map
          ref="selectMap"
          @addAddress="addAddress"
          @addressDel = "addressDel"
          :isCanEdit="!disabled"
          :lng="obj.lon"
          :lat="obj.lat"
          :address="obj.address"
          :type="type"
        ></select-map>
      </template>
      <!-- 行业类型 -->
      <!-- <template slot="tradeId">
        <div class="tradeId">
            <el-autocomplete
              popper-class="my-autocomplete"
              v-model.trim="tradeState"
              :fetch-suggestions="querySearchAsync"
              placeholder="请选择行业类型"
              @select="handleSelect"
              show-word-limit
              ref="selectTradeId"
              >
              <template slot-scope="{ item }">
                <div class="name">{{item.value}}</div>
              </template>
            </el-autocomplete>
        </div>
      </template> -->
      <!-- 工种 -->
      <template slot="worktypeIds">
        <div class="tradeId">
            <el-autocomplete
              popper-class="my-autocomplete"
              v-model.trim="workTypeState"
              :fetch-suggestions="querySearchAsyncWorkType"
              placeholder="请选择工种"
              @select="handleSelectWorkType"
              show-word-limit
              :disabled = "worktypeDisabled"
              >
              <template slot-scope="{ item }">
                <div class="name">{{item.value}}</div>
              </template>
            </el-autocomplete>
        </div>
      </template>
      <!--/自定义表单-->
      <template slot-scope="{ disabled }" slot="menuForm">
        <el-button
          icon="el-icon-circle-close"
          @click="drawer = false"
          :loading="disabled"
          >取消</el-button
        >
      </template>
    </avue-form>
  </el-drawer>
</template>

<script>
import { add, detail, update, tradeListAdd, workListAdd,getMounthDays} from "@/api/tenant/mission";
import { getTrade, getWork, getWorkTypes} from "@/api/tenant/common";
import SkillSelect from "../Dialog/Skill";
import SelectMap from "@/components/map/selectLocation";
import { isvalidatemobile } from "@/util/validate";
import { mapGetters } from "vuex";
import {
  wageUnitCategoryState,
  wageOptionsWithNoMonth,
  educationState,
} from "@/common/dic";

const validateTel = (rule, value, callback) => {
  if (isvalidatemobile(value)[0]) {
    callback(new Error(isvalidatemobile(value)[1]));
  } else {
    callback();
  }
};

export default {
  data() {
    return {
      skillArr: [],
      id: "",
      title: "",
      type: "",
      tradeBtnState:true,
      workTypeBtnState:true,
      worktypeDisabled:true,
      selectedSkillIds: [],
      selectedName: [],
      selectedSkills: [],
      tradeData: [],
      tradeNameAttr:[],
      tradeIdAttr:[],
      workData: [],
      workDataNameAttr:[],
      workDataIdAttr:[],
      skillIdAttr:[],
      obj: {
        wageUnitCategory: null,
        sex: 0,
        ageDesc: "不限年龄",
        education: 7,
        experienceDesc: "不限经验",
        tradeId:null,
        tradeNames: null,
        userNature:"灵活用工",
      },
      loading: false,
      drawer: false,
      wageUnitCategory: wageUnitCategoryState,
      restaurants: [],
      tradeState: '',
      workTypeState:'',
      timeout:  null,
      days:null,//某个月份的天数
      endTimeFlag:true,
      stimeDate:null,
    };
  },
  components: {
    SkillSelect,
    SelectMap,
  },
  created() {
    this.$store.dispatch("InitArea");
    this.initData();

  },
  watch: {
    "obj.tradeId": function (val, oldval) {
      if (val) {
        getWork(val).then((res) => {
          this.workData = res;
           this.workDataNameAttr = res.map((ele)=>{
              return ele.name
            })
            this.workDataIdAttr = res.map((ele)=>{
                return ele.id
            })
          this.worktypeDisabled = false;
          if (val !== oldval && oldval) {
            this.obj.worktypeIds = "";
          }
        });
      } else {
        this.obj.worktypeIds = "";
      }
    },
    "obj.wageUnitCategory": function () {
      if (this.$refs.form) this.$refs.form.$refs.form.validateField("wage");
    },
    "stimeDate":function(n){
      if(n){
        getMounthDays(n).then(res=>{
                      this.days=res.data.data;
                    })
      }
    }
  },
  computed: {
    ...mapGetters(["area", "userInfo"]),
    /*计算时间*/
    startDate() {
      const self = this;
      if (self.obj.stime) {
        return new Date(self.obj.stime);
      } else {
        return null;
      }
    },
    endDate() {
      const self = this;
      if (self.obj.etime) {
        return new Date(self.obj.etime);
      } else {
        return null;
      }
    },
    siginDate() {
      const self = this;
      if (self.obj.etimePub) {
        return new Date(self.obj.etimePub);
      } else {
        return null;
      }
    },
    startTime() {
      const self = this;
      if (self.startDate) {
        return self.startDate.getTime();
      } else {
        return null;
      }

    },
    endTime() {
      const self = this;
      if (self.endDate) {
        return self.endDate.getTime();
      } else {
        return null;
      }
    },
    siginTime() {
      const self = this;
      if (self.siginDate) {
        return self.siginDate.getTime();
      } else {
        return null;
      }
    },
    option() {
      const self = this;
      // const tradeId = (rule, value, callback) => {
      //   if(this.tradeState == null || this.tradeState == undefined || this.tradeState == ""){
      //     callback(
      //       new Error(
      //         "请选择行业类型"
      //       )
      //     )
      //   }else{
      //     if(!this.tradeBtnState){
      //       callback(
      //         new Error(
      //           "新增行业要添加后才能使用"
      //         )
      //       )
      //     }else{
      //         callback();
      //     }

      //   }
      // };
      const validatePass = (rule, value, callback)=>{
        let specialKey = "[`~#$^&*()=|{}\\[\\]<>/~#￥……&*（）——|{}【】《》%@‘”“']‘'";
        let flagValue = true;
        for (var i = 0; i < value.length; i++) {
          if (specialKey.indexOf(value.substr(i, 1)) != -1) {
            flagValue = false;
          }
        }
        if( flagValue){
          callback();
        }else{
          callback(new Error('任务名称不能输入特殊字符'));
        }


    };
      return {
        emptyBtn: false,
        menuPosition: "right",
        group: [
          {
            label: "任务信息",
            prop: "missionInfo",
            arrow: false,
            column: [
              {
                label: "任务名称",
                prop: "missionTitle",
                search: true,
                span: 24,
                rules: [
                  {
                    required: true,
                    whitespace: true,
                    message: "请输入任务名称",
                    trigger: "blur",
                  },
                  {
                    min: 3,
                    max: 30,
                    message: "长度在 3到 30 个字",
                    trigger: "blur",
                  },
                  { validator: validatePass, trigger: 'blur' }
                ],
              },
              {
                label: "发布时间",
                prop: "stime",
                type: "date",
                placeholder: "请选择任务发布时间",
                format: "yyyy-MM-dd",
                valueFormat: "yyyy-MM-dd 00:00:00",
                pickerOptions: {
                  disabledDate(time) {
                    return !(
                      time.getTime() > Date.now() &&
                      (!self.endTime ||
                        (time.getTime() < self.endTime &&
                          time.getTime() > self.endTime - 2678400000)) &&
                      (!self.siginTime || time.getTime() > self.siginTime)
                    );
                  },
                },
                blur:({value})=>{
                  self.obj.etime='';
                  if(value){
                    self.stimeDate=value.split(' ')[0]
                    self.endTimeFlag=false
                  }
                  else{
                    self.endTimeFlag=true
                  }
                },
                rules: [
                  {
                    required: true,
                    message: "请选择任务开始日期",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "结束时间",
                prop: "etime",
                type: "date",
                placeholder: "请选择任务结束日期",
                format: "yyyy-MM-dd",
                valueFormat: "yyyy-MM-dd 23:59:59",
                disabled:self.endTimeFlag,
                pickerOptions: {
                  disabledDate(time) {
                    if(!self.obj.stime){
                      return true
                    }
                    if(self.days){
                      // let mutiply=1000*60*60*24;
                      return !( time.getTime() > Date.now() && (!self.startTime || (time.getTime() > self.startTime )))
                    }
                  },
                },
                rules: [
                  {
                    required: true,
                    message: "请选择任务结束日期",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
            ],
          },
          {
            label: "任务要求",
            prop: "missionRequire",
            arrow: false,
            column: [
              {
                label: "招聘人数",
                prop: "peopleNum",
                type: "number",
                rules: [
                  {
                    required: true,
                    message: "请输入招聘人数",
                    trigger: "blur",
                  },
                  {
                    type: "number",
                    min: 1,
                    message: "招聘人数最少为1",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "参考工资",
                prop: "wage",
                type: "select",
                dicData: wageOptionsWithNoMonth,
                rules: [
                  {
                    required: true,
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "行业类型",
                prop: "tradeId",
                type: "select",
                dicData: this.tradeData,
                props: {
                  label: "name",
                  value: "id",
                },
                rules: [
                  {
                    required: true,
                    // validator: tradeId,
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "工种",
                prop: "workSkills",
                type: "cascader",
                search: true,
                display: true,
                dicUrl: `/api/jobslink-api/tenant/worktypes/base/list?type=1`,
                dicFormatter: (res) => {
                  return res.data; //返回字典的层级结构
                },
                props: {
                  label: "name",
                  value: "id",
                  children: "child"
                },
                rules: [
                  {
                    required: true,
                    message: "请输入工种",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "任务描述",
                prop: "missionDesc",
                type: "textarea",
                rules: [
                  {
                    required: true,
                    whitespace: true,
                    message: "请输入任务描述",
                    trigger: "blur",
                  },
                  {
                    min: 30,
                    max: 200,
                    message: "长度在 30 到 200 个字",
                    trigger: "blur",
                  },
                ],
                placeholder: "请输入任务描述，字数30-200字以内",
                span: 24,
                maxlength: 200,
                showWordLimit: true,
              },
            ],
          },
          {
            label: "人员要求",
            prop: "personRequire",
            arrow: false,
            column: [
              // {
              //   label: "人员属性",
              //   type: "select",
              //   prop: "userNature",
              //   dicData: [
              //     {
              //       value: "灵活用工",
              //       label: "灵活用工",
              //     },
              //   ],
              //   rules: [
              //     {
              //       required: true,
              //       message: "请选择人员属性",
              //       trigger: ["change", "blur"],
              //     },
              //   ],
              //   span: 8,
              // },
              {
                label: "年龄要求",
                type: "select",
                prop: "ageDesc",
                dicData: [
                  {
                    label: "不限年龄",
                    value: "不限年龄",
                  },
                  {
                    label: "30以下",
                    value: "30以下",
                  },
                  {
                    label: "35以下",
                    value: "35以下",
                  },
                  {
                    label: "40以下",
                    value: "40以下",
                  },
                  {
                    label: "45以下",
                    value: "45以下",
                  },
                  {
                    label: "50以下",
                    value: "50以下",
                  },
                  {
                    label: "55以下",
                    value: "55以下",
                  },
                  {
                    label: "60以下",
                    value: "60以下",
                  },
                ],
                span: 8,
                clearable: false,
              },
              {
                label: "学历要求",
                type: "select",
                prop: "education",
                dicData: educationState,
                span: 8,
                clearable: false,
              },
              {
                label: "经验要求",
                type: "select",
                prop: "experienceDesc",
                dicData: [
                  {
                    label: "不限经验",
                    value: "不限经验",
                  },
                  {
                    label: "1年以下",
                    value: "1年以下",
                  },
                  {
                    label: "1~3年",
                    value: "1~3年",
                  },
                  {
                    label: "3~5年",
                    value: "3~5年",
                  },
                  {
                    label: "5~10年",
                    value: "5~10年",
                  },
                  {
                    label: "10年以上",
                    value: "10年以上",
                  },
                ],
                span: 8,
                clearable: false,
              },
            ],
          },
          {
            label: "企业信息",
            prop: "contactsRequire",
            arrow: false,
            column: [
              {
                label: "企业名称",
                prop: "missionCompanyName",
                rules: [
                  {
                    required: true,
                    message: "请输入企业名称",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "企业规模",
                prop: "missionCompanyScale",
                rules: [
                  {
                    required: true,
                    message: "请输入企业规模",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "所属行业",
                prop: "missionCompanyIndustry",
                rules: [
                  {
                    required: true,
                    message: "请输入所属行业",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "企业性质",
                prop: "missionCompanyNature",
                rules: [
                  {
                    required: true,
                    message: "请输入企业性质",
                    trigger: "blur",
                  },
                ],
                span: 12,
              },
              {
                label: "企业介绍",
                prop: "missionCompanyDescription",
                type: "textarea",
                rules: [
                  {
                    required: true,
                    message: "请输入企业介绍",
                    trigger: "blur",
                  },
                  {
                    min: 30,
                    max: 200,
                    message: "长度在 30 到 200 个字",
                    trigger: "blur",
                  },
                ],
                placeholder: "请输入企业介绍，字数30-200字以内",
                span: 24,
                maxlength: 200,
                showWordLimit: true,
              },
              {
                label: "联系人",
                prop: "callName",
                rules: [
                  {
                    required: true,
                    whitespace: true,
                    message: "请输入联系人",
                    trigger: "blur",
                  },
                  {
                    min: 1,
                    max: 5,
                    message: "长度在 1 到 5 个字",
                    trigger: "blur",
                  },
                ],
                span: 8,
              },
              {
                label: "手机号",
                prop: "callTel",
                rules: [
                  {
                    required: true,
                    validator: validateTel,
                    trigger: "blur",
                  },
                ],
                span: 8,
              },
              {
                label: "座机",
                prop: "callNumber",
                span: 8,
              },
              {
                label: "工作地址",
                type: "input",
                prop: "cityId",
                rules: [
                  {
                    required: true,
                    message: "请选择工作地址",
                  },
                ],
                formslot: true,
                labelslot: false,
                errorslot: false,
                span: 24,
              },
              {
                label: "详细地址",
                prop: "address",
                formslot: true,
                labelslot: false,
                errorslot: false,
                rules: [
                  {
                    required: true,
                    whitespace: true,
                    message: "请输入详细地址",
                    trigger: "blur",
                  },
                ],
                span: 24,
              },
            ],
          },
        ],
      };
    },
  },
  methods: {
    //过滤行业类型
    querySearchAsync(queryString, cb) {
      let results = [];
      let tradeNameState = this.tradeNameAttr.indexOf(queryString);
      if(tradeNameState == -1){
        this.tradeBtnState = false;
      }else{
        this.tradeBtnState = true;
      }
        for(let i of this.tradeData){
            i.value = i.name;
        }
        results = queryString ? this.tradeData.filter(this.createStateFilter(queryString)) : this.tradeData;
        cb(results);
      },
      //工种筛选
      querySearchAsyncWorkType(queryString, cb){

        let results = [];
        let workDataNameState = this.workDataNameAttr.indexOf(queryString);
        if(workDataNameState == -1){
          this.workTypeBtnState = false;
        }else{
          this.workTypeBtnState = true;
        }
          for(let i of this.workData){
              i.value = i.name;
          }
          results = queryString ? this.workData.filter(this.createStateFilter(queryString)) : this.workData;
          cb(results);
      },
      createStateFilter(queryString) {
        return (state) => {
          return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
        };
      },
      //行业类型
      handleSelect(item) {
        console.log('11111111111')
        console.log(item)
        this.tradeBtnState = true;
        this.obj.tradeId = item.id
        this.obj.tradeNames = item.name
      },
      //工种
      handleSelectWorkType(item){
        console.log('222222')
        this.workTypeBtnState = true;
        this.obj.worktypeIds = item.id;
        console.log(item)
      },
      //点击行业类型添加按钮
      handleIconClick() {
        this.$message.closeAll();
        let nameState = this.tradeNameAttr.indexOf(this.tradeState)
        if(this.tradeState == ""){
          this.$message({
            type: "error",
            message: "请输入要添加的行业类型！",
          })
        }else if(nameState != -1){
            this.$message({
              type: "error",
              message: "此行业类型已存在，请在列表中选择！",
          })
        }else{
          tradeListAdd(this.tradeState).then((res) =>{
            if(res.data.code == 200){
              this.obj.tradeId = res.data.data;
              this.$message({
                type: "success",
                message: res.data.msg,
              })
              this.tradeBtnState = true;
              this.initData();
              this.clearValidator('tradeId');
                        }else{
              this.$message({
                type: "error",
                message: res.data.msg,
              })
            }
        });
        }

      },
      //点击工种添加按钮
      handleIconClickWorkType() {
        this.$message.closeAll();
        let nameState = this.workDataNameAttr.indexOf(this.workTypeState)
        if(this.workTypeState == ""){
          this.$message({
            type: "error",
            message: "请输入要添加的工种！",
          })
        }else if(nameState != -1){
            this.$message({
              type: "error",
              message: "此工种已存在，请在列表中选择！",
          })
        }else{
          workListAdd(this.obj.tradeId,this.workTypeState).then((res) =>{
            if(res.data.code == 200){
              this.obj.worktypeIds = res.data.data;
              this.$message({
                type: "success",
                message: res.data.msg,
              })
              this.workTypeBtnState = true;
              this.clearValidator('worktypeIds');
              getWork(this.obj.tradeId).then((res) => {
                this.workData = res;
                this.workDataNameAttr = res.map((ele)=>{
                  return ele.name
                })
              })
            }else{
              this.$message({
                type: "error",
                message: res.data.msg,
              })
            }
        });
        }

      },
    //
    addressDel(){
      this.obj.address = "";
    },
    initData() {
      /*获取行业类型*/
      this.loading = true;
      getTrade(this.userInfo.company_id).then((res) => {
        this.tradeData = res;
        this.tradeNameAttr = res.map((ele)=>{
          return ele.name
        })
        this.tradeIdAttr = res.map((ele)=>{
          return ele.id
        })
        this.loading = false;
      });
      // 获取工种
      getWorkTypes(1).then(res => {
        console.log(res)
        this.skillArr = res.data.data;
      })
    },
    closed() {
      this.tradeState = "";
      this.workTypeState = "";
      this.$refs.form.init();
      this.$refs.form.resetForm();
      this.$refs.form.clearValidate();
      this.obj = {
        wageUnitCategory: null,
        sex: 0,
        ageDesc: "不限年龄",
        education: 7,
        experienceDesc: "不限经验",
        userNature:"灵活用工",

      };
    },
    /*地图*/
    addAddress(form) {
      this.obj.address = form.address + (form.title || "");
      this.obj.lat = form.lat;
      this.obj.lon = form.lng;
    },
    /*技能*/
    addSkill(arr) {
      if (arr.length) {
        this.selectedSkills = arr;
      } else {
        this.selectedSkills = [];
      }
    },
    submit(row, done) {
      if(this.$refs.selectMap.addressLocation == ""){
        this.$message({
          type: "error",
          message: "请选择详细地址!",
        });
      }else{
        row.address = this.$refs.selectMap.addressLocation;
      // let ids = [];
      // let name = [];
      // this.selectedSkills.forEach((ele) => {
      //   ids.push(ele.id);
      //   name.push(ele.name);
      // });
      if(this.skillArr && this.skillArr.length > 0) {
        this.skillArr.forEach(item => {
          if(item.id == row.workSkills[0]) {
            row.worktypeNames = item.name
            if(item.child && item.child.length > 0) {
              item.child.forEach(item2 => {
                if(item2.id == row.workSkills[1]) {
                  row.skillNames = item2.name;
                }
              })
            }
          }
        })
      }

      if(this.tradeData && this.tradeData.length > 0) {
        this.tradeData.forEach(item => {
          if(row.tradeId == item.id) {
            row.tradeNames = item.name
          }
        })
      }


      if (this.type === "add" || this.type === "copy") {
        this.$jlEvent("trialCheck")
          .then(() => {
            add({

              missionTitle: row.missionTitle,
              stime: row.stime,
              etime: row.etime,
              etimePub: row.etimePub,
              peopleNum: row.peopleNum,
              wage: row.wage,
              wageUnitCategory: row.wageUnitCategory,
              tradeId: row.tradeId,
              tradeNames: row.tradeNames,
              worktypeIds: row.workSkills[0],
              worktypeNames: row.worktypeNames,
              skillIds: row.workSkills[1],
              skillNames: row.skillNames,
              missionDesc: row.missionDesc,
              userNature: row.userNature,
              sex: row.sex,
              ageDesc: row.ageDesc,
              education: row.education,
              experienceDesc: row.experienceDesc,
              missionCompanyName: row.missionCompanyName,
              missionCompanyScale: row.missionCompanyScale,
              missionCompanyIndustry: row.missionCompanyIndustry,
              missionCompanyNature: row.missionCompanyNature,
              missionCompanyDescription: row.missionCompanyDescription,
              callName: row.callName,
              callTel: row.callTel,
              callNumber: row.callNumber,
              cityId: row.cityId,
              address: row.address,
              lat: row.lat,
              lon: row.lon,
            }).then(
              () => {
                this.drawer = false;
                done();
                this.$message({
                  type: "success",
                  message: "操作成功!",
                });
                this.$emit("back");
              },
              (error) => {
                window.console.log(error);
                done();
              }
            );
          })
          .catch(() => {
            done();
          });
      } else if (this.type === "edit") {
        update({
          id: this.id,
          missionTitle: row.missionTitle,
          stime: row.stime,
          etime: row.etime,
          etimePub: row.etimePub,
          peopleNum: row.peopleNum,
          wage: row.wage,
          wageUnitCategory: row.wageUnitCategory,
          tradeId: row.tradeId,
          tradeNames: row.tradeNames,
          worktypeIds: row.workSkills[0],
          worktypeNames: row.worktypeNames,
          skillIds: row.workSkills[1],
          skillNames: row.skillNames,
          missionDesc: row.missionDesc,
          userNature: row.userNature,
          sex: row.sex,
          ageDesc: row.ageDesc,
          education: row.education,
          experienceDesc: row.experienceDesc,
          callName: row.callName,
          callTel: row.callTel,
          callNumber: row.callNumber,
          cityId: row.cityId,
          address: row.address,
          lat: row.lat,
          lon: row.lon,
        }).then(
          () => {
            this.drawer = false;
            done();
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            this.$emit("back");
          },
          (error) => {
            window.console.log(error);
            done();
          }
        );
      }
      }

    },
    clearValidator(val){
      this.$refs.form.clearValidate(val);
    },
    onLoad(row, type) {
      this.type = type;
      this.id = row.id;
      this.$nextTick(() => {
        if(type!='edit'){
          // getLastTaskInfo().then(res=>{
          //   const data=res.data.data;
          //   this.obj.callName=data.callName;
          //   this.obj.callTel=data.callTel;
          // })
        }

        if (type === "copy") {
          this.title = "复制任务";
          detail(row.missionNo).then((res) => {
            if (![1, 2].includes(res.wageUnitCategory)) {
              res.wageUnitCategory = null;
            }
            this.obj = res;
            this.obj.etimePub = "";
            this.obj.stime = "";
            this.obj.etime = "";
            this.drawer = true;
          });
        } else if (type === "add") {
          this.title = "发布任务";
          this.obj = {
            wageUnitCategory: 2,
            sex: 0,
            ageDesc: "不限年龄",
            education: 7,
            experienceDesc: "不限经验",
            userNature:"灵活用工"
          };
          this.selectedSkills = [];
          this.drawer = true;
          this.$nextTick(() =>{
            this.$refs.form.clearValidate();
          })
          if (this.$refs.selectMap) {
            this.$refs.selectMap.geolocation();
          }
        } else if (type === "edit") {
          this.title = "编辑任务";
          detail(row.missionNo).then((res) => {
            console.log(res)
            this.obj = res;
            this.obj.workSkills = []
            this.obj.workSkills.push(res.worktypeIds)
            this.obj.workSkills.push(res.skillIds)
            this.drawer = true;
            // let tradeIdState = this.tradeIdAttr.indexOf(this.obj.tradeId);
          });
        }
      });
    },
  },
  mounted() {

    }
};
</script>
<style scoped>
.el-col,
.el-form-item {
  margin-bottom: 0px;
}
</style>
<style>
.input-with-select {
  width: 100%;
}
.copy-form .el-input-group__append {
  background-color: #fff;
}
.input-with-select .el-input-group__append .el-input__icon {
  display: none;
}
.input-with-select .el-input-group__append input {
  width: 105px;
  padding: 0;
  text-align: center;
}

.my-autocomplete li{
  line-height: normal;
    padding: 7px;
}
.my-autocomplete li .name{
    text-overflow: ellipsis;
    overflow: hidden;
}
.my-autocomplete li .addr{
    font-size: 12px;
    color: #b4b4b4;
}
.my-autocomplete li .highlighted .addr{
    color: #ddd;
}
.tradeId .el-autocomplete{
  width:100%;
}
.tradeId .el-icon-plus:before{
    content: "\e6d9 添加行业类型";
    color: #606266;
}
.tradeId .el-input--small input{
  padding-right: 150px;
}
</style>
