<template> 
 | 
    <GlobalWindow 
 | 
        :title="title" 
 | 
        width="100%" 
 | 
        :visible.sync="visible" 
 | 
        :confirm-working="isWorking" 
 | 
        @confirm="confirm" 
 | 
    > 
 | 
        <div class="desc"> 
 | 
            <div class="desc_item"> 
 | 
                <div class="desc_item_label" v-if="userInfo.type === 1 &&(model.statusCollect === 2 || model.statusCollect === 3)"> 
 | 
                    <div class="desc_item_label_left"> 
 | 
                        <span>保险到期还有 <b style="color: #F95601;">{{model.loseEfficacyDays ? model.loseEfficacyDays : '-'}}</b> 天</span> 
 | 
                        <el-button type="primary" v-if="model.statusCollect === 2 || model.statusCollect === 3" @click="$refs.OperaInsuranceApply.open('投保申请', { id: dataId })">一键续保</el-button> 
 | 
                        <el-button type="primary" v-if="model.statusCollect === 2" @click="$refs.additionSubtractionApplication.open('加减保申请', { id: dataId })">加减保申请</el-button> 
 | 
                        <el-button type="primary" v-if="model.statusCollect === 2" @click="$refs.factoryChange.open('换厂申请', { id: dataId })">换厂申请</el-button> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <div class="desc_item_label"> 
 | 
                    <div class="desc_item_label_left"> 
 | 
                        <span>投保企业:{{ model.companyName }}</span> 
 | 
                      <span>保单状态:<span  :class="'apply-status'+model.status" >{{ model.statusInfo }}</span></span> 
 | 
                        <span>提交时间:{{ model.createDate }}</span> 
 | 
                    </div> 
 | 
                  <div class="desc_item_label_right"> 
 | 
                      <template v-if="userInfo.type === 1"> 
 | 
                          <el-button v-if="[0, 2, 3, 10].includes(model.status)" type="danger" @click="$refs.applyReturn.open('申请退回', {id: dataId})">申请退回</el-button> 
 | 
                          <el-button v-if="model.status == 4" type="primary" @click="$refs.OperaInsuranceApply.open('投保申请', {id: dataId})">再次投保</el-button> 
 | 
                          <el-button type="primary" @click="$refs.InsuranceDetails.open('投保详情单',model,0)">导出详单</el-button> 
 | 
                          <el-button v-if="[2, 3, 5, 7, 8].includes(model.status)" type="primary" @click="viewToubaodan">查看投保单</el-button> 
 | 
                          <el-button v-if="model.status == 5" type="primary" @click="viewBaoxiandan">查看保险单</el-button> 
 | 
                          <el-button v-if="model.status == 2" type="primary" @click="goSign">签署投保单</el-button> 
 | 
                      </template> 
 | 
                    <template v-else> 
 | 
                      <el-button type="primary" @click="$refs.InsuranceDetails.open('投保详情单',model,0)">导出详单</el-button> 
 | 
                      <el-button v-if="[2, 3, 5, 7, 8].includes(model.status)" type="primary" @click="viewToubaodan">查看投保单</el-button> 
 | 
                      <el-button v-if="model.status == 5" type="primary" @click="viewBaoxiandan">查看保险单</el-button> 
 | 
                      <el-button v-if="model.status == 10" type="primary" @click="$refs.OperaInsuranceApplyCheckWindow.open('上传投保单',model,2)">上传投保单</el-button> 
 | 
                      <el-button v-if="model.status == 3" type="primary" @click="$refs.OperaInsuranceApplyCheckWindow.open('上传保险单',model,3)">上传保险单</el-button> 
 | 
                      <el-button  v-if="model.status == 6 || model.status == 7|| model.status == 8" type="primary" @click="$refs.OperaInsuranceApplyCheckWindow.open('驳回退回申请',model,5)">驳回退回申请</el-button> 
 | 
                      <el-button v-if="model.status == 0" type="primary" @click="$refs.InsuranceDetails.open('投保审核',model,1)">投保审核</el-button> 
 | 
                      <el-button v-if="model.status != 5 && model.status != 4 && model.status != 1" type="danger" @click="$refs.OperaInsuranceApplyCheckWindow.open('退回投保',model,1)">退回投保</el-button> 
 | 
                      <el-button v-if="model.status == 5" type="danger" @click="$refs.OperaInsuranceApplyCheckWindow.open('修改保险单',model,4)">修改保险单</el-button> 
 | 
                    </template> 
 | 
                  </div> 
 | 
                </div> 
 | 
                <div class="desc_item_from"> 
 | 
                    <el-table 
 | 
                        :data="tableData" 
 | 
                        border 
 | 
                        style="width: 100%"> 
 | 
                        <el-table-column 
 | 
                            prop="code" 
 | 
                            align="center" 
 | 
                            label="保单号"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="solutionsName" 
 | 
                            label="保险方案" 
 | 
                            align="center" 
 | 
                            width="180"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="startTime" 
 | 
                            align="center" 
 | 
                            label="保险生效起期"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="endTime" 
 | 
                            align="center" 
 | 
                            label="保险生效止期"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="insureNum" 
 | 
                            align="center" 
 | 
                            label="投保人数"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="serviceDays" 
 | 
                            align="center" 
 | 
                            label="在保时长(天)"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="currentFee" 
 | 
                            align="center" 
 | 
                            label="产生费用(元)"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="fee" 
 | 
                            align="center" 
 | 
                            label="总费用(元)"> 
 | 
                        </el-table-column> 
 | 
                    </el-table> 
 | 
                </div> 
 | 
                <div class="desc_item_cate"> 
 | 
                    <el-tabs v-model="activeName" @tab-click="handleClick"> 
 | 
                        <el-tab-pane label="在保人员" name="0"></el-tab-pane> 
 | 
                        <el-tab-pane label="加/减保记录" name="1"></el-tab-pane> 
 | 
                        <el-tab-pane label="换厂记录" name="2"></el-tab-pane> 
 | 
                    </el-tabs> 
 | 
                </div> 
 | 
                <div class="desc_item_search"> 
 | 
                    <el-form :inline="true" :model="formInline" ref="sou" class="demo-form-inline"> 
 | 
                        <el-form-item label="在保状态" prop="applyStatus"> 
 | 
                            <el-select v-model="formInline.applyStatus" @change="search" placeholder="请选择"> 
 | 
                                <el-option label="全部" value="0"></el-option> 
 | 
                                <el-option label="保障中" value="1"></el-option> 
 | 
                                <el-option label="不在保" value="2"></el-option> 
 | 
                            </el-select> 
 | 
                        </el-form-item> 
 | 
                        <el-form-item label="派遣单位" prop="duId"> 
 | 
                            <el-select v-model="formInline.duId" placeholder="请选择" @change="search"> 
 | 
                                <el-option 
 | 
                                    v-for="item in dwList" 
 | 
                                    :key="item.id" 
 | 
                                    :label="item.name" 
 | 
                                    :value="item.id"> 
 | 
                                </el-option> 
 | 
                            </el-select> 
 | 
                        </el-form-item> 
 | 
                        <el-form-item label="所属工种" prop="workTypeId"> 
 | 
                            <el-select v-model="formInline.workTypeId" placeholder="请选择" @change="search"> 
 | 
                                <el-option 
 | 
                                    v-for="item in gzList" 
 | 
                                    :key="item.id" 
 | 
                                    :label="item.name" 
 | 
                                    :value="item.id"> 
 | 
                                </el-option> 
 | 
                            </el-select> 
 | 
                        </el-form-item> 
 | 
                        <el-form-item label="员工姓名" prop="memberName"> 
 | 
                            <el-input v-model="formInline.memberName" placeholder="请输入" @keypress.enter.native="search"></el-input> 
 | 
                        </el-form-item> 
 | 
                        <el-form-item label="保险生效起期" prop="end"> 
 | 
                            <el-date-picker 
 | 
                                @change="changeStart" 
 | 
                                v-model="formInline.end" 
 | 
                                type="daterange" 
 | 
                                format="yyyy 年 MM 月 dd 日" 
 | 
                                value-format="yyyy-MM-dd" 
 | 
                                range-separator="至" 
 | 
                                start-placeholder="开始日期" 
 | 
                                end-placeholder="结束日期"> 
 | 
                            </el-date-picker> 
 | 
                        </el-form-item> 
 | 
                        <el-form-item label="保险生效止期" prop="start"> 
 | 
                            <el-date-picker 
 | 
                                @change="changeEnd" 
 | 
                                v-model="formInline.start" 
 | 
                                type="daterange" 
 | 
                                format="yyyy 年 MM 月 dd 日" 
 | 
                                value-format="yyyy-MM-dd" 
 | 
                                range-separator="至" 
 | 
                                start-placeholder="开始日期" 
 | 
                                end-placeholder="结束日期"> 
 | 
                            </el-date-picker> 
 | 
                        </el-form-item> 
 | 
                        <section> 
 | 
                            <el-button type="primary" @click="search">查询</el-button> 
 | 
                            <el-button @click="resetting">重置</el-button> 
 | 
                            <el-button type="primary" @click="exportExcel">导出名单</el-button> 
 | 
                        </section> 
 | 
                    </el-form> 
 | 
                </div> 
 | 
                <div class="desc_item_from"> 
 | 
                    <el-table 
 | 
                        :data="list" 
 | 
                        border 
 | 
                        style="width: 100%"> 
 | 
                        <el-table-column label="序号"> 
 | 
                            <template slot-scope="scope"> 
 | 
                                <span>{{scope.$index + 1}}</span> 
 | 
                            </template> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="memberName" 
 | 
                            label="员工姓名"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            label="性别"> 
 | 
                            <template slot-scope="{row}"> 
 | 
                                <span v-if="row.sex === 0">男</span> 
 | 
                                <span v-else>女</span> 
 | 
                            </template> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="idcardNo" 
 | 
                            label="身份证号"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="duName" 
 | 
                            label="派遣单位"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="workTypeName" 
 | 
                            label="所属工种"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="startTime" 
 | 
                            label="保险生效起期"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="endTime" 
 | 
                            label="保险生效止期"> 
 | 
                        </el-table-column> 
 | 
                        <el-table-column 
 | 
                            prop="fee" 
 | 
                            label="产生费用(元)"> 
 | 
                        </el-table-column> 
 | 
                    </el-table> 
 | 
                    <div class="desc_item_from_page"> 
 | 
                        <el-pagination 
 | 
                            @current-change="handleCurrentChange" 
 | 
                            :current-page="currentPage" 
 | 
                            :page-size="10" 
 | 
                            layout="total, prev, pager, next, jumper" 
 | 
                            :total="total"> 
 | 
                        </el-pagination> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <div class="desc_item_review"> 
 | 
                    <div class="desc_item_review_label">审核流程</div> 
 | 
                  <el-timeline :reverse="reverse"> 
 | 
                    <el-timeline-item 
 | 
                        v-for="(activity, index) in activities" 
 | 
                        :key="index"> 
 | 
                      <div style="display: flex; flex-direction: column;"> 
 | 
                                <span style="font-size: 16px; font-weight: 400; color: black;"> 
 | 
                                    {{activity.title}} 
 | 
                                    <span style="font-size: 16px; font-weight: 400; color: black; margin-left: 10px;" v-if="activity.objType === 5 || activity.objType === 6 || activity.objType === 1 || activity.objType === 2"> 
 | 
                                      {{activity.content}} 
 | 
                                    </span> 
 | 
                                </span> 
 | 
                        <span style="margin-top: 5px; font-size: 12px; font-weight: 400; color: #999999;"> 
 | 
                                    操作员-{{activity.creatorName}}({{activity.creatorType==1? activity.companyName: "平台端"}}){{activity.createDate}} 
 | 
                                </span> 
 | 
                      </div> 
 | 
                    </el-timeline-item> 
 | 
                  </el-timeline> 
 | 
                </div> 
 | 
            </div> 
 | 
        </div> 
 | 
        <InsuranceDetails ref="InsuranceDetails" @success="successEvent" /> 
 | 
        <OperaInsuranceApplyCheckWindow ref="OperaInsuranceApplyCheckWindow" @success="successEvent" /> 
 | 
        <!--    企业申请退回    --> 
 | 
        <applyReturn ref="applyReturn" @success="successEvent" /> 
 | 
        <!--    新增投保    --> 
 | 
        <OperaInsuranceApply ref="OperaInsuranceApply" @success="successEvent" /> 
 | 
        <!--    加减保申请    --> 
 | 
        <additionSubtractionApplication ref="additionSubtractionApplication" @success="successEvent" /> 
 | 
        <!--    换厂申请    --> 
 | 
        <factoryChange ref="factoryChange" @success="successEvent" /> 
 | 
      <template v-slot:footer> 
 | 
        <el-button @click="visible=false">返回</el-button> 
 | 
      </template> 
 | 
    </GlobalWindow> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseOpera from '@/components/base/BaseOpera' 
 | 
import GlobalWindow from '@/components/common/GlobalWindow' 
 | 
import InsuranceDetails from '@/components/business/InsuranceDetails' 
 | 
import OperaInsuranceApplyCheckWindow from '@/components/business/OperaInsuranceApplyCheckWindow' 
 | 
import additionSubtractionApplication from '@/components/enterprise/additionSubtractionApplication' 
 | 
import factoryChange from '@/components/enterprise/factoryChange' 
 | 
  
 | 
import applyReturn from '@/components/enterprise/applyReturn' 
 | 
import { getDetail, getSignLink, applyDetailPage, applyChagneDetailPage, exportExcel, applyChagneDetailExcel } from "@/api/business/insuranceApply"; 
 | 
import { findListByDTO } from "@/api/business/dispatchUnit"; 
 | 
import { findListByDTO as worktypeFindListByDTO } from "@/api/business/worktype"; 
 | 
import OperaInsuranceApply from '@/components/enterprise/OperaInsuranceApplyWindow' 
 | 
import { mapState } from 'vuex' 
 | 
  
 | 
export default { 
 | 
  name: 'OperaInsuranceApplyWindow', 
 | 
  extends: BaseOpera, 
 | 
  components: { 
 | 
      GlobalWindow, 
 | 
      InsuranceDetails, 
 | 
      OperaInsuranceApplyCheckWindow, 
 | 
      applyReturn, 
 | 
      OperaInsuranceApply, 
 | 
      additionSubtractionApplication, 
 | 
      factoryChange 
 | 
  }, 
 | 
  data () { 
 | 
    return { 
 | 
      // 表单数据 
 | 
      dataId:null, 
 | 
      model: {}, 
 | 
      form: { 
 | 
          id: null, 
 | 
          editDate: '' 
 | 
      }, 
 | 
      // 验证规则 
 | 
      rules: { 
 | 
      }, 
 | 
      formInline: { 
 | 
          applyStatus: '', 
 | 
          duId: '', 
 | 
          workTypeId: '', 
 | 
          memberName: '', 
 | 
          end: [], 
 | 
          start: [], 
 | 
          endTimeE: '', 
 | 
          endTimeS: '', 
 | 
          startTimeE: '', 
 | 
          startTimeS: '', 
 | 
          types: '' 
 | 
      }, 
 | 
      visible1: false, 
 | 
      visible2: false, 
 | 
      visible3: false, 
 | 
      visible4: false, 
 | 
      visible5: false, 
 | 
      reverse: false, 
 | 
      radio: 0, 
 | 
      activities: [], 
 | 
      tableData: [], 
 | 
        list: [], 
 | 
        dwList: [], 
 | 
        gzList: [], 
 | 
      activeName: '0', 
 | 
        total: 0, 
 | 
      currentPage: 1 
 | 
    } 
 | 
  }, 
 | 
  created () { 
 | 
      this.config({ 
 | 
          api: '/business/insuranceApply', 
 | 
          'field.id': 'id' 
 | 
      }) 
 | 
  }, 
 | 
    computed: { 
 | 
      ...mapState(['userInfo']) 
 | 
    }, 
 | 
  methods: { 
 | 
     open(title,target){ 
 | 
        this.visible = true; 
 | 
        this.title = title 
 | 
        this.model={} 
 | 
        this.dataId=null 
 | 
        this.dataId = target.id 
 | 
        this.getDetail() 
 | 
        this.getList() 
 | 
        this.getDW() 
 | 
        this.getGZ() 
 | 
     }, 
 | 
      // 派遣单位 
 | 
      getDW() { 
 | 
          findListByDTO({ applyId: this.dataId }) 
 | 
            .then(res => { 
 | 
                this.dwList = res 
 | 
            }) 
 | 
      }, 
 | 
      // 工种 
 | 
      getGZ() { 
 | 
          worktypeFindListByDTO({ 
 | 
              id: this.dataId, 
 | 
              queryType: 2 
 | 
          }).then(res => { 
 | 
              this.gzList = res 
 | 
          }) 
 | 
      }, 
 | 
      resetting() { 
 | 
            this.formInline.end = [] 
 | 
            this.formInline.end = [] 
 | 
            this.formInline.endTimeE = '' 
 | 
            this.formInline.endTimeS = '' 
 | 
            this.formInline.startTimeE = '' 
 | 
            this.formInline.startTimeS = '' 
 | 
            this.$refs.sou.resetFields(); 
 | 
            this.search() 
 | 
      }, 
 | 
      search() { 
 | 
          this.currentPage = 1 
 | 
          this.getList() 
 | 
      }, 
 | 
      changeStart(e) { 
 | 
            if (e.length > 0) { 
 | 
                this.formInline.startTimeE = e[0] 
 | 
                this.formInline.startTimeS = e[1] 
 | 
            } else { 
 | 
                this.formInline.startTimeE = '' 
 | 
                this.formInline.startTimeS = '' 
 | 
            } 
 | 
            this.search() 
 | 
      }, 
 | 
      changeEnd(e) { 
 | 
         if (e.length > 0) { 
 | 
             this.formInline.endTimeE = e[0] 
 | 
             this.formInline.endTimeS = e[1] 
 | 
         } else { 
 | 
             this.formInline.endTimeE = '' 
 | 
             this.formInline.endTimeS = '' 
 | 
         } 
 | 
          this.search() 
 | 
      }, 
 | 
      exportExcel() { 
 | 
          if (this.activeName === '0') { 
 | 
              exportExcel({ 
 | 
                  capacity: 10, 
 | 
                  page: this.currentPage, 
 | 
                  model: { 
 | 
                      solutionName: this.tableData[0].solutionsName, 
 | 
                      applyId: this.dataId, 
 | 
                      applyStatus: this.formInline.applyStatus, 
 | 
                      duId: this.formInline.duId, 
 | 
                      workTypeId: this.formInline.workTypeId, 
 | 
                      memberName: this.formInline.memberName, 
 | 
                      endTimeE: this.formInline.endTimeE, 
 | 
                      endTimeS: this.formInline.endTimeS, 
 | 
                      startTimeE: this.formInline.startTimeE, 
 | 
                      startTimeS: this.formInline.startTimeS 
 | 
                  } 
 | 
              }).then(response => { 
 | 
                  this.download(response) 
 | 
              }) 
 | 
          } else { 
 | 
              applyChagneDetailExcel({ 
 | 
                  capacity: 10, 
 | 
                  page: this.currentPage, 
 | 
                  model: { 
 | 
                      applyId: this.dataId, 
 | 
                      applyStatus: this.formInline.applyStatus, 
 | 
                      duId: this.formInline.duId, 
 | 
                      workTypeId: this.formInline.workTypeId, 
 | 
                      memberName: this.formInline.memberName, 
 | 
                      endTimeE: this.formInline.endTimeE, 
 | 
                      endTimeS: this.formInline.endTimeS, 
 | 
                      startTimeE: this.formInline.startTimeE, 
 | 
                      startTimeS: this.formInline.startTimeS, 
 | 
                      types: this.formInline.types 
 | 
                  } 
 | 
              }).then(response => { 
 | 
                  this.download(response) 
 | 
              }) 
 | 
          } 
 | 
      }, 
 | 
      getList() { 
 | 
         if (this.activeName === '0') { 
 | 
             applyDetailPage({ 
 | 
                 capacity: 10, 
 | 
                 page: this.currentPage, 
 | 
                 model: { 
 | 
                     applyId: this.dataId, 
 | 
                     applyStatus: this.formInline.applyStatus, 
 | 
                     duId: this.formInline.duId, 
 | 
                     workTypeId: this.formInline.workTypeId, 
 | 
                     memberName: this.formInline.memberName, 
 | 
                     endTimeE: this.formInline.endTimeE, 
 | 
                     endTimeS: this.formInline.endTimeS, 
 | 
                     startTimeE: this.formInline.startTimeE, 
 | 
                     startTimeS: this.formInline.startTimeS 
 | 
                 } 
 | 
             }).then(res => { 
 | 
                 this.list = res.records 
 | 
                 this.total = res.total 
 | 
             }) 
 | 
         } else { 
 | 
             applyChagneDetailPage({ 
 | 
                 capacity: 10, 
 | 
                 page: this.currentPage, 
 | 
                 model: { 
 | 
                     applyId: this.dataId, 
 | 
                     applyStatus: this.formInline.applyStatus, 
 | 
                     duId: this.formInline.duId, 
 | 
                     workTypeId: this.formInline.workTypeId, 
 | 
                     memberName: this.formInline.memberName, 
 | 
                     endTimeE: this.formInline.endTimeE, 
 | 
                     endTimeS: this.formInline.endTimeS, 
 | 
                     startTimeE: this.formInline.startTimeE, 
 | 
                     startTimeS: this.formInline.startTimeS, 
 | 
                     types: this.formInline.types 
 | 
                 } 
 | 
             }).then(res => { 
 | 
                 this.list = res.records 
 | 
                 this.total = res.total 
 | 
             }) 
 | 
         } 
 | 
      }, 
 | 
      handleClick(e) { 
 | 
        this.activeName = e.index 
 | 
          if (e.index === '1') { 
 | 
            this.formInline.types = [0, 1] 
 | 
          } else if (e.index === '2') { 
 | 
            this.formInline.types = [2] 
 | 
          } 
 | 
          this.resetting() 
 | 
      }, 
 | 
    goSign(){ 
 | 
      getSignLink(this.dataId).then(res => { 
 | 
        setTimeout(() => { 
 | 
          window.open(res) 
 | 
        }, 500); 
 | 
      }).catch(err => { 
 | 
       this.$tip.apiFailed(err) 
 | 
      }) 
 | 
    }, 
 | 
    viewToubaodan(){ 
 | 
       if(this.model.toubaodanSignedFile && this.model.toubaodanSignedFile.fileurlFull){ 
 | 
         setTimeout(() => { 
 | 
           window.open(this.model.toubaodanSignedFile.fileurlFull) 
 | 
         }, 500); 
 | 
  
 | 
       } else if(this.model.toubaodanFile && this.model.toubaodanFile.fileurlFull){ 
 | 
         setTimeout(() => { 
 | 
           window.open(this.model.toubaodanFile.fileurlFull) 
 | 
             },500) 
 | 
       } 
 | 
    }, 
 | 
    viewBaoxiandan(){ 
 | 
      if(this.model.baoxiandanFile && this.model.baoxiandanFile.fileurlFull){ 
 | 
        window.open(this.model.baoxiandanFile.fileurlFull) 
 | 
      } 
 | 
    }, 
 | 
    handleSizeChange(val){ 
 | 
        console.log(val) 
 | 
    }, 
 | 
    handleCurrentChange(val){ 
 | 
        console.log(val) 
 | 
        this.page = val 
 | 
        this.getList() 
 | 
    }, 
 | 
    onSubmit(){ 
 | 
  
 | 
    }, 
 | 
     getDetail(){ 
 | 
      getDetail(this.dataId).then(res => { 
 | 
        this.model = res 
 | 
        this.tableData = new Array() 
 | 
        this.tableData.push(res) 
 | 
        console.log(this.tableData) 
 | 
        this.activities = res.applyLogList 
 | 
      }).catch(err => { 
 | 
      }) 
 | 
    }, 
 | 
    successEvent(){ 
 | 
       // this.visible=false 
 | 
      this.getDetail() 
 | 
      this.$emit('success') 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 | 
<style> 
 | 
  
 | 
</style> 
 | 
<style lang="scss" scoped> 
 | 
    .form { 
 | 
        width: 100%; 
 | 
        display: flex; 
 | 
        align-items: center; 
 | 
        flex-direction: column; 
 | 
        .form_span { 
 | 
            width: 100%; 
 | 
            display: flex; 
 | 
            align-items: start; 
 | 
            flex-direction: column; 
 | 
            margin-bottom: 20px; 
 | 
            span { 
 | 
                font-size: 14px; 
 | 
                &:nth-child(1) { 
 | 
                    color: black; 
 | 
                    margin-bottom: 5px; 
 | 
                } 
 | 
                &:nth-child(2) { 
 | 
                    color: #8c939d; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .form_item { 
 | 
            width: 100%; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            margin-bottom: 20px; 
 | 
            &:last-child { 
 | 
                margin: 0 !important; 
 | 
            } 
 | 
            .form_item_label { 
 | 
                flex-shrink: 0; 
 | 
                width: 170px; 
 | 
                color: black; 
 | 
                font-size: 14px; 
 | 
                span { 
 | 
                    color: red; 
 | 
                    font-size: 14px; 
 | 
                } 
 | 
            } 
 | 
            .form_item_val { 
 | 
                flex: 1; 
 | 
                /*height: 40px;*/ 
 | 
                margin-left: 20px; 
 | 
                textarea { 
 | 
                    width: 100%; 
 | 
                    height: 70px; 
 | 
                    border: 1px solid #cbcbcb; 
 | 
                    padding: 10px; 
 | 
                    outline: none; 
 | 
                    box-sizing: border-box; 
 | 
                } 
 | 
                input { 
 | 
                    width: 100%; 
 | 
                    height: 40px; 
 | 
                    outline: none; 
 | 
                    border-radius: 5px; 
 | 
                    border: 1px solid #cbcbcb; 
 | 
                    padding: 0 20px; 
 | 
                    box-sizing: border-box; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
    .desc { 
 | 
        width: 100%; 
 | 
        .desc_item { 
 | 
            width: 100%; 
 | 
            display: flex; 
 | 
            flex-direction: column; 
 | 
            .desc_item_label { 
 | 
                width: 100%; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                margin-bottom: 10px; 
 | 
                span { 
 | 
                    font-size: 14px; 
 | 
                    color: black; 
 | 
                    margin-right: 30px; 
 | 
                } 
 | 
            } 
 | 
            .desc_item_from { 
 | 
                width: 100%; 
 | 
                margin-bottom: 10px; 
 | 
                .desc_item_from_page { 
 | 
                    width: 100%; 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: end; 
 | 
                    margin-top: 10px; 
 | 
                } 
 | 
            } 
 | 
            .desc_item_cate { 
 | 
                width: 100%; 
 | 
                margin-bottom: 10px; 
 | 
            } 
 | 
            .desc_item_search { 
 | 
                width: 100%; 
 | 
                margin-bottom: 20px; 
 | 
            } 
 | 
            .desc_item_review { 
 | 
                width: 100%; 
 | 
                .desc_item_review_label { 
 | 
                    font-size: 20px; 
 | 
                    color: black; 
 | 
                    font-weight: bold; 
 | 
                    margin-bottom: 15px; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</style> 
 |