<template>
  <div class="cooperation-desk-account-project">
    <div class="consulting-search-form">
      <el-form :model="form" ref="form" :rules="rules" label-width="84px" class="el-search-form-public">
        <div class="each-line">
          <el-form-item label="项目名称">
            <el-input v-model="form.projectName" placeholder="请输入项目名称" clearable></el-input>
          </el-form-item>
          <el-form-item label="咨询机构">
            <el-input v-model="form.consultingAgency" placeholder="请输入咨询机构名称" clearable></el-input>
          </el-form-item>
          <el-form-item label="业主单位">
            <el-input v-model="form.ownerName" placeholder="请输入业主名称" clearable></el-input>
          </el-form-item>
        </div>
        <div class="each-line">
          <el-form-item label="承接项目单位">
            <el-input v-model="form.undertakingUnit" placeholder="请输入承接项目单位名称" clearable></el-input>
          </el-form-item>
          <el-form-item label="项目创建时间">
            <el-date-picker v-model="form.projectCreateTime" type="daterange" range-separator="至" start-placeholder="年/月/日" end-placeholder="年/月/日"
              format="yyyy/MM/dd" value-format="yyyy-MM-dd"></el-date-picker>
          </el-form-item>
          <el-form-item label="项目承接类型">
            <el-select v-model="form.prjectType" placeholder="请选择" clearable>
              <el-option v-for="item in projectTypeOptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <div class="each-line" style="padding-top:16px;border-top:1px solid #EEEEEE;box-sizing:border-box">
          <el-form-item label="工程类型大类">
            <el-select v-model="form.engineeringCategory" placeholder="请选择" clearable>
              <el-option v-for="item in engineeringCategoryOptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="工程类别明细">
            <el-select v-model="form.engineeringCategoryDeatil" placeholder="请选择" clearable>
              <el-option v-for="item in engineeringCategoryDetailOptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="合同金额">
            <dsk-amount-range v-model="form.contractAmount" :range-text="'至'" :start-placeholder="'最小金额(万元)'"
              :end-placeholder="'最大金额(万元)'"></dsk-amount-range>
          </el-form-item>
        </div>
      </el-form>

      <!-- 查询重置 -->
      <div class="consulting-search-form-btn">
        <el-button type="primary" @click="searchForm" class="search-btn">查询</el-button>
        <el-button @click="resetForm" class="reset-btn">重置</el-button>
      </div>

    </div>
    <!-- 列表容器 -->
    <div class="search-result-list-container">
      <div class="search-result-head-container">
        <div class="result-head-left">
          <div class="result-list-total">共 {{total}} 条</div>
        </div>
        <div class="result-head-right">
          <!-- 表头设置 -->
          <dsk-table-header-setting :settingList="formColum"></dsk-table-header-setting>
        </div>
      </div>

      <skeleton v-if="tableLoading"></skeleton>
      <!-- table 列表 -->
      <table-list-com :tableData="tableDataList" :formColum="formColum" :tableDataTotal="total" :queryParams="queryParams"
        v-else-if="!tableLoading"></table-list-com>

    </div>
  </div>
</template>
<script>
import DskAmountRange from "@/components/DskAmountRange";
import DskTableHeaderSetting from "@/components/DskTableHeaderSetting";
import TableListCom from "@/components/TableListCom";
import Skeleton from "@/components/Skeleton";
export default {
  name: "cooperationDeskAccountProject",
  components: {
    DskAmountRange,
    DskTableHeaderSetting,
    TableListCom,
    Skeleton
  },
  data() {
    return {
      form: {
        projectName: "",
        consultingAgency: "",
        ownerName: "",
        undertakingUnit: "",
        projectCreateTime: [],
        prjectType: "",
        engineeringCategory: "",
        engineeringCategoryDeatil: "",
        contractAmount: []
      },
      tableLoading: false,
      // 列表表头
      formColum: [
        { label: '序号', type: "index", lock: true },
        { label: '项目列表', prop: 'projectName', width: "220px", lock: true },
        { label: '项目编码', prop: 'projectNo', width: "121px" },
        { label: '省市', prop: 'province', width: "100px" },
        { label: '项目承接类型', prop: 'projectUndertakingType', width: "100px" },
        { label: '工程基础大类', prop: 'basicCategories', width: "100px" },
        { label: '工程类别明细', prop: 'classOfWorks', width: "100px" },
        { label: '项目负责人姓名', prop: 'nameOfProjectLeader', width: "110px" },
        { label: '项目负责人专业', prop: 'projectLeaderMajor', width: "110px" },
        { label: '项目负责人联系电话', prop: 'contactNumberOfProjectLeader', width: "135px" },
        { label: '合同金额', prop: 'contractAmount' },
        { label: '业主单位', prop: 'ownerUnit' },
        { label: '项目承接单位', prop: 'projectUndertakingUnit', width: "110px" },
        { label: '咨询机构名称', prop: 'nameOfConsultingAgency', width: "110px" },
        { label: '创建时间', prop: 'createTime' },
      ],
      queryParams: {
        pageSize: 50,
        pageNum: 1
      },
      tableDataList: [
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
        {
          projectName: "测试项目",
          projectNo: "asdiasjdioajdoiajsdioasjdioasj",
          province: "北京",
          projectUndertakingType: "测试",
          basicCategories: "工程基础大类",
          classOfWorks: "工程类别明细",
          nameOfProjectLeader: "项目负责人姓名",
          projectLeaderMajor: "项目负责人专业",
          contactNumberOfProjectLeader: "项目负责人联系电话",
          contractAmount: "合同金额",
          ownerUnit: "业主单位",
          projectUndertakingUnit: "项目承接单位",
          nameOfConsultingAgency: "咨询机构名称",
          createTime: "创建时间"
        },
      ],
      total: 51,
      rules: {

      },
      projectTypeOptions: [
        {
          value: "1",
          label: "测试1"
        },
        {
          value: "2",
          label: "测试2"
        }
      ],
      engineeringCategoryOptions: [
        {
          value: "1",
          label: "测试1"
        },
        {
          value: "2",
          label: "测试2"
        }
      ],
      engineeringCategoryDetailOptions: [
        {
          value: "1",
          label: "测试1"
        },
        {
          value: "2",
          label: "测试2"
        }
      ]
    };
  },
  //可访问data属性
  created() {

  },
  //计算集
  computed: {

  },
  //方法集
  methods: {
    searchForm() {

    },
    resetForm() {

    }
  },
}
</script>
<style lang="scss" scoped>
.cooperation-desk-account-project {
  .consulting-search-form {
    background: #fff;
    padding: 16px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-sizing: border-box;
    @import "@/assets/styles/el-search-form-public.scss";

    .consulting-search-form-btn {
      padding-left: 96px;
      box-sizing: border-box;

      .el-button {
        height: 32px;
        line-height: 32px;
        text-align: center;
        padding: 0px 16px;
        box-sizing: border-box;
        border-radius: 4px;

        &.search-btn {
          background: #0081ff;
          border-color: #0081ff;
        }

        &.reset-btn {
          border: 1px solid #dcdfe6;
          color: rgba(35, 35, 35, 0.8);
          background: #fff;
          margin-left: 12px;
        }
      }
    }
  }

  .search-result-list-container {
    margin-top: 16px;
    background: #fff;
    border-radius: 4px;
    padding: 16px;
    box-sizing: border-box;
    height: calc(100% - 241px);

    @import "@/assets/styles/search-result-list-public.scss";

    ::v-deep .table-list-com-ins {
      height: calc(100% - 80px);
      margin-top: 16px;

      .table-item {
        .el-table {
          overflow: auto !important;
        }
      }

      .pagination-box {
        padding: 0px;
        margin-top: 16px;
      }
    }
  }
}
</style>
