Skip to content

P
psa-web
Commit de441101 authored by yanzhengyang's avatar yanzhengyang
Browse files
Options

Merge remote-tracking branch 'origin/master'

parents 0a5f03ab def96193
Hide whitespace changes
Inline Side-by-side
Showing with 483 additions and 296 deletions
.prettierrc.cjs
View file @ de441101
......@@ -2,7 +2,7 @@ module.exports = {
// 超过80就换行
printWidth: 80,
// tab缩进大小，默认为2
tabWidth: 2,
tabWidth: 4,
// 使用tab缩进，默认false
useTabs: false,
// 使用分号，默认true
......
src/api/projectCostRequest/projectCostRequest.js 0 → 100644
View file @ de441101
import request from '@/utils/request'
// 查询项目费用申请列表
export function getCostRequestList() {
return request({
url: '/projectCostRequest/list',
method: 'get',
})
}
src/assets/styles/btn.scss
View file @ de441101
......@@ -12,7 +12,16 @@
}
}
}
.btn-A{
width: 116px;
height: 40px;
background: #0147EB;
}
.btn-B{
width: 116px;
height: 40px;
border: 1px solid #E2E7F5;
}
.blue-btn {
@include colorBtn($blue)
}
......@@ -97,7 +106,7 @@
font-size: 14px;
border-radius: 4px;
}
.el-button--primary{
.el-button-primary{
width: 104px;
height: 36px;
background: #0062FF;
......@@ -106,7 +115,7 @@
font-size: 13px;
color: #FFFFFF;
}
.el-button--defalut {
.el-button-defalut {
width: 104px;
height: 36px;
border: 1px solid #E2E7F5;
......@@ -114,4 +123,19 @@
font-weight: 400;
font-size: 13px;
color: #536387;
&:hover{
background-color: var(--el-button-hover-bg-color);
border: 1px solid #0062FF;
color: #0062FF;
}
}
.el-button-primary-pain{
width: 120px;
height: 36px;
border: 1px solid #0062FF;
border-radius: 2px;
font-weight: 400;
font-size: 16px;
color: #0062FF;
}
src/assets/styles/element-ui.scss
View file @ de441101
......@@ -119,3 +119,20 @@ $base-font-size: 16px;
.el-date-editor .el-range-input{
font-size: 14px;
}
.el-tabs__active-bar {
background-color: #0062FF;
height: 4px;
min-width: 60px;
}
.el-tabs__item.is-active {
font-weight: 500;
font-size: 18px;
color: #0D162A;
}
.el-tabs__item {
font-size: 18px;
}
.el-tabs__item:hover {
color: #0062FF;
cursor: pointer;
}
src/assets/styles/index.scss
View file @ de441101
......@@ -123,14 +123,30 @@ aside {
//main-container全局样式
.app-container {
display: flex;
flex-direction: column; /* 垂直排列 */
padding: 20px;
background: #FAFAFB;
min-height: calc(100vh - 100px);
}
.formSearch {
background: #ffffff;
margin-bottom: 20px;
box-shadow: 0 2px 2px 0 #b3b3b380;
border-radius: 2px;
min-height:100px;
padding: 30px;
}
.contentTable {
background: #ffffff;
box-shadow: 0 2px 2px 0 #b3b3b380;
border-radius: 2px;
flex: 1; /* 占满剩余高度 */
padding: 30px;
}
.content{
padding: 20px;
margin-bottom: 10px;
height:calc(100vh - 149px);
flex: 1;
background: #FFFFFF;
box-shadow: 0 2px 2px 0 #b3b3b380;
border-radius: 2px;
......
src/assets/styles/sidebar.scss
View file @ de441101
......@@ -235,3 +235,7 @@
}
}
}
.el-menu-item.is-active{
color:#FFFFFF;
background-color: #1B51B4 !important;
}
src/assets/styles/variables.module.scss
View file @ de441101
......@@ -9,7 +9,7 @@ $yellow: #FEC171;
$panGreen: #30B08F;
// 默认主题变量
$menuText: #bfcbd9;
$menuText: #FFFFFF;
$menuActiveText: #FFFFFF;
$menuBg: #143468;
$menuHover: #1B51B4;
......
src/layout/components/Navbar.vue
View file @ de441101
......@@ -7,12 +7,12 @@
<div class="right-menu">
<!-- <template v-if="appStore.device !== 'mobile'">-->
<!-- <div class="todo">-->
<div class="todo hover-effect">
<div class="todo hover-effect" @click="goMYTodoList">
<div class="todo-logo"><img :src="todo" class="img-logo"/></div>
<div class="todo-title">待办</div>
</div>
<div class="todo hover-effect">
<div class="todo-logo"><img :src="send" class="todo-logo"/></div>
<div class="todo-logo"><img :src="initiate" class="todo-logo"/></div>
<div class="todo-title">发起</div>
</div>
<div class="todo hover-effect">
......@@ -20,7 +20,7 @@
<div class="todo-title">处理</div>
</div>
<div class="todo hover-effect">
<div class="todo-logo"><img :src="initiate" class="todo-logo"/></div>
<div class="todo-logo"><img :src="send" class="todo-logo"/></div>
<div class="todo-title">抄送</div>
</div>
<!-- </div>-->
......@@ -75,6 +75,7 @@
</template>
<script setup>
const router = useRouter();
import { ElMessageBox } from 'element-plus'
import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav'
......@@ -132,6 +133,9 @@ function setLayout() {
function toggleTheme() {
settingsStore.toggleTheme()
}
const goMYTodoList= () => {
router.push({ path: '/myTodoLIst'});
}
</script>
<style lang='scss' scoped>
......
src/views/costManage/projectCostReimbursement/index.vue
View file @ de441101
<script setup>
import { getDicts } from "@/api/system/dict/data";
getDicts("project_cost_type").then(response => {
console.log(response)
});
</script>
<template>
......
src/views/costManage/projectCostRequest/detail.vue
View file @ de441101
<template>
<div class="app-container">
<!-- 面包屑导航-->
<div class="top">
<div class="top_text">新增项目费用申请</div>
<div class="top_line"></div>
</div>
<!-- 表单-->
<div class="addform">
<el-form :inline="true" :model="form" label-width="auto">
<el-form-item label="项目名称">
<el-select
v-model="form.xiangmumingcheng"
placeholder="请选择项目名称"
>
<el-option label="项目一" value="shanghai" />
<el-option label="项目二" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="项目编号">
<el-input v-model="form.xiangmubianhao" disabled />
</el-form-item>
<el-form-item label="项目类型">
<el-input v-model="form.xiangmuleixing" disabled />
</el-form-item>
<el-form-item label="事业部负责人">
<el-input v-model="form.fuzeren" disabled />
</el-form-item>
<el-form-item label="项目状态">
<el-input v-model="form.xiangmustatus" disabled />
</el-form-item>
<el-form-item label="登记人">
<el-input v-model="form.dengjiren" placeholder="张三" disabled />
</el-form-item>
<el-form-item label="费用类型">
<el-select
v-model="form.feiyongleixing"
placeholder="请选择项目费用类型"
>
<el-option label="办公用品" value="shanghai" />
<el-option label="云服务购买" value="beijing" />
<el-option label="域名/服务器托管费" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="费用发生时间">
<el-date-picker
v-model="form.date"
type="date"
placeholder="请选择费用发生时间"
clearable
/>
</el-form-item>
<el-form-item label="物品描述">
<el-input v-model="form.wupinmiaoshu" placeholder="请输入物品名称" />
</el-form-item>
<el-form-item label="单价">
<el-input v-model="form.danjia" placeholder="请输入物品单价" />
</el-form-item>
<el-form-item label="数量">
<el-input v-model="form.num" placeholder="请输入物品数量" />
</el-form-item>
<el-form-item label="申请金额（元）">
<el-input v-model="form.jine" placeholder="请输入申请金额" />
</el-form-item>
<el-form-item label="备注">
<el-input
v-model="form.beizhu"
:autosize="{ minRows: 1 }"
type="textarea"
placeholder="请输入备注"
/>
</el-form-item>
<el-form-item label="流水号">
<el-input
v-model="form.liushuihao"
disabled
placeholder="自动生成流水号"
/>
</el-form-item>
<!-- <el-form-item label="上传附件">-->
<!-- <el-upload-->
<!-- v-model:file-list="form.fujian"-->
<!-- action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"-->
<!-- multiple-->
<!-- :on-preview="handlePreview"-->
<!-- :on-remove="handleRemove"-->
<!-- :before-remove="beforeRemove"-->
<!-- :limit="3"-->
<!-- :on-exceed="handleExceed"-->
<!-- >-->
<!-- <el-icon class="folderAdd"><FolderAdd /></el-icon>-->
<!-- <text>点击上传附件</text>-->
<!-- </el-upload>-->
<!-- </el-form-item>-->
</el-form>
</div>
<div class="inner">
<!-- 导航-->
<div class="top">
<div class="top_text">新增项目费用申请</div>
<div class="top_line"></div>
</div>
<!-- 表单-->
<div class="addform">
<el-form :model="form" label-width="auto">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="流水号">
<el-input
v-model="form.liushuihao"
disabled
placeholder="自动生成流水号"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="费用类型">
<el-select
v-model="form.feiyongleixing"
placeholder="请选择项目费用类型"
clearable
>
<el-option label="办公用品" value="shanghai" />
<el-option label="云服务购买" value="beijing" />
<el-option label="域名/服务器托管费" value="beijing" />
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="项目名称">
<el-select
v-model="form.xiangmumingcheng"
placeholder="请选择项目名称" clearable>
<el-option label="项目一" value="shanghai" />
<el-option label="项目二" value="beijing" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="物品描述">
<el-input v-model="form.wupinmiaoshu" placeholder="请输入物品名称" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="项目编号">
<el-input v-model="form.xiangmubianhao" disabled/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="费用发生时间">
<el-date-picker style="width: 500px;height: 40px"
v-model="form.date"
type="date"
placeholder="请选择费用发生时间"
clearable/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="项目类型">
<el-input v-model="form.xiangmuleixing" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-row >
<el-col :span="7">
<el-form-item label="单价">
<el-input class="danjia_shuliang" v-model="form.danjia" placeholder="请输入物品单价" />
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="数量">
<el-input class="danjia_shuliang" v-model="form.num" placeholder="请输入物品数量" />
</el-form-item>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="事业部负责人">
<el-input v-model="form.fuzeren" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="申请金额（元）">
<el-input v-model="form.jine" placeholder="请输入申请金额" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="项目状态">
<el-input v-model="form.xiangmustatus" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注">
<el-input
v-model="form.beizhu"
:autosize="{ minRows: 4 }"
type="textarea"
placeholder="请输入备注"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="登记人">
<el-input v-model="form.dengjiren" placeholder="张三" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
</el-col>
</el-row>
<!-- 取消、提交按钮-->
<div class="button">
<div><el-button class="button_size">取消</el-button></div>
<div><el-button class="button_size" type="primary">提交</el-button></div>
</el-form>
</div>
<!-- 取消、提交按钮-->
<div class="button">
<div><el-button @click="goBackIndex" class="button_size">取消</el-button></div>
<div><el-button class="button_size" type="primary">提交</el-button></div>
</div>
</div>
</div>
</template>
<script setup>
import { reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
// 表单
const form = reactive({
......@@ -139,15 +188,27 @@ const form = reactive({
liushuihao: '',
fujian: ''
})
const router = useRouter()
const goBackIndex = () => {
router.push({ path: '/costManage/projectCostRequest/index' })
}
</script>
<style scoped lang="scss">
.inner{
box-shadow: 0 0 3px rgba(211, 211, 211, 0.2),
0 0 7px rgba(211, 211, 211, 0.2),
0 0 7px rgba(211, 211, 211, 0.2);
background-color: white;
height: calc(100vh - 130px);
}
.top {
display: flex;
flex-direction: column;
width: 150px;
margin-left: 40px;
margin-top: 20px;
.top_text {
cursor: default;
......@@ -157,23 +218,25 @@ const form = reactive({
font-family: 'Microsoft YaHei', sans-serif;
}
.top_line {
border: solid 2px #0062ff;
border: solid 1px #0062ff;
margin-top: 5px;
height: 4px;
background-color: #0062ff;
}
}
.addform {
margin-left: 50px;
margin-top: 30px;
display: flex;
align-content: center;
.el-form-item {
margin-right: 400px;
width: 400px;
width: 500px;
height: 40px;
.danjia_shuliang{
width: 150px;
}
}
}
.folderAdd {
......
src/views/costManage/projectCostRequest/index.vue
View file @ de441101
<template>
<div class="app-container">
<div class="app-container" >
<div class="shadow_box_top">
<el-form :inline="true" :model="formInline">
<el-form class="shadow_box_top_form" :inline="true" :model="formInline">
<el-form-item label="项目名称">
<el-select
v-model="formInline.mingcheng"
placeholder="请选择项目名称"
clearable
v-model="formInline.mingcheng"
placeholder="请选择项目名称"
clearable
>
<el-option label="项目名称一" value="shanghai" />
<el-option label="项目名称二" value="beijing" />
......@@ -15,49 +15,38 @@
<el-form-item label="项目编号">
<el-input
v-model="formInline.bianhao"
placeholder="请输入项目编号"
clearable
v-model="formInline.bianhao"
placeholder="请输入项目编号"
clearable
/>
</el-form-item>
<el-form-item label="项目负责人">
<el-input
v-model="formInline.fuzeren"
placeholder="请输入项目负责人"
clearable
v-model="formInline.fuzeren"
placeholder="请输入项目负责人"
clearable
/>
</el-form-item>
<el-form-item label="项目类型">
<el-select
v-model="formInline.leixing"
placeholder="请选择项目类型"
clearable
v-model="formInline.leixing"
placeholder="请选择项目类型"
clearable
>
<el-option label="项目类型一" value="shanghai" />
<el-option label="项目类型二" value="beijing" />
</el-select>
</el-form-item>
<el-form-item>
<el-button @click="reset"
><img
src="@/assets/icons/common/reset.png"
class="img-icon"
/>重置</el-button
>
<el-button type="primary" @click="onSearch"
><img
src="@/assets/icons/common/search.png"
class="img-icon"
/>查询</el-button
>
</el-form-item>
</el-form>
<div>
<el-button type="primary" class="el-button-primary" icon="Search" @click="onSearch">搜索</el-button>
<el-button type="default" class="el-button-defalut" icon="Refresh" @click="reset">重置</el-button>
</div>
</div>
<div class="shadow_box_bottom">
<div class="shadow_box_bottom">
<!-- 导航、按钮-->
<div class="shadow_box_bottom_add">
<div class="left">
......@@ -65,52 +54,12 @@
<div class="left_line"></div>
</div>
<div class="right">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain size="mini" @click="goToAddPage">
<template #icon>
<Plus />
</template>
新增费用申请
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
size="mini"
:disabled="single"
@click="handleUpdate"
>
<template #icon>
<Edit />
</template>
修改
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
size="mini"
:disabled="multiple"
@click="handleDelete"
>
<template #icon>
<el-icon><Delete /></el-icon>
</template>
删除
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain size="mini" @click="handleExport">
<template #icon>
<el-icon><Share /></el-icon>
</template>
导出
</el-button>
</el-col>
</el-row>
<el-button
type="primary"
plain
icon="Plus"
@click="goToAddPage"
>费用申请</el-button>
</div>
</div>
......@@ -136,9 +85,9 @@
<!-- 列表-->
<div class="shadow_box_bottom_table">
<el-table :data="tableData" border>
<el-table v-loading="loading" :data="projectCostRequestList" border>
<el-table-column type="selection" align="center"></el-table-column>
<el-table-column prop="projectNo" label="项目编号" align="center">
<el-table-column prop="projectNumber" label="项目编号" align="center">
<template #default="scope">
<span
style="
......@@ -146,7 +95,7 @@
text-decoration: underline;
cursor: pointer;
"
>{{ scope.row.projectNo }}</span
>{{ scope.row.projectNumber }}</span
>
</template>
</el-table-column>
......@@ -158,27 +107,28 @@
<el-table-column
prop="projectType"
label="项目类型"
align="center"
></el-table-column>
align="center">
<template #default="{ row }">
<dict-tag :options="project_type" :value="row.projectType"/>
</template>
</el-table-column>
<el-table-column
prop="departmentLeader"
prop="userName"
label="事业部负责人"
align="center"
></el-table-column>
<el-table-column prop="projectStatus" label="项目状态" align="center">
<template #default="{ row }">
<el-tag :type="getTagType(row.projectStatus)">{{
row.projectStatus
}}</el-tag>
<dict-tag :options="project_status" :value="row.projectStatus"/>
</template>
</el-table-column>
<el-table-column
prop="serialNo"
prop="waterNumber"
label="流水号"
align="center"
></el-table-column>
<el-table-column
prop="expenseTime"
prop="timeOfExpense"
label="费用发生时间"
align="center"
></el-table-column>
......@@ -186,21 +136,22 @@
prop="expenseType"
label="费用类型"
align="center"
></el-table-column>
>
<template #default="scope">
<dict-tag :options="project_cost_type" :value="scope.row.costType"/>
</template>
</el-table-column>
<el-table-column
prop="amount"
prop="sumMoney"
label="金额（元）"
align="center"
></el-table-column>
<el-table-column
prop="approvalStatus"
label="审批状态"
align="center"
>
<template #default="{ row }">
<el-tag :type="getApprovalTagType(row.approvalStatus)">{{
row.approvalStatus
}}</el-tag>
align="center">
<template #default="scope">
<dict-tag :options="project_cost_request_status" :value="scope.row.approveStatus"/>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
......@@ -211,11 +162,31 @@
</el-table-column>
</el-table>
</div>
</div>
</div >
</div>
</template>
<script setup>
import { reactive, ref } from 'vue'
const { proxy } = getCurrentInstance();
const { project_status, project_cost_type,project_cost_request_status,project_type} = proxy.useDict('project_status', 'project_cost_type','project_cost_request_status','project_type');
// 列表
const projectCostRequestList = ref([]);
const getList=()=> {
getCostRequestList().then(response => {
console.log("数组",response.data)
projectCostRequestList.value = response.data
});
}
getList()
// 顶部搜索表单数据
const formInline = reactive({
......@@ -238,90 +209,48 @@ const onSearch = () => {
console.log(formInline.value)
}
const tableData = reactive([
{
projectNo: 'XS647375',
projectName: '生活费项目',
projectType: 'A型',
departmentLeader: '张三',
projectStatus: '待审批',
serialNo: 'ls565646265',
expenseTime: '2025/01/02',
expenseType: '笔记本',
amount: 300,
approvalStatus: '待审批'
},
{
projectNo: 'XS647375',
projectName: '生活费项目',
projectType: 'A型',
departmentLeader: '张三',
projectStatus: '待审批',
serialNo: 'XS656465',
expenseTime: '2025/01/02',
expenseType: 'U盘',
amount: 200,
approvalStatus: '已通过'
},
{
projectNo: '1345abc',
projectName: 'XXX项目',
projectType: 'B型',
departmentLeader: '李四',
projectStatus: '待审批',
serialNo: 'ls565646265',
expenseTime: '2025/01/02',
expenseType: '办公用品',
amount: 200,
approvalStatus: '进行中'
},
{
projectNo: '1345abc',
projectName: 'XXX项目',
projectType: 'B型',
departmentLeader: '李四',
projectStatus: '待审批',
serialNo: 'XS656465',
expenseTime: '2025/01/02',
expenseType: '办公用品',
amount: 200,
approvalStatus: '已通过'
}
])
// 根据项目状态返回标签类型
const getTagType = status => {
if (status === '待审批') return 'warning'
return 'default'
}
// 根据审批状态返回标签类型
const getApprovalTagType = status => {
if (status === '已通过') return 'success'
if (status === '进行中') return 'primary'
if (status === '待审批') return 'warning'
return 'default'
}
//新增按钮
import { useRouter } from 'vue-router'
import {getCostRequestList} from "../../../api/projectCostRequest/projectCostRequest.js";
const router = useRouter()
const goToAddPage = () => {
console.log(123)
router.push({ path: '/costManage/projectCostRequest/add' })
}
</script>
<style scoped lang="scss">
.shadow_box_top {
margin-top: 20px;
margin-left: 1%;
width: 98%;
box-shadow: 5px 5px 5px -3px rgba(0, 0, 0, 0.2);
.el-form {
padding: 10px;
display: flex;
justify-content: space-around;
align-items: center;
box-shadow: 0 0 3px rgba(211, 211, 211, 0.2),
0 0 7px rgba(211, 211, 211, 0.2),
0 0 7px rgba(211, 211, 211, 0.2);
.shadow_box_top_form {
margin-top: 20px;
padding: 10px 10px;
display: flex;
justify-content: space-around;
justify-content: space-between;
align-items: center;
}
.el-form-item {
......@@ -338,8 +267,10 @@ const goToAddPage = () => {
margin-top: 20px;
margin-left: 1%;
width: 98%;
height: 50%;
box-shadow: 5px 5px 5px -3px rgba(0, 0, 0, 0.2);
height: calc(100vh - 250px);
box-shadow: 0 0 3px rgba(211, 211, 211, 0.2),
0 0 7px rgba(211, 211, 211, 0.2),
0 0 7px rgba(211, 211, 211, 0.2);
//导航 、 按钮
.shadow_box_bottom_add {
......@@ -347,7 +278,7 @@ const goToAddPage = () => {
width: 98%;
justify-content: space-between;
align-items: center;
margin-top: 20px;
padding:10px;
.left {
display: flex;
flex-direction: column;
......@@ -361,9 +292,10 @@ const goToAddPage = () => {
font-family: 'Microsoft YaHei', sans-serif;
}
.left_line {
border: solid 2px #0062ff;
border: solid 1px #0062ff;
margin-top: 5px;
height: 4px;
background-color: #0062ff;
}
}
.right {
......@@ -373,12 +305,12 @@ const goToAddPage = () => {
//步骤条
.shadow_box_bottom_step {
display: flex;
margin: 20px 0px;
margin: 10px 13px;
padding: 20px 0px;
width: 98%;
justify-content: space-evenly;
align-items: center;
background-color: #f9f9fa;
background-color: #f3f3f3;
.text1 {
font-size: 18px;
font-weight: 550;
......
src/views/handle/index.vue 0 → 100644
View file @ de441101
<template>
<div>处理</div>
</template>
<script setup></script>
<style scoped lang="scss"></style>
src/views/initiated/index.vue 0 → 100644
View file @ de441101
<template>
<div>发起</div>
</template>
<script setup></script>
<style scoped lang="scss"></style>
src/views/makeCopy/index.vue 0 → 100644
View file @ de441101
<template>
<div>抄送</div>
</template>
<script setup></script>
<style scoped lang="scss"></style>
src/views/myTodoList/index.vue 0 → 100644
View file @ de441101
<template>
<div class="app-container">
<div class="formSearch">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="日常报销" name="daily"></el-tab-pane>
<el-tab-pane label="项目费用" name="projectCost"></el-tab-pane>
<el-tab-pane label="差旅报销" name="travel"></el-tab-pane>
<el-tab-pane label="工时审批" name="workHours"></el-tab-pane>
</el-tabs>
<el-form :inline="true" :model="formQuery" class="demo-form-inline">
<el-form-item label="项目名称">
<el-input
v-model="formQuery.user"
placeholder="Approved by"
clearable
style="width: 220px"
/>
</el-form-item>
<el-form-item label="申请人">
<el-select
v-model="formQuery.region"
placeholder="Activity zone"
clearable
style="width: 220px"
>
<el-option label="Zone one" value="shanghai" />
<el-option label="Zone two" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="申请时间">
<el-date-picker
v-model="formQuery.date"
type="date"
placeholder="Pick a date"
clearable
style="width: 220px"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" class="el-button-primary" icon="search"
>搜索</el-button
>
<el-button type="defalut" class="el-button-defalut" icon="Refresh"
>重置</el-button
>
</el-form-item>
</el-form>
</div>
<div class="contentTable">
<component
:is="dialogComponents[activeName]"
:key="activeName"
></component>
</div>
</div>
</template>
<script setup>
import { daily, projectCost, travel, workHours } from '../tab/tabComponent.js'
const dialogComponents = ref({
daily: daily,
projectCost: projectCost,
travel: travel,
workHours: workHours
})
const activeName = ref('daily')
const formQuery = reactive({})
const handleClick = value => {
console.log(activeName.value)
}
</script>
<style scoped lang="scss"></style>
src/views/tab/daily.vue 0 → 100644
View file @ de441101
<script setup></script>
<template>
<div>1</div>
</template>
<style scoped lang="scss"></style>
src/views/tab/projectCost.vue 0 → 100644
View file @ de441101
<script setup></script>
<template><div>2</div></template>
<style scoped lang="scss"></style>
src/views/tab/tabComponent.js 0 → 100644
View file @ de441101
import daily from './daily.vue'
import projectCost from './projectCost.vue'
import travel from './travel.vue'
import workHours from './workHours.vue'
export{daily,projectCost,travel,workHours}
src/views/tab/travel.vue 0 → 100644
View file @ de441101
<script setup></script>
<template><div>3</div></template>
<style scoped lang="scss"></style>
src/views/tab/workHours.vue 0 → 100644
View file @ de441101
<script setup></script>
<template><div>4</div></template>
<style scoped lang="scss"></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