Merge remote-tracking branch 'origin/master'

.prettierrc.cjs

@@ -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

+import request from '@/utils/request'
+
+// 查询项目费用申请列表
+export function getCostRequestList() {
+    return request({
+        url: '/projectCostRequest/list',
+        method: 'get',
+    })
+}

src/assets/styles/btn.scss

@@ -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

@@ -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

@@ -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

@@ -235,3 +235,7 @@
     }
   }
 }
+.el-menu-item.is-active{
+  color:#FFFFFF;
+  background-color: #1B51B4 !important;
+}

src/assets/styles/variables.module.scss

@@ -9,7 +9,7 @@ $yellow: #FEC171;
 $panGreen: #30B08F;
 
 // 默认主题变量
-$menuText: #bfcbd9;
+$menuText: #FFFFFF;
 $menuActiveText: #FFFFFF;
 $menuBg: #143468;
 $menuHover: #1B51B4;

src/layout/components/Navbar.vue

@@ -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

 <script setup>
-
+import { getDicts } from "@/api/system/dict/data";
+getDicts("project_cost_type").then(response => {
+  console.log(response)
+});
 </script>
 
 <template>

src/views/handle/index.vue

+<template>
+  <div>处理</div>
+</template>
+<script setup></script>
+<style scoped lang="scss"></style>

src/views/initiated/index.vue

+<template>
+  <div>发起</div>
+</template>
+<script setup></script>
+<style scoped lang="scss"></style>

src/views/makeCopy/index.vue

+<template>
+  <div>抄送</div>
+</template>
+<script setup></script>
+<style scoped lang="scss"></style>

src/views/myTodoList/index.vue

+<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

+<script setup></script>
+
+<template>
+  <div>1</div>
+</template>
+
+<style scoped lang="scss"></style>

src/views/tab/projectCost.vue

+<script setup></script>
+
+<template><div>2</div></template>
+
+<style scoped lang="scss"></style>

src/views/tab/tabComponent.js

+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

+<script setup></script>
+
+<template><div>3</div></template>
+
+<style scoped lang="scss"></style>

src/views/tab/workHours.vue

+<script setup></script>
+
+<template><div>4</div></template>
+
+<style scoped lang="scss"></style>