|
|
@@ -0,0 +1,191 @@
|
|
|
+<template>
|
|
|
+ <div class="table-demo">
|
|
|
+ <bs-table v-bind="tableOptions" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="jsx">
|
|
|
+ import BsTable, { useBsTable } from '/@/components/BsUi/Table/index.js';
|
|
|
+ import { onMounted, ref } from 'vue';
|
|
|
+ import { useRouter } from 'vue-router';
|
|
|
+ import { DISPLAY_STATE } from '/@/components/BsUi/constant.js';
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ refreshTable();
|
|
|
+ });
|
|
|
+ const { tableOptions, setTablePropsValue, getTablePropsValue, refreshTable } = useBsTable({
|
|
|
+ tableOptions: {
|
|
|
+ url: '/supports/project/queryPage',
|
|
|
+ gridOptions: {
|
|
|
+ // data:[],
|
|
|
+ loading: false,
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '项目名称',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '项目ID',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '项目状态',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '项目地址',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '合同金额(元)',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '项目来源',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '项目类型',
|
|
|
+ width: 150,
|
|
|
+ slots: {
|
|
|
+ default({ row, column }) {
|
|
|
+ // return <span>{row?.projectType?.[0].valueName}</span>;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '产品类型',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '招标方式',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '预计开标日期',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '操作人',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ title: '操作时间',
|
|
|
+ width: 150,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: 'opt',
|
|
|
+ title: '操作',
|
|
|
+ width: '120px',
|
|
|
+ fixed: 'right',
|
|
|
+ align: 'center',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ // fixed: 'right',
|
|
|
+ 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: '',
|
|
|
+ component: 'a-input',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请输入项目名称',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ component: 'a-select',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请选择地址',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ component: 'a-select',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请选择专业类型',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ component: 'a-select',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请选择项目状态',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ component: 'a-select',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请选择中标金额',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ field: '',
|
|
|
+ component: 'a-select',
|
|
|
+ componentProps: {
|
|
|
+ placeholder: '请选择项目经理',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ 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>
|