Merge branch 'master' of https://sinanoaq.cn:8888/r/gtqt

Your Name

2022-07-13 e2cad5345678266960d40f1ba5e3ffac4d5c85e8

 src/views/specialWorkSystem/workApplyManagement/myApply/index.vue

对比新文件
@@ -0,0 +1,280 @@
<template>
   <div class="home-container">
      <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
         <el-tab-pane label="申请中" name="Applying">
            <el-scrollbar height="100%">
               <el-row class="homeCard">
                     <el-col :span="8">
                        <div class="grid-content topInfo">
                           <el-input v-model="searchWord" placeholder="作业证名称"></el-input>
                           <el-button type="primary">查询</el-button>
                           <el-button plain>重置</el-button>
                        </div>
                     </el-col>
               </el-row>
               <div class="homeCard">
                  <div class="main-card">
                     <el-row class="cardTop">
                        <el-col :span="12" class="mainCardBtn">
                           <el-button type="primary" :icon="Plus" size="default">申请</el-button>
<!--                           <el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
<!--                           <el-button type="success" size="default">设置分类</el-button>-->
                        </el-col>
                        <el-button type="primary" :icon="Refresh" size="default"/>
                     </el-row>
                     <el-table
                           ref="multipleTableRef"
                           :data="applyData"
                           style="width: 100%"
                           :header-cell-style="{background: '#fafafa'}"
                           @selection-change="handleSelectionChange"
                     >
                        <el-table-column type="selection" width="55" />
                        <el-table-column property="num" label="作业证编号" width="200"/>
                        <el-table-column property="level" label="作业证等级" width="180" sortable />
                        <el-table-column property="applyDate" label="申请日期" sortable />
                        <el-table-column property="name" label="申请人" width="180"/>
                        <el-table-column property="department" label="申请部门" width="180" />
                        <el-table-column label="申请状态" width="180">
                           <template #default="scope">
                              <el-tag type="success">{{ scope.row.status }}</el-tag>
                           </template>
                        </el-table-column>
                     </el-table>
                  </div>
                  <div class="pageBtn">
                     <el-pagination
                           v-model:currentPage="currentPage"
                           v-model:page-size="pageSize"
                           :page-sizes="[10, 15]"
                           small=false
                           background
                           layout="total, sizes, prev, pager, next, jumper"
                           :total="100"
                           @size-change="handleSizeChange"
                           @current-change="handleCurrentChange"
                     />
                  </div>
               </div>
            </el-scrollbar>
         </el-tab-pane>
         <el-tab-pane label="已通过" name="passed">
            <el-scrollbar height="100%">
               <el-row>
                  <div class="homeCard">
                     <el-col :span="12">
                        <div class="grid-content topInfo">
                           <el-input v-model="searchWord" placeholder="作业证名称"></el-input>
                           <el-button type="primary">查询</el-button>
                           <el-button plain>重置</el-button>
                        </div>
                     </el-col>
                  </div>
               </el-row>
               <div class="homeCard">
                  <div class="main-card">
<!--                     <el-row class="cardTop">-->
<!--                        <el-col :span="12" class="mainCardBtn">-->
<!--                           <el-button type="primary" :icon="Plus" size="default">申请</el-button>-->
                           <!--<el-button type="danger" :icon="Delete" size="default">删除</el-button>-->
                           <!--<el-button type="success" size="default">设置分类</el-button>-->
<!--                        </el-col>-->
<!--                        <el-button type="primary" :icon="Refresh" />-->
<!--                     </el-row>-->
                     <el-table
                           ref="multipleTableRef"
                           :data="passedData"
                           style="width: 100%"
                           :header-cell-style="{background: '#fafafa'}"
                           @selection-change="handleSelectionChange"
                     >
                        <el-table-column type="selection" width="55" />
                        <el-table-column property="num" label="作业证编号" width="200"/>
                        <el-table-column property="level" label="作业证等级" width="180" sortable />
                        <el-table-column property="applyDate" label="申请日期" sortable />
                        <el-table-column property="name" label="申请人" width="180"/>
                        <el-table-column property="department" label="申请部门" width="180" />
                        <el-table-column label="申请状态" width="180">
                           <template #default="scope">
                              <el-tag type="success">{{ scope.row.status }}</el-tag>
                           </template>
                        </el-table-column>
                     </el-table>
                  </div>
                  <div class="pageBtn">
                     <el-pagination
                           v-model:currentPage="currentPage"
                           v-model:page-size="pageSize"
                           :page-sizes="[10, 15]"
                           small=false
                           background
                           layout="total, sizes, prev, pager, next, jumper"
                           :total="100"
                           @size-change="handleSizeChange"
                           @current-change="handleCurrentChange"
                     />
                  </div>
               </div>
            </el-scrollbar>
         </el-tab-pane>
      </el-tabs>
   </div>
</template>

<script lang="ts">
   import { toRefs, reactive, defineComponent, ref } from 'vue';
   import { storeToRefs } from 'pinia';
   import { initBackEndControlRoutes } from '/@/router/backEnd';
   import {useUserInfo} from "/@/stores/userInfo";
   import { Session } from '/@/utils/storage';
   import { Plus, Delete, Refresh } from '@element-plus/icons-vue'
   import { ElTable } from 'element-plus'
   import type { TabsPaneContext } from 'element-plus'
   let global: any = {
      homeChartOne: null,
      homeChartTwo: null,
      homeCharThree: null,
      dispose: [null, '', undefined],
   };

   interface stateType {
      homeOne: Array <type>
   }
   interface type {

   }
   interface User {
      num: string
      level: string
      applyDate: string
      name: string
      department: string
      status: string
   }
   export default defineComponent({
      name: 'myApply',
      setup() {
         const userInfo = useUserInfo()
         const { userInfos } = storeToRefs(userInfo);
         const state  = reactive<stateType>({});
         const activeName = ref('Applying')
         const handleClick = (tab: TabsPaneContext, event: Event) => {
            console.log(tab, event)
         }
         const multipleTableRef = ref<InstanceType<typeof ElTable>>()
         const multipleSelection = ref<User[]>([])
         const handleSelectionChange = (val: User[]) => {
            multipleSelection.value = val
         }
         const currentPage = ref(1)
         const pageSize = ref(10)
         const handleSizeChange = (val: number) => {
            console.log(`${val} items per page`)
         }
         const handleCurrentChange = (val: number) => {
            console.log(`current page: ${val}`)
         }
         const applyData: User[] = []
         const passedData: User[] = []
         // 折线图
         const renderMenu = async (value: string) => {
            Session.set('projectId',value)
            userInfos.value.projectId = value
            await initBackEndControlRoutes();
         };
         return {
            renderMenu,
            multipleTableRef,
            applyData,
            passedData,
            currentPage,
            pageSize,
            activeName,
            handleClick,
            handleSizeChange,
            handleCurrentChange,
            Plus,
            Delete,
            handleSelectionChange,
            Refresh,
            ...toRefs(state),
         };
      },
   });
</script>

<style scoped lang="scss">
   $homeNavLengh: 8;
   .home-container {
      height: 100%;
      overflow: hidden;
      padding: 20px;
      .demo-tabs > .el-tabs__content {
         padding: 32px;
         color: #6b778c;
         font-size: 32px;
         font-weight: 600;
      }
      .homeCard{
         width: 100%;
         padding: 20px;
         background: #fff;
         border-radius: 4px;
      }
      .el-row{
         display: flex;
         align-items: center;
         margin-bottom: 20px;
         &:last-child {
            margin-bottom: 0;
         }
         .grid-content{
            align-items: center;
            min-height: 36px;
         }

         .topInfo {
            display: flex;
            align-items: center;
            font-size: 16px;
            font-weight: bold;

            &>div{
               white-space: nowrap;
               margin-right: 20px;
            }
         }
      }
      .mainPages{
         height: 100%;
         display: flex;
         flex-direction: column;
         justify-content: space-between;
      }
      .main-card{
         width: 100%;
         .cardTop{
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20px;
            .mainCardBtn{
               margin: 0;
            }
         }
      }
      .pageBtn{
         display: flex;
         align-items: center;
         justify-content: right;
         margin-top: 20px;

         .demo-pagination-block + .demo-pagination-block {
            margin-top: 10px;
         }
         .demo-pagination-block .demonstration {
            margin-bottom: 16px;
         }
      }
   }
</style>