将v-data-table全部换成CtTable组件

src/components/CtTable/index.vue

@@ -172,5 +172,8 @@ const handleSelect = (e) => {
   .v-selection-control__input {
     color: var(--v-primary-base) !important;
   }
+  .v-table.v-table--hover > .v-table__wrapper > table > tbody > tr > td {
+    white-space: nowrap !important;
+  }
 }
 </style>

src/components/Position/longStrip.vue

@@ -19,7 +19,7 @@
       </div>
       <div class="info-content" >
         <div class="job-info">
-          <div class="job-name" :class="{'cursor-pointer': val.job.status === '0'}">
+          <div class="job-name ellipsis" :class="{'cursor-pointer': val.job.status === '0'}">
             <span class="mr-3" :class="{'info-name': val.job.status === '0'}" @click="handleToPositionDetails(val)">{{ val.job.name }}</span>
             <span v-if="val?.job?.areaName">[{{ val.job.areaName }}]</span>
           </div>
@@ -185,6 +185,7 @@ const loginClose = () => {
       font-weight: 500;
       font-size: 16px;
       .job-name {
+        width: 100%;
         height: 22px;
         line-height: 22px;
         color: var(--color-222);

src/views/mall/components/table.vue

@@ -1,16 +1,19 @@
 <template>
-  <v-data-table
+  <CtTable
     class="mt-3"
-    v-model="selected"
     :items="items"
     :headers="headers"
-    hover
+    :loading="false"
+    :elevation="0"
+    :isTools="false"
+    :showPage="true"
+    :total="total"
+    :page-info="query"
+    itemKey="id"
     height="60vh"
-    item-value="id"
-    no-data-text="暂无数据"
+    @pageHandleChange="handlePageChange"
   >
-    <template #bottom></template>
-  </v-data-table>
+  </CtTable>
 </template>
 
 <script setup>
@@ -21,14 +24,21 @@ defineProps({
   items: Array
 })
 
-
-const selected = ref([])
+const total = ref(0)
+const query = ref({
+  pageNo: 1,
+  pageSize: 10
+})
 const headers = [
   { title: '兑换物品', key: '兑换物品' },
   { title: '兑换时间', key: '兑换时间' },
   { title: '消耗积分', key: '消耗积分' },
 ]
 
+const handlePageChange = (e) => {
+  query.value.pageNo = e.pageNo
+}
+
 </script>
 
 <style scoped lang="scss">

src/views/mall/purchasePackage/index copy.vue

@@ -1,145 +0,0 @@
-<!-- 购买套餐 -->
-<template>
-  <div class="py-3" :class="customClass">
-    <div class="white-bgc resume-box">
-      <div class="resume-header" v-if="showTitle">
-        <div class="resume-title">购买会员</div>
-      </div>
-      <div :class="['d-flex', 'align-center', 'justify-center', {'my-5': showTitle}]">
-        <div
-          v-for="(item, index) in packList"
-          :key="index"
-          :elevation="tab === (index+1) ? 3 : 2"
-          class="packagesItem cursor-pointer mx-3"
-          :class="{'active': tab === (index+1)}"
-          style="width: 200px;"
-          @click="tab = index + 1"
-        >
-          <div class="d-flex flex-column align-center pb-5">  
-            <div class="mt-4 font16 fontBold titleColor">{{ item.title }}</div>  
-            <div class="mt-2 fontBold priceBox">
-              <span>￥</span>
-              <span class="font28">{{ item.price }}</span>
-            </div>  
-            <div class="dailyPrice font13 mt-2">开通会员</div>  
-          </div> 
-        </div>
-      </div>
-      <v-data-table
-        :items="!type ? personalItems : enterpriseItems"
-        :headers="headers"
-        no-data-text="暂无数据"
-      > 
-        <template v-slot:[`item.equity`]="{ item }">
-          <span class="font-weight-bold font-size-14">{{ item.equity }}</span>
-        </template>
-        <template #bottom></template>
-      </v-data-table>
-    </div>
-  </div>
-</template>
-
-<script setup>
-defineOptions({name: 'purchasePackage'})
-import { ref } from 'vue'
-const tab = ref(1)
-
-defineProps({
-  type: {
-    type: Number,
-    default: 0 // 0个人 1企业
-  },
-  showTitle: {
-    type: Boolean,
-    default: true
-  },
-  customClass: {
-    type: String,
-    default: 'default-width'
-  }
-})
-
-const packList = [
-  { title: '14天双周卡', price: 38 },
-  { title: '30天月卡', price: 58 },
-  { title: '60天月卡', price: 78 },
-  { title: '季度卡', price: 108 },
-  { title: '年度卡', price: 388 }
-]
-
-const headers = [
-  { title: '权益', key: 'equity', value: 'equity', sortable: false },
-  { title: '14天双周卡', key: 'weeklyCard', sortable: false },
-  { title: '30天月卡', key: 'thirtyCard', sortable: false },
-  { title: '60天月卡', key: 'sixtyCard', sortable: false },
-  { title: '季度卡', key: 'seasonCard', sortable: false },
-  { title: '年度卡', key: 'yearCard', sortable: false }
-]
-
-const personalItems = [
-  { equity: '简历刷新pro', weeklyCard: '5次/天', thirtyCard: '5次/天', sixtyCard: '15次/天', seasonCard: '40次/天', yearCard: '40次/天' },
-  { equity: '竞争力分析', weeklyCard: '20次/天', thirtyCard: '25次/天', sixtyCard: '35次/天', seasonCard: '无限', yearCard: '无限' },
-  { equity: '谁对我有兴趣', weeklyCard: '3次/天', thirtyCard: '无限查看', sixtyCard: '无限查看', seasonCard: '无限查看', yearCard: '无限查看' },
-  { equity: '投递优先查看', weeklyCard: '✓', thirtyCard: '✓', sixtyCard: '✓', seasonCard: '✓', yearCard: '✓' },
-  { equity: 'VIP会员标识', weeklyCard: '✓', thirtyCard: '✓', sixtyCard: '✓', seasonCard: '✓', yearCard: '✓' },
-  { equity: 'VIP专属折扣', weeklyCard: '✓', thirtyCard: '✓', sixtyCard: '✓', seasonCard: '✓', yearCard: '✓' },
-  { equity: '简历内容范例', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '5条', yearCard: '✓' },
-  { equity: '会员简历模版', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '3次', yearCard: '✓' },
-  { equity: '一键润色简历', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '10次/天', yearCard: '无限' },
-  { equity: '导入解析简历', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '10次/天', yearCard: '无限' },
-  { equity: '简历草稿数', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '5份', yearCard: '20份' },
-  { equity: '全年简历回收', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '×', yearCard: '✓' },
-  { equity: '会员求职大礼包', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '×', yearCard: '✓' },
-]
-
-const enterpriseItems = [
-  { equity: '职位发布', weeklyCard: '3个', thirtyCard: '5个', sixtyCard: '10个', seasonCard: '15个', yearCard: '20个' },
-  { equity: '发布岗位置顶', weeklyCard: '1次/天', thirtyCard: '3次/天', sixtyCard: '5次/天', seasonCard: '10次/天', yearCard: '无限' },
-  { equity: '优质人才搜索', weeklyCard: '3次/天', thirtyCard: '5次/天', sixtyCard: '10次/天', seasonCard: '20次/天', yearCard: '无限' },
-  { equity: '专属职位推荐', weeklyCard: '×', thirtyCard: '×', sixtyCard: '1次/天', seasonCard: '10次/天', yearCard: '25次/天' },
-  { equity: '候选推荐', weeklyCard: '×', thirtyCard: '×', sixtyCard: '2次/天', seasonCard: '10次/天', yearCard: '无限' },
-  { equity: '背景调查及报告', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '×', yearCard: '赠送2次' },
-  { equity: '保入职服务', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '✓', yearCard: '✓' },
-  { equity: '主页轮播广告', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '×', yearCard: '✓' },
-  { equity: 'AI分析简历', weeklyCard: '×', thirtyCard: '×', sixtyCard: '×', seasonCard: '2次', yearCard: '✓' }
-]
-</script>
-
-<style lang="scss" scoped>
-:deep(.v-data-table-header__content) {
-  color: #883a19;
-  font-size: 16px;
-  font-weight: 700;
-}
-.font13 { font-size: 13px; }
-.font16 { font-size: 16px; }
-.font28 { font-size: 28px; }
-.fontBold { font-weight: bold; }
-.titleColor { color: #883a19; }
-.packagesItem {
-  border: 1px solid var(--color-f3);
-  border-radius: 8px;
-  background-color: var(--color-f2f4f742);
-}
-.dailyPrice {
-  border-radius: 14px;
-  background-color: #dde3e94f;
-  padding: 2px 18px;
-  color: var(--color-666);
-}
-.active {
-  padding: 4px 8px;
-  border: 1px solid #cf990c;
-  background-color: #fff;
-  .titleColor {
-    color: #cf990c;
-  }
-  .priceBox {
-    color: #ff4747;
-  }
-  .dailyPrice {
-    color: #ff4747;
-    background-color: #fff4e7;
-  }
-}
-</style>

src/views/publicRecruitment/components/integralTable.vue

@@ -1,28 +1,26 @@
 <template>
-  <v-data-table
+  <CtTable
     class="mt-3"
-    v-model="selected"
     :items="items"
     :headers="headers"
-    hover
+    :loading="false"
+    :elevation="0"
+    :isTools="false"
+    :showPage="false"
+    itemKey="id"
     height="60vh"
-    item-value="id"
-    no-data-text="暂无数据"
   >
-    <template #bottom></template>
-  </v-data-table>
+  </CtTable>
 </template>
 
 <script setup>
 defineOptions({ name: 'myRegistration-integralTable'})
-import { ref } from 'vue'
 defineProps({
   tab: String,
   items: Array
 })
 
 
-const selected = ref([])
 const headers = [
   { title: '积分类型', key: '积分类型' },
   { title: '变更时间', key: '时间' },

src/views/publicRecruitment/components/table.vue

@@ -1,34 +1,38 @@
 <template>
-  <v-data-table
+  <CtTable
     class="mt-3"
-    v-model="selected"
     :items="items"
     :headers="headers"
-    hover
-    item-value="id"
-    no-data-text="暂无数据"
+    :loading="false"
+    :elevation="0"
+    :isTools="false"
+    :showPage="true"
+    :total="total"
+    :page-info="pageInfo"
+    itemKey="id"
+    @pageHandleChange="e => emit('page', e)"
   >
-    <template #bottom></template>
-    <template v-slot:item.name="{ item }">
+    <template #name="{ item }">
       <div class="d-flex align-center cursor-pointer" >
         <v-avatar size="40" :image="item?.sendPerson?.avatar || 'https://minio.citupro.com/dev/menduner/7.png'"></v-avatar>
         <span class="ml-2" style="color: #000000DE;">{{ item?.sendPerson?.name }}</span>
       </div>
     </template>
-  </v-data-table>
+  </CtTable>
 </template>
 
 <script setup>
 defineOptions({ name: 'myPublicRecruitment-table-page'})
-import { ref } from 'vue'
 import { timesTampChange } from '@/utils/date'
 
+const emit = defineEmits(['page'])
 defineProps({
   tab: String,
-  items: Array
+  items: Array,
+  total: Number,
+  pageInfo: Object
 })
 
-const selected = ref([])
 const headers = [
   { title: '牛人', value: 'sendPerson.name', key: 'name', sortable: false },
   { title: '应聘公司', key: 'enterprise.anotherName', sortable: false },
@@ -40,11 +44,4 @@ const headers = [
 </script>
 
 <style scoped lang="scss">
-:deep(.v-table > .v-table__wrapper > table > thead) {
-  background-color: #f7f8fa !important;
-}
-:deep(.v-selection-control__input) {
-  // color: var(--v-primary-base) !important;
-  color: #767778;
-}
 </style>

src/views/publicRecruitment/myRecommendation.vue

@@ -12,14 +12,7 @@
         </div>
         <div class="topTip">推荐好友入职得赏金</div>
         <!-- 数据 -->
-        <TablePage :items="items"></TablePage>
-        <CtPagination
-          v-if="total > 0"
-          :total="total"
-          :page="query.pageNo"
-          :limit="query.pageSize"
-          @handleChange="handleChangePage"
-        ></CtPagination>
+        <TablePage :items="items" :total="total" :pageInfo="query" @page="handleChangePage"></TablePage>
       </div>
     </div>
     <!-- 滚动区域 -->

src/views/recruit/enterprise/systemManagement/groupAccount/components/record.vue

@@ -1,23 +1,20 @@
 <!-- 邀请记录 -->
 <template>
   <div>
-    <v-data-table
-      :loading="loading"
-      color="#00897B"
+    <CtTable
+      class="mt-3"
       :items="tableData"
       :headers="headers"
-      no-data-text="暂无数据"
+      :loading="loading"
+      :elevation="0"
+      :isTools="false"
+      :showPage="true"
+      :total="total"
+      :page-info="query"
+      itemKey="id"
+      @pageHandleChange="handleChangePage"
     >
-      <template #bottom>
-        <CtPagination
-          v-if="total > 0"
-          :total="total"
-          :page="query.pageNo"
-          :limit="query.pageSize"
-          @handleChange="handleChangePage"
-        ></CtPagination>
-      </template>
-    </v-data-table>
+    </CtTable>
   </div>
 </template>
 

src/views/recruit/enterprise/systemManagement/userManagement/index.vue

@@ -1,36 +1,25 @@
 <template>
   <v-card class="pa-5 card-box">
-    <!-- <div class="mb-3">
-      <v-btn color="primary" variant="tonal" :disabled="!selected.length" @click="handleAction('all', 0, {})">{{ $t('enterprise.userManagement.enable') }}</v-btn>
-      <v-btn class="ml-3" color="primary" variant="tonal" :disabled="!selected.length" @click="handleAction('all', 1, {})">{{ $t('enterprise.userManagement.disable') }}</v-btn>
-    </div> -->
-    <v-data-table
-      v-model="selected"
-      :headers="headers"
+    <CtTable
+      class="mt-3"
       :items="items"
-      hide-default-header
+      :headers="headers"
+      :loading="false"
+      :elevation="0"
+      :isTools="false"
+      :showPage="true"
+      :total="total"
+      :page-info="query"
+      itemKey="id"
       height="70vh"
-      item-value="id"
-      no-data-text="暂无数据"
+      @pageHandleChange="handleChangePage"
     >
-      <template #bottom></template>
-      <template v-slot:[`item.actions`]="{ item }">
-        <!-- <v-btn color="primary" variant="text" @click="handleBinding(item)">{{ $t('enterprise.userManagement.jobBinding') }}</v-btn> -->
+      <template #actions="{ item }">
         <v-btn v-if="item.status === '1' && item.userType !== '1'" color="primary" variant="text" @click="handleAction('', 0, item)">{{ $t('enterprise.userManagement.enable') }}</v-btn>
         <v-btn v-if="item.status === '0' && item.userType !== '1'" color="primary" variant="text" @click="handleAction('', 1, item)">{{ $t('enterprise.userManagement.disable') }}</v-btn>
       </template>
-    </v-data-table>
-    <CtPagination
-      :total="total"
-      :page="query.pageNo"
-      :limit="query.pageSize"
-      @handleChange="handleChangePage"
-    ></CtPagination>
+    </CtTable>
   </v-card>
-
-  <CtDialog :visible="show" :widthType="2" titleClass="text-h6" :title="$t('enterprise.userManagement.selectBinding')" @close="handleClose" @submit="handleSubmit">
-    <CtForm ref="formPageRef" :items="formItems"></CtForm>
-  </CtDialog>
 </template>
 
 <script setup>
@@ -39,17 +28,14 @@ import { ref } from 'vue'
 import { timesTampChange } from '@/utils/date'
 import { useI18n } from '@/hooks/web/useI18n'
 import { getEnterprisePostPage } from '@/api/recruit/enterprise/system/post'
-import { getEnterpriseUserList, systemUserEnable, systemUserDisable, systemUserBindingPost } from '@/api/recruit/enterprise/system/user'
+import { getEnterpriseUserList, systemUserEnable, systemUserDisable } from '@/api/recruit/enterprise/system/user'
 import Confirm from '@/plugins/confirm'
 import Snackbar from '@/plugins/snackbar'
 
 const { t } = useI18n()
-const show = ref(false)
 const total = ref(10)
 const items = ref([])
 const selected = ref([])
-const formPageRef = ref()
-const bindQuery = ref({})
 const query = ref({
   pageNo: 1,
   pageSize: 10
@@ -65,21 +51,6 @@ const headers = [
   { title: t('enterprise.userManagement.lastLoginTime'), key: 'loginDate', value: item => timesTampChange(item.loginDate), sortable: false },
   { title: t('common.actions'), key: 'actions' }
 ]
-const formItems = ref({
-  options: [
-    {
-      type: 'autocomplete',
-      key: 'postId',
-      value: null,
-      label: '岗位 *',
-      noAttach: false,
-      itemText: 'nameCn',
-      itemValue: 'id',
-      rules: [v => !!v || '请选择要绑定的岗位'],
-      items: []
-    }
-  ]
-})
 
 // 获取企业用户列表
 const getData = async () => {
@@ -113,34 +84,6 @@ const handleAction = (type, index, item) => {
     getData()
   })
 }
-
-// 绑定岗位
-// const handleBinding = async (item) => {
-//   if (!postList.value.length) {
-//     Snackbar.warning(t('enterprise.userManagement.postNodataToAdd'))
-//     return
-//   }
-//   bindQuery.value.id = item.id
-//   const obj = formItems.value.options.find(e => e.key === 'postId')
-//   obj.items = postList.value
-//   obj.value = item.postId
-//   show.value = true
-// }
-
-const handleClose = () => {
-  show.value = false
-  query.value = {}
-}
-
-const handleSubmit = async () => {
-  const { valid } = await formPageRef.value.formRef.validate()
-  if (!valid) return
-  const postId = formItems.value.options.find(e => e.key === 'postId').value
-  await systemUserBindingPost(bindQuery.value.id, postId)
-  Snackbar.success(t('common.operationSuccessful'))
-  handleClose()
-  getData()
-}
 </script>
 
 <style scoped lang="scss">

src/views/recruit/enterprise/talentMap/index.vue

@@ -49,20 +49,21 @@
       <span v-if="chosenLabels?.length" class="my-2" style="font-size: 14px;cursor: pointer;color: var(--color-999);" @click="resetLabel">清空标签</span>
     </template>
     <!-- 人员信息表单 -->
-    <v-data-table
+    <CtTable
       v-if="dataList?.length"
       class="mt-3"
       :items="dataList"
       :headers="headers"
-      hover
-      :disable-sort="true"
       :loading="loading"
-      loading-text="加载中..."
-      item-value="id"
-      no-data-text="暂无数据"
+      :elevation="0"
+      :isTools="false"
+      :showPage="true"
+      :total="total"
+      :page-info="pageInfo"
+      itemKey="id"
+      @pageHandleChange="handleChangePage"
     >
-      <template #bottom></template>
-      <template v-slot:[`item.name`]="{ item }">
+      <template #name="{ item }">
         <div class="d-flex align-center cursor-pointer" @click="talentPoolDetails(item)">
           <v-badge
             v-if="item?.sex === '1' || item?.sex === '2'"
@@ -76,17 +77,10 @@
           <span class="defaultLink ml-3">{{ item?.name }}</span>
         </div>
       </template>
-      <template v-slot:[`item.actions`]="{ item }">
+      <template #actions="{ item }">
         <v-btn color="primary" variant="text" @click="talentPoolDetails(item)">查看</v-btn>
       </template>
-    </v-data-table>
-    <CtPagination
-      v-if="total > 0"
-      :total="total"
-      :page="pageInfo.pageNo"
-      :limit="pageInfo.pageSize"
-      @handleChange="handleChangePage"
-    ></CtPagination>
+    </CtTable>
     <Empty v-if="!init && !total" :message="loading ? '加载中...' : '没有找到对应人才信息，请换个条件搜索'" :elevation="false" class="mt-15"></Empty>
   </v-card>
   <CtDialog :visible="showMore" titleClass="text-h6" title="选择人才标签" @close="showMore = false" @submit="handleSubmit">

src/views/recruit/enterprise/talentPool/index.vue

@@ -4,46 +4,43 @@
       <div></div>
       <v-btn color="primary" prependIcon="mdi-filter-multiple-outline" class="half-button" variant="tonal" @click="openDrawer">筛选</v-btn>
     </div>
-      <v-data-table
-        class="mt-3"
-        :items="dataList"
-        :headers="headers"
-        hover
-        :disable-sort="true"
-        item-value="id"
-        no-data-text="暂无数据"
-      >
-        <template #bottom></template>
-        <template v-slot:[`item.name`]="{ item }">
-          <div class="d-flex align-center cursor-pointer" @click="talentPoolDetails(item)">
-            <v-badge
-              v-if="item?.sex === '1' || item?.sex === '2'"
-              bordered
-              offset-y="6"
-              :color="badgeColor(item)"
-              :icon="badgeIcon(item)">
-              <v-avatar size="40" :image="getUserAvatar(item.avatar, item.sex)"></v-avatar>
-            </v-badge>
-            <v-avatar v-else size="40" :image="getUserAvatar(item.avatar, item.sex)"></v-avatar>
-            <span class="defaultLink ml-3">{{ item?.name }}</span>
-          </div>
+    <CtTable
+      class="mt-3"
+      :items="dataList"
+      :headers="headers"
+      :loading="false"
+      :elevation="0"
+      :isTools="false"
+      :showPage="true"
+      :total="total"
+      :page-info="pageInfo"
+      itemKey="id"
+      height="60vh"
+      @pageHandleChange="handleChangePage"
+    >
+      <template #name="{ item }">
+        <div class="d-flex align-center cursor-pointer" @click="talentPoolDetails(item)">
+          <v-badge
+            v-if="item?.sex === '1' || item?.sex === '2'"
+            bordered
+            offset-y="6"
+            :color="badgeColor(item)"
+            :icon="badgeIcon(item)">
+            <v-avatar size="40" :image="getUserAvatar(item.avatar, item.sex)"></v-avatar>
+          </v-badge>
+          <v-avatar v-else size="40" :image="getUserAvatar(item.avatar, item.sex)"></v-avatar>
+          <span class="defaultLink ml-3">{{ item?.name }}</span>
+        </div>
+      </template>
+      <template #advantage="{ item }">
+        <template v-if="item.advantage">
+          <v-btn color="primary" variant="tonal" @click="advantageDetail(item.advantage)">查看</v-btn>
         </template>
-        <template v-slot:[`item.advantage`]="{ item }">
-          <template v-if="item.advantage">
-            <v-btn color="primary" variant="tonal" @click="advantageDetail(item.advantage)">查看</v-btn>
-          </template>
-        </template>
-        <template v-slot:[`item.actions`]="{ item }">
-          <v-btn color="primary" variant="text" @click="handleRemove(item)">移除</v-btn>
-        </template>
-      </v-data-table>
-      <CtPagination
-        v-if="total > 0"
-        :total="total"
-        :page="pageInfo.pageNo"
-        :limit="pageInfo.pageSize"
-        @handleChange="handleChangePage"
-      ></CtPagination>
+      </template>
+      <template #actions="{ item }">
+        <v-btn color="primary" variant="text" @click="handleRemove(item)">移除</v-btn>
+      </template>
+    </CtTable>
 
     <v-navigation-drawer v-model="screen" location="right" absolute temporary width="700">
       <FilterPage