<template>

  <div v-if="detailData">
    <el-row>
      <el-col :span="24">企业认证审核</el-col>
    </el-row>
    <el-row>
      <el-col :span="16">
        <el-image
          style="width: 50px; height: 50px"
          :src="detailData.verifying && detailData.verifying.icon_url"
        ></el-image>
      </el-col>
      <el-col :span="8">
        <el-button size="mini" @click="userinfo(detailData.verifying.uid)" type="info">用户信息</el-button>
        <el-button size="mini" @click="woinfo(detailData.verifying.uid)" type="info">主页</el-button>
        <el-button size="mini" @click="returnPage()" type="info">返回</el-button>
      </el-col>
    </el-row>
    <div style="height: 8px;background: #F7F7F7"></div>
    <el-row style="padding: 14px;">
      <el-col :span="18">
        <span class="h2-title">企业认证</span>
      </el-col>
      <el-col :span="5">
        <el-button size="mini">{{this.company_verify_status}}</el-button>
        <el-link @click="companyVerifyStatus(detailData.verifying.uid)" type="primary">查看详情</el-link>
      </el-col>
    </el-row>
    <div style="height: 8px;background: #F7F7F7"></div>
    <div v-if="detailData.companyInfo.base">
      <el-row style="padding: 14px;">
        <el-col :span="19">
          <span class="h2-title">基本信息</span>
        </el-col>
      </el-row>
      <div style="height: 2px;background: #F7F7F7;margin-bottom:20px;"></div>

      <el-row style="margin-left: 14px;">
        <el-col :span="2">
          <el-image style="width: 50px; height: 50px" :src="detailData.companyInfo.base.logo"></el-image>
        </el-col>
        <el-col :span="22">
          {{detailData.companyInfo.applyInfo.name}}
        </el-col>
      </el-row>
      <br>
      <el-row style="margin-left: 14px;">
        <el-col :span="4">
          <span class="title-text">企业联系人</span><span
          class="content-text">{{detailData.companyInfo.applyInfo.name}}</span>
        </el-col>
        <el-col :span="4">
          <span class="title-text">联系方式</span><span
          class="content-text">{{detailData.companyInfo.applyInfo.phone}}</span>
        </el-col>
      </el-row>
      <br>
      <el-row style="margin-left: 14px;">
        <el-col :span="20">
          <span class="title-text">企业介绍</span>
          <span class="content-text">
            {{detailData.companyInfo.base.description}}
          </span>
        </el-col>
      </el-row>
    </div>

    <div style="height: 8px;background: #F7F7F7;margin-top:10px;margin-bottom: 10px;"></div>
    <el-row>
      <el-row style="padding: 14px 20px;font-size:16px;font-weight:500;color:rgba(29,42,58,1);line-height:22px;">
        已认证解决方案
      </el-row>
      <div style="padding-left: 20px;" v-if="detailData.verifyList">
        <el-row v-for="item in detailData.verifyList" :key="item.id"
                @click.native="jumpToDetail(item)"
                style="margin-bottom:18px; padding: 10px; cursor: pointer;">
          <el-col :span="3">
            <el-image
              style="width: 100px; height: 100px"
              :src="item.images"
            ></el-image>
          </el-col>
          <el-col :span="15">
            <h3>{{item.title}}</h3>
            <br>
            <p>方案简介:{{item.description}}</p>
            <p>成功案例:{{item.successCase || '暂未添加'}}</p>
            <p>
              <el-tag type="primary"> {{item.tech_type_name}}</el-tag>
            </p>
          </el-col>
          <el-col :span="6">
            <p>当前状态
              <el-tag type="success">{{item.status_name}}</el-tag>
            </p>
            <br>
            <p>
              <el-button size="mini" @click.stop="jumpToCheck(item)" type="info">重新审核</el-button>
            </p>
          </el-col>
        </el-row>
      </div>
    </el-row>
    <div style="height: 8px;background: #F7F7F7;margin-top:10px;margin-bottom: 10px;"></div>
    <div style="padding-left: 20px;">

      <el-row>
        <el-row style="padding: 5px;margin-bottom: 10px;">
          <span class="h2-title">当前申请</span>
        </el-row>
        <el-row
          style="padding: 10px; box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);"
        >
          <el-col :span="3">
            <el-image
              style="width: 100px; height: 100px"
              :src="detailData.verifying.images"
            ></el-image>
          </el-col>
          <el-col :span="15">
            <h3 @click="jumpToDetail(detailData.verifying)">{{detailData.verifying.title}}</h3>
            <br>
            <p>方案简介:{{detailData.verifying.description}}</p>
            <p>成功案例:{{detailData.verifying.successCase || '暂未添加'}}</p>
            <p style="margin: 3px;">
              领域：
              <el-tag  type="primary" v-for="(cat, idx) in bindCatData" style="margin: 0 3px;">{{cat['name']}}</el-tag>
              <el-button type="text" @click="bindCat" ><i class="el-icon-edit"></i></el-button>
            </p>
            <p style="margin: 3px;">
              标签：
              <el-tag type="success" v-for="(tag, idx) in bindTagData" style="margin: 0 3px;">{{tag['name']}}</el-tag>
              <el-button type="text" @click="addTag" ><i class="el-icon-edit"></i></el-button>
            </p>
            <p style="margin: 3px;" v-if="detailData.verifying.industry_name != null && detailData.verifying.tech_type_name != null">
              旧领域：
              <el-tag type="success"> {{detailData.verifying.industry_name}}</el-tag>
              <el-tag type="primary"> {{detailData.verifying.tech_type_name}}</el-tag>
              <el-button type="text" @click="showEdit" ><i class="el-icon-edit"></i></el-button>
            </p>
          </el-col>
          <el-col :span="6">
            <p>当前状态:
              <el-tag :type="verifying_status"> {{detailData.verifying.status_name}}</el-tag>
            </p>
            <br/>
            <p>颗粒度:
              <el-tag type="primary" v-if="detailData.verifying.dimension == 1">产品</el-tag>
              <el-tag type="warning" v-else>集合</el-tag>
            </p>
            <br/>
            <p>是否优选:
              <el-tag type="success" v-if="choice">是</el-tag>
              <el-tag type="warning" v-else>否</el-tag>
            </p>
            <br/>
            <div v-if="detailData.verifying.source == 1">
              <p>来源:
                <el-tag type="success">用户</el-tag>
              </p>
              <br/>
              <el-button type="primary" @click.stop="editSolutionInfo">修改信息</el-button>
            </div>
            <div v-else>
              <p>来源:
                <el-tag type="warning">爬虫</el-tag>
              </p>
              <br/>
              <el-button type="primary" @click.stop="editSolutionInfo">修改信息</el-button>
            </div>


          </el-col>
        </el-row>
      </el-row>
      <br>
      <el-row>
        <el-radio @change="refuse()" v-model="radio" label="3">拒绝</el-radio>
        <el-radio @change="pass()" v-model="radio" label="2">通过</el-radio>
      </el-row>
      <br>
      <el-row>
        <h4 style="border-bottom: solid 1px brown">邮件内容</h4>
        <el-row v-if="show" id="emailRefuseInfo">
          <p>Hi,{{detailData.verifying.nickname}},您好!</p>
          <p>谢谢您的申请</p>
          <p>您的解决方案 {{detailData.verifying.title}} 暂时不符合我们的认证标准,主要原因是:</p>
          <el-input v-model="reason" placeholder="请输入内容"></el-input>
          <p>您可以满足以上要求后,继续申请认证.</p>
          <p>谢谢您的支持!</p>
          <p>程序员客栈敬上:)</p>
        </el-row>
        <el-row v-else id="emailPassInfo">
          <p>Hi,{{detailData.verifying.nickname}},您好!</p>
          <p>恭喜您的解决方案 {{detailData.verifying.title}} 通过审核！</p>
          <p>谢谢您的支持!</p>
          <p>程序员客栈敬上:)</p>
        </el-row>
        <br>
        <el-button @click="sendEmail(detailData.verifying)" size="mini" type="primary">确定并发送邮件</el-button>
      </el-row>
    </div>
    <br>
    <el-dialog title="更新解决方案" :visible.sync="showEditStatus">
      <el-form :model="form">
        <el-form-item label="行业领域" :label-width="formLabelWidth">
          <el-select v-model="form.industry" placeholder="请选择行业领域">
            <template v-for="industry in industries">
              <el-option :label="industry['name']" :value="industry['id']"></el-option>
            </template>
          </el-select>
        </el-form-item>
        <el-form-item label="技术分类" :label-width="formLabelWidth">
          <el-select v-model="form.tech_type" placeholder="请选择技术分类">
            <template v-for="tech_type in tech_types">
              <el-option :label="tech_type['name']" :value="tech_type['id']"></el-option>
            </template>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showEditStatus = false">取 消</el-button>
        <el-button type="primary" @click="updateSolution">确 定</el-button>
      </div>
    </el-dialog>

    <!--        关联领域 start -->
    <el-dialog
      :title="bindCatForm.title"
      :visible.sync="bindCatDialog"
      width="40%">
      <el-form ref="form" :model="bindCatForm" label-width="100px">
        <el-form-item>
          <p slot="label">选择分类<span style="color:red;">*</span></p>
          <el-cascader
            v-model="bindCatForm.cats"
            :options="bindCatForm.classes"
            :props="props"
            clearable></el-cascader>
        </el-form-item>
        <el-form-item>
          <p slot="label">服务方式<span style="color:red;">*</span></p>
          <el-select v-model="bindCatForm.serviceType" multiple filterable @change="selectChange" placeholder="请选择">
            <el-option
              v-for="item in bindCatForm.serviceTypes"
              :key="item.hash_id"
              :label="item.name"
              :value="item.hash_id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="catSub">提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--        关联领域 end -->

    <!--        关联标签 start -->
    <el-dialog
      :title="bindTagForm.title"
      :visible.sync="bindTagDialog"
      width="40%">
      <el-form ref="form" :model="bindTagForm" label-width="100px">
        <el-form-item>
        <p slot="label">标签<span style="color:red;">*</span></p>
        <el-select v-model="bindTagForm.bindTags" multiple filterable @change="selectChange" placeholder="请选择标签">
          <el-option
            v-for="item in bindTagForm.tagDatas"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="tagSub">提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--        关联标签 end -->

    <!--        设置优选 start -->
    <el-dialog
      title="设置优选服务"
      :visible.sync="choiceDialog"
      width="40%">
      <el-form ref="form" label-width="100px">
        <el-form-item>
          <p slot="label">标题</p>
          <el-input v-model="tempTitle" placeholder="请输入标题"></el-input>
        </el-form-item>
        <el-form-item>
          <p slot="label">简介</p>
          <el-input v-model="tempDescription" placeholder="请输入简介"></el-input>
        </el-form-item>
        <el-form-item>
          <p slot="label">状态</p>
          <el-select v-model="tempStatus" placeholder="请选择状态">
            <el-option
              v-for="item in statusData"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <p slot="label">颗粒度</p>
          <el-select v-model="tempDimension" placeholder="请选择颗粒度">
            <el-option
              v-for="item in dimensionData"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
        <p slot="label">优选服务</p>
          <el-switch
            v-model="is_choice">
          </el-switch>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="choiceSub">提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--        设置优选 end -->

    <el-row style="border-bottom: solid 3px green">
      审核记录
    </el-row>
    <br>
    <el-row v-for="item in detailData.audit_record" :key="item.id" style=" box-shadow: 0 2px 4px #ccc, 0 0 6px #ccc">
      <el-col :span="18"><h4 style="border-bottom: solid 1px brown;padding: 10px">{{item.status_name}}</h4></el-col>
      <el-col :span="6"><p
        style="border-bottom: solid 1px brown;padding: 10px">{{item.nickname}} {{item.audit_time}}</p></el-col>
      <p style="padding: 10px">邮件内容</p>
      <div v-html="item.audit_data" style="background-color: #ccc;padding: 10px">
        {{item.audit_data}}
      </div>
    </el-row>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        props: { multiple: true },
        id: '',
        detailData: '',
        radio: '3',
        reason: '',
        company_verify_status: '未认证',
        show: true,
        showEditStatus: false,
        form: {},
        formLabelWidth: '120px',
        industries: [],
        tech_types: [],
        bindCatForm: {},
        bindTagForm: {},
        bindCatDialog: false,
        bindTagDialog: false,
        choiceDialog: false,
        bindCatData: [],
        bindTagData: [],
        catData:[],
        class_map:[],
        serviceTypeData: [],
        tag_map: {},
        is_choice: false,
        choice: false,
        statusData:[
          {'id':'0',name:'草稿'},
          {'id':'1',name:'审核'},
          {'id':'2',name:'通过'},
          {'id':'3',name:'拒绝'},
          {'id':'4',name:'下架'},
        ],
        dimensionData:[
          {'id':'1',name:'产品'},
          {'id':'2',name:'集合'},
        ],
        tempTitle:'',
        tempDescription:'',
        tempStatus:'',
        tempDimension:'',
      }
    },
    mounted() {
      this.id = this.$route.query.id;
      this.getDetail();
      this.getOptions();
    },
    computed: {
      verifying_status() {
        if (this.detailData.verifying.status_name) {
          switch (this.detailData.verifying.status_name) {
            case "审核通过":
              return "success";
            case "审核拒绝":
              return "danger";
            default:
              return "info"

          }
        }
      },
      checked_status(name) {
        if (name) {
          switch (name) {
            case "审核通过":
              return "success";
            case "审核拒绝":
              return "danger";
            default:
              return "info"
          }
        }
      }
    },
    methods: {
      showEdit() {
        event.stopPropagation()
        this.showEditStatus = true;
      },
      async updateSolution() {
        if (!this.form.industry) {
          this.$message.error('请选择行业');
          return;
        }
        if (!this.form.tech_type) {
          this.$message.error('请选择技术类型');
        }
        let res = await this.$post('/api/admin/kaifawu/changeTag', {
          id: this.id,
          industry: this.form.industry,
          tech_type: this.form.tech_type
        });
        if (res.status === 1) {
          this.showEditStatus = false;
          this.$message.success('修改成功');
          this.getDetail();
        }
      },
      async getOptions() {
        let res = await this.$post("/api/admin/kaifawu/getOptions");
        this.industries = res.data.industries;
        this.tech_types = res.data.tech_types;
      },
      async getDetail() {
        const id = this.id;
        const page = 1;
        const data = {
          id,
          page
        };
        let res = await this.$post("/api/admin/kaifawu/getDetail", data);
        if (res && res.status === 1) {
          res.data.verifying = res.data.verifying || {}
          if(res.data.verifying.is_choice == 1){
            this.is_choice = true;
            this.choice = true;
          }else{
            this.is_choice = false;
            this.choice = false;
          }
          this.detailData = res.data;
          this.tempTitle = this.detailData.verifying.title;
          this.tempDescription = this.detailData.verifying.description;
          this.tempStatus = this.detailData.verifying.status;
          this.tempDimension = this.detailData.verifying.dimension;
          switch (this.detailData.companyInfo.applyInfo.status) {
            case '0':
              this.company_verify_status = '未申请';
              break;
            case '1':
              this.company_verify_status = '申请中';
              break;
            case '2':
              this.company_verify_status = '通过';
              break;
            case '3':
              this.company_verify_status = '拒绝';
              break;
          }

        }

        let cat_res = await this.$post("/api/admin/kaifain/getClasses", data);
        if(cat_res && cat_res.status === 1){
          this.bindCatForm.classes = cat_res.data.classes;
          this.bindCatForm.serviceTypes = cat_res.data.serviceTypes;
        }

        let bind_cat_res = await this.$post("/api/admin/kaifain/getSpCat", data);
        if(bind_cat_res && bind_cat_res.status === 1){
          this.bindCatData = bind_cat_res.data.list;
        }
        let cat_class = this.bindCatForm.classes;
        for(let i = 0; i < cat_class.length; i++){
          let children = cat_class[i]['children']
          for(var j = 0; j < children.length; j++){
            this.class_map[children[j].value] = cat_class[i].value;
          }
        }

        let b_tag_res = await this.$post("/api/admin/kaifain/getSpTag", data);
        if(b_tag_res && b_tag_res.status === 1){
          this.bindTagData = b_tag_res.data.list;
          this.bindTagForm.bindTags = [];
          for(let k=0; k < this.bindTagData.length; k++){
            this.bindTagForm.bindTags.push(this.bindTagData[k]['tag_id']);
          }
        }

        let tag_res = await this.$post("/api/admin/CpsManage/listTags", {});
        if(tag_res.status == 1){
          this.bindTagForm.tagDatas = tag_res.data;
          let maps = {};
          let data = tag_res.data;
          for(let t = 0; t < data.length; t++){
            maps[data[t].id] = data[t].name;
          }
          this.tag_map = maps;
        }
      },

      async userinfo(uid) {
        let url = window.location.href;

        window.open(this.$store.state.domainConfig.siteUrl + `/rooter/user/${uid}`)
      },
      async woinfo(uid) {
        let url = window.location.href;

        window.open(this.$store.state.domainConfig.siteUrl + `/wo/${uid}`)

      },
      async returnPage() {
        let url = window.location.href;
        window.open(`/main/solution/`, '_self')
      },
      async companyVerifyStatus(uid) {
        let url = window.location.href;

        window.open(this.$store.state.domainConfig.siteUrl + `/rooter/companyVerifyAuditItem?uid=${uid}`)

      },
      async updateStatus(item) {
        const result = 3;
        const auditData = '您的解决方案' + item.title + '审核被拒绝!';
        const data = {
          'id': item.id,
          result,
          auditData
        };
        let res = await this.$post("/api/admin/kaifawu/auditProvider", data);
        if (res && res.status === 1) {
          this.$message({
            message: '修改成功!',
            type: 'success'
          });
          this.getDetail()
        }
      },
      async sendEmail(item) {
        const result = this.radio;
        let auditData = '';
        auditData = this.reason;
        if (this.show && (this.reason.length == 0)) {
          this.$message({
            message: '请输入拒绝原因!',
            type: 'warning'
          });
          return false;
        }

        const data = {
          'id': item.id,
          result,
          auditData
        };

        let res = await this.$post("/api/admin/kaifawu/auditProvider", data);
        if (res && res.status === 1) {
          this.$message({
            message: '修改成功!',
            type: 'success'
          });
          this.getDetail()
        }
      },
      async refuse() {
        this.show = true;
      },
      async pass() {
        this.show = false;
      },
      async jumpToDetail(item) {
        const {id, hash_id} = item
        let url = window.location.href;
        // window.open(this.$store.state.domainConfig.kaifainUrl + `/s/${hash_id}`, '_black')
        window.open('https://kaifain.proginn.com'+ `/s/${hash_id}`, '_black')
      },
      async jumpToCheck(item) {
        const {id} = item
        window.open(`/main/solution_detail?id=${id}`, '_self')
      },
      bindCat (){
        event.stopPropagation()
        this.catData = [];
        this.serviceTypeData = [];
        let b_data = this.bindCatData;
        for(let i = 0; i < b_data.length; i++){
          let c_id = b_data[i].cat_id;
          if(this.class_map[c_id] !== undefined){
            let p_id = this.class_map[b_data[i].cat_id];
            this.catData.push([p_id, c_id]);
          }else{
            this.serviceTypeData.push(c_id)
          }
        }

        this.bindCatForm.cats = this.catData;
        this.bindCatForm.serviceType = this.serviceTypeData;
        this.bindCatForm.title = '关联领域';
        this.bindCatDialog = true;
      },
      async catSub() {
        if(!this.bindCatForm.cats || this.bindCatForm.cats.length <1){
          this.$message({
            type: "error",
            message: '分类不能为空'
          });
          return false;
        }
        if(!this.bindCatForm.serviceType || this.bindCatForm.serviceType.length <1){
          this.$message({
            type: "error",
            message: '服务方式不能为空'
          });
          return false;
        }
        let f_cats = this.bindCatForm.cats;
        let serviceType = this.bindCatForm.serviceType;
        let cats = new Array();
        for(let i = 0; i < f_cats.length; i++){
          cats.push(f_cats[i][1]);
        }

        let data = {
          id: this.id,
          cats: JSON.stringify(cats),
          serviceType: JSON.stringify(serviceType),
        }
        let bind_res = await this.$post("/api/admin/kaifain/bindCat", data);
        if(bind_res && bind_res.status === 1){
          this.$message({
            type: "success",
            message: "新增成功!"
          });
          this.resetCat();
          this.bindCatDialog = false;
        }

      },
      async resetCat(){
        const id = this.id;
        const page = 1;
        const data = {
          id,
          page
        };
        let bind_cat_res = await this.$post("/api/admin/kaifain/getSpCat", data);
        if(bind_cat_res && bind_cat_res.status === 1){
          this.bindCatData = bind_cat_res.data.list;
        }

        let cat_class = this.bindCatForm.classes;
        for(let i = 0; i < cat_class.length; i++){
          let children = cat_class[i]['children']
          for(var j = 0; j < children.length; j++){
            this.class_map[children[j].value] = cat_class[i].value;
          }
        }
      },
      addTag(){
        event.stopPropagation();
        this.bindTagForm.title = '标签管理';
        this.bindTagDialog = true;
      },
      async tagSub() {
        let tags = this.bindTagForm.bindTags;
        let tagData = [];
        if(tags && tags.length > 0){
          for(let i = 0; i < tags.length; i++){
            tagData.push({'tag_id':tags[i], 'name':this.tag_map[tags[i]]})
          }
        }

        let data = {
          id: this.id,
          tags: JSON.stringify(tagData),
        }
        let bind_res = await this.$post("/api/admin/kaifain/bindTag", data);
        if(bind_res && bind_res.status === 1){
          this.$message({
            type: "success",
            message: "更新成功!"
          });
          this.resetTag();
          this.bindTagDialog = false;
        }
      },
      async resetTag(){
        const id = this.id;
        const page = 1;
        const data = {
          id,
          page
        };
        let b_tag_res = await this.$post("/api/admin/kaifain/getSpTag", data);
        if(b_tag_res && b_tag_res.status === 1){
          this.bindTagData = b_tag_res.data.list;
          this.bindTagForm.bindTags = [];
          for(let k=0; k < this.bindTagData.length; k++){
            this.bindTagForm.bindTags.push(this.bindTagData[k]['tag_id']);
          }
        }
      },
      editSolutionInfo() {
        if(this.choice){
          this.is_choice = true;
        }else{
          this.is_choice = false;
        }

        this.choiceDialog = true;
      },
      async choiceSub() {
        if(!this.tempTitle){
          this.$message({
            type: "error",
            message: "标题不能为空"
          });
          return false;
        }
        if(!this.tempDescription){
          this.$message({
            type: "error",
            message: "标题不能为空"
          });
          return false;
        }
        if(!this.tempStatus){
          this.$message({
            type: "error",
            message: "标题不能为空"
          });
          return false;
        }
        if(!this.tempDimension){
          this.$message({
            type: "error",
            message: "标题不能为空"
          });
          return false;
        }
        let data = {
          id: this.id,
          is_choice: this.is_choice?1:0,
          title: this.tempTitle,
          description: this.tempDescription,
          status: this.tempStatus,
          dimension: this.tempDimension,
        }
        let bind_res = await this.$post("/api/admin/kaifain/editInfo", data);
        if(bind_res && bind_res.status === 1){
          this.$message({
            type: "success",
            message: "编辑成功!"
          });
          switch (this.tempStatus) {
            case '0':
              this.detailData.verifying.status_name = '草稿';
              break;
            case '1':
              this.detailData.verifying.status_name = '待审核';
              break;
            case '2':
              this.detailData.verifying.status_name = '审核通过';
              break;
            case '3':
              this.detailData.verifying.status_name = '审核拒绝';
              break;
            default:
              this.detailData.verifying.status_name = '已下架';
              break;
          }

          this.detailData.verifying.title = this.tempTitle;
          this.detailData.verifying.description = this.tempDescription;
          this.detailData.verifying.status = this.tempStatus;
          this.detailData.verifying.dimension = this.tempDimension;
          this.choice = this.is_choice?true:false;
          this.choiceDialog = false;
        }
      },
      selectChange(){
        this.$forceUpdate();
      }
    }

  }
</script>

<style lang="scss" scoped>

  .header {
    display: flex;
  }

  .title-wrapper {
    display: flex;
    align-items: center;
  }

  .title {
    line-height: 27px;
    font-weight: bold;
    font-size: 18px;
    color: #101010;
  }

  .h2-title {
    font-size: 16px;
    font-weight: 500;
    color: rgba(29, 42, 58, 1);
    line-height: 22px;

  }

  .status {
    margin-left: 6px;
    line-height: 20px;
    font-size: 14px;
  }

  .salary {
    margin-top: 13px;
    line-height: 24px;
    font-size: 16px;
    color: #101010;
  }

  .skill {
    margin-top: 8px;
    line-height: 24px;
    font-size: 16px;
    color: #101010;
  }

  .experience {
    margin-top: 8px;
    line-height: 24px;
    font-size: 16px;
    color: #101010;
  }

  .owner-wrapper {
    margin-left: 100px;
    text-align: center;
  }

  .owner-img {
    width: 53px;
    height: 53px;
    border-radius: 50%;
  }

  .owner-name {
    margin-top: 8px;
    line-height: 20px;
    font-size: 14px;
    color: #3F51B5;
  }

  .title-text {
    font-size: 13px;
    font-weight: 400;
    color: rgba(153, 153, 153, 1);
    line-height: 18px;
    margin-right: 6px;
  }

  .content-text {
    font-size: 13px;
    color: rgba(51, 51, 51, 1);
    line-height: 18px;
    white-space: normal;
  }

  .description-wrapper {
    margin-top: 22px;
  }

  .description-title {
    line-height: 27px;
    font-weight: bold;
    font-size: 18px;
    color: #101010;
  }

  .description-content {
    margin-top: 16px;
    line-height: 24px;
    font-size: 16px;
    color: #101010;
  }
</style>
