明树Git Lab

Skip to content

J
jt_front
Commit 9d98e887 authored by yangyajing's avatar yangyajing
Browse files
Options

项目管理页面开发

parent 912d46dc
Pipeline #103863 passed with stage
    in 11 seconds
    Show whitespace changes
    Inline Side-by-side
    Showing with 775 additions and 1 deletion
    src/data/https.js 0 → 100644
    View file @ 9d98e887
    import axios from "axios";
    import { ElMessage } from "element-plus";
    axios.interceptors.request.use(function (config) {
    let token = "8681f75e775447f7903708c55a35634e";
    if (token) {
    config.headers.Authorization = token;
    }
    return config;
    }, (err) => {
    return Promise.reject(err);
    });
    axios.interceptors.response.use(response => {
    return response.data;
    }, err => {
    if (err && err.response) {
    switch (err.response.status) {
    case 401:
    err.msg = "请先登录";
    break;
    }
    } else {
    err.msg = "网络连接错误";
    }
    return Promise.reject(err);
    });
    let baseUrl = "http://10.40.8.9:3000"
    export function $get ({ url, params = {}, callback }) {
    return axios({
    method: "get",
    url: baseUrl + url,
    params
    }).then(response => {
    callback && callback(response.data);
    return response;
    }).catch((err) => {
    ElMessage.error(err);
    });
    };
    export function $post ({ url, data = {}, callback }) {
    return axios.post(baseUrl + url, data).then((response) => {
    if (response.code === 0) {
    callback && callback(response.data);
    } else {
    ElMessage.error(response.message);
    }
    return response;
    }).catch((err) => {
    console.log(err);
    ElMessage.error(err.msg || "操作失败");
    if (err && err.response && err.response.status === 401) {
    store.commit("clearUserInfo");
    router.replace("/login");
    }
    });
    };
    src/layouts/MainLayout.vue
    View file @ 9d98e887
    ...@@ -72,7 +72,7 @@ const router = useRouter(); ...@@ -72,7 +72,7 @@ const router = useRouter();
    // 计算菜单路由 // 计算菜单路由
    const menuRoutes = computed(() => { const menuRoutes = computed(() => {
    const mainRoute = router.options.routes.find((route) => route.path === "/"); const mainRoute = router.options.routes.find((route) => route.path === "/");
    return mainRoute?.children || []; return mainRoute?.children && mainRoute?.children.filter(route => !route.meta || route.meta.showInMenu !== false ) || [];
    }); });
    // 处理退出登录 // 处理退出登录
    ...@@ -92,6 +92,10 @@ const handleLogout = () => { ...@@ -92,6 +92,10 @@ const handleLogout = () => {
    } }
    /* 选中菜单项样式 */ /* 选中菜单项样式 */
    .el-menu-item{
    color: #666;
    background-color: #fff;
    }
    .el-menu-item.is-active { .el-menu-item.is-active {
    background-color: #ecf3fd; background-color: #ecf3fd;
    color: #3d84ee; color: #3d84ee;
    ......
    src/main.js
    View file @ 9d98e887
    ...@@ -7,8 +7,11 @@ import * as ElIcons from '@element-plus/icons' ...@@ -7,8 +7,11 @@ import * as ElIcons from '@element-plus/icons'
    import router from './router' import router from './router'
    import "./assets/fonts/font.less"; // 字体样式 import "./assets/fonts/font.less"; // 字体样式
    import "../public/iconFont/iconfont.css"; // 图标字体样式 import "../public/iconFont/iconfont.css"; // 图标字体样式
    import { $get, $post } from "@/data/https.js";
    const app = createApp(App) const app = createApp(App)
    app.config.globalProperties.$get = $get;
    app.config.globalProperties.$post = $post;
    for (const [key, component] of Object.entries(ElIcons)) { for (const [key, component] of Object.entries(ElIcons)) {
    app.component(key, component) app.component(key, component)
    } }
    ......
    src/router/index.js
    View file @ 9d98e887
    ...@@ -22,6 +22,23 @@ const routes = [ ...@@ -22,6 +22,23 @@ const routes = [
    component: () => import('@/views/homePage/index.vue'), component: () => import('@/views/homePage/index.vue'),
    meta: { menuName: '数据大屏', icon: 'home' } meta: { menuName: '数据大屏', icon: 'home' }
    }, },
    {
    path: '/projectManage',
    name: '项目管理',
    title: 'projectManage',
    component: () => import('@/views/managePage/projectManage.vue'),
    meta: { menuName: '项目管理', icon: 'Management' }
    },
    {
    path: '/addProject',
    name: '新增项目',
    title: 'addProject',
    component: () => import('@/views/managePage/addProject.vue'),
    meta: {
    menuName: '新增项目',
    showInMenu: false // 不在菜单中显示
    }
    }
    ] ]
    } }
    ] ]
    ......
    src/views/managePage/addProject.vue 0 → 100644
    View file @ 9d98e887
    <template>
    <div class="add-project-container">
    <div class="add-project-header">
    <div class="header-left"></div>
    <div class="header-right">
    <el-button type="default" @click="backClick">返回</el-button>
    <el-button type="primary" @click="saveClick">保存</el-button>
    </div>
    </div>
    <div class="add-project-content">
    <el-tabs v-model="tabActiveName">
    <el-tab-pane label="项目基本信息" name="项目基本信息">
    <div class="tab-content">
    <el-form :model="formData" :label-width="190">
    <el-collapse v-model="activeCollapse">
    <el-collapse-item title="项目基本信息" name="项目基本信息">
    <el-row :gutter="20">
    <el-col :span="12">
    <el-form-item label="项目名称">
    <el-input v-model="formData.projectName" />
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="项目编号">
    <el-input v-model="formData.projectCode" />
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="是否再决策">
    <el-radio-group v-model="formData.sfzjc">
    <el-radio value="1">是</el-radio>
    <el-radio value="2">否</el-radio>
    </el-radio-group>
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="项目外文名称">
    <el-input v-model="formData.projectForeignName" />
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="是否能建联合体项目">
    <el-radio-group v-model="formData.sfnjlhtxm">
    <el-radio value="1">是</el-radio>
    <el-radio value="2">否</el-radio>
    </el-radio-group>
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="申报单位">
    <el-input v-model="formData.applicationUnit" />
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="主业/非主业">
    <el-radio-group v-model="formData.zyfzy">
    <el-radio value="1">是</el-radio>
    <el-radio value="2">否</el-radio>
    </el-radio-group>
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="直属企业">
    <el-input v-model="formData.zsqy" />
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="是否能建重大或重要投资">
    <el-radio-group v-model="formData.sfnjzdhzytz">
    <el-radio value="1">是</el-radio>
    <el-radio value="2">否</el-radio>
    </el-radio-group>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="是否自主决策">
    <el-radio-group v-model="formData.sfzzjc">
    <el-radio value="1">是</el-radio>
    <el-radio value="2">否</el-radio>
    </el-radio-group>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="财务报表类型">
    <el-select v-model="formData.financialStatementType" placeholder="请选择">
    <el-option label="1" value="1"></el-option>
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="政府审批（核准、备案）级别">
    <el-select v-model="formData.zfsphzbajb" placeholder="请选择">
    <el-option label="1" value="1"></el-option>
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="是否履行标前预审程序">
    <el-radio-group v-model="formData.sflxbqyscx">
    <el-radio value="1">是</el-radio>
    <el-radio value="2">否</el-radio>
    </el-radio-group>
    </el-form-item>
    </el-col>
    </el-row>
    </el-collapse-item>
    <el-collapse-item title="项目所在地" name="项目所在地">
    <el-row :gutter="20">
    <el-col :span="6">
    <el-form-item label="境内/外">
    <el-select v-model="formData.domesticOrOverseas" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="省（境内）/洲际（境外）">
    <el-select v-model="formData.sjnzjjw" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="地市（境内）/国家（境外）">
    <el-select v-model="formData.cityOrCountry" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="区县(境内)/国家(境外)">
    <el-select v-model="formData.qxjngjjw" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="项目区域">
    <el-select v-model="formData.xmqy" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="是否一带一路沿线国家">
    <el-select v-model="formData.sfydylyxgj" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    </el-row>
    </el-collapse-item>
    <el-collapse-item title="计量币种" name="计量币种">
    <el-row :gutter="20">
    <el-col :span="6">
    <el-form-item label="币种">
    <el-select v-model="formData.bizhong" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="汇率">
    <el-input v-model="formData.huilv" />
    </el-form-item>
    </el-col>
    </el-row>
    </el-collapse-item>
    <el-collapse-item title="实施时间" name="实施时间">
    <el-row :gutter="20">
    <el-col :span="6">
    <el-form-item label="项目建设期">
    <el-input
    v-model="formData.xmjsqy"
    placeholder="请输入"
    type="number"
    >
    <template #append>月</template>
    </el-input>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="运营年限">
    <el-input
    v-model="formData.yynxn"
    placeholder="请输入"
    type="number"
    >
    <template #append>年</template>
    </el-input>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="项目合作期">
    <el-input
    v-model="formData.xmhzqn"
    placeholder="请输入"
    type="number"
    >
    <template #append>月</template>
    </el-input>
    </el-form-item>
    </el-col>
    <el-col :span="6"></el-col>
    <el-col :span="6">
    <el-form-item label="项目开工时间（预计）">
    <el-date-picker
    v-model="formData.xmkgsjyj"
    type="date"
    placeholder="请选择"
    />
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="项目交工时间（预计）">
    <el-date-picker
    v-model="formData.xmjgsjyj"
    type="date"
    placeholder="请选择"
    />
    </el-form-item>
    </el-col>
    </el-row>
    </el-collapse-item>
    </el-collapse>
    </el-form>
    </div>
    </el-tab-pane>
    <el-tab-pane label="决策及批复信息" name="决策及批复信息">
    <div class="tab-content">
    <el-form :model="formData" :label-width="190">
    <el-collapse v-model="activeCollapse">
    <el-collapse-item title="投资分类" name="投资分类">
    <el-row :gutter="20">
    <el-col :span="6">
    <div class="col-title">投资属性分类</div>
    <el-form-item label="一级分类">
    <el-select v-model="formData.tzsxyjfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="二级分类">
    <el-select v-model="formData.tzsxejfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="投资板块">
    <el-select v-model="formData.tzbk" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="细分板块">
    <el-select v-model="formData.subsector" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <div class="col-title">投资目的分类</div>
    <el-form-item label="一级分类">
    <el-select v-model="formData.tzmdyjfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="二级分类">
    <el-select v-model="formData.tzmdejfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="四新分类">
    <el-select v-model="formData.sxfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-row :gutter="20">
    <el-col :span="12">
    <div class="col-title">投资指南分类</div>
    <el-form-item label="一级分类">
    <el-select v-model="formData.tzznyjfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="二级分类">
    <el-select v-model="formData.tzznejfl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    <el-form-item label="投资指南分类概述">
    <el-input v-model="formData.tzznflgs" type="textarea" />
    </el-form-item>
    </el-col>
    <el-col :span="12">
    <el-form-item label="国民经济行业">
    <el-select v-model="formData.gmjjhy" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    </el-row>
    </el-col>
    </el-row>
    </el-collapse-item>
    <el-collapse-item title="特别关注、特别监管类等信息" name="特别关注、特别监管类等信息">
    <el-row :gutter="20">
    <el-col :span="6">
    <el-form-item label="是否需报国家发展改革委和商务部核准">
    <el-select v-model="formData.sfxbgjfzggwhswbhz" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="是否国家领导见签">
    <el-select v-model="formData.sfgjldjq" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    <el-col :span="6">
    <el-form-item label="是否境内特别监管类">
    <el-select v-model="formData.sfjntbjgl" placeholder="请选择">
    <el-option label="1" value="1" />
    </el-select>
    </el-form-item>
    </el-col>
    </el-row>
    </el-collapse-item>
    </el-collapse>
    </el-form>
    </div>
    </el-tab-pane>
    <el-tab-pane label="项目公司落实批复信息" name="项目公司落实批复信息">
    <div class="tab-content">
    <el-collapse v-model="activeCollapse">
    <el-collapse-item title="建设规模（实物量指标）" name="建设规模（实物量指标）">
    <div class="tab-handle">
    <el-button type="primary" size="small" @click="addSwlzb">新增</el-button>
    </div>
    <el-table :data="swlzbData" style="width: 100%" empty-text="暂无数据">
    <el-table-column type="index" width="50" />
    <el-table-column prop="name" label="指标名称">
    <template #default="scope">
    <el-input v-model="scope.row.name" />
    </template>
    </el-table-column>
    <el-table-column prop="count" label="数量">
    <template #default="scope">
    <el-input v-model="scope.row.count" type="number" />
    </template>
    </el-table-column>
    <el-table-column prop="unit" label="单位">
    <template #default="scope">
    <el-input v-model="scope.row.unit" />
    </template>
    </el-table-column>
    <el-table-column prop="mark" label="补充说明">
    <template #default="scope">
    <el-input v-model="scope.row.mark" type="textarea" />
    </template>
    </el-table-column>
    <el-table-column label="操作" width="90">
    <template #default="scope">
    <el-button link type="danger" size="small" @click="deleteSwlzb(scope.$index)">删除</el-button>
    </template>
    </el-table-column>
    </el-table>
    </el-collapse-item>
    <el-collapse-item title="股东信息" name="股东信息">
    <div class="tab-handle">
    <el-button type="primary" size="small" @click="addGdxx">新增</el-button>
    </div>
    <el-table :data="gdxxData" style="width: 100%" empty-text="暂无数据">
    <el-table-column type="index" width="50" />
    <el-table-column prop="type" label="股东类型">
    <template #default="scope">
    <el-select v-model="scope.row.type" placeholder="请选择">
    <el-option label="1" value="1"></el-option>
    </el-select>
    </template>
    </el-table-column>
    <el-table-column prop="name" label="股东名称">
    <template #default="scope">
    <el-select v-model="scope.row.name" placeholder="请选择">
    <el-option label="1" value="1"></el-option>
    </el-select>
    </template>
    </el-table-column>
    <el-table-column prop="percent" label="持股比例（%）">
    <template #default="scope">
    <el-input v-model="scope.row.percent" type="number" />
    </template>
    </el-table-column>
    <el-table-column prop="cze" label="出资额（万元）">
    <template #default="scope">
    <el-input v-model="scope.row.cze" type="number" />
    </template>
    </el-table-column>
    <el-table-column prop="yjzczb" label="应缴注册资本（万元）">
    <template #default="scope">
    <el-input v-model="scope.row.yjzczb" type="number" />
    </template>
    </el-table-column>
    <el-table-column prop="ycxmzbj" label="应出项目资本金（万元）">
    <template #default="scope">
    <el-input v-model="scope.row.ycxmzbj" type="number" />
    </template>
    </el-table-column>
    <el-table-column prop="hzfqk" label="合作方情况">
    <template #default="scope">
    <el-input v-model="scope.row.hzfqk" />
    </template>
    </el-table-column>
    <el-table-column prop="mark" label="备注">
    <template #default="scope">
    <el-input v-model="scope.row.mark" />
    </template>
    </el-table-column>
    <el-table-column label="操作" width="90">
    <template #default="scope">
    <el-button link type="danger" size="small" @click="deleteGdxx(scope.$index)">删除</el-button>
    </template>
    </el-table-column>
    </el-table>
    </el-collapse-item>
    <el-collapse-item title="项目必要性及可行性" name="项目必要性及可行性">
    <el-form :model="formData" :label-width="150">
    <el-form-item label="建设内容及规模">
    <el-input v-model="formData.jsnrjgm" type="textarea" />
    </el-form-item>
    <el-form-item label="项目必要性">
    <el-input v-model="formData.xmbyx" type="textarea" />
    </el-form-item>
    <el-form-item label="项目可行性">
    <el-input v-model="formData.xmkxx" type="textarea" />
    </el-form-item>
    <el-form-item label="其他说明">
    <el-input v-model="formData.qtsm" type="textarea" />
    </el-form-item>
    </el-form>
    </el-collapse-item>
    </el-collapse>
    </div>
    </el-tab-pane>
    <el-tab-pane label="项目合法合规性附件" name="项目合法合规性附件">
    <div class="tab-content">
    <el-collapse v-model="activeCollapse">
    <el-collapse-item title="立项资料" name="立项资料">
    <el-form :model="formData" :label-width="150">
    <el-form-item label="相关支撑材料">
    <el-upload
    v-model:file-list="zcclFileList"
    class="upload-demo"
    action=""
    :show-file-list="false"
    >
    <el-button type="default">上传</el-button>
    </el-upload>
    <el-button type="default">删除选中文件</el-button>
    </el-form-item>
    </el-form>
    <el-table :data="zcclData" style="width: 100%" empty-text="暂无数据">
    <el-table-column type="selection" width="55" />
    <el-table-column prop="fileName" label="文件名" />
    <el-table-column prop="fileTime" label="上传时间" />
    <el-table-column prop="fileSize" label="大小" />
    <el-table-column fixed="right" label="操作" width="90">
    <template #default="scope">
    <el-button link type="danger" size="small">删除</el-button>
    </template>
    </el-table-column>
    </el-table>
    </el-collapse-item>
    </el-collapse>
    </div>
    </el-tab-pane>
    <el-tab-pane label="全生命周期策划文件" name="全生命周期策划文件">全生命周期策划文件</el-tab-pane>
    <el-tab-pane label="项目绩效评价" name="项目绩效评价">项目绩效评价</el-tab-pane>
    <el-tab-pane label="目标责任书考核" name="目标责任书考核">目标责任书考核</el-tab-pane>
    <el-tab-pane label="后评价" name="后评价">后评价</el-tab-pane>
    <el-tab-pane label="重大事项上报" name="重大事项上报">重大事项上报</el-tab-pane>
    <el-tab-pane label="投资分析" name="投资分析">投资分析</el-tab-pane>
    <el-tab-pane label="投资检查" name="投资检查">投资检查</el-tab-pane>
    <el-tab-pane label="投资回收" name="投资回收">投资回收</el-tab-pane>
    <el-tab-pane label="管理费上缴" name="管理费上缴">管理费上缴</el-tab-pane>
    <el-tab-pane label="PPP整改方案" name="PPP整改方案">PPP整改方案</el-tab-pane>
    <el-tab-pane label="项目结束/暂停(备案资料)" name="项目结束/暂停(备案资料)">项目结束/暂停(备案资料)</el-tab-pane>
    </el-tabs>
    </div>
    </div>
    </template>
    <script setup>
    import { reactive, ref, onMounted, getCurrentInstance } from "vue";
    import { useRouter } from "vue-router";
    const router = useRouter();
    const { proxy } = getCurrentInstance();
    // tab相关
    const tabActiveName = ref("项目基本信息");
    const activeCollapse = reactive([
    "项目基本信息","项目所在地", "计量币种", "实施时间", "投资分类", "特别关注、特别监管类等信息",
    "建设规模（实物量指标）", "股东信息", "项目必要性及可行性", "立项资料"
    ]);
    // 获取资源库数据
    const getResourceData = () => {
    proxy.$post({
    url: "/api/resource/listResourceAll",
    data: {
    page: 1,
    pagesize: 1000
    },
    callback: (data) => {}
    });
    };
    onMounted(() => {
    getResourceData();
    })
    const formData = reactive({});
    // 建设规模（实物量指标）
    const swlzbData = reactive([]);
    const addSwlzb = () => {
    swlzbData.push({});
    };
    const deleteSwlzb = (index) => {
    swlzbData.splice(index, 1);
    };
    // 股东信息
    const gdxxData = reactive([]);
    const addGdxx = () => {
    gdxxData.push({});
    };
    const deleteGdxx = (index) => {
    gdxxData.splice(index, 1);
    };
    // 支撑材料
    const zcclFileList = reactive([]);
    const zcclData = reactive([]);
    // 返回列表页
    const backClick = () => {
    router.push("/projectManage");
    }
    // 保存数据
    const saveClick = () => {
    proxy.$post({
    url: "/api/project/createProject",
    data: formData,
    callback: (data) => {
    router.push("/projectManage");
    }
    })
    };
    </script>
    <style lang="less">
    .add-project{
    &-container{
    width: 100%;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    .el-collapse-item__header{
    color: var(--el-color-primary);
    }
    }
    &-header{
    margin: 10px 0;
    display: flex;
    justify-content: space-between;
    }
    &-content{
    flex: 1;
    height: 0;
    .el-tabs{
    height: 100%;
    }
    .el-tab-pane{
    height: 100%;
    .tab-content{
    height: 100%;
    overflow: auto;
    padding: 0 10px;
    .col-title{
    font-weight: bold;
    text-align: center;
    }
    .tab-handle{
    display: flex;
    justify-content: flex-end;
    }
    }
    }
    }
    }
    </style>
    \ No newline at end of file
    src/views/managePage/projectManage.vue 0 → 100644
    View file @ 9d98e887
    <template>
    <div class="project-manage-container">
    <div class="project-manage-header">
    <div class="header-left"></div>
    <div class="header-right">
    <el-button type="primary" @click="addProject">新增</el-button>
    </div>
    </div>
    <div class="project-manage-content">
    <div class="table-wrap">
    <el-table :data="tableData" style="width: 100%"
    empty-text="暂无数据" height="100%"
    >
    <el-table-column type="index" width="50" />
    <el-table-column prop="projectName" label="项目名称" />
    <el-table-column prop="projectCode" label="项目编号" />
    <el-table-column fixed="right" label="操作" min-width="120">
    <template #default="scope">
    <el-button link type="primary" size="small">查看</el-button>
    <el-button link type="primary" size="small">编辑</el-button>
    </template>
    </el-table-column>
    </el-table>
    </div>
    <div class="page-wrap">
    <el-pagination background layout="prev, pager, next" :total="1000" />
    </div>
    </div>
    </div>
    </template>
    <script setup>
    import { reactive, ref, onMounted, getCurrentInstance } from "vue";
    import { useRouter } from "vue-router";
    const router = useRouter();
    const { proxy } = getCurrentInstance();
    const tableData = ref([]);
    const getProjectData = () => {
    proxy.$post({
    url: "/api/project/listProject",
    data: {
    page: 1,
    pagesize: 10,
    attributes: []
    },
    callback: (data) => {
    tableData.value = data.rows;
    }
    })
    };
    const addProject = () => {
    router.push("/addProject");
    };
    onMounted(() => {
    getProjectData();
    })
    </script>
    <style scoped lang="less">
    .project-manage{
    &-container{
    width: 100%;
    height: 100%;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    .tab-content{
    padding: 10px 15px;
    }
    }
    &-header{
    display: flex;
    justify-content: space-between;
    }
    &-content{
    flex: 1;
    height: 0;
    display: flex;
    flex-direction: column;
    .table-wrap{
    margin: 15px 0;
    flex: 1;
    height: 0;
    }
    .page-wrap{
    display: flex;
    justify-content: flex-end;
    }
    }
    }
    </style>
    Markdown is supported
    0% or
    You are about to add 0 people to the discussion. Proceed with caution.
    Finish editing this message first!
    Please register or to comment