牛人管理列表

src/styles/index.css

@@ -84,3 +84,8 @@
   color: #666;
   font-size: 14px;
 }
+
+.card-box {
+  width: 100%;
+  height: 100%;
+}

src/styles/index.min.css

@@ -1 +1 @@
-:root{--zIndex-dialog:9999;--default-bgc:#f2f4f7;--v-primary-base:#00897B;--v-error-base:#fe574a;--v-primary-lighten1:#26A69A;--v-primary-lighten2:#4DB6AC;--v-primary-lighten3:#80CBC4;--v-primary-lighten4:#B2DFDB;--default-text:#666}.buttons{height:36px;width:224px}.half-button{height:36px;width:88px}.default-width{width:1184px;min-width:1184px;max-width:1184px;margin:0 auto}.defaultLink{color:#008978;cursor:pointer}.default-active{color:var(--v-primary-base) !important}.border-bottom-dashed{border-bottom:1px dashed #ccc}.white-bgc{background-color:#fff}.ellipsis{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.vline{display:inline-block;width:1px;height:10px;vertical-align:middle;background-color:#e0e0e0;margin:0 10px}.resume-box{border-radius:5px;padding:20px 30px;background-color:#fff}.resume-header{display:flex;justify-content:space-between;align-items:center;height:36px}.resume-title{font-weight:700;font-size:18px;border-left:5px solid #00897B;padding-left:12px;line-height:17px}.resumeNoDataText{color:#666;font-size:14px}
+:root{--zIndex-dialog:9999;--default-bgc:#f2f4f7;--v-primary-base:#00897B;--v-error-base:#fe574a;--v-primary-lighten1:#26A69A;--v-primary-lighten2:#4DB6AC;--v-primary-lighten3:#80CBC4;--v-primary-lighten4:#B2DFDB;--default-text:#666}.buttons{height:36px;width:224px}.half-button{height:36px;width:88px}.default-width{width:1184px;min-width:1184px;max-width:1184px;margin:0 auto}.defaultLink{color:#008978;cursor:pointer}.default-active{color:var(--v-primary-base) !important}.border-bottom-dashed{border-bottom:1px dashed #ccc}.white-bgc{background-color:#fff}.ellipsis{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.vline{display:inline-block;width:1px;height:10px;vertical-align:middle;background-color:#e0e0e0;margin:0 10px}.resume-box{border-radius:5px;padding:20px 30px;background-color:#fff}.resume-header{display:flex;justify-content:space-between;align-items:center;height:36px}.resume-title{font-weight:700;font-size:18px;border-left:5px solid #00897B;padding-left:12px;line-height:17px}.resumeNoDataText{color:#666;font-size:14px}.card-box{width:100%;height:100%}

src/styles/index.scss

@@ -90,4 +90,9 @@
 .resumeNoDataText {
   color: #666;
   font-size: 14px;
+}
+
+.card-box {
+  width: 100%;
+  height: 100%;
 }

src/views/enterprise/personnelManagement/components/commonStyle.vue

@@ -0,0 +1,41 @@
+<template>
+  <v-menu 
+    open-on-hover 
+    :close-delay="1" 
+    :open-delay="0" 
+    v-bind="$attrs" 
+    location="bottom" 
+    max-height="400"
+    :close-on-content-click="closeOnContentClick"
+  >
+    <template v-slot:activator="{ isActive, props }">
+      <v-btn
+        class="mr-3 py-0 px-2"
+        density="comfortable"
+        :append-icon="isActive ? 'mdi mdi-menu-up' : 'mdi mdi-menu-down'"
+        color="primary" variant="tonal"
+        v-bind="props"
+      >
+        {{ defineProps.btnTitle }}
+      </v-btn>
+    </template>
+    <slot></slot>
+  </v-menu>
+</template>
+<script setup>
+
+defineOptions({name: 'conditionFilter-index-page'})
+const defineProps = defineProps({
+  btnTitle: {
+    type: String,
+    default: 'Text'
+  },
+  closeOnContentClick: {
+    type: Boolean,
+    default: true
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/enterprise/personnelManagement/components/screen.vue

@@ -0,0 +1,121 @@
+<template>
+  <div>
+    <CommonStyle v-for="(val, i) in list" :key="i" :btnTitle="val.title">
+      <v-list>
+        <v-list-item
+          v-for="(item, index) in val.items"
+          :key="index"
+          :active="val.selected.includes(item.value)"
+          color="primary"
+          :value="item.value"
+          @click="handleClick(item, val)"
+        >
+          <v-list-item-title>{{ item.label }}</v-list-item-title>
+        </v-list-item>
+      </v-list>
+    </CommonStyle>
+    <span class="reset-text cursor-pointer ml-3" @click="handleReset">重置</span>
+  </div>
+</template>
+
+<script setup>
+defineOptions({ name: 'screen-page'})
+import { ref, defineProps, defineEmits, watch } from 'vue'
+import { getDict } from '@/hooks/web/useDictionaries'
+import CommonStyle from './commonStyle.vue'
+
+const emit = defineEmits(['search'])
+const props = defineProps({
+  tab: {
+    type: Number,
+    default: 0
+  }
+})
+
+const list = ref([
+  {
+    title: '应聘岗位',
+    defaultTitle: '应聘岗位',
+    selected: [],
+    items: [
+      { label: 'Java_广州 150-200元/天', value: '0' }
+    ]
+  },
+  {
+    title: '学历',
+    defaultTitle: '学历',
+    dictTypeName: 'menduner_education_type',
+    selected: [],
+    items: []
+  },
+  {
+    title: '工作经验',
+    defaultTitle: '工作经验',
+    dictTypeName: 'menduner_exp_type',
+    selected: [],
+    items: []
+  },
+  // {
+  //   title: '年龄',
+  //   defaultTitle: '年龄',
+  //   selected: [],
+  //   items: [
+  //     { label: '16-20岁', value: '0' },
+  //     { label: '21-25岁', value: '1' },
+  //     { label: '26-30岁', value: '2' },
+  //     { label: '31-35岁', value: '3' },
+  //     { label: '35岁以上', value: '4' }
+  //   ]
+  // },
+  {
+    title: '求职状态',
+    defaultTitle: '求职状态',
+    dictTypeName: 'menduner_job_status',
+    selected: [],
+    items: []
+  }
+])
+
+// 获取字典数据
+list.value.forEach(k => {
+  if (!k.dictTypeName) return
+    getDict(k.dictTypeName).then(({ data }) => {
+    data = data?.length && data || []
+    k.items = data
+  })
+})
+
+// 单击
+const handleClick = (item, val) => {
+  const obj = val.selected.includes(item.value)
+  val.selected = obj ? val.selected.filter(i => i !== item.value) : [item.value]
+  val.title = obj ? val.defaultTitle : item.label
+  emit('search', item.value)
+}
+
+// 重置
+const handleReset = () => {
+  list.value.map(e => {
+    e.selected = []
+    e.title = e.defaultTitle
+    return e
+  })
+}
+
+watch(
+  () => props.tab,
+  () => {
+    handleReset()
+  }
+)
+</script>
+
+<style scoped lang="scss">
+.reset-text {
+  font-size: 14px;
+  color: #777;
+  &:hover {
+    color: var(--v-primary-base);
+  }
+}
+</style>

src/views/enterprise/personnelManagement/components/table.vue

@@ -0,0 +1,97 @@
+<template>
+  <div>
+    <div class="text-end">
+      <v-btn color="primary" :disabled="selected.length ? false : true" variant="tonal" @click="handleInappropriate">不合适</v-btn>
+    </div>
+    <v-data-table
+      v-model="selected"
+      :items="items"
+      class="mt-3"
+      :headers="headers"
+      show-select
+      item-value="id"
+      hover
+      height="60vh"
+      hide-default-footer
+    >
+      <template #bottom></template>
+      <template v-slot:item.actions>
+        <v-btn color="primary" variant="text">不合适</v-btn>
+      </template>
+    </v-data-table>
+    <CtPagination
+      v-if="total > 0"
+      :total="total"
+      :page="query.pageNo"
+      :limit="query.pageSize"
+      @handleChange="handleChangePage"
+    ></CtPagination>
+  </div>
+</template>
+
+<script setup>
+defineOptions({ name: 'table-page'})
+import { ref } from 'vue'
+
+const selected = ref([])
+const total = ref(3)
+const query = ref({
+  pageNo: 1,
+  pageSize: 10
+})
+const headers = [
+  { title: '牛人', value: 'name' },
+  { title: '基本信息', value: 'info' },
+  { title: '最近工作经历', value: 'work' },
+  { title: '教育经历', key: 'school', value: item => `${item.startYear}-${item.endYear} ${item.school}` },
+  { title: '应聘职位', value: 'jobName' },
+  { title: '操作', value: 'actions' }
+]
+const items = [
+  {
+    name: '黄桐奕',
+    info: '本科·21岁·25年应届生·5-8K',
+    work: 'Java 江门市天天生活科技有限公司',
+    school: '五邑大学',
+    jobName: 'Java',
+    startYear: '2021',
+    id: 1,
+    endYear: '2025'
+  },
+  {
+    name: '黄桐奕',
+    info: '本科·21岁·25年应届生·5-8K',
+    work: 'Java 江门市天天生活科技有限公司',
+    school: '五邑大学',
+    jobName: 'Java',
+    startYear: '2021',
+    endYear: '2025',
+    id: 2
+  },
+  {
+    name: '黄桐奕',
+    info: '本科·21岁·25年应届生·5-8K',
+    work: 'Java 江门市天天生活科技有限公司',
+    school: '五邑大学',
+    jobName: 'Java',
+    startYear: '2021',
+    endYear: '2025',
+    id: 3
+  }
+]
+
+const handleChangePage = () => {}
+
+const handleInappropriate = () => {
+  console.log(selected.value, 'handleInappropriate')
+}
+</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;
+}
+</style>

src/views/enterprise/personnelManagement/index.vue

@@ -1,11 +1,50 @@
 <template>
-  <div>牛人管理</div>
+  <v-card class="pa-5 card-box">
+    <div class="d-flex justify-space-between">
+      <v-tabs v-model="tab" align-tabs="start" color="primary" bg-color="#f7f8fa" @update:model-value="handleChangeTab">
+        <v-tab :value="1">新简历</v-tab>
+        <v-tab :value="2">已查看</v-tab>
+        <v-tab :value="3">已邀约</v-tab>
+        <v-tab :value="4">已发offer</v-tab>
+        <v-tab :value="5">已入职</v-tab>
+        <v-tab :value="6">不合适</v-tab>
+      </v-tabs>
+      <TextInput v-model="textItems.value" :item="textItems" @appendInnerClick="handleSearch" @enter="handleSearch"></TextInput>
+    </div>
+    <Screen :tab="tab" @search="handleChange"></Screen>
+
+    <v-window v-model="tab" class="mt-1">
+      <v-window-item :value="1">
+        <TablePage></TablePage>
+      </v-window-item>
+    </v-window>
+  </v-card>
 </template>
 
 <script setup>
 defineOptions({ name: 'enterprise-personnelManagement-management'})
+import { ref } from 'vue'
+import TablePage from './components/table.vue'
+import Screen from './components/screen.vue'
+
+const tab = ref(1)
+const textItems = ref({
+  type: 'text',
+  value: '',
+  width: 250,
+  label: '搜索牛人姓名',
+  appendInnerIcon: 'mdi-magnify'
+})
+
+const handleChangeTab = () => {}
+
+const handleSearch = () => {
+  console.log(textItems.value.value, 'search')
+}
+const handleChange = (e) => {
+  console.log(e, 'change')
+}
 </script>
 
 <style scoped lang="scss">
-
 </style>

src/views/enterprise/positionManagement/index.vue

@@ -103,10 +103,6 @@ const handleEnter = (e) => {
 </script>
 
 <style scoped lang="scss">
-.card-box {
-  width: 100%;
-  height: 100%;
-}
 .btn {
   width: 116px;
 }

src/views/enterprise/systemManagement/informationSettings.vue

@@ -1,7 +1,7 @@
 <!-- 企业信息设置 -->
 <template>
   <div>
-    <v-card class="card-box pa-5">
+    <v-card class="card-box pa-5" style="min-height: 500px">
       <div>
         <v-tabs v-model="tab" @update:model-value="handleTabClick" align-tabs="start" color="primary" bg-color="#fff">
           <v-tab :value="1">{{ $t('enterprise.infoSetting.basicInfo') }}</v-tab>
@@ -69,9 +69,4 @@ const handleTabClick = () => {
 </script>
 
 <style scoped lang="scss">
-.card-box {
-  width: 100%;
-  height: 100%;
-  min-height: 500px;
-}
 </style>

src/views/enterprise/talentPool/index.vue

@@ -230,10 +230,6 @@ const handleChangePage = () => {
 </script>
 
 <style scoped lang="scss">
-.card-box {
-  width: 100%;
-  height: 100%;
-}
 .list-item {
   border: 1px solid #e5e6eb;
 }