style: 🎨 修改了薪资管理、薪资统计、我的薪资、界面头部等

components.d.ts

@@ -39,6 +39,7 @@ declare module '@vue/runtime-core' {
     ElIcon: typeof import('element-plus/es')['ElIcon']
     ElImage: typeof import('element-plus/es')['ElImage']
     ElInput: typeof import('element-plus/es')['ElInput']
+    ElLink: typeof import('element-plus/es')['ElLink']
     ElMain: typeof import('element-plus/es')['ElMain']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']

src/hooks/useTable.ts

@@ -1,4 +1,4 @@
-import { reactive, toRefs, watch } from 'vue'
+import { reactive, toRefs } from 'vue'
 interface Pageable {
   pageNum: number
   pageSize: number
@@ -26,9 +26,8 @@ interface Table {
 export const useTable = (
   requestApi: (params: any) => Promise<any>,
   initParam: object = {},
-  isPagination?: boolean = true,
-  dataCallback?: (data: any) => any,
-  uuid?: string
+  isPagination: boolean = true,
+  dataCallback?: (data: any) => any
 ) => {
   const state = reactive<Table>({
     // 表格数据
@@ -67,7 +66,8 @@ export const useTable = (
       state.pageable.RemainingTime = res.Data.RemainingTime
     }
   }
-
+  if (isPagination) {
+  }
   const handleSizeChange = (val: number) => {
     state.pageable.pageSize = val
     getTableList()
@@ -83,38 +83,11 @@ export const useTable = (
     getTableList()
   }
 
-  // watch(
-  //   () => uuid,
-  //   pre => {
-  //     console.log(pre)
-  //   }
-  // )
-
-  // const tableRowClassName = ({ row, rowIndex }) => {
-  //   console.log(uuid)
-  //   //判断是否相等，相同时改变背景颜色
-  //   // let user = this.multipleSelection.find(item => item.autoid === row.autoid)
-  //   let rowBackground = {
-  //     background: '#95d475'
-  //   }
-  //   return rowBackground
-  //   // if (list !== undefined) {
-  //   //   let rowBackground = {
-  //   //     background: '#9FBBFF'
-  //   //   }
-  //   //   //rowBackground.color = "red" //字体颜色
-  //   //   return rowBackground
-  //   // } else {
-  //   //   return ''
-  //   // }
-  // }
-
   return {
     ...toRefs(state),
     getTableList,
     searchTable,
     handleSizeChange,
     handleCurrentChange
-    // tableRowClassName
   }
 }

src/layouts/Header/index.vue

@@ -1,10 +1,10 @@
 <script setup lang="ts">
-import { ref } from 'vue'
+import { ref, computed } from 'vue'
 import { useRouter } from 'vue-router'
 import { GlobalStore } from '@/stores/index'
 import Breadcrumb from './Breadcrumb.vue'
-import Notice from './Notice.vue'
-import { Expand, Fold } from '@element-plus/icons-vue'
+// import Notice from './Notice.vue'
+import { Expand, Fold, List } from '@element-plus/icons-vue'
 import 'element-plus/theme-chalk/src/dropdown.scss'
 const globalStore = GlobalStore()
 const router = useRouter()
@@ -15,7 +15,10 @@ const logOut = () => {
   globalStore.SET_Flat_Menu([])
   router.replace('/login')
 }
-
+const info = computed(() => globalStore.GET_User_Info)
+const goTask = () => {
+  window.open(`http://dootask.baozhida.cn/gologin/index.html?uuid=${info.value.T_uuid}&name=${info.value.T_name}`)
+}
 const getTime = () => {
   return new Date().toLocaleString('en-US', {
     hour: 'numeric',
@@ -34,7 +37,7 @@ setInterval(() => {
 <template>
   <div class="header">
     <el-row>
-      <el-col :xl="16" :sm="15" class="d-flex">
+      <el-col :xl="15" :lg="13" :sm="13" class="d-flex">
         <el-button
           class="isCollapse"
           type="primary"
@@ -44,6 +47,11 @@ setInterval(() => {
         ></el-button>
         <Breadcrumb></Breadcrumb>
       </el-col>
+      <el-col :xl="2" :lg="2" :sm="2" class="notice">
+        <el-link type="primary" @click="goTask"
+          ><el-icon> <List /> </el-icon>任务管理</el-link
+        >
+      </el-col>
       <el-col :xl="2" :sm="2" class="notice">
         <!-- <el-popover placement="bottom-end" :width="400" trigger="click">
           <template #reference>

src/layouts/Menu/SubMenu.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts" name="SubMenu">
 import { useRouter } from 'vue-router'
 import { icons } from '@/utils/common'
+
 const router = useRouter()
 
 defineProps<{ menuList: Menu.MenuOptions[] }>()

src/router/modules/asyncRouter.ts

@@ -6,22 +6,6 @@ import { ElNotification } from 'element-plus'
 // 加载views下面所有的.vue文件
 const modules = import.meta.glob('@/views/**/*.vue')
 
-
-// export const asyncAddRouter = () => {
-//   const globalStore = GlobalStore()
-//   globalStore.GET_Flat_Menu.forEach((item: any) => {
-//     item.children && delete item.children
-//     if (item.component && typeof item.component == 'string') {
-//       item.component = modules['/src/views' + item.component + '.vue']
-//     }
-//     if (item.meta.isFull) {
-//       router.addRoute(item)
-//     } else {
-//       router.addRoute('Index', item)
-//     }
-//   })
-// }
-
 /**
  * 初始化动态路由
  */

src/router/modules/staticRouter.ts

@@ -64,7 +64,7 @@ export const staticRouter: RouteRecordRaw[] = [
             }
           },
           {
-            path: '/contract-detail/:id',
+            path: '/contractDetail/:id',
             name: 'ContractDetail',
             component: () => import('@/views/storehouse/sales/ContractDetail.vue'),
             meta: {

src/views/salary/SalaryCount.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
-import { ref, reactive } from 'vue'
+import { ref, reactive, nextTick } from 'vue'
 import { ElMessage } from 'element-plus'
 import type { TableColumnCtx } from 'element-plus'
 import { Salary_List, Salary_Send, Salary_Excel } from '@/api/salary/index'
 
 interface User {
   Id: number
+  T_State: number
   T_user_name: string
   T_base: number
   T_post: number
@@ -47,8 +48,8 @@ const multipleSelection = ref<User[]>([])
 const tableTH = [
   { type: 'selection', width: '60px', fixed: 'left' },
   { type: 'index', label: '序号', width: '60px', fixed: 'left' },
-  { prop: 'T_user_name', label: '姓名', fixed: 'left', width: '80px' },
-  { prop: 'T_user_dept', label: '部门', fixed: 'left', width: '80px' },
+  { prop: 'T_user_name', label: '姓名', fixed: 'left', width: '100px' },
+  { prop: 'T_user_dept', label: '部门', fixed: 'left', width: '100px' },
   { prop: 'T_user_post', label: '岗位', fixed: 'left', width: '100px' },
   { prop: 'T_base', label: '基本工资', sortable: true, width: '120px' },
   { prop: 'T_post', label: '岗位工资', sortable: true, width: '120px' },
@@ -67,7 +68,8 @@ const tableTH = [
   { prop: 'T_housing_fund', label: '公积金', sortable: true, width: '100px' },
   { prop: 'T_tax', label: '个税扣款', sortable: true, width: '120px' },
   { prop: 'T_laborage', label: '扣款合计', sortable: true, width: '120px' },
-  { prop: 'T_total', label: '实发合计', sortable: true, width: '120px' }
+  { prop: 'T_total', label: '实发合计', sortable: true, width: '120px' },
+  { prop: 'T_remark', label: '备注', sortable: true, width: '200px' }
 ]
 
 const salarDateYearChange = (val: string) => {
@@ -109,6 +111,17 @@ const publishSalary = async () => {
     Salary_Send({ T_id: item.Id })
   }
   ElMessage.success('发布成功!!!')
+  tableData.value = tableData.value.map((item: User) => {
+    let index = multipleSelection.value.findIndex((user: User) => item.Id === user.Id)
+    if (index !== -1) {
+      item.T_State = 2
+    }
+    return item
+  })
+
+  nextTick(() => {
+    multipleSelection.value = []
+  })
 }
 
 const handleSelectionChange = (val: User[]) => {
@@ -129,6 +142,16 @@ const tableRowClassName = ({ rowIndex }: { row: User; rowIndex: number }) => {
   }
 }
 
+const tableRowStyle = (row: { row: User }) => {
+  if (row.row.T_State === 2) {
+    return {
+      background: '#fef0f0',
+      color: '#f56c6c'
+    }
+  }
+
+  // #f56c6c  #fef0f0   // #fdf6ec #e6a23c  // #f0f9eb #67c23a
+}
 const getSalary_List = async () => {
   const res: any = await Salary_List(initParam)
   tableData.value = res.Data.Data
@@ -170,11 +193,13 @@ getSalary_List()
     </el-card>
     <el-card class="table-card">
       <el-table
+        border
         :data="tableData"
+        :highlight-current-row="true"
         @selection-change="handleSelectionChange"
         :span-method="arraySpanMethod"
-        border
-        style="width: 100%"
+        style="width: 100%; height: 100%"
+        :row-style="tableRowStyle"
         :row-class-name="tableRowClassName"
       >
         <template v-for="(item, index) in tableTH" :key="index">
@@ -194,7 +219,16 @@ getSalary_List()
             align="center"
             label-class-name="label-table"
             :sortable="item.sortable"
-          />
+          >
+            <template #default="{ row }">
+              <el-tooltip v-if="item.prop === 'T_remark'" effect="customized" placement="left">
+                <template #content>
+                  <div class="tooltip-content">{{ row.T_remark }}</div>
+                </template>
+                {{ row.T_remark }}
+              </el-tooltip>
+            </template>
+          </el-table-column>
         </template>
       </el-table>
     </el-card>

src/views/salary/SalaryMy.vue

@@ -10,7 +10,16 @@ const salaryFromData = reactive({
   month: (month < 10 ? '0' : '') + month,
   T_uuid: ''
 })
-const isSalary = ['T_user_name', 'T_user_post', 'T_user_dept', 'T_attendance', 'T_cut_payment', 'T_laballot', 'T_total']
+const isSalary = [
+  'T_user_name',
+  'T_user_post',
+  'T_user_dept',
+  'T_attendance',
+  'T_cut_payment',
+  'T_laballot',
+  'T_total',
+  'T_remark'
+]
 
 const salaryData = reactive([
   { name: '姓名', field: 'T_user_name', salary: '' },
@@ -33,7 +42,8 @@ const salaryData = reactive([
   { name: '考勤扣款：', field: 'T_attendance', salary: '' },
   { name: '其他扣款', field: 'T_cut_payment', salary: '' },
   { name: '应发合计', field: 'T_laballot', salary: '' },
-  { name: '实发合计', field: 'T_total', salary: '' }
+  { name: '实发合计', field: 'T_total', salary: '' },
+  { name: '备注', field: 'T_remark', salary: '' }
 ])
 
 const getMySalary = async () => {
@@ -132,7 +142,7 @@ getMySalary()
                 {{ item.name }}
               </div>
             </template>
-            <el-tag type="danger">{{ item.salary }}￥</el-tag>
+            <el-tag type="danger">{{ item.salary }}{{ item.field === 'T_perf_score' ? '' : '￥' }}</el-tag>
           </el-descriptions-item>
         </template>
         <el-descriptions-item :span="2">
@@ -151,6 +161,10 @@ getMySalary()
           <template #label>实发合计：</template>
           <el-tag type="danger">{{ salaryData[20].salary }}￥</el-tag>
         </el-descriptions-item>
+        <el-descriptions-item :span="2">
+          <template #label>备注：</template>
+          <el-tag type="danger">{{ salaryData[21].salary ? salaryData[21].salary : '-' }}</el-tag>
+        </el-descriptions-item>
       </el-descriptions>
     </el-card>
   </div>
@@ -165,6 +179,6 @@ getMySalary()
 }
 .salary-content {
   overflow-y: auto;
-  height: 800px;
+  max-height: calc(100% - 60px - 72px - 24px);
 }
 </style>

src/views/salary/salary/Salary.vue

@@ -89,7 +89,8 @@ const tableRowClassName = (data: any): any => {
   }
   if (user !== undefined) {
     let rowBackground = {
-      background: '#95d475'
+      background: '#f0f9eb',
+      color: '#67c23a'
     }
     return rowBackground
   } else {
@@ -131,9 +132,6 @@ const tableRowClassName = (data: any): any => {
             </el-col>
           </el-row>
         </template>
-        <!-- <template #T_name="{ row }">
-          <el-button type="primary" text @click="getSalaryParams(row)">{{ row.T_name }}</el-button>
-        </template> -->
       </TableBase>
     </div>
     <el-row class="h-100 f-1 margin-left-3">
@@ -150,6 +148,9 @@ const tableRowClassName = (data: any): any => {
               </h4>
             </div>
           </div>
+          <!-- <el-icon size="42">
+            <CircleCheck color="#67C23A" />
+          </el-icon> -->
         </el-card>
         <el-card class="m-b-3">
           <el-row :gutter="20">

src/views/salary/salary/SalaryFrom.vue

@@ -4,6 +4,7 @@ import { ElNotification, ElMessage } from 'element-plus'
 import { Salary_Post } from '@/api/salary/index'
 import { ref, reactive, onMounted, onUnmounted } from 'vue'
 import type { FormInstance, FormRules } from 'element-plus'
+import { StarFilled } from '@element-plus/icons-vue'
 
 const formRef = ref<FormInstance>()
 const form = ref({
@@ -21,6 +22,7 @@ const form = ref({
   T_medical_insurance: '',
   T_large_medical_insurance: '',
   T_housing_fund: '',
+  T_remark: '',
   T_State: 1
 })
 const rules = reactive<FormRules>(reuls_validator)
@@ -83,6 +85,13 @@ onUnmounted(() => {
 
 <template>
   <el-card class="form-card" :style="{ height: cardHeight + 'px' }">
+    <el-row :gutter="24">
+      <el-col :span="12" style="margin-left: 4rem">
+        <el-tag type="warning" effect="dark"
+          >已发布 <el-icon> <StarFilled /> </el-icon
+        ></el-tag>
+      </el-col>
+    </el-row>
     <el-form :model="form" ref="formRef" :rules="rules">
       <el-row :gutter="24">
         <el-col :span="12" class="form-card-left">
@@ -131,10 +140,20 @@ onUnmounted(() => {
             <el-input v-model="form.T_housing_fund" autocomplete="off" placeholder="￥" />
           </el-form-item>
         </el-col>
+        <el-col :span="24">
+          <el-form-item label="备注：" :label-width="formLabelWidth" prop="T_remark">
+            <el-input
+              v-model="form.T_remark"
+              :autosize="{ minRows: 4, maxRows: 6 }"
+              type="textarea"
+              placeholder="请输入备注信息"
+            />
+          </el-form-item>
+        </el-col>
       </el-row>
     </el-form>
-    <div class="d-flex">
-      <el-button v-if="form.T_State !== 2" type="primary" class="submit" @click="submitSalary(formRef)">提交</el-button>
+    <div class="d-flex" style="flex-direction: column">
+      <el-button type="primary" class="submit" @click="submitSalary(formRef)">提交</el-button>
     </div>
   </el-card>
 </template>

src/views/salary/salary/index.scss

@@ -5,7 +5,7 @@
 
 .submit {
   padding: 0.5rem 1.875rem;
-  margin-top: 1.25rem;
+  // margin-top: 1.25rem;
 }
 .form-card {
   overflow: auto;

src/views/storehouse/inventory/InStorage.vue

@@ -24,6 +24,7 @@ const columns: ColumnProps[] = [
 const url = ref('')
 const srcList = ref<any[]>([])
 const dialog = ref<InstanceType<typeof Dialog> | null>(null)
+const InStorageFormRef = ref<InstanceType<typeof InStorageForm> | null>(null)
 const previewImg = (str: string) => {
   dialog.value?.DialogOpen()
   url.value = str
@@ -37,13 +38,19 @@ const initParam = reactive({
   T_state: ''
 })
 const searchHandle = () => {
-  console.log(initParam)
+  TableRef.value?.searchTable()
+}
 
-  // TableRef.value?.searchTable()
+const openInStorageFormDrawer = (type: string, row?: any) => {
+  InStorageFormRef.value?.openDrawer(type, row)
 }
 
 // 拿到仓库列表
-const options = ref()
+interface ItemType {
+  T_name: string
+  T_State: number
+}
+const options = ref<ItemType[]>()
 const getDepotList = async () => {
   const res: any = await Storehouse_Depot_List({ User_tokey: globalStore.GET_User_tokey, page: 1, page_z: 999 })
   options.value = res.Data.Data
@@ -79,7 +86,9 @@ onMounted(() => {
               </el-select>
               <el-button type="primary" @click="searchHandle">搜索</el-button>
             </el-col>
-            <el-col :xl="3" :lg="3" :md="4" class="btn"><el-button type="primary">入库</el-button></el-col>
+            <el-col :xl="3" :lg="3" :md="4" class="btn"
+              ><el-button type="primary" @click="openInStorageFormDrawer('new')">入库</el-button></el-col
+            >
           </el-row>
         </div>
       </template>
@@ -103,7 +112,7 @@ onMounted(() => {
     <Dialog ref="dialog" width="50%">
       <el-image :src="url" :zoom-rate="1.2" :preview-src-list="srcList" fit="cover" />
     </Dialog>
-    <InStorageForm />
+    <InStorageForm ref="InStorageFormRef" :options="options" />
   </div>
 </template>
 

src/views/storehouse/inventory/InStorageForm.vue

@@ -1,6 +1,527 @@
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { ref, reactive, nextTick } from 'vue'
+import Drawer from '@/components/Drawer/index.vue'
+import { Delete, CirclePlus } from '@element-plus/icons-vue'
+import { GlobalStore } from '@/stores/index'
+import { ElMessage } from 'element-plus'
+import {
+  Storehouse_Product_List,
+  Storehouse_ProductClass_List,
+  Storehouse_Product_Model_List,
+  Storehouse_Product_Name_List,
+  Storehouse_Contract_Product_List
+} from '@/api/storehouse/index'
+import type { FormInstance, FormRules } from 'element-plus'
+import { default as vElTableInfiniteScroll } from 'el-table-infinite-scroll'
+
+const isNew = ref(true)
+const selectTable = ref()
+const snTable = ref()
+let selectProductData: any[] = []
+const globalStore = GlobalStore()
+const formLabelWidth = ref('120px')
+const ruleFormRef = ref<FormInstance>()
+const drawerRef = ref<InstanceType<typeof Drawer> | null>(null)
+const drawerSnRef = ref<InstanceType<typeof Drawer> | null>(null)
+const drawerProductRef = ref<InstanceType<typeof Drawer> | null>(null)
+
+const classOptions = ref<any[]>([])
+const modelOptions = ref<any[]>([])
+const initParam = reactive({
+  User_tokey: globalStore.GET_User_tokey,
+  T_name: '',
+  T_model: '',
+  T_class: '',
+  page: 0,
+  page_z: 20
+})
+type Fn = () => void
+interface FormType {
+  T_number: string
+  T_depot_id: any
+  T_product: any
+  T_date: string
+  T_remark: string
+}
+const form = reactive<FormType>({
+  T_number: '',
+  T_depot_id: '',
+  T_product: '',
+  T_date: '',
+  T_remark: ''
+})
+const rules = reactive<FormRules>({
+  // T_product: [{ validator: validate_T_product, trigger: 'blur' }],
+  T_depot_id: [{ required: true, message: '请选择仓库', trigger: 'blur' }],
+  T_date: [{ required: true, message: '请选择入库日期', trigger: 'blur' }]
+})
+
+const tableData = ref<any[]>([])
+const columns = [
+  { type: 'index', label: '序号', width: 80, align: 'center ' },
+  { label: '产品图片', prop: 'T_img', align: 'center ', name: 'T_img' },
+  { label: '产品名称', prop: 'T_name', align: 'center ' },
+  { label: '产品分类', prop: 'T_class_name', align: 'center ' },
+  { label: '产品型号', prop: 'T_model', align: 'center ' },
+  { label: '产品规格', prop: 'T_spec', align: 'center ' },
+  { label: '是否关联SN', prop: 'T_relation_sn', align: 'center ', width: 120, name: 'T_relation_sn' },
+  { label: '*数量', prop: 'count', align: 'center ', name: 'count' },
+  { label: '*关联设备', prop: 'sn', align: 'center ', name: 'sn' },
+  { prop: 'operation', label: '操作', width: 80, fixed: 'right' }
+]
+
+const productColumns = [
+  { type: 'selection', width: 80 },
+  { prop: 'T_img', label: '产品图片', name: 'T_img' },
+  { prop: 'T_name', label: '产品名称' },
+  { prop: 'T_class_name', label: '产品分类' },
+  { prop: 'T_model', label: '产品型号', ellipsis: true },
+  { prop: 'T_spec', label: '产品规格' },
+  { prop: 'T_relation_sn', label: '关联SN', name: 'T_relation_sn' },
+  { prop: 'T_remark', label: '备注', ellipsis: true }
+]
+
+const countBlurHandle = () => {
+  form.T_product = tableData.value.map(item => {
+    if (!item.count) return undefined
+    return `${item.Id},${item.count}`
+  })
+}
+// const snBlurHandle = ()=>{
+//   form.T_product = tableData.value.map(item => {
+//     if (!item.sn) return undefined
+//     return `${item.Id},${item.count}`
+//   })
+// }
+
+const deleteProduct = (row: any) => {
+  tableData.value = tableData.value.filter(item => item.Id !== row.Id)
+
+  // 设置产品的选中
+  // selectTable.value?.toggleRowSelection(row, false)
+}
+
+const callbackDrawer = (done: Fn) => {
+  resetForm(ruleFormRef.value)
+  isNew.value = true
+  done()
+}
+const callbackProductDrawer = (done: Fn) => done()
+const callbackSnDrawer = (done: Fn) => done()
+
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  tableData.value = []
+  formEl.resetFields()
+}
+
+// 获取产品分类
+const getProductClassList = async () => {
+  const res: any = await Storehouse_ProductClass_List({ page: 1, page_z: 999 })
+  classOptions.value = res.Data.Data
+}
+const AddProductionDetailed = () => {
+  !classOptions.value.length && getProductClassList()
+  drawerProductRef.value?.openDrawer()
+}
+const openDrawer = (type: string, row?: any) => {
+  isNew.value = type === 'new' ? true : false
+  if (!isNew.value) {
+    nextTick(() => {
+      editDataEcho(row)
+    })
+  }
+  drawerRef.value?.openDrawer()
+}
+
+const editDataEcho = async (row: any) => {
+  form.T_date = row.T_date
+  form.T_remark = row.T_remark
+  form.T_number = row.T_number
+
+  const res: any = await Storehouse_Contract_Product_List({
+    User_tokey: globalStore.GET_User_tokey,
+    T_number: row.T_number
+  })
+  if (res.Code === 200) {
+    res.Data &&
+      (tableData.value = res.Data.map((item: any) => {
+        item.Id = item.T_product_id
+        item.T_img = item.T_product_img
+        item.T_name = item.T_product_name
+        item.T_class_name = item.T_product_class_name
+        item.T_model = item.T_product_model
+        item.T_spec = item.T_product_spec
+        item.T_relation_sn = item.T_product_relation_sn
+        item.count = item.T_product_total
+        return item
+      }))
+    selectProductData = tableData.value
+  }
+}
+
+// 自动搜索
+const autoSelect = ref('')
+let timeout: NodeJS.Timeout
+const querySearchAsync = async (queryString: string, cb: (arg: any) => void) => {
+  clearTimeout(timeout)
+  timeout = setTimeout(async () => {
+    const results = await getNameAsync(queryString)
+    console.log(autoSelect, queryString)
+    cb(results)
+  }, 2000)
+}
+const getNameAsync = async (str: string): Promise<any> => {
+  const res: any = await Storehouse_Product_Name_List({ T_name: str, T_class: initParam.T_class })
+  if (!res.Data) return
+  return res.Data.map((item: any, index: number) => {
+    return {
+      value: item,
+      index: index
+    }
+  })
+}
+const getProductModelList = async () => {
+  const res: any = await Storehouse_Product_Model_List({ T_name: autoSelect.value })
+  modelOptions.value = res.Data.map((item: any, index: number) => {
+    return {
+      value: item,
+      index: index
+    }
+  })
+}
+const handleSelect = (item: any) => {
+  // initParam.T_name = item.value
+  getProductModelList()
+}
+// 加载第二个抽屉数据
+const load = () => {
+  if (initParam.page && total === tableProductData.value.length) {
+    ElMessage.warning('没有更多数据了！！')
+    return
+  }
+  initParam.page++
+  getProductList()
+}
+let total = 0
+const tableProductData = ref<any[]>([])
+const getProductList = async () => {
+  const res: any = await Storehouse_Product_List({ ...initParam, T_name: autoSelect.value })
+  tableProductData.value.push(...res.Data.Data)
+  total = res.Data.Num
+  if (!isNew.value) {
+    // 设置产品的选中
+    tableProductData.value.forEach((row: any) => {
+      const matchedIndex = selectProductData.findIndex((item: any) => item.Id == row.Id)
+
+      selectTable.value?.toggleRowSelection(row, matchedIndex != -1)
+    })
+  }
+}
+const ProductselectionChange = (row: any[]) => {
+  const newProduct = row.find((product: any) => tableData.value.findIndex((item: any) => item.Id === product.Id) === -1)
+  newProduct && tableData.value.push({ ...newProduct })
+}
+
+// 搜索模型
+const searchModelHandle = () => {
+  total = 0
+  initParam.page = 1
+  tableProductData.value = []
+  getProductList()
+}
+// 保存选中的数据id,row-key就是要指定一个key标识这一行的数据
+const getRowKey = (row: any) => {
+  return row.Id
+}
+
+// 添加sn
+const addDeviceSn = () => {
+  //
+  drawerSnRef.value?.openDrawer()
+}
+const tableSnData: any[] = []
+const snColumns = [
+  { type: 'index', label: '序号', width: 80, align: 'center ' },
+  { label: 'SN', prop: 'sn', align: 'center ' },
+  { prop: 'operation', label: '操作', width: 80, fixed: 'right' }
+]
+
+// 接受props
+interface ItemType {
+  T_name: string
+  T_State: number
+}
+interface PropsType {
+  options?: ItemType[]
+}
+const props = defineProps<PropsType>()
+
+defineExpose({
+  openDrawer
+})
+</script>
 
 <template>
-  <div class="inStorage-form"></div>
+  <div class="inStorage-form">
+    <Drawer ref="drawerRef" :handleClose="callbackDrawer" size="80%">
+      <template #header="{ params }">
+        <h4 :id="params.titleId" :class="params.titleClass">{{ isNew ? '入库' : '详情' }}</h4>
+      </template>
+      <el-form ref="ruleFormRef" :model="form" :rules="rules">
+        <el-divider border-style="dashed" />
+        <el-form-item label="入库单号：" :label-width="formLabelWidth" prop="T_number">
+          <el-input v-model="form.T_number" type="text" :disabled="true" placeholder="请输入入库单号" class="w-50" />
+        </el-form-item>
+        <el-form-item label="入库仓库：" :label-width="formLabelWidth" prop="T_depot_id">
+          <el-select v-model="form.T_depot_id" class="w-50" clearable placeholder="请选择入库仓库~">
+            <el-option v-for="item in props.options" :key="item.T_State" :label="item.T_name" :value="item.T_State" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="入库日期：" :label-width="formLabelWidth" prop="T_date">
+          <el-date-picker
+            class="my-date-picker"
+            style="width: 21.5rem"
+            v-model="form.T_date"
+            type="date"
+            placeholder="选择日期"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+          />
+        </el-form-item>
+        <el-form-item label="入库明细：" :label-width="formLabelWidth" prop="T_product">
+          <el-table
+            :data="tableData"
+            style="width: 100%"
+            border
+            stripe
+            :header-cell-style="{
+              background: '#dedfe0',
+              height: '50px'
+            }"
+          >
+            <template v-for="item in columns" :key="item.prop">
+              <el-table-column v-bind="item" v-if="item.fixed !== 'right'">
+                <template #header v-if="item.prop === 'count' || item.prop === 'sn'">
+                  <span style="color: red">{{ item.label }}</span>
+                </template>
+                <template #default="{ row }" v-if="item.prop === item.name">
+                  <el-input
+                    v-if="item.prop === 'count'"
+                    v-model.number="row.count"
+                    type="text"
+                    autocomplete="off"
+                    @blur="countBlurHandle"
+                  />
+                  <el-button
+                    v-if="item.prop === 'sn'"
+                    link
+                    type="primary"
+                    size="small"
+                    :icon="CirclePlus"
+                    @click="addDeviceSn"
+                    >添加</el-button
+                  >
+                  <span v-if="item.prop === 'T_relation_sn'">
+                    <el-tag v-if="row.T_relation_sn === 1" effect="dark">是</el-tag>
+                    <el-tag v-else type="success" effect="dark">否</el-tag>
+                  </span>
+                  <el-image v-if="item.prop === 'T_img'" style="height: 50px" :src="row.T_img" fit="cover" />
+                </template>
+              </el-table-column>
+              <el-table-column v-bind="item" v-if="item.fixed === 'right'">
+                <template #default="{ row }">
+                  <el-button link type="danger" size="small" :icon="Delete" @click="deleteProduct(row)">删除</el-button>
+                </template>
+              </el-table-column>
+            </template>
+            <template #append>
+              <el-button type="primary" @click="AddProductionDetailed">
+                <el-icon><Plus /></el-icon><span style="margin-left: 6px">添加产品</span>
+              </el-button>
+            </template>
+          </el-table>
+        </el-form-item>
+        <el-form-item label="入库仓库：" :label-width="formLabelWidth" prop="T_number">
+          <el-input
+            class="w-50"
+            v-model="form.T_remark"
+            :autosize="{ minRows: 4, maxRows: 6 }"
+            type="textarea"
+            placeholder="请输入备注信息"
+          />
+        </el-form-item>
+        <div class="btn">
+          <el-divider>
+            <el-button>取消</el-button>
+            <el-button v-if="isNew" color="#626aef">提交</el-button>
+          </el-divider>
+        </div>
+        <Drawer ref="drawerProductRef" :handleClose="callbackProductDrawer" size="70%">
+          <template #header="{ params }">
+            <h4 :id="params.titleId" :class="params.titleClass">选择产品</h4>
+          </template>
+          <el-card class="box-card" shadow="never">
+            <template #header>
+              <div class="input-suffix">
+                <el-row :gutter="20" style="margin-bottom: 0">
+                  <el-col :xl="5" :lg="8" :md="10" class="d-flex">
+                    <span class="inline-flex items-center">产品分类：</span>
+                    <el-select v-model="initParam.T_class" clearable placeholder="请选择分类~">
+                      <el-option v-for="item in classOptions" :key="item.Id" :label="item.T_name" :value="item.Id" />
+                    </el-select>
+                  </el-col>
+                  <el-col :xl="7" :lg="8" :md="10" class="d-flex">
+                    <span class="inline-flex items-center">产品名称：</span>
+                    <el-autocomplete
+                      v-model="autoSelect"
+                      clearable
+                      :fetch-suggestions="querySearchAsync"
+                      placeholder="按产品名称搜索"
+                      :debounce="2000"
+                      :trigger-on-focus="false"
+                      @select="handleSelect"
+                    />
+                  </el-col>
+                  <el-col :xl="7" :lg="8" :md="12" class="d-flex">
+                    <span class="inline-flex items-center">产品型号：</span>
+                    <el-select v-model="initParam.T_model" clearable placeholder="请选择型号~">
+                      <el-option
+                        v-for="item in modelOptions"
+                        :key="item.index"
+                        :label="item.value"
+                        :value="item.value"
+                      />
+                    </el-select>
+                    <el-button type="primary" @click="searchModelHandle">搜索</el-button>
+                  </el-col>
+                </el-row>
+              </div>
+            </template>
+            <el-table
+              ref="selectTable"
+              :row-key="getRowKey"
+              :data="tableProductData"
+              style="width: 100%; height: 99%"
+              :header-cell-style="{
+                background: '#dedfe0',
+                height: '50px'
+              }"
+              v-el-table-infinite-scroll="load"
+              @selection-change="ProductselectionChange"
+            >
+              <template v-for="item in productColumns" :key="item">
+                <el-table-column
+                  v-if="item.type === 'index' || item.type === 'selection'"
+                  align="center"
+                  v-bind="item"
+                />
+                <el-table-column v-if="!item.ellipsis && item.prop" v-bind="item">
+                  <template #default="{ row }">
+                    <span v-if="item.prop === 'T_relation_sn'">
+                      <el-tag v-if="row.T_relation_sn === 1" effect="dark">是</el-tag>
+                      <el-tag v-else type="success" effect="dark">否</el-tag>
+                    </span>
+                    <el-image v-if="item.prop === 'T_img'" style="height: 50px" :src="row.T_img" fit="cover" />
+                  </template>
+                </el-table-column>
+                <el-table-column v-if="item.ellipsis && item.prop === 'T_model'" align="center" v-bind="item">
+                  <template #default="{ row }">
+                    <el-tooltip effect="dark" :content="row.T_model" placement="bottom">
+                      {{ row.T_model }}
+                    </el-tooltip>
+                  </template>
+                </el-table-column>
+                <el-table-column v-if="item.ellipsis && item.prop === 'T_remark'" align="center" v-bind="item">
+                  <template #default="{ row }">
+                    <el-tooltip effect="customized" placement="left">
+                      <template #content>
+                        <div class="tooltip-content">{{ row.T_remark }}</div>
+                      </template>
+                      {{ row.T_remark }}
+                    </el-tooltip>
+                  </template>
+                </el-table-column>
+              </template>
+            </el-table>
+          </el-card>
+        </Drawer>
+        <Drawer ref="drawerSnRef" :handleClose="callbackSnDrawer" size="50%">
+          <el-card class="box-card" shadow="never">
+            <template #header>
+              <div class="sn-header">
+                <el-form ref="ruleFormRef" :model="form" :rules="rules">
+                  <el-form-item label="SN：" :label-width="formLabelWidth" prop="T_number">
+                    <el-input v-model="form.T_number" type="text" placeholder="请输入SN" class="w-50" />
+                  </el-form-item>
+                </el-form>
+                <el-button type="primary">添加</el-button>
+              </div>
+            </template>
+            <el-table
+              ref="snTable"
+              :data="tableSnData"
+              style="width: 100%; height: 99%"
+              :header-cell-style="{
+                background: '#dedfe0',
+                height: '50px'
+              }"
+            >
+              <template v-for="item in snColumns" :key="item">
+                <el-table-column v-if="item.type === 'index'" v-bind="item" />
+                <el-table-column v-if="item.prop" align="center" v-bind="item">
+                  <template #default="{ row }">
+                    <el-button v-if="item.prop === 'operation'" link type="danger" size="small" :icon="Delete"
+                      >删除</el-button
+                    >
+                  </template>
+                </el-table-column>
+              </template>
+            </el-table>
+          </el-card>
+        </Drawer>
+      </el-form>
+    </Drawer>
+  </div>
 </template>
-<style scoped></style>
+<style scoped lang="scss">
+.tooltip-content {
+  max-width: 500px;
+  overflow-y: auto;
+}
+.inStorage-form {
+  :deep(.el-drawer__header) {
+    margin-bottom: 0;
+  }
+  .box-card {
+    height: 100%;
+    :deep(.el-card__body) {
+      height: calc(100% - 70px);
+    }
+    .sn-header {
+      display: flex;
+      justify-content: end;
+    }
+  }
+  .btn {
+    margin-top: 32px;
+    display: flex;
+    justify-content: center;
+    .el-button {
+      padding: 0 32px;
+    }
+  }
+  .w-50 {
+    width: 21.5rem;
+  }
+  .input-suffix {
+    width: 100%;
+    .inline-flex {
+      white-space: nowrap;
+    }
+    .d-flex {
+      display: flex;
+    }
+  }
+}
+</style>

src/views/storehouse/inventory/InStorageProduct.vue

@@ -0,0 +1,7 @@
+<script setup lang="ts"></script>
+
+<template>
+  <div></div>
+</template>
+
+<style scoped></style>

src/views/storehouse/sales/Contract.vue

@@ -108,7 +108,7 @@ const searchHandle = () => {
         <el-tag v-if="row.T_out === 2 || row.T_out === 3" type="success" effect="dark">
           {{ row.T_out === 2 ? '已出库' : '已全部出库' }}
         </el-tag>
-        <el-tag v-else-if="row.T_State === 1" type="warning" effect="dark"> 未出库 </el-tag>
+        <el-tag v-else-if="row.T_out === 1" type="warning" effect="dark"> 未出库 </el-tag>
         <el-tag v-else type="danger" effect="dark"> --- </el-tag>
       </template>
       <template #right="{ row }">

src/views/storehouse/sales/ContractForm.vue

@@ -64,7 +64,6 @@ const emit = defineEmits<{ (event: 'onTableList'): void }>()
 
 // 添加仓库名称
 interface FormType {
-  // T_id: string
   T_number: string
   T_customer: string
   T_type: any
@@ -76,7 +75,6 @@ interface FormType {
 }
 type Fn = () => void
 const form = reactive<FormType>({
-  // T_id: '',
   T_number: '',
   T_customer: '',
   T_type: '',
@@ -98,8 +96,6 @@ const openDrawer = (type: string, row?: any) => {
 }
 // edit data echo
 const editDataEcho = async (row: any) => {
-  // console.log(row)
-  // form.T_id = row.Id
   form.T_pdf = row.T_pdf
   form.T_date = row.T_date
   form.T_type = row.T_type
@@ -132,7 +128,7 @@ const editDataEcho = async (row: any) => {
 const blurHandle = () => {
   form.T_product = tableData.value.map(item => {
     if (!item.count) return undefined
-    return `${item.Id},${item.count}`
+    return `${item.Id},${item.count}|`
   })
 }
 const deleteProduct = (row: any) => {
@@ -357,11 +353,7 @@ defineExpose({
             style="width: 100%"
             border
             stripe
-            :header-cell-style="{
-              background: '#909399',
-              height: '50px',
-              color: '#fff'
-            }"
+            :header-cell-style="{ background: '#dedfe0', height: '50px' }"
           >
             <template v-for="item in columns" :key="item.prop">
               <el-table-column v-bind="item" v-if="item.fixed !== 'right'">
@@ -462,7 +454,7 @@ defineExpose({
                       v-model="autoSelect"
                       clearable
                       :fetch-suggestions="querySearchAsync"
-                      placeholder="Please input"
+                      placeholder="按产品名称搜索"
                       :debounce="2000"
                       :trigger-on-focus="false"
                       @select="handleSelect"
@@ -475,7 +467,7 @@ defineExpose({
                         v-for="item in modelOptions"
                         :key="item.index"
                         :label="item.value"
-                        :value="item.index"
+                        :value="item.value"
                       />
                     </el-select>
                     <el-button type="primary" @click="searchModelHandle">搜索</el-button>
@@ -489,6 +481,7 @@ defineExpose({
               :data="tableProductData"
               style="width: 100%; height: 99%"
               v-el-table-infinite-scroll="load"
+              :header-cell-style="{ background: '#dedfe0', height: '50px' }"
               @selection-change="ProductselectionChange"
             >
               <template v-for="item in productColumns" :key="item">

src/views/workAttendance/Leave.vue

@@ -1,16 +1,16 @@
 <script setup lang="ts">
 import { ElMessage } from 'element-plus'
 import { GlobalStore } from '@/stores/index'
+import { ref, onMounted, onUnmounted } from 'vue'
 import { getFormatDuration } from '@/utils/common'
 import { UserFilled } from '@element-plus/icons-vue'
 import TableBase from '@/components/TableBase/index.vue'
-import { ref, nextTick, onMounted, onUnmounted } from 'vue'
 import { ColumnProps } from '@/components/TableBase/interface/index'
 import { Leave_List, Leave_Approval } from '@/api/workAttendance/index'
 
 const TableRef = ref()
 const globalStore = GlobalStore()
-const columns: ColumnProps[] = [{ prop: 'T_user_name', label: '姓名', name: 'T_user_name' }]
+const columns: ColumnProps[] = [{ prop: 'T_user_name', label: '姓名' }]
 
 interface UserInfoIn {
   T_user_name: string
@@ -73,6 +73,22 @@ onMounted(() => {
 onUnmounted(() => {
   window.onresize = null
 })
+const tableRowClassName = (data: any): any => {
+  //判断是否相等，相同时改变背景颜色
+  let user: any = undefined
+  if (data.row.Id === userInfo.value.Id) {
+    user = data.row
+  }
+  if (user !== undefined) {
+    let rowBackground = {
+      background: '#f0f9eb',
+      color: '#67c23a'
+    }
+    return rowBackground
+  } else {
+    return ''
+  }
+}
 </script>
 
 <template>
@@ -85,13 +101,11 @@ onUnmounted(() => {
         :initParam="initParam"
         layout="prev, pager, next"
         :rowClick="getSalaryParams"
+        :tableRowClassName="tableRowClassName"
       >
         <template #table-header>
           <h3 class="title">待处理</h3>
         </template>
-        <template #T_user_name="{ row }">
-          <el-button type="primary" text @click="getSalaryParams(row)">{{ row.T_user_name }}</el-button>
-        </template>
       </TableBase>
     </div>
     <transition

src/views/workAttendance/Overtime.vue

@@ -10,8 +10,9 @@ import { Overtime_List, Overtime_Approval } from '@/api/workAttendance/index'
 
 const TableRef = ref()
 const globalStore = GlobalStore()
-const columns: ColumnProps[] = [{ prop: 'T_user_name', label: '姓名', name: 'T_user_name' }]
+const columns: ColumnProps[] = [{ prop: 'T_user_name', label: '姓名' }]
 interface UserInfoIn {
+  T_uid: string
   T_user_name: string
   T_dept: string
   T_post: string
@@ -24,6 +25,7 @@ interface UserInfoIn {
   T_prove_img: string
 }
 const userInfo = ref<UserInfoIn>({
+  T_uid: '',
   T_user_name: '',
   T_dept: '',
   T_post: '',
@@ -76,6 +78,23 @@ onMounted(() => {
 onUnmounted(() => {
   window.onresize = null
 })
+
+const tableRowClassName = (data: any): any => {
+  //判断是否相等，相同时改变背景颜色
+  let user: any = undefined
+  if (data.row.Id === userInfo.value.Id) {
+    user = data.row
+  }
+  if (user !== undefined) {
+    let rowBackground = {
+      background: '#f0f9eb',
+      color: '#67c23a'
+    }
+    return rowBackground
+  } else {
+    return ''
+  }
+}
 </script>
 
 <template>
@@ -88,13 +107,11 @@ onUnmounted(() => {
         :initParam="initParam"
         layout="prev, pager, next"
         :rowClick="getSalaryParams"
+        :tableRowClassName="tableRowClassName"
       >
         <template #table-header>
           <h3 class="title">待处理</h3>
         </template>
-        <template #T_user_name="{ row }">
-          <el-button type="primary" text @click="getSalaryParams(row)">{{ row.T_user_name }}</el-button>
-        </template>
       </TableBase>
     </div>
     <transition

src/views/workAttendance/RecordsFinance.vue

@@ -88,11 +88,11 @@ const getTableData = async () => {
 }
 onMounted(async () => {
   await getTableData()
-  let userInfoFirst = TableData.value[0]
-  LeaveinitParam.T_uuid = userInfoFirst.T_uuid
-  userInfo.name = userInfoFirst.T_name
-  userInfo.T_dept = userInfoFirst.T_dept_name
-  userInfo.T_post = userInfoFirst.T_post_name
+  // let userInfoFirst = TableData.value[0]
+  // LeaveinitParam.T_uuid = userInfoFirst.T_uuid
+  // userInfo.name = userInfoFirst.T_name
+  // userInfo.T_dept = userInfoFirst.T_dept_name
+  // userInfo.T_post = userInfoFirst.T_post_name
 })
 const pageable = reactive({
   pageNum: 1,
@@ -120,12 +120,35 @@ onMounted(() => {
   window.onresize = onContentResize
 })
 onUnmounted(() => (window.onresize = null))
+
+const tableRowClassName = (data: any): any => {
+  //判断是否相等，相同时改变背景颜色
+  let user: any = undefined
+  if (data.row.T_uuid === LeaveinitParam.T_uuid) {
+    user = data.row
+  }
+  if (user !== undefined) {
+    let rowBackground = {
+      background: '#f0f9eb',
+      color: '#67c23a'
+    }
+    return rowBackground
+  } else {
+    return ''
+  }
+}
 </script>
 
 <template>
   <div class="RecordsFinance">
     <div style="width: 290px; display: flex; padding: 20px; background: #fff; flex-direction: column">
-      <el-table class="h-100" style="width: 100%; height: 100%; flex: 1" :data="TableData" @row-click="getSalaryParams">
+      <el-table
+        class="h-100"
+        style="width: 100%; height: 100%; flex: 1"
+        :data="TableData"
+        @row-click="getSalaryParams"
+        :row-style="tableRowClassName"
+      >
         <el-table-column
           align="center"
           v-for="item in columns"
@@ -141,66 +164,71 @@ onUnmounted(() => (window.onresize = null))
         :handleCurrentChange="handleCurrentChange"
       />
     </div>
-    <el-row class="h-100 f-1 margin-left-3">
-      <el-col :span="24" class="h-100" style="overflow: hidden">
-        <el-card class="m-b-3">
-          <h3 class="title m-b-5">员工基本信息</h3>
-          <div class="info-content">
-            <el-avatar shape="square" size="large" :src="userInfo.squareUrl" />
-            <div class="info-name">
-              <h4 class="m-b-3">名字：{{ userInfo.name }}</h4>
-              <h4>
-                <span>部门：{{ userInfo.T_dept }}</span>
-                <span>岗位：{{ userInfo.T_post }}</span>
-              </h4>
+    <transition
+      leave-active-class="animate__animated animate__bounceOutRight"
+      enter-active-class="animate__animated animate__bounceInDown"
+    >
+      <el-row class="h-100 f-1 margin-left-3" v-if="LeaveinitParam.T_uuid">
+        <el-col :span="24" class="h-100" style="overflow: hidden">
+          <el-card class="m-b-3">
+            <h3 class="title m-b-5">员工基本信息</h3>
+            <div class="info-content">
+              <el-avatar shape="square" size="large" :src="userInfo.squareUrl" />
+              <div class="info-name">
+                <h4 class="m-b-3">名字：{{ userInfo.name }}</h4>
+                <h4>
+                  <span>部门：{{ userInfo.T_dept }}</span>
+                  <span>岗位：{{ userInfo.T_post }}</span>
+                </h4>
+              </div>
             </div>
+          </el-card>
+          <el-card class="m-b-3">
+            <el-row :gutter="20">
+              <el-col :span="10" class="d-flex justify-start">
+                <span class="demonstration">年：</span>
+                <el-date-picker
+                  v-model="salaryFromData.year"
+                  value-format="YYYY"
+                  type="year"
+                  placeholder="请选择年"
+                  @change="salarDateYearChange"
+                />
+                <span class="demonstration">月：</span>
+                <el-date-picker
+                  v-model="salaryFromData.month"
+                  popper-class="picker-date"
+                  value-format="MM"
+                  format="MM"
+                  type="month"
+                  placeholder="请选择月"
+                  @change="salarDateMonthChange"
+                />
+              </el-col>
+            </el-row>
+          </el-card>
+          <div :style="{ height: clientHeight + 'px' }">
+            <TableBase
+              v-if="LeaveinitParam.T_uuid"
+              ref="LeaveTableRef"
+              :columns="userColums"
+              :requestApi="Leave_Finance_List"
+              :initParam="LeaveinitParam"
+              layout="total,prev, pager, next"
+              :onResize="onResize"
+              :displayHeader="true"
+            >
+              <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration) }}</template>
+              <template #T_State="{ row }">
+                <el-tag v-if="row.T_State === 1" type="success">通过</el-tag>
+                <el-tag v-else-if="row.T_State === 2" type="warning">未通过</el-tag>
+                <el-tag v-else type="danger">待审核</el-tag>
+              </template>
+            </TableBase>
           </div>
-        </el-card>
-        <el-card class="m-b-3">
-          <el-row :gutter="20">
-            <el-col :span="10" class="d-flex justify-start">
-              <span class="demonstration">年：</span>
-              <el-date-picker
-                v-model="salaryFromData.year"
-                value-format="YYYY"
-                type="year"
-                placeholder="请选择年"
-                @change="salarDateYearChange"
-              />
-              <span class="demonstration">月：</span>
-              <el-date-picker
-                v-model="salaryFromData.month"
-                popper-class="picker-date"
-                value-format="MM"
-                format="MM"
-                type="month"
-                placeholder="请选择月"
-                @change="salarDateMonthChange"
-              />
-            </el-col>
-          </el-row>
-        </el-card>
-        <div :style="{ height: clientHeight + 'px' }">
-          <TableBase
-            v-if="LeaveinitParam.T_uuid"
-            ref="LeaveTableRef"
-            :columns="userColums"
-            :requestApi="Leave_Finance_List"
-            :initParam="LeaveinitParam"
-            layout="total,prev, pager, next"
-            :onResize="onResize"
-            :displayHeader="true"
-          >
-            <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration) }}</template>
-            <template #T_State="{ row }">
-              <el-tag v-if="row.T_State === 1" type="success">通过</el-tag>
-              <el-tag v-else-if="row.T_State === 2" type="warning">未通过</el-tag>
-              <el-tag v-else type="danger">待审核</el-tag>
-            </template>
-          </TableBase>
-        </div>
-      </el-col>
-    </el-row>
+        </el-col>
+      </el-row>
+    </transition>
   </div>
 </template>
 

src/views/workAttendance/records/Records.vue

@@ -114,8 +114,8 @@ const getTableData = async () => {
 
 onMounted(async () => {
   await getTableData()
-  let userInfoFirst: any = TableData.value[0]
-  userInfoAssign(userInfoFirst)
+  // let userInfoFirst: any = TableData.value[0]
+  // userInfoAssign(userInfoFirst)
 })
 // 分页
 const pageable = reactive({
@@ -135,8 +135,8 @@ const handleCurrentChange = (val: number) => {
 }
 // 查看加班记录
 const viewOvertime = (row: any) => {
-  url = 'https://erposs.baozhida.cn' + row.T_prove_img
-  srcList.push(url)
+  url = row.T_prove_img
+  srcList.push(row.T_prove_imgl)
   OvertimeInfo.value = { ...row }
   drawerOvertimeRef.value && drawerOvertimeRef.value.openDrawer()
 }
@@ -160,6 +160,23 @@ type Fn = () => void
 const callbackDrawer = (done: Fn) => {
   done()
 }
+
+const tableRowClassName = (data: any): any => {
+  //判断是否相等，相同时改变背景颜色
+  let user: any = undefined
+  if (data.row.T_uuid === userInitParam.T_uuid) {
+    user = data.row
+  }
+  if (user !== undefined) {
+    let rowBackground = {
+      background: '#f0f9eb',
+      color: '#67c23a'
+    }
+    return rowBackground
+  } else {
+    return ''
+  }
+}
 </script>
 
 <template>
@@ -171,6 +188,7 @@ const callbackDrawer = (done: Fn) => {
         style="width: 100%; height: 100%; flex: 1"
         :data="TableData"
         @row-click="getSalaryParams"
+        :row-style="tableRowClassName"
       >
         <el-table-column
           align="center"
@@ -187,92 +205,97 @@ const callbackDrawer = (done: Fn) => {
         :handleCurrentChange="handleCurrentChange"
       />
     </div>
-    <el-row class="h-100 f-1 margin-left-3">
-      <el-col :span="24" class="h-100" style="overflow: hidden">
-        <el-card class="m-b-3">
-          <h3 class="title m-b-5">员工基本信息</h3>
-          <div class="info-content">
-            <el-avatar shape="square" size="large" :src="userInfo.squareUrl" />
-            <div class="info-name">
-              <h4 class="m-b-3">名字：{{ userInfo.name }}</h4>
-              <h4>
-                <span>部门：{{ userInfo.T_dept }}</span>
-                <span>岗位：{{ userInfo.T_post }}</span>
-              </h4>
-            </div>
-          </div>
-        </el-card>
-        <div class="content" :style="{ height: clientHeight + 'px' }">
-          <div>
-            <div class="content-table-item">
-              <el-tag class="mx-1 font-large" type="success" effect="dark">加班记录:</el-tag>
-              <TableBase
-                ref="overtimeRef"
-                v-if="userInitParam.T_uuid"
-                :columns="overtimeColums"
-                :requestApi="Overtime_User_list"
-                :initParam="userInitParam"
-                :onResize="onResizeItem"
-                :displayHeader="true"
-                layout="prev, pager, next"
-              >
-                <template #T_State="{ row }">
-                  <el-tag v-if="row.T_State === 1" type="success">通过</el-tag>
-                  <el-tag v-else-if="row.T_State === 2" type="warning">未通过</el-tag>
-                  <el-tag v-else type="danger">待审核</el-tag>
-                </template>
-                <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration) }}</template>
-                <template #right="{ row }">
-                  <el-button type="success" size="small" link :icon="View" @click="viewOvertime(row)">查看</el-button>
-                </template>
-              </TableBase>
-            </div>
-            <div class="content-table-item">
-              <TableBase
-                ref="remainingTimeRef"
-                v-if="userInitParam.T_uuid"
-                :columns="remainingTimeColums"
-                :requestApi="Overtime_Stat"
-                :initParam="userInitParam"
-                :onResize="onResizeItem"
-                layout="prev, pager, next"
-              >
-                <template #table-header="{ pageable }">
-                  <el-tag class="mx-1" effect="dark">
-                    剩余总时长：{{ getFormatDuration(pageable.RemainingTime as number) }}
-                  </el-tag>
-                </template>
-                <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration) }}</template>
-                <template #RemainingTime="{ row }">{{ getFormatDuration(row.RemainingTime) }}</template>
-              </TableBase>
+    <transition
+      leave-active-class="animate__animated animate__bounceOutRight"
+      enter-active-class="animate__animated animate__bounceInDown"
+    >
+      <el-row class="h-100 f-1 margin-left-3" v-if="userInitParam.T_uuid">
+        <el-col :span="24" class="h-100" style="overflow: hidden">
+          <el-card class="m-b-3">
+            <h3 class="title m-b-5">员工基本信息</h3>
+            <div class="info-content">
+              <el-avatar shape="square" size="large" :src="userInfo.squareUrl" />
+              <div class="info-name">
+                <h4 class="m-b-3">名字：{{ userInfo.name }}</h4>
+                <h4>
+                  <span>部门：{{ userInfo.T_dept }}</span>
+                  <span>岗位：{{ userInfo.T_post }}</span>
+                </h4>
+              </div>
             </div>
-            <div class="content-table-item">
-              <el-tag class="mx-1 font-large" type="danger" effect="dark">请假记录:</el-tag>
-              <TableBase
-                ref="leaveRef"
-                v-if="userInitParam.T_uuid"
-                :columns="leaveColums"
-                :requestApi="Leave_User_list"
-                :initParam="userInitParam"
-                :onResize="onResizeItem"
-                :displayHeader="true"
-                layout="prev, pager, next"
-              >
-                <template #T_State="{ row }">
-                  <el-tag v-if="row.T_State === 1" type="success">通过</el-tag>
-                  <el-tag v-else-if="row.T_State === 2" type="warning">未通过</el-tag>
-                  <el-tag v-else type="danger">待审核</el-tag>
-                </template>
-                <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration as number) }}</template>
-                <template #right="{ row }">
-                  <el-button type="success" size="small" link :icon="View" @click="viewoLeave(row)">查看</el-button>
-                </template>
-              </TableBase>
+          </el-card>
+          <div class="content" :style="{ height: clientHeight + 'px' }">
+            <div>
+              <div class="content-table-item">
+                <el-tag class="mx-1 font-large" type="success" effect="dark">加班记录:</el-tag>
+                <TableBase
+                  ref="overtimeRef"
+                  v-if="userInitParam.T_uuid"
+                  :columns="overtimeColums"
+                  :requestApi="Overtime_User_list"
+                  :initParam="userInitParam"
+                  :onResize="onResizeItem"
+                  :displayHeader="true"
+                  layout="prev, pager, next"
+                >
+                  <template #T_State="{ row }">
+                    <el-tag v-if="row.T_State === 1" type="success">通过</el-tag>
+                    <el-tag v-else-if="row.T_State === 2" type="warning">未通过</el-tag>
+                    <el-tag v-else type="danger">待审核</el-tag>
+                  </template>
+                  <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration) }}</template>
+                  <template #right="{ row }">
+                    <el-button type="success" size="small" link :icon="View" @click="viewOvertime(row)">查看</el-button>
+                  </template>
+                </TableBase>
+              </div>
+              <div class="content-table-item">
+                <TableBase
+                  ref="remainingTimeRef"
+                  v-if="userInitParam.T_uuid"
+                  :columns="remainingTimeColums"
+                  :requestApi="Overtime_Stat"
+                  :initParam="userInitParam"
+                  :onResize="onResizeItem"
+                  layout="prev, pager, next"
+                >
+                  <template #table-header="{ pageable }">
+                    <el-tag class="mx-1" effect="dark">
+                      剩余总时长：{{ getFormatDuration(pageable.RemainingTime as number) }}
+                    </el-tag>
+                  </template>
+                  <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration) }}</template>
+                  <template #RemainingTime="{ row }">{{ getFormatDuration(row.RemainingTime) }}</template>
+                </TableBase>
+              </div>
+              <div class="content-table-item">
+                <el-tag class="mx-1 font-large" type="danger" effect="dark">请假记录:</el-tag>
+                <TableBase
+                  ref="leaveRef"
+                  v-if="userInitParam.T_uuid"
+                  :columns="leaveColums"
+                  :requestApi="Leave_User_list"
+                  :initParam="userInitParam"
+                  :onResize="onResizeItem"
+                  :displayHeader="true"
+                  layout="prev, pager, next"
+                >
+                  <template #T_State="{ row }">
+                    <el-tag v-if="row.T_State === 1" type="success">通过</el-tag>
+                    <el-tag v-else-if="row.T_State === 2" type="warning">未通过</el-tag>
+                    <el-tag v-else type="danger">待审核</el-tag>
+                  </template>
+                  <template #T_duration="{ row }">{{ getFormatDuration(row.T_duration as number) }}</template>
+                  <template #right="{ row }">
+                    <el-button type="success" size="small" link :icon="View" @click="viewoLeave(row)">查看</el-button>
+                  </template>
+                </TableBase>
+              </div>
             </div>
           </div>
-        </div>
-      </el-col>
-    </el-row>
+        </el-col>
+      </el-row>
+    </transition>
     <Drawer ref="drawerOvertimeRef" :handleClose="callbackDrawer">
       <template #header="{ params }">
         <h4 :id="params.titleId" :class="params.titleClass">加班记录</h4>