|
|
@@ -0,0 +1,222 @@
|
|
|
+<template>
|
|
|
+ <v-card class="pa-3" elevation="5">
|
|
|
+ <CtForm ref="CtFormRef" :items="formItems" class="mt-3">
|
|
|
+ <template #formBtn>
|
|
|
+ <v-btn color="primary" class="elevation-5" @click.stop="handleSearch">搜 索</v-btn>
|
|
|
+ <v-btn variant="outlined" color="primary" class="elevation-5 ml-3" @click.stop="handleReset">重 置</v-btn>
|
|
|
+ </template>
|
|
|
+ </CtForm>
|
|
|
+ </v-card>
|
|
|
+
|
|
|
+ <v-card class="mt-3" elevation="5">
|
|
|
+ <CtTable
|
|
|
+ :items="items"
|
|
|
+ class="pa-3"
|
|
|
+ :headers="headers"
|
|
|
+ :loading="loading"
|
|
|
+ :disable-sort="true"
|
|
|
+ :elevation="0"
|
|
|
+ :isTools="false"
|
|
|
+ :showPage="true"
|
|
|
+ :total="total"
|
|
|
+ :pageInfo="query"
|
|
|
+ itemKey="id"
|
|
|
+ @pageHandleChange="handleChangePage"
|
|
|
+ >
|
|
|
+ <template #actions="{ item }">
|
|
|
+ <v-btn variant="text" color="primary" @click.stop="handleDetail(item)">详 情</v-btn>
|
|
|
+ </template>
|
|
|
+ </CtTable>
|
|
|
+ </v-card>
|
|
|
+
|
|
|
+ <v-navigation-drawer v-model="showDetail" absolute location="left" rounded temporary width="500" class="pa-5">
|
|
|
+ 详情
|
|
|
+ </v-navigation-drawer>
|
|
|
+
|
|
|
+ <!-- 无权限提示 -->
|
|
|
+ <CtDialog :visible="showDialog" :widthType="4" :footer="false" titleClass="text-h6" title="系统提示" @close="showDialog = false">
|
|
|
+ <div class="d-flex align-center flex-column">
|
|
|
+ <div class="color-warning">
|
|
|
+ <p>您没有权限查看门墩儿新任命信息</p>
|
|
|
+ <p>请用微信扫描下方二维码联系门墩儿管理员开通权限</p>
|
|
|
+ </div>
|
|
|
+ <div style="width: 150px; height: 150px;">
|
|
|
+ <v-img src="https://minio.citupro.com/dev/menduner/official-account-code4.jpg"></v-img>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </CtDialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+defineOptions({ name: 'newlyAppointedTable'})
|
|
|
+import { ref } from 'vue'
|
|
|
+import { getNewAppointmentsPage } from '@/api/recruit/enterprise/newlyAppointed'
|
|
|
+import { useUserStore } from '@/store/user'
|
|
|
+// import Snackbar from '@/plugins/snackbar'
|
|
|
+
|
|
|
+const store = useUserStore()
|
|
|
+const loading = ref(false)
|
|
|
+const total = ref(10)
|
|
|
+const query = ref({
|
|
|
+ pageSize: 10,
|
|
|
+ pageNo: 1
|
|
|
+})
|
|
|
+const items = ref([
|
|
|
+ { id: 1, nameChinese: '张三', workTerritory: '北京', inaugurationHotel: '北京王府半岛酒店' },
|
|
|
+ { id: 2, nameChinese: '李四', workTerritory: '上海', inaugurationHotel: '上海外滩茂悦大酒店' },
|
|
|
+ { id: 3, nameChinese: '王五', workTerritory: '广州', inaugurationHotel: '广州富力丽思卡尔顿酒店' },
|
|
|
+ { id: 4, nameChinese: '赵六', workTerritory: '深圳', inaugurationHotel: '深圳华侨城洲际酒店' },
|
|
|
+ { id: 5, nameChinese: '钱七', workTerritory: '杭州', inaugurationHotel: '杭州西溪喜来登酒店' },
|
|
|
+ { id: 6, nameChinese: '孙八', workTerritory: '南京', inaugurationHotel: '南京金鹰国际酒店' },
|
|
|
+ { id: 7, nameChinese: '周九', workTerritory: '武汉', inaugurationHotel: '武汉光谷希尔顿酒店' },
|
|
|
+ { id: 8, nameChinese: '吴十', workTerritory: '成都', inaugurationHotel: '成都茂业万豪酒店' },
|
|
|
+ { id: 9, nameChinese: '郑十一', workTerritory: '重庆', inaugurationHotel: '重庆富力丽思卡尔顿酒店' },
|
|
|
+ { id: 10, nameChinese: '王十二', workTerritory: '西安', inaugurationHotel: '西安希尔顿酒店' },
|
|
|
+])
|
|
|
+const headers = [
|
|
|
+ { title: '宣布日期', key: 'announceTime', sortable: false },
|
|
|
+ { title: '中文名', key: 'nameChinese', sortable: false },
|
|
|
+ { title: '英文名', key: 'nameEnglish', sortable: false },
|
|
|
+ { title: '职位', key: 'position', sortable: false },
|
|
|
+ { title: '任职酒店', key: 'inaugurationHotel', sortable: false },
|
|
|
+ { title: '酒店品牌', key: 'hotelBrand', sortable: false },
|
|
|
+ { title: '工作地域', key: 'workTerritory', sortable: false },
|
|
|
+ { title: '过往工作酒店品牌', key: 'workHistory', sortable: false },
|
|
|
+ { title: '操作', key: 'actions', sortable: false, align: 'center' }
|
|
|
+]
|
|
|
+const CtFormRef = ref()
|
|
|
+const formItems = ref({
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'nameChinese',
|
|
|
+ value: '',
|
|
|
+ label: '中文名',
|
|
|
+ hideDetails: true,
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'nameEnglish',
|
|
|
+ value: '',
|
|
|
+ label: '英文名',
|
|
|
+ hideDetails: true,
|
|
|
+ flexStyle: 'mx-3',
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'position',
|
|
|
+ value: '',
|
|
|
+ label: '职位',
|
|
|
+ hideDetails: true,
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'inaugurationHotel',
|
|
|
+ value: '',
|
|
|
+ label: '任职酒店',
|
|
|
+ hideDetails: true,
|
|
|
+ flexStyle: 'ml-3',
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'hotelBrand',
|
|
|
+ value: '',
|
|
|
+ label: '酒店品牌',
|
|
|
+ hideDetails: true,
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'workTerritory',
|
|
|
+ value: '',
|
|
|
+ label: '工作地域',
|
|
|
+ flexStyle: 'mx-3',
|
|
|
+ hideDetails: true,
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'text',
|
|
|
+ key: 'workHistory',
|
|
|
+ value: '',
|
|
|
+ label: '过往工作酒店品牌',
|
|
|
+ hideDetails: true,
|
|
|
+ col: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ slotName: 'formBtn',
|
|
|
+ col: 3,
|
|
|
+ noParam: true,
|
|
|
+ flexStyle: 'ml-3'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+})
|
|
|
+const showDialog = ref(false)
|
|
|
+
|
|
|
+// 获取企业权益信息
|
|
|
+const info = ref(localStorage.getItem('entBaseInfo') ? JSON.parse(localStorage.getItem('entBaseInfo')) : {})
|
|
|
+store.$subscribe((mutation, state) => {
|
|
|
+ if (Object.keys(state.entBaseInfo).length) info.value = state.entBaseInfo
|
|
|
+})
|
|
|
+
|
|
|
+const getList = async () => {
|
|
|
+ const result = await getNewAppointmentsPage(query.value)
|
|
|
+ items.value = result.list
|
|
|
+ total.value = result.total
|
|
|
+}
|
|
|
+
|
|
|
+// 分页切换
|
|
|
+const handleChangePage = async (e) => {
|
|
|
+ await store.getEnterpriseInfo(true)
|
|
|
+ // 没有权限提示联系门墩儿
|
|
|
+ if (!info.value?.entitlement?.newAppointment) {
|
|
|
+ showDialog.value = true
|
|
|
+ return
|
|
|
+ }
|
|
|
+ query.value.pageNo = e
|
|
|
+ getList()
|
|
|
+}
|
|
|
+
|
|
|
+// 搜索
|
|
|
+const handleSearch = async () => {
|
|
|
+ await store.getEnterpriseInfo(true)
|
|
|
+ // 没有权限提示联系门墩儿
|
|
|
+ if (!info.value?.entitlement?.newAppointment) {
|
|
|
+ showDialog.value = true
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const param = {}
|
|
|
+ formItems.value.options.forEach(item => {
|
|
|
+ if (item.noParam) return
|
|
|
+ param[item.key] = item.value
|
|
|
+ })
|
|
|
+ console.log(param, 'search')
|
|
|
+}
|
|
|
+// 重置
|
|
|
+const handleReset = () => {
|
|
|
+ formItems.value.options.forEach(item => {
|
|
|
+ if (!item.noParam) item.value = ''
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 查看详情
|
|
|
+const showDetail = ref(false)
|
|
|
+const handleDetail = async (item) => {
|
|
|
+ console.log(item, 'detail')
|
|
|
+ await store.getEnterpriseInfo(true)
|
|
|
+ // 没有权限提示联系门墩儿
|
|
|
+ if (!info.value?.entitlement?.newAppointment) {
|
|
|
+ showDialog.value = true
|
|
|
+ return
|
|
|
+ }
|
|
|
+ showDetail.value = true
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+
|
|
|
+</style>
|
