flat: 样式
This commit is contained in:
@@ -4,16 +4,17 @@
|
|||||||
<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"
|
||||||
@current-change="leftCurrentPageChange" @size-change="leftSizePageChange"
|
:page.sync="leftPages"
|
||||||
@selection-change="leftSelectionChange">
|
@current-change="leftCurrentPageChange" @size-change="leftSizePageChange"
|
||||||
|
@selection-change="leftSelectionChange">
|
||||||
<template slot="menuLeft">
|
<template slot="menuLeft">
|
||||||
<div class="leftInput">
|
<div class="leftInput">
|
||||||
<el-input size="small" v-model="formInline.userName" class="input-with-select" placeholder="用户名">
|
<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"
|
<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"
|
<el-option v-for="item in leftServeOptions" :key="item.id" :label="item.groupName"
|
||||||
:value="item.value">
|
:value="item.value">
|
||||||
</el-option>
|
</el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
<el-button size="small" slot="append" class="input-search" @click="leftSearch">搜索</el-button>
|
<el-button size="small" slot="append" class="input-search" @click="leftSearch">搜索</el-button>
|
||||||
@@ -28,19 +29,24 @@
|
|||||||
</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>
|
||||||
<!-- 列表 -->
|
<!-- 列表 -->
|
||||||
<div class="content-right relative">
|
<div class="content-right relative">
|
||||||
<avue-crud height="900" ref="crud2" :data="rightDataList"
|
<avue-crud height="900" ref="crud2" :data="rightDataList"
|
||||||
: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"
|
||||||
@input="searchInputChange" v-model="searchInput" clearable>
|
prefix-icon="el-icon-search"
|
||||||
|
@input="searchInputChange" v-model="searchInput" clearable>
|
||||||
</el-input>
|
</el-input>
|
||||||
</template>
|
</template>
|
||||||
<template slot="labelName" slot-scope="{row}">
|
<template slot="labelName" slot-scope="{row}">
|
||||||
@@ -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,
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
@@ -149,8 +162,8 @@ let rightPostOptions = {
|
|||||||
...baseOptions,
|
...baseOptions,
|
||||||
column: [
|
column: [
|
||||||
{
|
{
|
||||||
label: '岗位名称',
|
label: '岗位名称',
|
||||||
prop: 'jobName',
|
prop: 'jobName',
|
||||||
}, {
|
}, {
|
||||||
label: '用工单位',
|
label: '用工单位',
|
||||||
prop: 'companyName',
|
prop: 'companyName',
|
||||||
@@ -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;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user