Commit 3aea43de authored by 姬鋆屾's avatar 姬鋆屾

tui

parent 11b25d03
#开发环境 #开发环境
NODE_ENV = "development" NODE_ENV = "development"
VUE_APP_API_BASE_URL= http://112.19.80.237:11039 # VUE_APP_API_BASE_URL= http://112.19.80.237:11039
VUE_APP_API_BASE_URL= http://192.168.0.98:11039
VUE_APP_API_ZWFW_URL= http://112.19.80.237:11031 VUE_APP_API_ZWFW_URL= http://112.19.80.237:11031
\ No newline at end of file
# VUE_APP_API_BASE_URL= http://192.168.0.98:11039
\ No newline at end of file
// table-list 所需的一系列操作方法 // table-list 所需的一系列操作方法
/** /**
* formatter * formatter
* *
...@@ -10,8 +9,8 @@ ...@@ -10,8 +9,8 @@
*/ */
const formatter = (tableData, column, val) => { const formatter = (tableData, column, val) => {
const key = column.property; const key = column.property;
if(tableData.dict && tableData.dict[key]){ if (tableData.dict && tableData.dict[key]) {
const dict = tableData.dict[key] const dict = tableData.dict[key];
return dict[val] || val; return dict[val] || val;
} }
return val; return val;
...@@ -27,11 +26,11 @@ const formatter = (tableData, column, val) => { ...@@ -27,11 +26,11 @@ const formatter = (tableData, column, val) => {
const formatterAmount = (row, column) => { const formatterAmount = (row, column) => {
const property = column.property; const property = column.property;
const amount = row[property]; const amount = row[property];
if(!amount){ if (!amount) {
return '0.00'; return "0.00";
} }
if(amount == 0){ if (amount == 0) {
return '0.00'; return "0.00";
} }
return amount; return amount;
}; };
...@@ -46,15 +45,19 @@ const formatterAmount = (row, column) => { ...@@ -46,15 +45,19 @@ const formatterAmount = (row, column) => {
const formatterDate = (row, column) => { const formatterDate = (row, column) => {
const property = column.property; const property = column.property;
const time = row[property]; const time = row[property];
if(!time) return '--'; if (!time) return "--";
let date = time.length<13?new Date(Number(time) * 1000) : new Date(Number(time)); let date =
let Y = date.getFullYear() + '-'; time.length < 13 ? new Date(Number(time) * 1000) : new Date(Number(time));
let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'; let Y = date.getFullYear() + "-";
let D = panLeft(date.getDate()) + ' '; let M =
let h = panLeft(date.getHours()) + ':'; (date.getMonth() + 1 < 10
let m = panLeft(date.getMinutes()) + ':'; ? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = panLeft(date.getDate()) + " ";
let h = panLeft(date.getHours()) + ":";
let m = panLeft(date.getMinutes()) + ":";
let s = panLeft(date.getSeconds()); let s = panLeft(date.getSeconds());
return Y+M+D+h+m+s; return Y + M + D + h + m + s;
}; };
/** /**
...@@ -67,16 +70,19 @@ const formatterDate = (row, column) => { ...@@ -67,16 +70,19 @@ const formatterDate = (row, column) => {
const formatterDateOnly = (row, column) => { const formatterDateOnly = (row, column) => {
const property = column.property; const property = column.property;
const time = row[property]; const time = row[property];
if(!time) return '-'; if (!time) return "-";
let date = new Date(Number(time)); let date = new Date(Number(time));
let Y = date.getFullYear() + '-'; let Y = date.getFullYear() + "-";
let M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-'; let M =
let D = panLeft(date.getDate()) + ' '; (date.getMonth() + 1 < 10
return Y+M+D; ? "0" + (date.getMonth() + 1)
: date.getMonth() + 1) + "-";
let D = panLeft(date.getDate()) + " ";
return Y + M + D;
}; };
function panLeft(num){ function panLeft(num) {
return num < 10 ? '0'+num : num; return num < 10 ? "0" + num : num;
} }
/** /**
...@@ -90,18 +96,18 @@ function panLeft(num){ ...@@ -90,18 +96,18 @@ function panLeft(num){
const find = (list, key, val) => { const find = (list, key, val) => {
let index = -1; let index = -1;
let data = null; let data = null;
list.forEach((item, i)=>{ list.forEach((item, i) => {
if(item[key] === val){ if (item[key] === val) {
index = i; index = i;
data = JSON.parse(JSON.stringify(item)); data = JSON.parse(JSON.stringify(item));
return; return;
} }
}) });
return { return {
index, index,
data, data,
} };
} };
/** /**
* 构造树型结构数据 * 构造树型结构数据
...@@ -112,24 +118,34 @@ const find = (list, key, val) => { ...@@ -112,24 +118,34 @@ const find = (list, key, val) => {
* @param {*} rootId 根Id 默认 0 * @param {*} rootId 根Id 默认 0
*/ */
function handleTree(data, id, parentId, children, rootId) { function handleTree(data, id, parentId, children, rootId) {
id = id || 'id' id = id || "id";
parentId = parentId || 'parentId' parentId = parentId || "parentId";
children = children || 'children' children = children || "children";
rootId = rootId || Math.min.apply(Math, data.map(item => { return item[parentId] })) || 0 rootId =
rootId ||
Math.min.apply(
Math,
data.map((item) => {
return item[parentId];
})
) ||
null;
//对源数据深度克隆 //对源数据深度克隆
const cloneData = JSON.parse(JSON.stringify(data)) const cloneData = JSON.parse(JSON.stringify(data));
//循环所有项 //循环所有项
const treeData = cloneData.filter(father => { const treeData = cloneData.filter((father) => {
let branchArr = cloneData.filter(child => { let branchArr = cloneData.filter((child) => {
//返回每一项的子级数组 //返回每一项的子级数组
return father[id] === child[parentId] console.log(child[parentId]);
return father[id] === child[parentId];
}); });
branchArr.length > 0 ? father.children = branchArr : ''; branchArr.length > 0 ? (father.children = branchArr) : "";
//返回第一层 //返回第一层
return father[parentId] === rootId; return father[parentId] === rootId;
}); });
return treeData != '' ? treeData : data; console.log(treeData);
}; return treeData != "" ? treeData : data;
}
export { export {
formatter, formatter,
...@@ -137,5 +153,5 @@ export { ...@@ -137,5 +153,5 @@ export {
formatterDate, formatterDate,
formatterDateOnly, formatterDateOnly,
find, find,
handleTree handleTree,
}; };
<template> <template>
<div class="page"> <div class="page">
<div style="margin:10px 0"> <div style="margin:10px 0">
<tab-pane :thirdList="thirdList" :activeName="activeName" @handleClick="handleClick"></tab-pane> <tab-pane
:thirdList="thirdList"
:activeName="activeName"
@handleClick="handleClick"
></tab-pane>
</div> </div>
<el-row :gutter="20"> <el-row :gutter="20">
<el-col :span="6" :xs="12" class="mytree"> <el-col :span="6" :xs="12" class="mytree">
<div class="title"> <div class="title">
<el-button type="primary" size="mini" @click="saveFn('group')">新增分组</el-button> <el-button type="primary" size="mini" @click="saveFn('group')"
<el-button type="success" size="mini" @click="saveFn('job')">新增职位</el-button> >新增分组</el-button
>
<el-button type="success" size="mini" @click="saveFn('job')"
>新增职位</el-button
>
</div> </div>
<el-scrollbar style="height: 100%" class="mt20"> <el-scrollbar style="height: 100%" class="mt20">
<!-- 区分分组和职位 --> <!-- 区分分组和职位 -->
...@@ -19,7 +27,7 @@ ...@@ -19,7 +27,7 @@
node-key="id" node-key="id"
indent="4" indent="4"
:props="{ :props="{
children:'children' children: 'children',
}" }"
highlight-current highlight-current
default-expand-all default-expand-all
...@@ -29,8 +37,12 @@ ...@@ -29,8 +37,12 @@
> >
<template slot-scope="{ node, data }"> <template slot-scope="{ node, data }">
<span class="custom-tree-node"> <span class="custom-tree-node">
<span style="font-size:14px" v-if="!data.groupId">{{ data.groupName }}</span> <span style="font-size:14px" v-if="!data.groupId">{{
<span style="font-size:14px" v-if="data.groupId">{{ data.jobName }}</span> data.groupName
}}</span>
<span style="font-size:14px" v-if="data.groupId">{{
data.jobName
}}</span>
<span style="margin-left:50px"> <span style="margin-left:50px">
<el-button <el-button
type="text" type="text"
...@@ -46,42 +58,62 @@ ...@@ -46,42 +58,62 @@
@click.stop="deleteFn(data)" @click.stop="deleteFn(data)"
></el-button> ></el-button>
</span> </span>
</span> </span>
</template> </template>
</el-tree> </el-tree>
</el-scrollbar> </el-scrollbar>
</el-col> </el-col>
<el-col :span="18" :xs="12" class="mytree"> <el-col :span="18" :xs="12" class="mytree">
<div class="mt20" style="font-size:14px" v-if="currentName"> <div class="mt20" style="font-size:14px" v-if="currentName">
{{currentName}} ({{this.staffList.length}}) {{ currentName }} ({{ this.staffList.length }})
</div> </div>
<div class="mt10"> <div class="mt10">
<el-button type="success" size="mini" @click="addStaff"> <el-button type="success" size="mini" @click="addStaff">
新增员工</el-button> 新增员工</el-button
<el-button type="primary" @click="doExport" :disabled="isExport" >
size="mini">导出数据</el-button> <el-button
type="primary"
@click="doExport"
:disabled="isExport"
size="mini"
>导出数据</el-button
>
<el-button type="danger" @click="allDelete" :disabled="isExport" <el-button
size="mini">批量删除</el-button> type="danger"
@click="allDelete"
:disabled="isExport"
size="mini"
>批量删除</el-button
>
</div> </div>
<el-table :data="staffList" border class="mt20" @selection-change="handleSelectionChange"> <el-table
:data="staffList"
border
class="mt20"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column <el-table-column
type="selection" label="序号"
width="55"> type="index"
</el-table-column> width="50"
<el-table-column label="序号" type="index" width="50"></el-table-column> ></el-table-column>
<el-table-column label="姓名" prop="name"></el-table-column> <el-table-column label="姓名" prop="name"></el-table-column>
<el-table-column label="部门" prop="deptName"></el-table-column> <el-table-column label="部门" prop="deptName"></el-table-column>
<el-table-column label="员工类型" prop="staffType" <el-table-column label="员工类型" prop="staffType">
>
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag size='mini' v-show="scope.row.staffType == 1">全职</el-tag> <el-tag size="mini" v-show="scope.row.staffType == 1"
<el-tag size='mini' v-show="scope.row.staffType == 2">兼职</el-tag> >全职</el-tag
<el-tag size='mini' v-show="scope.row.staffType == 3">实习</el-tag> >
<el-tag size="mini" v-show="scope.row.staffType == 2"
>兼职</el-tag
>
<el-tag size="mini" v-show="scope.row.staffType == 3"
>实习</el-tag
>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="手机号" prop="phoneNumber"></el-table-column> <el-table-column label="手机号" prop="phoneNumber"></el-table-column>
...@@ -96,98 +128,109 @@ ...@@ -96,98 +128,109 @@
</el-table> </el-table>
</el-col> </el-col>
</el-row> </el-row>
<drawer-show ref="drawerform" @ok="getData"/> <drawer-show ref="drawerform" @ok="getData" />
<drawer-staff ref="drawerStaff" :bumentree="bumentree" @ok="refresh"></drawer-staff> <drawer-staff
ref="drawerStaff"
:bumentree="bumentree"
@ok="refresh"
></drawer-staff>
</div> </div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import {handleTree} from "@/assets/utils/table"; import { handleTree } from "@/assets/utils/table";
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
import TabPane from "@/components/tabPane.vue" import TabPane from "@/components/tabPane.vue";
import drawerStaff from './drawershowStaff.vue' import drawerStaff from "./drawershowStaff.vue";
import {timestampToTime} from '@/assets/utils/dateFormat.js' import { timestampToTime } from "@/assets/utils/dateFormat.js";
export default { export default {
name: "JobList", name: "JobList",
components: { components: {
drawerShow, drawerShow,
TabPane, TabPane,
drawerStaff drawerStaff,
}, },
mixins: [table], mixins: [table],
created() { created() {
this.query = { this.query = {
"page":1, page: 1,
"size":-1 size: -1,
} };
this.$post("/dept/treeselect", {}).then(({ data }) => { this.$post("/dept/treeselect", {}).then(({ data }) => {
this.bumentree = data.result this.bumentree = data.result;
}) });
}, },
computed:{ computed: {
thirdList(){ thirdList() {
if(!this.$store.state.CurrentThirdArr) return [] if (!this.$store.state.CurrentThirdArr) return [];
return this.$store.state.CurrentThirdArr return this.$store.state.CurrentThirdArr;
},
activeName() {
return this.$store.state.ThirdPath;
}, },
activeName(){
return this.$store.state.ThirdPath
}
}, },
methods: { methods: {
handleSelectionChange(val) { handleSelectionChange(val) {
this.multipleSelection = val; this.multipleSelection = val;
}, },
getStaff(){ getStaff() {
this.$post('/job/info?id='+this.currentId).then(res => { this.$post("/job/info?id=" + this.currentId).then((res) => {
if(res.code == 1){ if (res.code == 1) {
this.staffList = res.data.staffEntities this.staffList = res.data.staffEntities;
this.staffList.forEach(item => { this.staffList.forEach((item) => {
item.createTime = timestampToTime(item.createTime,6) item.createTime = timestampToTime(item.createTime, 6);
}) });
} }
}) });
}, },
addStaff(){ addStaff() {
this.$refs.drawerStaff.add(this.currentId) this.$refs.drawerStaff.add(this.currentId);
}, },
refresh(){ refresh() {
// 请求 // 请求
// 员工、职位列表 // 员工、职位列表
if(this.currentId){ if (this.currentId) {
this.getStaff() this.getStaff();
} }
this.getData() this.getData();
}, },
handleNodeClick(node){ handleNodeClick(node) {
if(!node.groupId){ if (!node.groupId) {
return return;
} }
this.currentId = node.id this.currentId = node.id;
this.currentName = node.jobName this.currentName = node.jobName;
this.getStaff() this.getStaff();
}, },
// 获取数据后 // 获取数据后
// 处理树结构 // 处理树结构
afterRender(data){ afterRender(data) {
console.log(data);
data.data = handleTree(data.data, "id", "groupId"); data.data = handleTree(data.data, "id", "groupId");
}, },
saveFn(from){ saveFn(from) {
this.$refs.drawerform.add(from) this.$refs.drawerform.add(from);
}, },
doExport(){ doExport() {
this.isExport = true; this.isExport = true;
let params = {} let params = {};
if(this.multipleSelection.length>0){ if (this.multipleSelection.length > 0) {
params['idList'] = this.multipleSelection params["idList"] = this.multipleSelection;
} }
this.$download("/staff/exportExcel", { this.$download(
...params "/staff/exportExcel",
}, { type: "excel" }).then(() => this.isExport = false).catch(error => { {
...params,
},
{ type: "excel" }
)
.then(() => (this.isExport = false))
.catch((error) => {
this.isExport = false; this.isExport = false;
this.$message.error(error.message); this.$message.error(error.message);
}) });
}, },
/** 重写新增方法 */ /** 重写新增方法 */
toAdd(row) { toAdd(row) {
...@@ -195,90 +238,90 @@ ...@@ -195,90 +238,90 @@
// this.$refs.drawerform.add(row); // this.$refs.drawerform.add(row);
}, },
/** 重写编辑方法 */ /** 重写编辑方法 */
toEdit(form,row) { toEdit(form, row) {
this.$refs.drawerform.edit(form,row); this.$refs.drawerform.edit(form, row);
}, },
/** 重写查看方法 */ /** 重写查看方法 */
toView(row) { toView(row) {
this.$refs.drawerform.view(row); this.$refs.drawerform.view(row);
}, },
handleClick(key){ handleClick(key) {
this.$store.commit('setThirdPath',key) this.$store.commit("setThirdPath", key);
this.$router.push({ this.$router.push({
path:key path: key,
}) });
}, },
// 职位 // 职位
editJob(row){ editJob(row) {
let from = '' let from = "";
// 编辑职位/分组 // 编辑职位/分组
if(!row.groupId){ if (!row.groupId) {
from = 'group' from = "group";
}else{ } else {
from = 'job' from = "job";
} }
this.toEdit(from,row) this.toEdit(from, row);
}, },
// 删除分组或者职位 // 删除分组或者职位
deleteFn(row){ deleteFn(row) {
this.$confirm('此操作将永久删除该信息, 是否继续?', '提示', { this.$confirm("此操作将永久删除该信息, 是否继续?", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning' type: "warning",
}).then(res => { }).then((res) => {
// 删除操作 // 删除操作
this.$post('/job/delete?id='+row.id).then(data => { this.$post("/job/delete?id=" + row.id).then((data) => {
if(data.code == 1){ if (data.code == 1) {
this.$message({ this.$message({
type: 'success', type: "success",
message: '删除成功!' message: "删除成功!",
}) });
this.getData() this.getData();
} }
}) });
}) });
}, },
// 删除员工 // 删除员工
deleteStaff(row){ deleteStaff(row) {
this.$confirm("此操作将永久删除该员工,是否继续",'提示',{ this.$confirm("此操作将永久删除该员工,是否继续", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning' type: "warning",
}).then(res => { }).then((res) => {
this.$post('/staff/delete?id='+row.id).then(res => { this.$post("/staff/delete?id=" + row.id).then((res) => {
if(res.code == 1){ if (res.code == 1) {
this.$message.success('删除成功') this.$message.success("删除成功");
this.getStaff() this.getStaff();
} }
}) });
}) });
}, },
// 批量删除员工 // 批量删除员工
allDelete(){ allDelete() {
if (!this.multipleSelection.length) { if (!this.multipleSelection.length) {
return this.$message.warning('请选中一条记录'); return this.$message.warning("请选中一条记录");
} }
let ids = this.multipleSelection.map(item => item.id).join(',') let ids = this.multipleSelection.map((item) => item.id).join(",");
this.$get('/staff/delete?',{id:ids}).then(res => { this.$get("/staff/delete?", { id: ids }).then((res) => {
if(res.code == 1){ if (res.code == 1) {
this.$message.success('删除成功') this.$message.success("删除成功");
this.getStaff() this.getStaff();
}
})
} }
});
},
}, },
data() { data() {
return { return {
isExport:false, isExport: false,
saveFrom:'', saveFrom: "",
addShow:false, addShow: false,
staffList:[], staffList: [],
bumentree:[], bumentree: [],
currentId:'', currentId: "",
currentName:'', currentName: "",
multipleSelection:[] multipleSelection: [],
} };
} },
} };
</script> </script>
...@@ -17,8 +17,8 @@ module.exports = { ...@@ -17,8 +17,8 @@ module.exports = {
hot: true,//自动保存 hot: true,//自动保存
proxy: { proxy: {
'/attendance': { '/attendance': {
//target: 'http://192.168.0.98:11039', target: 'http://192.168.0.98:11039',
target: 'http://112.19.80.237:11039', // target: 'http://112.19.80.237:11039',
// target: 'http://localhost:17500', // target: 'http://localhost:17500',
changeOrigin: true, changeOrigin: true,
secure: false, secure: false,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment