md
This commit is contained in:
parent
bd888ec814
commit
0edff7cc87
265
src/views/emis/EmisBaseTools/EmisStaffListPicker.vue
Normal file
265
src/views/emis/EmisBaseTools/EmisStaffListPicker.vue
Normal 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>
|
||||
Loading…
Reference in New Issue
Block a user