<template> 
 | 
  <TableLayout :permissions="['business:visits:query']"> 
 | 
    <!-- 搜索表单 --> 
 | 
    <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline> 
 | 
      <el-form-item label="姓名/手机号" prop="name"> 
 | 
        <el-input v-model="searchForm.name" placeholder="请输入姓名/手机号" @keypress.enter.native="search"></el-input> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="身份证号" prop="idcardNo"> 
 | 
        <el-input v-model="searchForm.idcardNo" placeholder="请输入身份证号" @keypress.enter.native="search"></el-input> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="访客单位" prop="companyName"> 
 | 
        <el-input v-model="searchForm.companyName" placeholder="请输入访客单位" @keypress.enter.native="search"></el-input> 
 | 
      </el-form-item> 
 | 
      <el-form-item label="审批状态" prop="status"> 
 | 
        <el-select v-model="searchForm.status" placeholder="请选择"> 
 | 
          <el-option label="待提交审批" value="0"></el-option> 
 | 
          <el-option label="审批中" value="1"></el-option> 
 | 
          <el-option label="审核通过" value="2"></el-option> 
 | 
          <el-option label="审批驳回" value="3"></el-option> 
 | 
          <el-option label="取消" value="4"></el-option> 
 | 
          <el-option label="下发成功" value="5"></el-option> 
 | 
          <el-option label="下发失败" value="6"></el-option> 
 | 
          <el-option label="拜访中" value="7"></el-option> 
 | 
          <el-option label="已签离" value="8"></el-option> 
 | 
          <el-option label="已失效" value="9"></el-option> 
 | 
        </el-select> 
 | 
      </el-form-item> 
 | 
      <section> 
 | 
        <el-button type="primary" @click="search">搜索</el-button> 
 | 
        <!--                <el-button type="primary" :loading="isWorking.export" v-permissions="['business:visits:exportExcel']" @click="exportExcel">导出</el-button>--> 
 | 
        <el-button @click="reset">重置</el-button> 
 | 
      </section> 
 | 
    </el-form> 
 | 
    <!-- 表格和分页 --> 
 | 
    <template v-slot:table-wrap> 
 | 
      <ul class="toolbar" v-permissions="['business:visits:create', 'business:visits:exportExcel']"> 
 | 
        <li><el-button type="primary" @click="handleEdit()" icon="el-icon-plus" 
 | 
            v-permissions="['business:visits:create']">新建</el-button></li> 
 | 
        <li><el-button type="primary" :loading="isWorking.export" @click="exportExcel" 
 | 
            v-permissions="['business:visits:exportExcel']">导出</el-button></li> 
 | 
      </ul> 
 | 
      <el-table v-loading="isWorking.search" :data="tableData.list" stripe @selection-change="handleSelectionChange"> 
 | 
        <el-table-column type="selection" width="55"></el-table-column> 
 | 
        <el-table-column prop="name" label="访客姓名" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="phone" label="手机号" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="companyName" label="访客单位" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="receptMemberName" label="被访人" min-width="100px"></el-table-column> 
 | 
        <el-table-column prop="reason" label="拜访事由" min-width="100px"></el-table-column> 
 | 
        <el-table-column label="预约时间" min-width="170px"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <span>起:{{ row.starttime }}</span><br /> 
 | 
            <span>止:{{ row.endtime }}</span> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column label="签到时间" min-width="170px"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <div v-if="row.inDate && row.outDate"> 
 | 
              <span>起:{{ row.inDate }}</span><br /> 
 | 
              <span>止:{{ row.outDate }}</span> 
 | 
            </div> 
 | 
            <span v-else>-</span> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column label="施工人员" min-width="100px"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <span v-if="row.type == 0">否</span> 
 | 
            <span v-if="row.type == 1">是</span> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column label="随访车辆" min-width="100px"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <span>{{ row.carNos }}</span> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column prop="status" fixed="right" label="状态" min-width="100px"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <span style="color: rgba(245, 154, 35, 0.996);" v-if="row.status === 0">待提交审批</span> 
 | 
            <span v-if="row.status === 1" style="color: rgba(245, 154, 35, 0.996);">审批中</span> 
 | 
            <span v-if="row.status === 2" style="color: rgba(245, 154, 35, 0.996);">审核通过</span> 
 | 
            <span style="color: gray;" v-if="row.status === 3">审批驳回</span> 
 | 
            <span v-if="row.status === 4" style="color: gray">取消</span> 
 | 
            <span v-if="row.status === 5" style="color: green">下发成功</span> 
 | 
            <span v-if="row.status === 6" style="color: gray">下发失败</span> 
 | 
            <span v-if="row.status === 7" style="color: green">拜访中</span> 
 | 
            <span v-if="row.status === 8" style="color: red">已签离</span> 
 | 
            <span v-if="row.status === 9" style="color: gray">已失效</span> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column v-if="containPermissions(['business:visits:update', 'business:visits:delete'])" label="操作" 
 | 
          min-width="200" fixed="right"> 
 | 
          <template slot-scope="{row}"> 
 | 
            <el-button type="text" @click="departure(row.id)" icon="el-icon-delete" style="color: red" v-if="row.status == 7">离厂</el-button> 
 | 
            <el-button type="text" @click="cancel(row.id)" v-permissions="['business:visits:cancel']" 
 | 
              icon="el-icon-delete" style="color: red" v-if="row.status == 5">取消预约</el-button> 
 | 
            <el-button type="text" @click="resend(row.id)" v-permissions="['business:visits:update']" 
 | 
              icon="el-icon-edit" v-if="row.status == 6">重新下发</el-button> 
 | 
            <!-- <el-button type="text" @click="$refs.OperaVisitsDesWindow.open('详情', row.id)" icon="el-icon-view">详情</el-button> --> 
 | 
            <el-button type="text" @click="handleDetail(row)" icon="el-icon-view">详情</el-button> 
 | 
            <!--                        <el-button type="text" @click="deleteById(row)" icon="el-icon-delete" v-permissions="['business:visits:delete']">查询审批结果</el-button>--> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
      </el-table> 
 | 
      <pagination @size-change="handleSizeChange" @current-change="handlePageChange" :pagination="tableData.pagination"> 
 | 
      </pagination> 
 | 
      <!--      详情      --> 
 | 
      <!-- <OperaVisitsDesWindow ref="OperaVisitsDesWindow" /> --> 
 | 
      <TaskDetail v-if="isShowDetail" ref="DetailRef" /> 
 | 
      <!-- 新建 --> 
 | 
      <OperaVisitsWindow @close="isShowEdit = false" @success="search" v-if="isShowEdit" ref="operaVisitsWindowRef" /> 
 | 
    </template> 
 | 
  </TableLayout> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
import BaseTable from '@/components/base/BaseTable' 
 | 
import TableLayout from '@/layouts/TableLayout' 
 | 
import Pagination from '@/components/common/Pagination' 
 | 
import OperaVisitsDesWindow from '@/components/business/OperaVisitsDesWindow' 
 | 
import OperaVisitsWindow from '@/components/business/operaVisitsWindow' 
 | 
import TaskDetail from '@/views/task/visSubDetail.vue' 
 | 
  
 | 
export default { 
 | 
  name: 'Visits', 
 | 
  extends: BaseTable, 
 | 
  components: { TableLayout, Pagination, TaskDetail, OperaVisitsWindow }, 
 | 
  data() { 
 | 
    return { 
 | 
      isShowEdit: false, 
 | 
      isShowDetail: false, 
 | 
      // 搜索 
 | 
      searchForm: { 
 | 
        name: '', 
 | 
        companyName: '', 
 | 
        idcardNo: '', 
 | 
        status: '', 
 | 
        type: 0 
 | 
      } 
 | 
    } 
 | 
  }, 
 | 
  created() { 
 | 
    this.config({ 
 | 
      module: '访客申请信息表', 
 | 
      api: '/business/visits', 
 | 
      'field.id': 'id', 
 | 
      'field.main': 'id' 
 | 
    }) 
 | 
    this.search() 
 | 
  }, 
 | 
  methods: { 
 | 
    handleDetail(row) { 
 | 
      this.isShowDetail = true 
 | 
      console.log('row', row) 
 | 
      this.$nextTick(() => { 
 | 
        this.$refs.DetailRef.id = row.id 
 | 
        this.$refs.DetailRef.type = 0 
 | 
        this.$refs.DetailRef.getDetail() 
 | 
        this.$refs.DetailRef.isShowModal = true 
 | 
      }) 
 | 
    }, 
 | 
    handleEdit() { 
 | 
      this.isShowEdit = true 
 | 
      this.$nextTick(() => { 
 | 
        this.$refs.operaVisitsWindowRef.isShowModal = true 
 | 
      }) 
 | 
    }, 
 | 
    departure(id) { 
 | 
      this.$confirm('确定离厂吗, 是否继续?', '提示', { 
 | 
        confirmButtonText: '确定', 
 | 
        cancelButtonText: '取消', 
 | 
        type: 'warning' 
 | 
      }).then(() => { 
 | 
        level(id) 
 | 
          .then(res => { 
 | 
            this.page = 1 
 | 
            this.getData() 
 | 
          }) 
 | 
      }).catch(() => { 
 | 
  
 | 
      }) 
 | 
    }, 
 | 
    cancel(id) { 
 | 
      this.$confirm('确定取消预约吗, 是否继续?', '提示', { 
 | 
        confirmButtonText: '确定', 
 | 
        cancelButtonText: '取消', 
 | 
        type: 'warning' 
 | 
      }).then(() => { 
 | 
        visitCancel(id) 
 | 
          .then(res => { 
 | 
            this.page = 1 
 | 
            this.getData() 
 | 
          }) 
 | 
      }).catch(() => { 
 | 
  
 | 
      }) 
 | 
    }, 
 | 
    resend(id) { 
 | 
      this.$confirm('确定尝试重新发起预约吗, 是否继续?', '提示', { 
 | 
        confirmButtonText: '确定', 
 | 
        cancelButtonText: '取消', 
 | 
        type: 'warning' 
 | 
      }).then(() => { 
 | 
        this.api.visitResend(id) 
 | 
          .then(res => { 
 | 
            this.page = 1 
 | 
            this.getData() 
 | 
          }) 
 | 
      }).catch(() => { 
 | 
  
 | 
      }) 
 | 
    } 
 | 
  } 
 | 
} 
 | 
</script> 
 |