first commit
This commit is contained in:
@@ -0,0 +1,482 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-input placeholder="请输入内容" clearable v-model="pageForm.searchKeyword"
|
||||
@keyup.enter.native="doSearch">
|
||||
<el-select v-model="pageForm.searchName" slot="prepend"
|
||||
placeholder="查询类型"
|
||||
style="width: 120px;">
|
||||
<el-option label="届次" value="uc.workersCongressSession"></el-option>
|
||||
<el-option label="分工" value="role.name"></el-option>
|
||||
<el-option label="姓名" value="u.username"></el-option>
|
||||
<el-option label="工号" value="u.loginname"></el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search"
|
||||
@click="doSearch"></el-button>
|
||||
</div>
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button size="medium" @click="openBatch"><i class="ti-plus"></i> 批量导入
|
||||
</el-button>
|
||||
<el-button size="medium" @click="openAdd"><i class="ti-plus"></i> 添加
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-card shadow="never" class="mt10">
|
||||
<el-row class="el-table-container">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
size="medium"
|
||||
header-align="center"
|
||||
v-loading="tableLoading"
|
||||
style="width: 100%"
|
||||
@sort-change="pageOrder"
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
prop="username"
|
||||
label="姓名"
|
||||
header-align="center"
|
||||
align="center" show-overflow-tooltip
|
||||
>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="loginname"
|
||||
label="工号"
|
||||
header-align="center"
|
||||
align="center" show-overflow-tooltip
|
||||
>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="mobile"
|
||||
label="联系方式"
|
||||
header-align="center"
|
||||
align="center" show-overflow-tooltip
|
||||
>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="rolename"
|
||||
label="分工"
|
||||
header-align="center"
|
||||
align="center" show-overflow-tooltip
|
||||
>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="workersCongressSession"
|
||||
label="届次"
|
||||
header-align="center"
|
||||
align="center" show-overflow-tooltip
|
||||
>
|
||||
<template scope="{row:{workersCongressSession}}">
|
||||
第{{ workersCongressSession }}届
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="state"
|
||||
label="状态"
|
||||
header-align="center"
|
||||
align="center" show-overflow-tooltip
|
||||
>
|
||||
<template scope="{row}">
|
||||
<vi-table-state :state="row"></vi-table-state>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="userOnline"
|
||||
label="操作"
|
||||
header-align="center"
|
||||
align="center"
|
||||
width="150">
|
||||
<template scope="{row}">
|
||||
<el-popconfirm
|
||||
title="确定要移除吗？"
|
||||
@confirm="doDelete(row)"
|
||||
>
|
||||
<el-button slot="reference" :disabled="!row.can" size="mini"
|
||||
:loading="row.delLoading" type="danger"
|
||||
icon="el-icon-delete">
|
||||
</el-button>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row class="el-pagination-container" style="margin-bottom: 0px">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
||||
<el-dialog
|
||||
title="添加"
|
||||
:visible.sync="addDialogVisible" width="40%">
|
||||
|
||||
<el-form :model="formData" ref="addForm" :rules="formRules" label-width="80px">
|
||||
|
||||
<el-form-item prop="workersCongressSession" label="届次">
|
||||
<dict-select v-model="formData.workersCongressSession" style="width: 100%"
|
||||
placeholder="届次"
|
||||
code="jc"></dict-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="roleCode" label="分工">
|
||||
|
||||
<el-select v-model="formData.roleCode"
|
||||
placeholder="分工" filterable
|
||||
style="width: 100%">
|
||||
<el-option
|
||||
v-for="item in roleOptions"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code">
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
</el-form-item>
|
||||
<el-form-item prop="userId" label="人员">
|
||||
|
||||
<el-select
|
||||
style="width: 100%"
|
||||
v-model="formData.userId"
|
||||
filterable
|
||||
remote
|
||||
reserve-keyword
|
||||
placeholder="请输入姓名或工号查找"
|
||||
:remote-method="(k)=>{userRemoteMethod(k)}"
|
||||
:loading="userLoading">
|
||||
<el-option
|
||||
v-for="i in userOptions"
|
||||
:key="i.id"
|
||||
:label="i.username+'（'+i.loginname+'）'"
|
||||
:value="i.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="addDialogVisible = false"
|
||||
:disabled="submitLoading">取 消</el-button>
|
||||
<el-button type="primary" :loading="submitLoading"
|
||||
@click="doAdd">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
title="管理员导入"
|
||||
:visible.sync="batchDialogVisible"
|
||||
:close-on-click-modal="false"
|
||||
width="50%"
|
||||
>
|
||||
<el-timeline>
|
||||
<el-timeline-item timestamp="下载模板" placement="top">
|
||||
<el-card>
|
||||
<el-button size="medium" type=""
|
||||
style="width: 200px"
|
||||
@click="location.href='/platform/basics/downloadTemplate?filePath=jdh/JdhTwoGlyImport.xls&fileName=管理员导入模板.xls'"
|
||||
icon="el-icon-download">下载模板
|
||||
</el-button>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
<el-timeline-item timestamp="上传文件" placement="top">
|
||||
<el-card>
|
||||
<el-upload
|
||||
name="file"
|
||||
ref="upload"
|
||||
:on-remove="(file, fileList) => {
|
||||
importData.fileList = fileHandleRemove(file, fileList)
|
||||
}"
|
||||
:on-change="(file, fileList) => {
|
||||
importData.fileList = fileHandleChange(file, fileList,{type:['xls']})
|
||||
}"
|
||||
:auto-upload="false"
|
||||
:limit="1"
|
||||
:file-list="importData.fileList">
|
||||
<el-button size="medium" type="" icon="el-icon-upload" style="width: 200px">选择文件
|
||||
</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传xls文件</div>
|
||||
</el-upload>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="batchDialogVisible = false" :disabled="importLoading">取 消</el-button>
|
||||
<el-button type="primary" @click="doImport" :loading="importLoading">确定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
module.exports = {
|
||||
name: "UnionCadreange",
|
||||
components: {
|
||||
'dict-select': httpVueLoader('/components/plugins/DictSelect.vue?v=1.0.0')
|
||||
},
|
||||
props: {
|
||||
union: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
searchName: 'uc.workersCongressSession',
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: ""
|
||||
},
|
||||
|
||||
tableLoading: false,
|
||||
tableData: [],
|
||||
roleOptions: [],
|
||||
|
||||
batchDialogVisible: false,
|
||||
addDialogVisible: false,
|
||||
userLoading: false,
|
||||
userOptions: [],
|
||||
formData: {},
|
||||
formRules: {
|
||||
workersCongressSession: [{required: true, message: '必选', trigger: ['blur', 'change']}],
|
||||
roleCode: [{required: true, message: '必选', trigger: ['blur', 'change']}],
|
||||
userId: [{required: true, message: '必选', trigger: ['blur', 'change']}],
|
||||
},
|
||||
submitLoading: false,
|
||||
importLoading: false,
|
||||
importData: {},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
union(val) {
|
||||
this.pageForm = {
|
||||
searchName: 'uc.workersCongressSession',
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: ""
|
||||
}
|
||||
this.userOptions = []
|
||||
this.pageData()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
fileHandleRemove(file, fileList) {
|
||||
return fileList;
|
||||
},
|
||||
fileHandleChange(file, fileList, {type, size}) {
|
||||
const removeFile = () => {
|
||||
fileList.splice(fileList.findIndex(v => v === file))
|
||||
}
|
||||
|
||||
if (!file.size) {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: "您选择的是空文件！",
|
||||
type: 'warning'
|
||||
});
|
||||
removeFile()
|
||||
}
|
||||
|
||||
if (type && type.length && !type.includes(file.name.split('.').pop().toLowerCase())) {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: `文件只能是 ${type.map(v => v.toUpperCase()).join('/')} 格式！`,
|
||||
type: 'warning'
|
||||
});
|
||||
removeFile()
|
||||
}
|
||||
|
||||
if (size && !file.size < size) {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: `文件大小不能超过 ${size / 1024 / 1024}MB！`,
|
||||
type: 'warning'
|
||||
});
|
||||
removeFile()
|
||||
}
|
||||
|
||||
return fileList;
|
||||
},
|
||||
openBatch() {
|
||||
this.importData = {}
|
||||
this.batchDialogVisible = true;
|
||||
},
|
||||
doImport() {
|
||||
if ($.isEmptyObject(this.importData) || this.importData.fileList.length === 0) {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: "请选择文件！",
|
||||
type: 'warning'
|
||||
});
|
||||
return
|
||||
}
|
||||
const data = new FormData();
|
||||
this.importData.fileList.forEach((val) => {
|
||||
data.append("file", val.raw, val.raw.name);
|
||||
});
|
||||
this.importLoading = true
|
||||
$.ajax({
|
||||
url: loc() + "/importGly",
|
||||
type: "post",
|
||||
data: data,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: (data) => {
|
||||
console.log(data)
|
||||
if (!data.code) {
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: data.msg,
|
||||
type: 'success'
|
||||
});
|
||||
this.pageData();
|
||||
this.batchDialogVisible = false
|
||||
} else {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: data.msg,
|
||||
type: 'warning'
|
||||
});
|
||||
}
|
||||
this.importLoading = false
|
||||
},
|
||||
error: (data) => {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: data.msg,
|
||||
type: 'warning'
|
||||
});
|
||||
this.batchDialogVisible = false
|
||||
this.importLoading = false
|
||||
}
|
||||
});
|
||||
},
|
||||
openAdd() {
|
||||
this.formData = {};
|
||||
if (this.$refs["addForm"]) this.$refs["addForm"].resetFields();
|
||||
this.addDialogVisible = true;
|
||||
},
|
||||
|
||||
async doAdd() {
|
||||
this.$refs["addForm"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
this.formData.type = 1
|
||||
this.formData.unionId = this.union
|
||||
|
||||
this.submitLoading = true
|
||||
|
||||
const {code, msg} = await $.post('/platform/union/cadre/createCadre', this.formData)
|
||||
|
||||
if (code === 0) {
|
||||
this.doSearch()
|
||||
this.addDialogVisible = false;
|
||||
}
|
||||
|
||||
this.$notify({
|
||||
title: code === 0 ? '成功' : '失败',
|
||||
type: code === 0 ? 'success' : 'error',
|
||||
message: msg,
|
||||
});
|
||||
|
||||
this.submitLoading = false
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
async doDelete(row) {
|
||||
const {id} = row
|
||||
|
||||
this.$set(row, "delLoading", true)
|
||||
|
||||
const {code} = await $.post('/platform/union/cadre/removeCadre', {id})
|
||||
|
||||
if (code === 0) {
|
||||
this.pageData()
|
||||
}
|
||||
|
||||
this.$notify({
|
||||
title: code === 0 ? '成功' : '失败',
|
||||
type: code === 0 ? 'success' : 'error'
|
||||
});
|
||||
|
||||
this.$set(row, "delLoading", false)
|
||||
},
|
||||
|
||||
async userRemoteMethod(query) {
|
||||
if (!query) {
|
||||
this.userOptions = []
|
||||
return
|
||||
}
|
||||
this.userLoading = true
|
||||
const users = await searchUser(query, this.union)
|
||||
this.userOptions = users
|
||||
this.userLoading = false
|
||||
},
|
||||
|
||||
async pageData() {
|
||||
this.tableLoading = true
|
||||
this.pageForm.unionid = this.union
|
||||
const resp = await $.get('/platform/union/cadre/pageData', this.pageForm)
|
||||
requestLaterFun(resp, ({list, totalCount}) => {
|
||||
this.tableData = list
|
||||
this.pageForm.totalCount = totalCount
|
||||
}, () => {
|
||||
this.tableData = []
|
||||
})
|
||||
this.tableLoading = false
|
||||
},
|
||||
|
||||
doSearch() {
|
||||
this.tableKey = new Date().getTime()
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageData()
|
||||
},
|
||||
pageOrder(column) {
|
||||
this.pageForm.pageOrderName = column.prop;
|
||||
this.pageForm.pageOrderBy = column.order;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange(val) {
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageSizeChange(val) {
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
|
||||
},
|
||||
async created() {
|
||||
this.doSearch()
|
||||
this.roleOptions = await getDictOptions("GrassrootsCadres")
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user