BoundLink-Plate-UI/src/views/project-manage/bid-management/index.vue

<template>
  <div class="table-demo">
    <bs-table v-bind="tableOptions">
    </bs-table>
    <add-or-edit-drawer ref="addOrEditDrawerRef"/>
  </div>
</template>

<script setup lang="jsx">
import BsTable, {useBsTable} from '/@/components/BsUi/Table/index.js';
import {onMounted, ref} from 'vue';
import AddOrEditDrawer from '/@/views/table-demo/components/AddOrEditDrawer.vue';
import {useRouter} from 'vue-router';
import {DISPLAY_STATE} from "/@/components/BsUi/constant.js";

const addOrEditDrawerRef = ref(null);
const router = useRouter();
onMounted(() => {
  refreshTable();
});
const {
      tableOptions,
      setTablePropsValue: setValue,
      getTablePropsValue: getValue,
      refreshTable
    } = useBsTable({
      tableOptions: {
        // url: '/supports/project/queryPage',
        gridOptions: {
          loading: false,
          columns: [
            {
                    type: 'seq',
                    width: 80,
                },
            {
              field: 'name',
              title: '项目名称',
              width: 150
            },
            {
              field: 'code',
              title: '项目ID',
              width: 150
            },
            {
              field: 'location',
              title: '项目地址',
              width: 150
            },
            {
              field: 'estimatedContractAmount',
              title: '预计合同金额(元)',
              width: 150
            },
            {
              field: 'source',
              title: '项目来源',
              width: 150
            },
            {
              field: 'type',
              title: '项目类型',
              width: 150,
              slots: {
                default({row, column}) {
                  return <span>{row?.type?.[0].valueName}</span>;
                },
              },
            },
            {
              field: 'productType',
              title: '产品类型',
              width: 150
            },
            {
              field: 'estimatedBidOpeningDate',
              title: '预计开标日期',
              width: 150
            },
            {
              field: 'estimatedBidSubmission',
              title: '预计投标',
              width: 150
            },
            {
              field: 'salesOwner',
              title: '归属营销',
              width: 150
            },
            {
              field: 'operator',
              title: '操作人',
              width: 150
            },
            {
              field: 'operationTime',
              title: '操作时间',
              width: 150
            },
            {
              cellRender: {
                name: 'CellOption',
                extraProps: {
                  buttons: [
                    {
                      title: '查看详情',
                      code: 'view',
                      display: ({row}) => {
                        return DISPLAY_STATE.VISIBLE;
                      },
                      disabled({row}) {
                        return false;
                      },
                      onClick({row}) {
                        goDetailPage(row)
                      },
                      extraProps: {},
                    },
                  ],
                },
              },
            }
          ],
        },
        searchConfig: {
          enabled: true,
          fieldSpan:
              4,
          fields:
              [
                {
                  field: 'projectName',
                  component: 'a-input',
                  componentProps: {
                    placeholder: '请输入项目名称',
                  },
                },
                {
                  field: 'projectId',
                  component: 'a-input',
                  componentProps: {
                    placeholder: '请输入项目ID',
                  },
                },
                {
                  field: 'projectAddress',
                  component: 'a-select',
                  componentProps: {
                    placeholder: '请选择地址',
                  },
                },
                {
                  field: 'status',
                  component: 'a-select',
                  componentProps: {
                    placeholder: '请选择项目状态',
                  },
                },
              ],
        },
        data:[
            {
              id: 'BID20230001',
              name: '新能源充电桩建设项目',
              code: 'EV-2023-001',
              location: '北京市海淀区',
              estimatedContractAmount: '15,800,000',
              source: '政府招标',
              type: [{ valueName: '新能源基建' }],
              productType: 'EPC总包',
              estimatedBidOpeningDate: '2023-09-15',
              estimatedBidSubmission: '2023-09-10',
              salesOwner: '张经理',
              operator: '投标专员A',
              operationTime: '2023-08-01 14:20:00',
              status: '标书准备中'
            },
            {
              id: 'BID20230002',
              name: '智慧城市数据中心',
              code: 'DC-2023-002',
              location: '上海市浦东新区',
              estimatedContractAmount: '28,500,000',
              source: '央企合作',
              type: [{ valueName: '新基建' }],
              productType: '设备供应',
              estimatedBidOpeningDate: '2023-10-20',
              estimatedBidSubmission: '2023-10-15',
              salesOwner: '李经理',
              operator: '投标专员B',
              operationTime: '2023-09-05-09:45:00',
              status: '技术方案编制'
            },
            {
              id: 'BID20230003',
              name: '5G通信基站项目',
              code: '5G-2023-003',
              location: '广州市天河区',
              estimatedContractAmount: '9,200,000',
              source: '运营商招标',
              type: [{ valueName: '通信基建' }],
              productType: '专业服务',
              estimatedBidOpeningDate: '2023-08-25',
              estimatedBidSubmission: '2023-08-20',
              salesOwner: '王总监',
              operator: '投标专员C',
              operationTime: '2023-07-20-11:30:00',
              status: '商务条款确认'
            },
            {
              id: 'BID20230004',
              name: '医疗云平台升级',
              code: 'MED-2023-004',
              location: '深圳市南山区',
              estimatedContractAmount: '12,000,000',
              source: '医疗机构',
              type: [{ valueName: '医疗信息化' }],
              productType: '软件服务',
              estimatedBidOpeningDate: '2023-11-10',
              estimatedBidSubmission: '2023-11-05',
              salesOwner: '赵经理',
              operator: '投标专员D',
              operationTime: '2023-10-01-16:15:00',
              status: '预算编制'
            },
            {
              id: 'BID20230005',
              name: '工业4.0智能工厂',
              code: 'IND-2023-005',
              location: '成都市高新区',
              estimatedContractAmount: '45,000,000',
              source: '制造业龙头',
              type: [{ valueName: '工业自动化' }],
              productType: '交钥匙工程',
              estimatedBidOpeningDate: '2023-07-30',
              estimatedBidSubmission: '2023-07-25',
              salesOwner: '陈主管',
              operator: '投标专员E',
              operationTime: '2023-06-20-10:00:00',
              status: '资质文件准备'
            },
            {
              id: 'BID20230006',
              name: '智慧物流园区',
              code: 'LOG-2023-006',
              location: '杭州市余杭区',
              estimatedContractAmount: '18,600,000',
              source: '电商平台',
              type: [{ valueName: '物流自动化' }],
              productType: '设备集成',
              estimatedBidOpeningDate: '2023-08-15',
              estimatedBidSubmission: '2023-08-10',
              salesOwner: '马总监',
              operator: '投标专员F',
              operationTime: '2023-07-10-13:30:00',
              status: '标书制作完成'
            },
            {
              id: 'BID20230007',
              name: '高校智慧校园',
              code: 'EDU-2023-007',
              location: '武汉市洪山区',
              estimatedContractAmount: '8,500,000',
              source: '教育机构',
              type: [{ valueName: '教育信息化' }],
              productType: '综合解决方案',
              estimatedBidOpeningDate: '2023-09-05',
              estimatedBidSubmission: '2023-08-30',
              salesOwner: '徐经理',
              operator: '投标专员G',
              operationTime: '2023-07-25-09:20:00',
              status: '已投标'
            },
            {
              id: 'BID20230008',
              name: '金融数据中心',
              code: 'FIN-2023-008',
              location: '南京市江宁区',
              estimatedContractAmount: '32,000,000',
              source: '金融机构',
              type: [{ valueName: '金融科技' }],
              productType: '专业服务',
              estimatedBidOpeningDate: '2023-10-30',
              estimatedBidSubmission: '2023-10-25',
              salesOwner: '刘经理',
              operator: '投标专员H',
              operationTime: '2023-09-20-15:45:00',
              status: '等待开标'
            }
        ],
        pagerConfig: {
          enabled: true,
          pageSize:
              10,
          pageNum:
              1,
          total:
              0,
        }
        ,
      },
    })
;
const goDetailPage = (record) => {
  console.log(record.id)
  router.push({
    path: "/market-manage/external-manage/clue-management/view-details",
    query: {
      id: record.id
    }
  });
}
</script>

<style scoped lang="scss">
.table-demo {
}
</style>