<template>
  <div class="app-container" v-loading="fullLoading">
    <card-table class="engineering-table" :modalData="list" :searchParams="queryParams" @pagination="getList" max-height="600px"
                :loading="loading" :tableSearch="true" @columnSearch="handleQuery" @resetList="resetQuery">
      <template #operations="{ selections }">
        <el-col :span="1.5">
          <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd"
                     v-hasPermi="['civil:engineering:add']">{{ $t('engineering.add') }}
          </el-button>
        </el-col>
      </template>
      <template #default="{ list }">
        <el-table-column label="No." type="index" width="50" align="center"/>
        <Column :label="$t('engineering.no')" prop="civilEngineeringNo" :searchParams="queryParams"
                :showSearch="true" width="200px">
          <template #default="{ row }">
            <span class="link-type" @click="handleView(row)">{{ row.civilEngineeringNo }}</span>
          </template>
        </Column>
        <Column :label="$t('project.no')" prop="projectNo" :searchParams="queryParams" :showSearch="true"
                width="200px">
          <template #default="{ row }">
            <span class="link-type" @click="handleViewProject(row)">{{ row.projectNo }}</span>
          </template>
        </Column>
        <Column :label="$t('project.name')" prop="projectName" :searchParams="queryParams" :showSearch="true"
                width="300px"/>
        <Column :label="$t('quotation.quotationNo')" prop="quotationNo" :searchParams="queryParams"
                :showSearch="true" width="200px">
          <!-- <template #default="{ row }">
              <span v-if="row.quotationNo" class="link-type" @click="handleViewQuotation(row)">{{
                  row.quotationNo }}</span>
              <span v-else>-</span>
          </template> -->
        </Column>
        <Column :label="$t('quotation.version')" prop="version" width="150px"/>
        <Column :label="$t('engineering.elevatorModel')" prop="elevatorModel" width="200px"/>
        <Column :label="$t('engineering.elevatorNumber')" prop="elevatorNumber" width="200px"/>
        <Column :label="$t('engineering.specification')" prop="specification" width="600px" align="left"/>
        <Column :label="$t('common.submitter')" prop="submitter" width="200px"/>
        <Column :label="$t('common.submitTime')" prop="createTime" width="200px"/>
        <Column :label="$t('engineering.status')" prop="status" :searchParams="queryParams" :showSearch="true"
                searchType="select" :searchDict="dict.type.plot_status" select-more width="200px">
          <template #default="{ row }">
            <ColorDictTag :bgc="statusColorMap[row.status].bgc"
                          :label="formatDict(row.status, dict.type.plot_status)"
                          :label-color="statusColorMap[row.status].color"/>
          </template>
        </Column>
        <Column :label="$t('common.operate')" :min-width="200" :showSearch="true" fixed="right" searchType="operate">
          <template #default="{ row }">
            <span></span>
            <!--            <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(row)"-->
            <!--                       v-hasPermi="['civil:engineering:view']">{{ $t('common.view') }}-->
            <!--            </el-button>-->
            <el-button v-hasPermi="['civil:engineering:download']" v-if="row.status == '2' && row.pdfFilePath" size="mini" type="text" icon="el-icon-download"
                       @click="handleDownload(row.pdfFilePath)">PDF{{ $t('common.download') }}
            </el-button>
            <el-button v-hasPermi="['civil:engineering:download']" v-if="row.status == '2' && row.dwgFilePath" size="mini" type="text" icon="el-icon-download"
                       @click="handleDownload(row.dwgFilePath)">DWG{{ $t('common.download') }}
            </el-button>
            <el-button v-if="row.status == '3'" size="mini" type="text" icon="el-icon-edit"
                       @click="handleAgain(row)">{{$t('engineering.again')}}
            </el-button>
          </template>
        </Column>
      </template>
    </card-table>
  </div>
</template>

<script>
import {listEngineering} from "@/api/business/civil/engineering";
import ColorDictTag from "@/views/crmManagement/lead/ColorDictTag/index";

const statusColorMap = {
  '1': {
    color: '#FFC500',
    bgc: 'rgba(255,200,12,0.12)'
  },
  '2': {
    color: '#24CA5D',
    bgc: 'rgba(24,199,84,0.12)'
  },
  '3': {
    color: '#D71943',
    bgc: '#FAEDED'
  },
}
export default {
  dicts: ['plot_status'],
  components: {ColorDictTag},
  data() {
    return {
      statusColorMap: statusColorMap,
      fullLoading: false,
      // 遮罩层
      loading: false,
      // 总条数
      total: 0,
      // 项目表格数据
      list: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
    }
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      this.loading = true;
      listEngineering(this.queryParams).then(response => {
        this.list = response.rows;
        this.queryParams.total = response.total;
        this.loading = false;
      });
    },
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList();
    },
    resetQuery() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
      }
      this.getList();
    },
    formatDict(value, dictData) {
      return dictData.find(dict => dict.value == value)?.label;
    },
    handleAdd() {
      this.$tab.openPage(this.$t('engineering.add'), '/civil/plot-add');
    },
    handleView(row) {
      this.$tab.openPage(this.$t('engineering.view'), '/civil/plot-view', {id: row.id});
    },
    handleViewProject(row) {
      this.$tab.openPage(this.$t('project.view'), '/project-view/' + row.projectId);
    },
    handleViewQuotation(row) {
      this.$tab.openPage(this.$t('quotation.view'), '/quotation/editQuotation', {type: 'view', quotationId: row.quotationId});
    },
    handleDownload(resource) {
      let param = {resource: resource}
      this.download("/common/download/resource", param);
    },
    handleAgain(row){
      this.$tab.openPage(this.$t('engineering.add'), '/civil/plot-add',{id : row.id});
    }
  }
}
</script>

<style lang="scss" rel="stylesheet/scss" scoped>
::v-deep .engineering-table .el-table td.el-table__cell > .cell {
  white-space: pre-line;
}
</style>
