xiaoy
/
contract-business-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

up

Browse Source
master
刘翔宇-旅管家 4 years ago
parent d168cede75
commit fa1319dcc5
2 changed files with 232 additions and 242 deletions
Show Stats Download Patch File Download Diff File

470
src/views/system/department.vue
Unescape View File

@ -1,241 +1,231 @@
<template> <template>
<div class="container"> <div class="container">
<!-- 查询配置 --> <!-- 查询配置 -->
<div style="padding: 0px 20px"> <div style="padding: 0px 20px">
<div ref="lxHeader"> <div ref="lxHeader">
<LxHeader icon="md-apps" text="部门管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px"> <LxHeader icon="md-apps" text="部门管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<div slot="content"></div> <div slot="content"></div>
<slot> <slot>
<div> <div>
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button> <Button type="primary" @click="load" style="margin-left: 10px">查询</Button>
<Button type="primary" @click="edit()" style="margin-left: 10px">新增部门</Button> <Button type="primary" @click="edit()" style="margin-left: 10px">新增部门</Button>
</div> </div>
</slot> </slot>
</LxHeader> </LxHeader>
</div> <div ref="lxHeader"> </div>
<LxHeader icon="md-apps" text="部门管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px"> <div class="table-tree">
<div slot="content"></div> <el-table :data="tableData" :height="tableHeight" class="v-table" style="width: 100%;margin-bottom: 20px;"
<slot> row-key="id" border default-expand-all :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
<div> <el-table-column type="index" align="center">
<Button type="primary" @click="load" style="margin-left: 10px">查询</Button> </el-table-column>
<Button type="primary" @click="edit()" style="margin-left: 10px">新增部门</Button> <el-table-column prop="name" label="部门名称" sortable>
</div> </el-table-column>
</slot> <el-table-column prop="manger" label="部门负责人" sortable width="180">
</LxHeader> <template slot-scope="scope">
</div> <el-tag type="primary" disable-transitions>{{scope.row.manager?scope.row.manager.name:"无"}}
<div class="table-tree"> </el-tag>
<el-table :data="tableData" :height="tableHeight" class="v-table" style="width: 100%;margin-bottom: 20px;" </template>
row-key="id" border default-expand-all :tree-props="{children: 'children', hasChildren: 'hasChildren'}"> </el-table-column>
<el-table-column type="index" align="center"> <el-table-column prop="leader" label="部门分管人" sortable width="180">
</el-table-column> <template slot-scope="scope">
<el-table-column prop="name" label="部门名称" sortable> <el-tag type="success" disable-transitions>{{scope.row.leader?scope.row.leader.name:"无"}}
</el-table-column> </el-tag>
<el-table-column prop="manger" label="部门负责人" sortable width="180"> </template>
<template slot-scope="scope"> </el-table-column>
<el-tag type="primary" disable-transitions>{{scope.row.manager?scope.row.manager.name:"无"}} <el-table-column prop="sortnumber" align="center" label="排序" sortable width="80">
</el-tag> </el-table-column>
</template> <el-table-column fixed="right" label="操作" width="300">
</el-table-column> <template slot-scope="scope">
<el-table-column prop="leader" label="部门分管人" sortable width="180"> <Button type="primary" @click="addchildren(scope.row)" size="small" style="margin-left: 10px;"
<template slot-scope="scope"> ghost>下级部门</Button>
<el-tag type="success" disable-transitions>{{scope.row.leader?scope.row.leader.name:"无"}} <Button type="error" @click="del(scope.row)" size="small" style="margin-left: 10px;" ghost>删除</Button>
</el-tag> <Button type="primary" @click="edit(scope.row)" size="small" style="margin-left: 10px;" ghost>编辑</Button>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="sortnumber" align="center" label="排序" sortable width="80"> </el-table>
</el-table-column> </div>
<el-table-column fixed="right" label="操作" width="300"> </div>
<template slot-scope="scope">
<Button type="primary" @click="addchildren(scope.row)" size="small" style="margin-left: 10px;" <el-dialog title="部门编辑" :visible.sync="dialogFormVisible" width="30%">
ghost>下级部门</Button> <el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth">
<Button type="error" @click="del(scope.row)" size="small" style="margin-left: 10px;" ghost>删除</Button> <el-form-item label="上级部门">
<Button type="primary" @click="edit(scope.row)" size="small" style="margin-left: 10px;" ghost>编辑</Button> <el-input v-model="form.pname" disabled autocomplete="off"></el-input>
</template> </el-form-item>
</el-table-column> <el-form-item label="部门名称" prop="name">
</el-table> <el-input v-model="form.name" autocomplete="off"></el-input>
</div> </el-form-item>
</div> <el-form-item label="部门负责人" prop="manager">
<el-autocomplete class="inline-input" v-model="form.manager" :fetch-suggestions="querySearch"
<el-dialog title="部门编辑" :visible.sync="dialogFormVisible" width="30%"> placeholder="请输入部门负责人" :trigger-on-focus="false" @select="handleSelectManager"></el-autocomplete>
<el-form :model="form" :rules="rules" ref="form" label-position="right" :label-width="formLabelWidth"> </el-form-item>
<el-form-item label="上级部门"> <el-form-item label="部门分管人" prop="leader">
<el-input v-model="form.pname" disabled autocomplete="off"></el-input> <el-autocomplete class="inline-input" v-model="form.leader" :fetch-suggestions="querySearch"
</el-form-item> placeholder="请输入部门分管人" :trigger-on-focus="false" @select="handleSelectLeader"></el-autocomplete>
<el-form-item label="部门名称" prop="name"> </el-form-item>
<el-input v-model="form.name" autocomplete="off"></el-input> <el-form-item label="排序">
</el-form-item> <el-input v-model="form.sortnumber" autocomplete="off"></el-input>
<el-form-item label="部门负责人" prop="manager"> </el-form-item>
<el-autocomplete class="inline-input" v-model="form.manager" :fetch-suggestions="querySearch" </el-form>
placeholder="请输入部门负责人" :trigger-on-focus="false" @select="handleSelectManager"></el-autocomplete> <div slot="footer" class="dialog-footer">
</el-form-item> <el-button @click="resetForm('form')">取 消</el-button>
<el-form-item label="部门分管人" prop="leader"> <el-button type="primary" @click="submitForm('form')">确 定</el-button>
<el-autocomplete class="inline-input" v-model="form.leader" :fetch-suggestions="querySearch" </div>
placeholder="请输入部门分管人" :trigger-on-focus="false" @select="handleSelectLeader"></el-autocomplete> </el-dialog>
</el-form-item>
<el-form-item label="排序"> </div>
<el-input v-model="form.sortnumber" autocomplete="off"></el-input> </template>
</el-form-item> <script>
</el-form> import LxHeader from "@/components/LxHeader/index.vue";
<div slot="footer" class="dialog-footer"> import {
<el-button @click="resetForm('form')">取 消</el-button> listdept,
<el-button type="primary" @click="submitForm('form')">确 定</el-button> save,
</div> del
</el-dialog> } from "../../api/system/department.js";
import {
</div> listuser
</template> } from "../../api/system/user.js";
<script>
import LxHeader from "@/components/LxHeader/index.vue"; export default {
import { components: {
listdept, LxHeader
save, },
del created() {
} from "../../api/system/department.js"; this.initLoad();
import { this.load();
listuser },
} from "../../api/system/user.js"; mounted() {},
data() {
export default { return {
components: { dialogFormVisible: false,
LxHeader formLabelWidth: "120px",
}, form: {
created() { name: "",
this.initLoad(); id: "",
this.load(); pid: "0",
}, manager_id: "",
mounted() {}, leader_id: "",
data() { manager: "",
return { leader: "",
dialogFormVisible: false, sortnumber: 0,
formLabelWidth: "120px", icon: "",
form: { pname: "上级部门"
name: "", },
id: "", rules: {
pid: "0", name: [{
manager_id: "", required: true,
leader_id: "", message: '请输入部门名称',
manager: "", trigger: 'blur'
leader: "", }]
sortnumber: 0, },
icon: "", tableHeight: 0,
pname: "上级部门" //查询条件字段
}, searchFields: {
rules: { KeyWord: ""
name: [{ },
required: true, tableData: []
message: '请输入部门名称', }
trigger: 'blur' },
}] methods: {
}, querySearch(queryString, cb) {
tableHeight: 0, listuser().then(response => {
//查询条件字段 var data = response.data;
searchFields: { for (var m of data) {
KeyWord: "" m.value = m.name;
}, }
tableData: [] cb(data)
} }).catch(error => {
}, //reject(error)
methods: { })
querySearch(queryString, cb) { },
listuser().then(response => { handleSelectManager(item) {
var data = response.data; this.form.manager_id = item.id;
for (var m of data) { },
m.value = m.name; handleSelectLeader(item) {
} this.form.leader_id = item.id;
cb(data) },
}).catch(error => { initLoad() {
//reject(error) var that = this;
}) var clientHeight = document.documentElement.clientHeight
}, var lxHeader_height = 96.5; //查询 头部
handleSelectManager(item) { var paginationHeight = 37; //分页的高度
this.form.manager_id = item.id; var topHeight = 50; //页面 头部
}, let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
handleSelectLeader(item) { that.tableHeight = tableHeight;
this.form.leader_id = item.id; },
}, load() {
initLoad() { var that = this;
var that = this; listdept().then(response => {
var clientHeight = document.documentElement.clientHeight that.tableData = response;
var lxHeader_height = 96.5; //查询 头部 }).catch(error => {
var paginationHeight = 37; //分页的高度 //reject(error)
var topHeight = 50; //页面 头部 })
let tableHeight = clientHeight - lxHeader_height - topHeight - paginationHeight - 20;
that.tableHeight = tableHeight; },
}, edit(obj) {
load() { this.form = this.$options.data().form
var that = this; if (obj) {
listdept().then(response => { var result = Object.assign(this.form, obj);
that.tableData = response; if (obj.leader)
}).catch(error => { result.leader = obj.leader.name
//reject(error) if (obj.manager)
}) result.manager = obj.manager.name
this.form = result;
}, }
edit(obj) { this.dialogFormVisible = true;
this.form = this.$options.data().form },
if (obj) { addchildren(obj) {
var result = Object.assign(this.form, obj); this.form = this.$options.data().form
if (obj.leader) if (obj) {
result.leader = obj.leader.name this.form.pname = obj.name;
if (obj.manager) this.form.pid = obj.id;
result.manager = obj.manager.name this.dialogFormVisible = true;
this.form = result; }
} },
this.dialogFormVisible = true; submitForm(formName) {
}, var that = this;
addchildren(obj) { this.$refs[formName].validate((valid) => {
this.form = this.$options.data().form if (valid) {
if (obj) { save(that.form).then(response => {
this.form.pname = obj.name; console.log(response)
this.form.pid = obj.id; this.$Message.success('操作成功');
this.dialogFormVisible = true; that.dialogFormVisible = false;
} that.load();
}, }).catch(error => {
submitForm(formName) { reject(error)
var that = this; })
this.$refs[formName].validate((valid) => { } else {
if (valid) { this.$Message.error('数据校验失败');
save(that.form).then(response => { return false;
console.log(response) }
this.$Message.success('操作成功'); });
that.dialogFormVisible = false; },
that.load(); resetForm(formName) {
}).catch(error => { var that = this;
reject(error) this.$refs[formName].resetFields();
}) that.dialogFormVisible = false;
} else { },
this.$Message.error('数据校验失败'); del(obj) {
return false; var that = this;
} if (obj) {
}); this.$Modal.confirm({
}, title: '确认要删除数据？',
resetForm(formName) { onOk: () => {
var that = this; del({
this.$refs[formName].resetFields(); id: obj.id
that.dialogFormVisible = false; }).then(response => {
}, this.$Message.success('操作成功');
del(obj) { that.load();
var that = this; }).catch(error => {
if (obj) { console.log(error)
this.$Modal.confirm({ reject(error)
title: '确认要删除数据？', })
onOk: () => { },
del({ onCancel: () => {
id: obj.id //this.$Message.info('Clicked cancel');
}).then(response => { }
this.$Message.success('操作成功'); });
that.load(); }
}).catch(error => { },
console.log(error) }
reject(error) };
})
},
onCancel: () => {
//this.$Message.info('Clicked cancel');
}
});
}
},
}
};
</script> </script>

4
vue.config.js
Unescape View File

@ -46,8 +46,8 @@ module.exports = {
//before: require('./mock/mock-server.js') //before: require('./mock/mock-server.js')
proxy: { proxy: {
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
target: 'http://hdcontract.ali251.langye.net', //target: 'http://hdcontract.ali251.langye.net',
//target: 'http://192.168.60.99:9003/', target: 'http://192.168.60.99:9003/',
changeOrigin: true, //配置跨域 changeOrigin: true, //配置跨域
pathRewrite: { pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: '' ['^' + process.env.VUE_APP_BASE_API]: ''

Write Preview
Loading…
Cancel
Save