This commit is contained in:
linfso 2024-10-23 16:43:34 +08:00
parent bd888ec814
commit 0edff7cc87

View File

@ -0,0 +1,265 @@
<template>
<div :id="createdId">
<SearchForm :model="queryParams" ref="queryForm" size="mini" :maxShow="20" label-width="68px" @search="handleQuery" @reset="resetQuery">
<el-form-item label="所属国家" prop="params.countryCode">
<CountryPicker :placeholder="$t('所属国家')" v-model="queryParams.params.countryCode" ></CountryPicker>
</el-form-item>
<el-form-item label="员工名称" prop="empName">
<el-input v-model="queryParams.empName" placeholder="员工名称" clearable />
</el-form-item>
<el-form-item label="员工编号" prop="empCode">
<el-input v-model="queryParams.empCode" placeholder="员工编号" clearable />
</el-form-item>
<el-form-item label="网点类型" prop="params.siteType">
<el-select v-model="queryParams.params.siteType" placeholder="网点类型" clearable filterable>
<el-option
v-for="dict in dict.type.emis_site_type"
:key="dict.value"
:label="dict.label"
:value="dict.value"
/>
</el-select>
</el-form-item>
<el-form-item label="所属网点" prop="ownerSiteCode">
<EmisSiteSimplePicker :placeholder="$t('所属网点')" v-model="queryParams.ownerSiteCode" :countryCode="queryParams.params.countryCode" :siteType="queryParams.params.siteType" ></EmisSiteSimplePicker>
</el-form-item>
<el-form-item label="电话" prop="phonenumber">
<el-input v-model="queryParams.phonenumber" placeholder="电话" clearable />
</el-form-item>
<el-form-item label="是否启用" prop="blOpen">
<el-select v-model="queryParams.blOpen" placeholder="是否启用" clearable>
<el-option v-for="dict in dict.type.sys_biz_enable_status" :key="dict.value" :label="dict.label" :value="dict.value"/>
</el-select>
</el-form-item>
<el-form-item label="岗位类型" prop="postIds">
<el-select v-model="queryParams.postIds" multiple filterable placeholder="请选择岗位" style="width:100%" >
<el-option
v-for="item in postOptions"
:key="item.postId"
:label="item.postName"
:value="item.postId"
></el-option>
</el-select>
</el-form-item>
</SearchForm>
<XdTable
max-height="300px"
v-loading="loading"
border
size="mini"
:data="optionItems"
storageName="emisUser_main_picker"
:showSearch.sync="showSearch"
:total="total"
highlight-current-row
:showStatInfo="false"
:showRightButton="false"
:showOperateButton="false"
:showCustomizeTpl="false"
@queryTable="queryData"
:queryParams="queryParams"
@selection-change="handleSelectionChange"
@sort-change="handleSortChange"
>
<el-table-column type="selection" width="50" align="center" />
<el-table-column label="员工编号" align="center" prop="empCode" width="80"/>
<el-table-column label="员工名称" align="left" prop="empName" :show-overflow-tooltip="true" width="100" >
<template slot-scope="scope">
<div class="link-type"><span>{{scope.row.empName}}</span> </div>
</template>
</el-table-column>
<el-table-column label="所属网点" align="left" prop="ownerSiteName" :show-overflow-tooltip="true" width="100" >
<template slot-scope="scope">
<div class="link-type" @click="handleUpdate(scope.row)"><span v-if="scope.row.ownerSiteCode!=null">{{scope.row.ownerSiteName}}</span> </div>
</template>
</el-table-column>
<el-table-column label="所属部门" align="center" key="deptName" prop="dept.deptName" width="100" :show-overflow-tooltip="true" />
<el-table-column label="启用状态" align="center" prop="blOpen" width="100" >
<template slot-scope="scope">
<dict-tag :options="dict.type.sys_biz_enable_status" :value="scope.row.blOpen"/>
</template>
</el-table-column>
<el-table-column label="电话" align="center" key="phonenumber" prop="phonenumber" width="100" />
<!-- <el-table-column label="邮箱" align="center" key="email" prop="email" width="100" /> -->
<!-- <el-table-column label="住址" align="center" key="address" prop="address" width="100" /> -->
<el-table-column label="员工类型" align="center" key="postNames" prop="postNames" width="100" />
</XdTable>
<div style="text-align: center;margin-bottom: 10px;">
<el-button type="primary" @click="confirmSelect">确定</el-button>
<el-button @click="cancelSelect">取 消</el-button>
</div>
</div>
</template>
<script>
import emitter from 'element-ui/src/mixins/emitter';
import { listUser } from "@/api/system/user";
import { listPost } from "@/api/system/post";
import CountryPicker from '@/views/emis/EmisBaseTools/CountryPicker.vue';
import EmisSiteSimplePicker from '@/views/emis/EmisBaseTools/EmisSiteSimplePicker.vue';
export default {
name: "EmisStaffListPicker",
components: { CountryPicker,EmisSiteSimplePicker },
mixins: [emitter],
dicts: ['sys_normal_disable', 'sys_user_sex','emis_site_type','sys_biz_enable_status'],
props: {
placeholder:{
type: String,
required: false
}
},
data() {
return {
createdId: '0',
loading:false,
total:0,
optionItems: [],
// 选中数组
ids: [],
empCodeStr:null,
empNameStr:null,
// 岗位选项
postOptions: [],
// 显示搜索条件
showSearch: true,
// 缺省值
defaultTotal:0,
defaultItems:null,
sId: null,
svalue: this.value,
isInputing: false,
queryParams:{
pageNum: 1,
pageSize: 10,
empCode: undefined,
empName: undefined,
phonenumber: undefined,
status: undefined,
deptId: undefined,
postIds: undefined,
params:{
countryCode:null,
siteType:null,
parentSiteCode:null,
blIncludeChildSite:'1',
}
}
};
},
watch: {
value(newVal,oldVal) {
this.svalue=this.value;
},
},
mounted() {
this.createdId = String(new Date().getTime()) // 给个随机id 判断是否clickoutside
},
created() {
this.initPost();
if(this.svalue!=null){
this.svalue = this.value;
}
},
methods: {
handleSelectionChange(selection) {
this.ids = selection.map(item => item.userId);
let empCodeArr = selection.map(item => item.empCode);
let empNameArr = selection.map(item => item.empName);
this.empCodeStr="";
this.empNameStr="";
if(empCodeArr.length > 0){
this.empCodeStr=empCodeArr.join(",");
this.empNameStr=empNameArr.join(",");
}
},
handleSortChange(column) {
},
initPost() {
let queryParams = {pageNum: 1,pageSize: 100};
listPost(queryParams).then(response => {
this.postOptions = response.rows;
});
},
handleInput(val) {
if(val == null ) return;
this.isInputing = true;
this.svalue = val;
this.queryParams.pageNum = 1
this.queryData(val,null)
},
confirmSelect(){
this.$emit("on-changed",this.empCodeStr,this.empNameStr);
},
cancelSelect(){
this.$emit("on-cancel");
},
onRowClick(row, column, event) {
this.svalue=row.name;
this.isInputing = false;
this.sId=row.id;
this.$emit("input", this.svalue);
this.$emit("onChange",row);
},
isRed({ row }) {
if (row.id == this.sId) {
return {
"color": "red",
"font-weight": "bold",
};
}
},
changePage(cur) {
this.queryParams.pageNum = cur
this.queryData(this.queryParams.searchValue)
},
onClear(el){
this.svalue = null;
this.$emit("input", this.svalue);
this.dispatch('ElFormItem', 'el.form.blur', [this.svalue]);
},
onBlur(el) {
this.$emit("input", this.svalue);
this.dispatch('ElFormItem', 'el.form.blur', [this.svalue]);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.queryData();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
queryData(val,key) {
this.loading = true;
this.queryParams.searchValue = val;
listUser(this.queryParams).then(response => {
this.loading = false;
this.total = response.total;
this.optionItems = response.rows;
});
},
getIndex($index) {
return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
},
}
};
</script>