flat: 样式

This commit is contained in:
Apcallover
2024-04-30 11:38:49 +08:00
parent 13a38172e0
commit 248a28d822

View File

@@ -4,7 +4,8 @@
<div class="content"> <div class="content">
<!-- 用户板块 --> <!-- 用户板块 -->
<div class="content-left relative"> <div class="content-left relative">
<avue-crud height="900" width="500" ref="crud1" :data="leftUserDataList" :option="leftUserOptions" :page.sync="leftPages" <avue-crud height="900" width="500" ref="crud1" :data="leftUserDataList" :option="leftUserOptions"
:page.sync="leftPages"
@current-change="leftCurrentPageChange" @size-change="leftSizePageChange" @current-change="leftCurrentPageChange" @size-change="leftSizePageChange"
@selection-change="leftSelectionChange"> @selection-change="leftSelectionChange">
<template slot="menuLeft"> <template slot="menuLeft">
@@ -28,9 +29,13 @@
</div> </div>
<!-- 操作 --> <!-- 操作 -->
<div class="content-center"> <div class="content-center">
<div><el-button type="primary" size="small" @click="changeTabs(0)">匹配政策</el-button></div> <div>
<div style="margin-top: 30px"><el-button :disabled="leftUserSelections.length > 0 ? false : true" <el-button type="primary" size="small" @click="changeTabs(0)">匹配政策</el-button>
type="primary" @click="changeTabs(1)" size="small">匹配岗位</el-button> </div>
<div style="margin-top: 30px">
<el-button :disabled="leftUserSelections.length > 0 ? false : true"
type="primary" @click="changeTabs(1)" size="small">匹配岗位
</el-button>
</div> </div>
</div> </div>
<!-- 列表 --> <!-- 列表 -->
@@ -39,7 +44,8 @@
:option="rightTabs ? rightPostOptions : rightPolicyOptions" :page.sync="rightPages" :option="rightTabs ? rightPostOptions : rightPolicyOptions" :page.sync="rightPages"
@selection-change="rightSelectionChange"> @selection-change="rightSelectionChange">
<template slot="menuLeft"> <template slot="menuLeft">
<el-input style="width: 300px" placeholder="搜索岗位" v-show="rightTabs === 1" prefix-icon="el-icon-search" <el-input style="width: 300px" placeholder="搜索岗位" v-show="rightTabs === 1"
prefix-icon="el-icon-search"
@input="searchInputChange" v-model="searchInput" clearable> @input="searchInputChange" v-model="searchInput" clearable>
</el-input> </el-input>
</template> </template>
@@ -75,10 +81,11 @@ import {
getListAllByPolicy getListAllByPolicy
} from "@/api/tenant/serve.js"; } from "@/api/tenant/serve.js";
import TextTooltip from "@/components/text-tooltip/index.vue"; import TextTooltip from "@/components/text-tooltip/index.vue";
import { debounce } from '@/util/util' import {debounce} from '@/util/util'
import { DateTime } from "@/util/dateTime"; import {DateTime} from "@/util/dateTime";
import CustomLoading from "@/components/Custom-Loading/index.vue"; import CustomLoading from "@/components/Custom-Loading/index.vue";
const pages = { pagerCount: 3, total: 0, size: 10, currentPage: 1 }
const pages = {pagerCount: 3, total: 0, size: 10, currentPage: 1}
const baseOptions = { const baseOptions = {
size: 'medium', size: 'medium',
dateBtn: false, dateBtn: false,
@@ -93,6 +100,7 @@ const baseOptions = {
menu: false, menu: false,
tip: false, tip: false,
selection: true, selection: true,
align: 'center',
} }
let leftUserOptions = { let leftUserOptions = {
...baseOptions, ...baseOptions,
@@ -100,36 +108,41 @@ let leftUserOptions = {
{ {
label: '机构名称', label: '机构名称',
prop: 'companyName', prop: 'companyName',
},{ fixed: true,
}, {
label: '姓名', label: '姓名',
prop: 'name', prop: 'name',
},{ fixed: true,
}, {
label: '姓别', label: '姓别',
prop: 'aac004', prop: 'aac004',
},{ }, {
label: '身份证', label: '身份证',
prop: 'idNumber', prop: 'idNumber',
width: 150,
}, { }, {
label: '手机号', label: '手机号',
prop: 'telphone', prop: 'telphone',
},{ }, {
label: "民族", label: "民族",
prop: "aac005", prop: "aac005",
},{ }, {
label: "户口性质", label: "户口性质",
prop: "aac009", prop: "aac009",
},{ }, {
label: "户口所在地", label: "户口所在地",
prop: "aac010", prop: "aac010",
},{ width: 150,
}, {
label: "文化程度", label: "文化程度",
prop: "aac011", prop: "aac011",
},{ }, {
label: "经办时间", label: "经办时间",
prop: "aae036", prop: "aae036",
},{ }, {
label: '个人标签', label: '个人标签',
prop: 'labelsBase', prop: 'labelsBase',
width: 150,
slot: true, slot: true,
}, },
] ]
@@ -178,7 +191,7 @@ let rightPostOptions = {
] ]
} }
export default { export default {
components: { TextTooltip, CustomLoading }, components: {TextTooltip, CustomLoading},
data() { data() {
return { return {
formInline: {}, formInline: {},
@@ -202,8 +215,8 @@ export default {
}, },
props: { props: {
visible: Boolean, visible: Boolean,
rowData: { default: null, type: Function }, rowData: {default: null, type: Function},
changeVisible: { default: null, type: Function }, changeVisible: {default: null, type: Function},
}, },
computed: { computed: {
viewDrawer: { viewDrawer: {
@@ -216,7 +229,9 @@ export default {
}, },
}, },
watch: { watch: {
viewDrawer(val) { val ? this.onPageLoad() : this.onPageInit() } viewDrawer(val) {
val ? this.onPageLoad() : this.onPageInit()
}
}, },
methods: { methods: {
onPageLoad() { onPageLoad() {
@@ -299,10 +314,15 @@ export default {
// console.log(this.rightDataSelections,); // console.log(this.rightDataSelections,);
let params = { let params = {
serveId: this.rowData.id, serveId: this.rowData.id,
posts: this.rightDataSelections.map((item) => ({ id: item.id, type: item.type1,jobName: item.jobName })), posts: this.rightDataSelections.map((item) => ({id: item.id, type: item.type1, jobName: item.jobName})),
users: this.leftUserSelections.map((item) => ({ idNumber: item.idNumber, talentsId: item.id, userId: item.userId, userName: item.name })) users: this.leftUserSelections.map((item) => ({
idNumber: item.idNumber,
talentsId: item.id,
userId: item.userId,
userName: item.name
}))
} }
console.log(params,"999999999999999999999999999"); console.log(params, "999999999999999999999999999");
let resData = await pushPostUserServe(params) let resData = await pushPostUserServe(params)
if (resData.data.code === 200) { if (resData.data.code === 200) {
const timed = createTime - Date.now() > 0 ? createTime - Date.now() : 0 const timed = createTime - Date.now() > 0 ? createTime - Date.now() : 0
@@ -321,7 +341,12 @@ export default {
let params = { let params = {
serveId: this.rowData.id, serveId: this.rowData.id,
policyIds: this.rightDataSelections.map((item) => item.id), policyIds: this.rightDataSelections.map((item) => item.id),
users: this.leftUserSelections.map((item) => ({ idNumber: item.idNumber, talentsId: item.id, userId: item.userId, userName: item.name })) users: this.leftUserSelections.map((item) => ({
idNumber: item.idNumber,
talentsId: item.id,
userId: item.userId,
userName: item.name
}))
} }
let resData = await pushPolicyUserServe(params) let resData = await pushPolicyUserServe(params)
if (resData.data.code === 200) { if (resData.data.code === 200) {
@@ -335,7 +360,7 @@ export default {
} }
}, },
async getRightSearch() { async getRightSearch() {
let params = { keywords: this.searchInput || '1' } let params = {keywords: this.searchInput || '1'}
const createTime = Date.now() + 3000 const createTime = Date.now() + 3000
this.rightLoading = true this.rightLoading = true
let resData = await getSearchAll(params) let resData = await getSearchAll(params)
@@ -352,7 +377,7 @@ export default {
const ids = this.leftUserSelections.map(item => item.userId).join(','); const ids = this.leftUserSelections.map(item => item.userId).join(',');
const createTime = Date.now() + 3000 const createTime = Date.now() + 3000
this.rightLoading = true this.rightLoading = true
let resData = await getSearchAllByUserId({ ids }) let resData = await getSearchAllByUserId({ids})
if (resData.data.code === 200) { if (resData.data.code === 200) {
const timed = createTime - Date.now() > 0 ? createTime - Date.now() : 0 const timed = createTime - Date.now() > 0 ? createTime - Date.now() : 0
setTimeout(() => { setTimeout(() => {
@@ -362,7 +387,7 @@ export default {
} }
}, },
async getRightListPolicy() { async getRightListPolicy() {
let params = { ids: this.rowData.policyIds } let params = {ids: this.rowData.policyIds}
const createTime = Date.now() + 3000 const createTime = Date.now() + 3000
this.rightLoading = true this.rightLoading = true
let resData = await getListByids(params) let resData = await getListByids(params)
@@ -375,7 +400,7 @@ export default {
} }
}, },
async getLeftUserList(type) { async getLeftUserList(type) {
const { currentPage, size } = this.leftPages const {currentPage, size} = this.leftPages
const createTime = Date.now() + 3000 const createTime = Date.now() + 3000
let params = { let params = {
...this.formInline, ...this.formInline,
@@ -390,9 +415,9 @@ export default {
if (resData.data.code === 200) { if (resData.data.code === 200) {
const timed = createTime - Date.now() > 0 ? createTime - Date.now() : 0 const timed = createTime - Date.now() > 0 ? createTime - Date.now() : 0
setTimeout(() => { setTimeout(() => {
const { records, total, size, current } = resData.data.data const {records, total, size, current} = resData.data.data
this.leftUserDataList = records this.leftUserDataList = records
this.leftPages = { total, size, currentPage: current } this.leftPages = {total, size, currentPage: current}
console.log('leftpages:', this.leftPages) console.log('leftpages:', this.leftPages)
this.leftLoading = false this.leftLoading = false
}, timed) }, timed)
@@ -400,8 +425,8 @@ export default {
} }
}, },
async getLeftSignGroupList() { async getLeftSignGroupList() {
const arr = this.rowData.talentsNames.map((v) => ({ groupName: v, value: v })) const arr = this.rowData.talentsNames.map((v) => ({groupName: v, value: v}))
this.leftServeOptions = [{ groupName: '全部' }, ...arr] this.leftServeOptions = [{groupName: '全部'}, ...arr]
// let params = { labels: this.rowData.talentsNames.join(',') } // let params = { labels: this.rowData.talentsNames.join(',') }
// params.labels = '未分组' // params.labels = '未分组'
// let resData = await getListAllByPolicy(params) // let resData = await getListAllByPolicy(params)
@@ -416,10 +441,11 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
display: grid; display: grid;
grid-template-columns: 1fr 60px 1fr; grid-template-columns: calc(50% - 40px) 80px calc(50% - 80px);
grid-gap: 20px; grid-gap: 20px;
.content-left {} .content-left {
}
.content-center { .content-center {
width: 100%; width: 100%;
@@ -458,12 +484,12 @@ export default {
} }
/deep/.el-loading-spinner { /deep/ .el-loading-spinner {
font-size: 80px; font-size: 80px;
font-weight: bold; font-weight: bold;
} }
/deep/.el-loading-spinner .circular { /deep/ .el-loading-spinner .circular {
width: 80px; width: 80px;
height: 80px; height: 80px;
} }