flat: 样式

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

View File

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