Commit dc4bc638 authored by 姬鋆屾's avatar 姬鋆屾

tui

parent 1d0db3ee
......@@ -2,7 +2,7 @@
NODE_ENV = production
# 地址
VUE_APP_BASE_API =
VUE_APP_API_BASE_URL =http://112.19.80.237:11039
# websocket地址
VUE_APP_WEBSOCKET_API =
......
......@@ -59,16 +59,17 @@ export default {
},
// 提交表单
submitForm(ref) {
console.log(123);
return;
let url = this.urls.saveUrl || this.pageInfo.saveUrl;
if (url == "/staff/perform/stat/save") {
url = "/perform/perpose/save";
} else if (url == "/perform/rules/attend/save") {
url = "/perform/rules/category/save";
}
const el = this.$refs.form;
el.validate((valid) => {
if (!valid) return;
this.loading = true;
this.$post(
this.urls.saveUrl || this.pageInfo.saveUrl,
this.beforeSubmit(this.form)
)
this.$post(url, this.beforeSubmit(this.form))
.then((res) => {
this.$message.success(res.msg);
this.afterSubmit(res);
......
import axios from 'axios';
import axios from "axios";
import {
formatter, formatterAmount, formatterDate, formatterDateOnly, find,
} from '@/assets/utils/table';
formatter,
formatterAmount,
formatterDate,
formatterDateOnly,
find,
} from "@/assets/utils/table";
const tagsMap = {
1: 'danger',
0: 'success'
1: "danger",
0: "success",
};
const baseUrl= process.env.VUE_APP_API_BASE_URL+'/'
const baseUrl = process.env.VUE_APP_API_BASE_URL + "/";
export default {
mounted() {
this.getData();
},
watch: {
'$route'(route) {
$route(route) {
this.query = Object.assign({}, this.query, route.query);
this.getData();
}
},
},
beforeDestroy() {
this.source.cancel('自动取消ajax操作')
clearTimeout(this.loadingTimer)
this.source.cancel("自动取消ajax操作");
clearTimeout(this.loadingTimer);
},
methods: {
beforeUpload(file) {
if (file.size / 1024 / 1024 > 200) {
this.$message({
message: '上传文件大小不能超过 200MB!',
type: 'error'
})
return false
message: "上传文件大小不能超过 200MB!",
type: "error",
});
return false;
}
// 获取文件类型
var test = file.name.substring(file.name.lastIndexOf('.') + 1)
if (test !== 'xlsx' && test !== 'xls') {
var test = file.name.substring(file.name.lastIndexOf(".") + 1);
if (test !== "xlsx" && test !== "xls") {
this.$message({
message: '上传文件只能是 zip、rar格式!',
type: 'warning'
})
return false
message: "上传文件只能是 zip、rar格式!",
type: "warning",
});
return false;
}
},
// 开启、关闭
......@@ -53,11 +57,13 @@ export default {
return Promise.resolve();
},
// 表格接收数据前
beforeRender(data) { return data },
beforeRender(data) {
return data;
},
// 表格接收数据后
afterRender(data) { },
afterRender(data) {},
// 删除动作发生后
afterDel(data) { },
afterDel(data) {},
// 默认拉取数据
async getData() {
try {
......@@ -67,52 +73,60 @@ export default {
}
this.tableData.loading = true;
this.$post(this.pageInfo.list, this.query, {
cancelToken: this.source.token
cancelToken: this.source.token,
})
.then(({ data }) => {
this.tableData = this.beforeRender(
Object.assign({}, this.tableData, data)
)
);
this.afterRender(this.tableData);
})
.catch(error => {
if (error.message == '自动取消ajax操作') return
.catch((error) => {
if (error.message == "自动取消ajax操作") return;
this.$message.error(error.message);
})
.then(data => {
.then((data) => {
clearTimeout(this.loadingTimer);
this.loadingTimer = setTimeout(() => {
this.tableData.loading = false;
}, 300);
})
});
},
// 复制一个数组或对象
util_copy(data) {
if (typeof data !== 'object') return data;
return JSON.parse(JSON.stringify(data))
if (typeof data !== "object") return data;
return JSON.parse(JSON.stringify(data));
},
_showAll(item) {
let data = this.util_copy(item);
data.isShowAll = true;
this.util_update(item.id, data)
this.util_update(item.id, data);
},
// 超长文本展开收起
util_short(key, size) {
return row => {
let string = row[key] || '';
return (row) => {
let string = row[key] || "";
if (string.length < size || row.isShowAll) return string;
return (
<span>
{string.substr(0, 50) + '...'}
<el-button size='mini' type='text' onClick={() => { this._showAll(row) }}>更多</el-button>
{string.substr(0, 50) + "..."}
<el-button
size="mini"
type="text"
onClick={() => {
this._showAll(row);
}}
>
更多
</el-button>
</span>
)
}
);
};
},
// 从dict字段暴力取值,取不到则返回原值
util_formatter(key, val) {
try {
return this.tableData.dict[key][val]
return this.tableData.dict[key][val];
} catch (error) {
return val;
}
......@@ -120,20 +134,24 @@ export default {
// 通过id修改某条记录
util_update(id, newData, idColumnName) {
let table = this.tableData.data;
let { index, data } = find(table, !idColumnName ? 'id' : idColumnName, id);
let { index, data } = find(
table,
!idColumnName ? "id" : idColumnName,
id
);
table.splice(index, 1, Object.assign({}, data, newData));
},
// 工具方法,把数字转化为字符串
util_toString(data, array) {
const dataCopy = Object.assign({}, data);
for (var item in data) {
dataCopy[item] = dataCopy[item] === undefined ? '' : dataCopy[item] + '';
dataCopy[item] =
dataCopy[item] === undefined ? "" : dataCopy[item] + "";
}
return dataCopy;
},
util_formatterDate(time, fmt) {
if (!time) return '';
if (!time) return "";
let date = new Date(Number(time));
var o = {
"M+": date.getMonth() + 1, //月份
......@@ -142,11 +160,21 @@ export default {
"m+": date.getMinutes(), //分
"s+": date.getSeconds(), //秒
"q+": Math.floor((date.getMonth() + 3) / 3), //季度
"S": date.getMilliseconds() //毫秒
S: date.getMilliseconds(), //毫秒
};
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
if (/(y+)/.test(fmt))
fmt = fmt.replace(
RegExp.$1,
(date.getFullYear() + "").substr(4 - RegExp.$1.length)
);
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
if (new RegExp("(" + k + ")").test(fmt))
fmt = fmt.replace(
RegExp.$1,
RegExp.$1.length == 1
? o[k]
: ("00" + o[k]).substr(("" + o[k]).length)
);
return fmt;
},
util_getPrevMonthDate() {
......@@ -154,213 +182,281 @@ export default {
var year = date.getFullYear();
var month = date.getMonth();
var day = date.getDate();
if (month == 0) {//年份为0代表,是本年的第一月,所以不能减
month = 11;//月份为上年的最后月份
year--;//年份减1
if (month == 0) {
//年份为0代表,是本年的第一月,所以不能减
month = 11; //月份为上年的最后月份
year--; //年份减1
return new Date(year, month, day);
}
month--;//否则,只减去月份
month--; //否则,只减去月份
return new Date(year, month, day);
},
// 格式化单元格数据
formatter(row, column, val) {
const content = formatter(this.tableData, column, val);
return content ? <el-tag type={'info'} size='mini'>{content}</el-tag> : val
return content ? (
<el-tag type={"info"} size="mini">
{content}
</el-tag>
) : (
val
);
},
formatterYES(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
if (val == '0') {
return <el-tag type={'danger'} size='mini'>{content}</el-tag>
} else if (val == '1') {
return <el-tag type={'success'} size='mini'>{content}</el-tag>
if (val == "0") {
return (
<el-tag type={"danger"} size="mini">
{content}
</el-tag>
);
} else if (val == "1") {
return (
<el-tag type={"success"} size="mini">
{content}
</el-tag>
);
}
} else {
return val
return val;
}
},
formatterStatus(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
if (val == '0') {
return <el-tag size='mini'>{content}</el-tag>
} else if (val == '1') {
return <el-tag type={'danger'} size='mini'>{content}</el-tag>
} else if (val == '2') {
return <el-tag type={'success'} size='mini'>{content}</el-tag>
if (val == "0") {
return <el-tag size="mini">{content}</el-tag>;
} else if (val == "1") {
return (
<el-tag type={"danger"} size="mini">
{content}
</el-tag>
);
} else if (val == "2") {
return (
<el-tag type={"success"} size="mini">
{content}
</el-tag>
);
}
} else {
return val
return val;
}
},
formatterDictLink(row, column, val) {
const content = formatter(this.tableData, column, val);
let underline = false;
let type = "primary"
let type = "primary";
if (val === 3) {
type = 'danger'
}
return content ? <el-link type={type} underline={underline} onClick={() => { this.toDrawerMsg(row) }} size='mini'>{content}</el-link> : val
type = "danger";
}
return content ? (
<el-link
type={type}
underline={underline}
onClick={() => {
this.toDrawerMsg(row);
}}
size="mini"
>
{content}
</el-link>
) : (
val
);
},
formatters(row, column, val) {
if (val) {
return (
val.split(',').map(v => { return formatter(this.tableData, column, v) }).join(",")
)
return val
.split(",")
.map((v) => {
return formatter(this.tableData, column, v);
})
.join(",");
}
return '--'
return "--";
},
formatterLink(row, column, val) {
//const content = formatter(this.tableData, column-2, val);
return <el-link type="primary" href={val} target="_blank">{row.fileName}</el-link>
return (
<el-link type="primary" href={val} target="_blank">
{row.fileName}
</el-link>
);
//return content;
// return content ? <el-tag type={'info'} size='mini'>{content}</el-tag> : val
},
formatterString(row, column, val) {
return formatter(this.tableData, column, val)
return formatter(this.tableData, column, val);
},
// 格式化单元格数据 0显示 0.00
formatterAmount(row, column) {
return formatterAmount(row, column)
return formatterAmount(row, column);
},
// 格式化单元格数据钱单位里换算成元
formatterMoney(row, column, val) {
return ((val || 0) / 1000).toFixed(2)
return ((val || 0) / 1000).toFixed(2);
},
// 查看天数
formatterDay(row, column, val) {
return <el-tag onClick={() => {
this.handleCountDays(row,column,val)
}}>{val}</el-tag>
return (
<el-tag
onClick={() => {
this.handleCountDays(row, column, val);
}}
>
{val}
</el-tag>
);
},
// 格式化单元格数据
formatterDate(row, column) {
//console.log("date:",row,column)
return formatterDate(row, column)
return formatterDate(row, column);
},
// 格式化单元格数据 只要年月日
formatterDateOnly(row, column) {
return formatterDateOnly(row, column)
return formatterDateOnly(row, column);
},
// 格式化人员
formaterPeople(row, column, val) {
let info
let info;
if (val) {
if (typeof (val) === 'number') {
info = <el-tag type={'info'} size='mini'>{this.util_formatter('assigneeList', val)}</el-tag>
} else {
if (typeof val === "number") {
info = (
val.split(',').map(v => {
<el-tag type={"info"} size="mini">
{this.util_formatter("assigneeList", val)}
</el-tag>
);
} else {
info = val.split(",").map((v) => {
if (this.tableData.dict["assigneeList"][v] != undefined) {
return <el-tag type={'info'} size='mini'>{this.util_formatter('assigneeList', v)}</el-tag>
return (
<el-tag type={"info"} size="mini">
{this.util_formatter("assigneeList", v)}
</el-tag>
);
}
})
)
});
}
} else {
info = '--'
info = "--";
}
return info
return info;
},
// 格式化员工类型
formatterType(row, column, val){
formatterType(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
if (val == '1') {
return <el-tag size='mini'>全职</el-tag>
} else if (val == '2') {
return <el-tag size='mini'>兼职</el-tag>
} else if (val == '3') {
return <el-tag size='mini'>实习</el-tag>
if (val == "1") {
return <el-tag size="mini">全职</el-tag>;
} else if (val == "2") {
return <el-tag size="mini">兼职</el-tag>;
} else if (val == "3") {
return <el-tag size="mini">实习</el-tag>;
}
} else {
return val
return val;
}
},
// geshu
// 格式化是否在政务中心
formatterSource(row, column, val){
formatterSource(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
if (val == '1') {
return <el-tag size='mini'></el-tag>
} else if (val == '2') {
return <el-tag size='mini'></el-tag>
if (val == "1") {
return <el-tag size="mini"></el-tag>;
} else if (val == "2") {
return <el-tag size="mini"></el-tag>;
}
} else {
return val
return val;
}
},
// 格式化处理异常状态
formattereErrorStatus(row,column,val){
const content = formatter(this.tableData, column, val)
formattereErrorStatus(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
return <el-tag size="mini" type="danger">{this.util_formatter('errorStatus', val)}</el-tag>
return (
<el-tag size="mini" type="danger">
{this.util_formatter("errorStatus", val)}
</el-tag>
);
} else {
return val
return val;
}
},
// 格式化处理状态
formattereDealStatus(row,column,val){
const content = formatter(this.tableData, column, val)
formattereDealStatus(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
return <el-tag size="mini">{this.util_formatter('processStatus', val)}</el-tag>
return (
<el-tag size="mini">
{this.util_formatter("processStatus", val)}
</el-tag>
);
} else {
return val
return val;
}
},
// 考勤组人数
formatterGroupPerson(row,column,val){
const content = formatter(this.tableData, column, val)
formatterGroupPerson(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
return Number(row.personNum) + Number(row.personNumNo)
return Number(row.personNum) + Number(row.personNumNo);
} else {
return val
return val;
}
},
// 考勤类型
formatterattendType(row,column,val){
const content = formatter(this.tableData, column, val)
formatterattendType(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
return <el-tag size="mini">{this.util_formatter('type', val)}</el-tag>
return <el-tag size="mini">{this.util_formatter("type", val)}</el-tag>;
} else {
return val
return val;
}
},
// 请假类型
formatterLeaveType(row,column,val){
const content = formatter(this.tableData, column, val)
formatterLeaveType(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
return <el-tag size="mini">{this.util_formatter('leaveType', val)}</el-tag>
return (
<el-tag size="mini">{this.util_formatter("leaveType", val)}</el-tag>
);
} else {
return val
return val;
}
},
// 格式化图片展示
formatterPic(row, column, val){
const content = formatter(this.tableData, column, val)
formatterPic(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
return <el-image
src={val.indexOf('http') == -1?baseUrl+val:val}
preview-src-list={val.indexOf('http') == -1?baseUrl+val:val}
style="width: 100px"></el-image>
return (
<el-image
src={val.indexOf("http") == -1 ? baseUrl + val : val}
preview-src-list={val.indexOf("http") == -1 ? baseUrl + val : val}
style="width: 100px"
></el-image>
);
} else {
return val
return val;
}
},
// 考勤组格式
formatterBanci(row,column,val){
const content = formatter(this.tableData, column, val)
formatterBanci(row, column, val) {
const content = formatter(this.tableData, column, val);
if (content) {
// let string = row.attendanceTime.replace("、","<br>")
return <div>
return (
<div>
<div>
<el-tag type="info">{row.restTime}</el-tag>
</div>
......@@ -368,35 +464,29 @@ export default {
<p>{row.attendanceTime}</p>
</div>
</div>
);
} else {
return val
return val;
}
},
// 多选表格行
handleSelectionChange(val) {
this.selection = val.map(i => i.id);
this.selection = val.map((i) => i.id);
},
// 当某一行被点击时会触发该事件
handleRowClick(row, column, event) {
},
handleRowClick(row, column, event) {},
// 合并表格行列
handleSpanMethod() {
},
handleSpanMethod() {},
// 自定义表格排序
handleSortChange() {
},
handleSortChange() {},
// 自定义索引号
handleIndexMethod(index) {
//prePageResult 每页条数
// console.log("index:"+index)
let size = this.tableData.pageInfo.prePageResult;
let page = this.tableData.pageInfo.currPage;
let count = parseInt(size) * (parseInt(page) - 1)
let count = parseInt(size) * (parseInt(page) - 1);
return count + index + 1;
},
// 自定义表格选择行是否能勾选
......@@ -405,100 +495,98 @@ export default {
},
// 设置单元行样式
tableRowClassName() { },
tableRowClassName() {},
// 批量删除
toBatchDel() {
this.toDel(this.selection.join(','), true);
this.toDel(this.selection.join(","), true);
},
// 单个删除
toDel(id, isBatch) {
if (!id) {
return this.$message.warning('请选中一条记录');
return this.$message.warning("请选中一条记录");
}
this.$get(this.pageInfo.del, { id: id })
.then(res => {
this.$message.success(res.msg)
.then((res) => {
this.$message.success(res.msg);
// 更新数据
if (isBatch) {
// 批量删除,刷新页面
this.getData();
} else {
let table = this.tableData.data;
let { index } = find(table, 'id', id);
let { index } = find(table, "id", id);
table.splice(index, 1);
this.tableData.pageInfo.totalResult -= 1;
}
this.afterDel(id);
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message);
})
});
},
// 新增
toAdd() {
this.$router.push({
path: this.pageInfo.add,
query: this.tableConfig.addQuery,
})
});
},
// 编辑
toEdit(row, query) {
this.$router.push({
path: this.pageInfo.edit,
query: Object.assign({}, { id: row.id }, query)
})
query: Object.assign({}, { id: row.id }, query),
});
},
// 查看
toView(row, query) {
console.log(this.pageInfo.view)
console.log(this.pageInfo.view);
this.$router.push({
path: this.pageInfo.view,
query: Object.assign({}, { id: row.id }, query)
})
query: Object.assign({}, { id: row.id }, query),
});
},
// 导入
toImport() {
this.$router.push({
path: this.pageInfo.importView,
query: this.tableConfig.addQuery,
})
});
},
// 导出
toexport(){
toexport() {
this.$router.push({
path: this.pageInfo.importView,
query: this.tableConfig.addQuery,
})
});
},
// 返回
toBack() {
this.$router.push({
path: this.pageInfo.back
})
path: this.pageInfo.back,
});
},
// 开启、关闭
open() {
},
open() {},
},
computed: {
tableConfig() {
return Object.assign({}, this.defaultConfig, this.config)
return Object.assign({}, this.defaultConfig, this.config);
},
pageInfo() {
const urls = { // 操作所需的url地址,和url同路径
const urls = {
// 操作所需的url地址,和url同路径
list: this.$route.path,
edit: this.$route.path.replace('/list', '/edit'),
save: this.$route.path.replace('/list', '/save'),
del: this.$route.path.replace('/list', '/delete'),
add: this.$route.path.replace('/list', '/add'),
view: this.$route.path.replace('/list', '/view'),
importView: this.$route.path.replace('/list', '/importView'),
exclude: this.$route.path.replace('/list', '/list/exclude'),
}
return Object.assign({}, urls, this.urls)
edit: this.$route.path.replace("/list", "/edit"),
save: this.$route.path.replace("/list", "/save"),
del: this.$route.path.replace("/list", "/delete"),
add: this.$route.path.replace("/list", "/add"),
view: this.$route.path.replace("/list", "/view"),
importView: this.$route.path.replace("/list", "/importView"),
exclude: this.$route.path.replace("/list", "/list/exclude"),
};
return Object.assign({}, urls, this.urls);
},
},
data() {
......@@ -528,17 +616,15 @@ export default {
back: this.toBack,
importView: this.toImport,
refresh: this.getData,
}
},
tableData: { // 表格数据
},
tableData: {
// 表格数据
loading: true, // ajax请求状态
dict: {},
result: [],
pageInfo: {},
}
}
}
}
},
};
},
};
......@@ -2,7 +2,12 @@
<template>
<div class="layout-table" :loading="data.loading">
<TabPane :thirdList="thirdList" :activeName="activeName" @handleClick="handleClick" v-if="config.isshowTabPane"></TabPane>
<TabPane
:thirdList="thirdList"
:activeName="activeName"
@handleClick="handleClick"
v-if="config.isshowTabPane"
></TabPane>
<div class="table-head flex flex-pack-justify">
<div class="table-head-left flex flex-align-center">
<!-- <slot name="breadcrumb">
......@@ -29,7 +34,8 @@
@click="config.methods.importView"
class="el-icon-upload2"
title="导入"
>导入</el-button>
>导入</el-button
>
<!-- <el-button
v-if="isShowButton('notDel')"
......@@ -41,8 +47,19 @@
title="批量删除"
>删除</el-button
> -->
<Confirm v-if='isShowButton("notDel")' @confirm='config.methods.del' message='确定要删除选中的多条记录吗?'>
<el-button icon="el-icon-delete" type="danger" size='mini' plain title="批量删除">批量删除</el-button>
<Confirm
v-if="isShowButton('notDel')"
@confirm="config.methods.del"
message="确定要删除选中的多条记录吗?"
>
<el-button
icon="el-icon-delete"
type="danger"
size="mini"
plain
title="批量删除"
>批量删除</el-button
>
</Confirm>
<el-button
@click="item.method"
......@@ -126,7 +143,6 @@
:downloadUrl="config.downloadUrl"
:areaSelect="config.areaSelect"
/>
</div>
</div>
</div>
......@@ -220,7 +236,7 @@ import DataTable from "@/components/DataTable.vue";
import DataTableMobile from "./DataTableMobile.js";
import DataTableFlow from "./DataTableFlow.vue";
import DataTreeTable from "@/components/DataTreeTable.vue";
import TabPane from "@/components/tabPane.vue"
import TabPane from "@/components/tabPane.vue";
export default {
props: {
data: {
......@@ -242,7 +258,9 @@ export default {
DataTableMobile,
DataTableFlow,
DataTreeTable,
TabPane
TabPane,
},
mounted() {
},
methods: {
// 根据url的query参数判断是否展示查询条件
......@@ -268,12 +286,12 @@ export default {
isShowBtn(name) {
return this.canShow.indexOf(name) !== -1;
},
handleClick(key){
this.$store.commit('setThirdPath',key)
handleClick(key) {
this.$store.commit("setThirdPath", key);
this.$router.push({
path:key
})
}
path: key,
});
},
},
watch: {
$route(route) {
......@@ -288,21 +306,21 @@ export default {
this.showType = this.config.showType ? this.config.showType : "table";
return Object.keys(this.$attrs) || [];
},
thirdList(){
if(!this.$store.state.CurrentThirdArr) return []
return this.$store.state.CurrentThirdArr
thirdList() {
if (!this.$store.state.CurrentThirdArr) return [];
return this.$store.state.CurrentThirdArr;
},
activeName() {
return this.$store.state.ThirdPath;
},
activeName(){
return this.$store.state.ThirdPath
}
},
data() {
return {
loading: this.config.loading,
showSearch: this.isShowSearch(this.$route.query),
showType: "table",
}
}
};
},
};
</script>
......
<template>
<div class="page">
<LayoutTable :data="tableData" :config="tableConfig">
</LayoutTable>
<LayoutTable :data="tableData" :config="tableConfig"> </LayoutTable>
<dialog-show ref="dialogform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import dialogShow from "./dialogshow";
import table from "@/assets/mixins/table";
export default {
/** 表单弹出框模式需引入 */
import dialogShow from "./dialogshow";
import table from "@/assets/mixins/table";
export default {
name: "PerformPerposeList",
components: {
dialogShow
},
mixins: [table],
created() {
dialogShow,
},
mixins: [table],
created() {},
methods: {
/** 重写新增方法 */
toAdd(row) {
......@@ -33,37 +30,49 @@
toView(row) {
this.$refs.dialogform.view(row);
},
},
data() {
return {
config: {
isshowTabPane:true,
search: [
],
isshowTabPane: true,
search: [],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
{label: "负责人名称", prop: "ownerName"},
{ label: "负责人名称", prop: "ownerName" },
{label: "请假类型", prop: "assessmentType",formatter: this.formatter},
{
label: "请假类型",
prop: "assessmentType",
formatter: this.formatter,
},
{label: "比例", prop: "ratio", formatter: this.formatter},
{ label: "比例", prop: "ratio", formatter: this.formatter },
{label: "创建时间", prop: "createTime", formatter: this.formatterDate},
{
label: "创建时间",
prop: "createTime",
formatter: this.formatterDate,
},
{
label: "操作",
width: 240,
formatter: row => {
formatter: (row) => {
return (
<table-buttons noAdd row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
<table-buttons
noAdd
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
}
}
]
}
};
}
},
},
],
},
};
},
};
</script>
......@@ -14,8 +14,8 @@
>
<span>{{ val.name }}</span>
<div>
<i class="el-icon-edit-outline"></i>
<i class="el-icon-delete"></i>
<i class="el-icon-edit-outline" @click="toEdit(val)"></i>
<i class="el-icon-delete" @click="toDel(val)"></i>
</div>
</div>
</div>
......@@ -34,7 +34,16 @@
<el-button type="primary"> 搜索 </el-button>
</div>
</div>
<div class="table_box"></div>
<div class="table_box">
<LayoutTable
:data="tableData"
notAdd
notDel
notSearch
:config="tableConfig"
>
</LayoutTable>
</div>
</div>
<drawer-show ref="drawerform" @ok="getData" />
<dialog-show ref="dialogform" @ok="getData" />
......@@ -44,25 +53,71 @@
<script>
import drawerShow from "../drawershow";
import dialogShow from "../dialogshow";
import table from "@/assets/mixins/table";
export default {
name: "AdminAttendIndex",
components: {
drawerShow,
dialogShow,
},
mixins: [table],
props: {
activeName: {
type: String,
default: () => "",
},
},
data() {
return {
index: -1,
dataArr: [
dataArr: [],
config: {
isshowTabPane: false,
search: [],
columns: [
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
{ label: "分类", prop: "categoryId", formatter: this.formatter },
{ label: "考核名称", prop: "name" },
{ label: "评分标准", prop: "content" },
{ label: "增减类型", prop: "subAddType", formatter: this.formatter },
{ label: "分值", prop: "score" },
{ label: "负责人分值", prop: "ownerScore" },
{
label: "创建用户",
prop: "createUserId",
formatter: this.formatter,
},
{
name: "工作纪律",
label: "操作",
width: 240,
formatter: (row) => {
return (
<table-buttons
noAdd
noView
row={row}
onEdit={this.eddRules}
onDel={this.toDelRules}
/>
);
},
},
],
},
};
},
mounted() {},
created() {
// this.getData();
},
methods: {
handleClick(val, i) {
......@@ -71,9 +126,53 @@ export default {
addRules() {
this.$refs.drawerform.add();
},
eddRules(row) {
this.$refs.drawerform.edit(row);
},
addCate() {
this.$refs.dialogform.add();
},
toDelRules(val) {
console.log(val);
this.$get("/perform/rules/delete", { id: val }).then((res) => {
this.$message.success(res.msg);
this.getKaoQin();
});
},
/** 重写编辑方法 */
toEdit(row) {
this.$refs.dialogform.edit(row);
},
toDel(val) {
this.$get("/perform/rules/category/delete", { id: val.id }).then(
(res) => {
this.$message.success(res.msg);
this.getData();
}
);
},
async getData() {
await this.$post("/perform/rules/category/list").then((res) => {
this.getKaoQin();
if (res.code == 1) {
this.dataArr = res.data.data;
} else {
this.dataArr = [];
}
});
},
async getKaoQin() {
await this.$post("/perform/rules/list", { type: this.activeName }).then(
(res) => {
if (res.code == 1) {
this.tableData = res.data;
this.$forceUpdate(this.tableData);
} else {
this.tableData = {};
}
}
);
},
},
};
</script>
......@@ -133,7 +232,7 @@ export default {
text-align: left;
padding: 0 10px;
border: 1px solid #ddd;
margin-bottom: 20px;
&:hover {
background-color: rgba(22, 202, 122, 1);
color: #ffffff;
......
......@@ -2,19 +2,19 @@
<div class="page">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="考勤绩效指标" name="1">
<attend-index />
<attend-index v-if="activeName == 1" :activeName="activeName" />
</el-tab-pane>
<el-tab-pane label="评价绩效指标" name="2">
<attend-index />
<attend-index v-if="activeName == 2" :activeName="activeName" />
</el-tab-pane>
<el-tab-pane label="办件绩效指标" name="3">
<attend-index />
<attend-index v-if="activeName == 3" :activeName="activeName" />
</el-tab-pane>
<el-tab-pane label="效能绩效指标" name="4">
<attend-index />
<attend-index v-if="activeName == 4" :activeName="activeName" />
</el-tab-pane>
<el-tab-pane label="其他绩效指标" name="5">
<attend-index />
<attend-index v-if="activeName == 5" :activeName="activeName" />
</el-tab-pane>
</el-tabs>
</div>
......@@ -28,7 +28,8 @@ export default {
created() {},
methods: {
handleClick(tab, event) {
console.log(tab, event);
// this.$forceUpdate(this.activeName);
},
},
data() {
......
......@@ -30,6 +30,7 @@ export default {
watch: {
title(val) {
console.log(val);
this.drawLine();
},
},
mounted() {
......
<template>
<!-- 弹出框表单 -->
<el-dialog :title="title" :visible.sync="open" width="90%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row>
<Field
label="负责人id号"
prop="ownerId"
v-model="form.ownerId"
placeholder="请输入负责人id号"
/>
<Field
label="负责人名称"
prop="ownerName"
v-model="form.ownerName"
placeholder="请输入负责人名称"
/>
<Field
label="窗口工作人员id号"
prop="staffId"
v-model="form.staffId"
placeholder="请输入窗口工作人员id号"
/>
<Field
label="请假类型"
prop="assessmentType"
v-model="form.assessmentType"
type="select"
:enumData="dict.assessmentType"
placeholder="请选择请假类型"
/>
<Field
label="考核范围"
prop="assessmentScope"
v-model="form.assessmentScope"
type="select"
:enumData="dict.assessmentScope"
placeholder="请选择考核范围"
/>
<Field
label="考比较类型"
prop="compareScope"
v-model="form.compareScope"
type="select"
:enumData="dict.compareScope"
placeholder="请选择考比较类型"
/>
<Field
label="比例"
prop="ratio"
v-model="form.ratio"
placeholder="请输入比例"
/>
<Field
label="周期类型"
prop="periodType"
v-model="form.periodType"
type="select"
:enumData="dict.periodType"
placeholder="请选择周期类型"
/>
<Field
label="年"
prop="year"
v-model="form.year"
placeholder="请输入年"
/>
<Field
label="月"
prop="month"
v-model="form.month"
type="select"
:enumData="dict.month"
placeholder="请选择月"
/>
<Field
label="半年类型"
prop="halfYear"
v-model="form.halfYear"
type="select"
:enumData="dict.halfYear"
placeholder="请选择半年类型"
/>
<Field
label="半年类型"
prop="halfYear"
v-model="form.halfYear"
type="select"
:enumData="dict.halfYear"
placeholder="请选择半年类型"
/>
<Field
label="季度类型"
prop="quarter"
v-model="form.quarter"
type="select"
:enumData="dict.quarter"
placeholder="请选择季度类型"
/>
<Field
label="负责人,多个逗号分割"
prop="leaders"
v-model="form.leaders"
type="textarea"
placeholder="请输入负责人,多个逗号分割"
/>
<Field
label="负责人电话,多个逗号分割"
prop="leaderMobiles"
v-model="form.leaderMobiles"
type="textarea"
placeholder="请输入负责人电话,多个逗号分割"
/>
<Field
label="备注"
prop="remark"
v-model="form.remark"
type="textarea"
placeholder="请输入备注"
/>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button
type="primary"
v-if="pageInfo.type !== 'view'"
@click="submitForm"
>确 定</el-button
>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import form from "@/assets/mixins/formdialog";
import dialogShow from "./dialogshow";
export default {
mixins: [form],
components: {
dialogShow,
},
data() {
return {
// 遮罩层
loading: true,
// 弹出层标题
title: "考核目标",
// 是否显示弹出层
open: false,
toString: [
"assessmentType",
"assessmentScope",
"compareScope",
"periodType",
"month",
"halfYear",
"halfYear",
"quarter",
],
// 表单校验
rules: {
year: [{ required: true, message: "请输入年", trigger: "blur" }],
month: [{ required: true, message: "请输入月", trigger: "blur" }],
},
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/perpose/edit";
this.getData();
this.pageInfo.type = "edit";
this.title = "修改考核目标";
},
/** 新增 */
add(row) {
this.reset();
this.urls.currUrl = "perform/perpose/add";
this.getData();
this.pageInfo.type = "add";
this.title = "新增考核目标";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "perform/perpose/view";
this.getData();
this.pageInfo.type = "view";
this.title = "考核目标详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置
reset() {
this.form = {
ownerId: null,
ownerName: "",
staffId: null,
assessmentType: null,
assessmentScope: 1,
compareScope: 1,
ratio: 0.0,
periodType: 1,
year: null,
month: null,
halfYear: 1,
halfYear: 1,
quarter: 1,
leaders: "",
leaderMobiles: "",
remark: "",
};
this.resetForm("form");
},
resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script>
......@@ -83,7 +83,7 @@
</el-option>
</el-select>
<el-select
v-model="value"
v-model="dateValue"
placeholder="请选择"
style="margin: 0 10px;"
>
......@@ -100,7 +100,9 @@
</div>
<div class="bar_content">
<bar-charts
:title="'各部门1月旷工率对齐情况'"
:title="
`${type == 1 ? '各部门' : '个人'}${dateValue}月旷工率对齐情况`
"
:id="'bar_content'"
:legendName="'旷工率'"
:styleObj="{ width: '1800px', height: '650px' }"
......@@ -115,12 +117,12 @@
<el-radio-button label="1">按部门</el-radio-button>
<el-radio-button label="2">按个人</el-radio-button>
</el-radio-group>
<el-button type="primary" style="margin: 0 20px;">
<el-button type="primary" style="margin: 0 20px;" @click="addGoal">
+ 创建目标</el-button
>
</div>
<div class="mid_content">
<div class="goal_box">
<div class="goal_box" v-for="(val, i) in dataList" :key="i">
<div class="goal_title">
<img src="../../../../assets/images/u17641.svg" alt="" />
<span>
......@@ -128,21 +130,34 @@
</span>
</div>
<p class="goal_txt">
<span>目标部门:</span><span>全部部门</span>
<span>{{ type == 1 ? "目标部门:" : "目标个人:" }}</span
><span>{{
type == 1 ? "全部部门" : "张三、李四、王武、陈真"
}}</span>
</p>
<p class="goal_txt"><span>周期:</span><span>全部部门</span></p>
<p class="goal_txt"><span>负责人:</span><span>全部部门</span></p>
<p class="goal_txt">
<span>最近更新:</span><span>全部部门</span>
<span>周期:</span><span>2023年/全年</span>
</p>
<p class="goal_txt">
<span>更新人员:</span><span>全部部门</span>
<span>负责人:</span><span>张三、李四、王武 </span>
</p>
<p class="goal_txt">
<span>最近更新:</span><span>2023-05-11 10:00:00</span>
</p>
<p class="goal_txt"><span>更新人员:</span><span>言若海</span></p>
<div class="button_box">
<el-button type="primary" style="width: 150px;" plain
<el-button
type="primary"
style="width: 150px;"
plain
@click="hanleEdit(val)"
>编辑</el-button
>
<el-button type="danger" style="width: 150px;" plain
<el-button
type="danger"
style="width: 150px;"
plain
@click="hanleDel(val)"
>删除</el-button
>
</div>
......@@ -151,6 +166,7 @@
</div>
</el-tab-pane>
</el-tabs>
<dialog-show ref="dialogform" @ok="getData" />
</div>
</template>
......@@ -158,24 +174,53 @@
import BarCharts from "./components/BarCharts.vue";
import LineCharts from "./components/LineCharts.vue";
import PieCharts from "./components/PieCharts.vue";
import dialogShow from "./dialogshow";
export default {
components: {
BarCharts,
PieCharts,
LineCharts,
dialogShow,
},
name: "StaffPerformStatList",
created() {},
created() {
this.getData();
},
methods: {
handleClick(tab, event) {
console.log(tab, event);
},
addGoal() {
this.$refs.dialogform.add();
},
/** 编辑方法 */
hanleEdit(row) {
this.$refs.dialogform.edit(row);
},
hanleDel(val) {
this.$get("/perform/perpose/delete", { id: val.id }).then((res) => {
this.$message.success(res.msg);
this.getData();
});
},
getData() {
this.$post("/perform/perpose/list").then((res) => {
console.log(res);
if (res.code == 1) {
this.dataList = res.data.data;
} else {
this.dataList = [];
}
});
},
},
data() {
return {
activeName: "1",
type: "1",
dateValue: "1",
options: [
{
value: "1",
......@@ -269,6 +314,7 @@ export default {
},
],
value: "",
dataList: [],
};
},
};
......
......@@ -3,23 +3,21 @@
<LayoutTable :data="tableData" notAdd notDel :config="tableConfig">
</LayoutTable>
<dialog-show ref="dialogform" @ok="getData" />
</div>
</template>
<script>
/** 表单弹出框模式需引入 */
import dialogShow from "./dialogshow";
import table from "@/assets/mixins/table";
export default {
/** 表单弹出框模式需引入 */
import dialogShow from "./dialogshow";
import table from "@/assets/mixins/table";
export default {
name: "StaffPerformSummaryList",
components: {
dialogShow
},
mixins: [table],
created() {
dialogShow,
},
mixins: [table],
created() {},
methods: {
/** 重写新增方法 */
toAdd(row) {
......@@ -33,67 +31,81 @@
toView(row) {
this.$refs.dialogform.view(row);
},
},
data() {
return {
config: {
isshowTabPane:true,
isshowTabPane: true,
search: [
{
name: "createTimeStart",
type: "date",
label: "月份"
label: "月份",
},
{
name: "deptId",
type: "select",
label: "所属部门"
label: "所属部门",
},
{
name: "staffName",
type: "text",
label: "员工姓名"
label: "员工姓名",
},
],
columns: [
{type: "selection", width: 60},
{type: "index",label: "序号",width: 50},
{ type: "selection", width: 60 },
{ type: "index", label: "序号", width: 50 },
{label: "姓名", prop: "staffName"},
{ label: "姓名", prop: "staffName" },
{label: "工号", prop: "workNum"},
{ label: "工号", prop: "workNum" },
{label: "所属部门", prop: "deptName"},
{ label: "所属部门", prop: "deptName" },
{label: "考勤绩效", prop: "attendScore", formatter: this.formatter},
{ label: "考勤绩效", prop: "attendScore", formatter: this.formatter },
{label: "评价绩效", prop: "assessScore", formatter: this.formatter},
{ label: "评价绩效", prop: "assessScore", formatter: this.formatter },
{label: "办件绩效", prop: "workScore", formatter: this.formatter},
{ label: "办件绩效", prop: "workScore", formatter: this.formatter },
{label: "效能绩效", prop: "effectScore", formatter: this.formatter},
{ label: "效能绩效", prop: "effectScore", formatter: this.formatter },
{label: "其它绩效", prop: "otherScore", formatter: this.formatter},
{ label: "其它绩效", prop: "otherScore", formatter: this.formatter },
{label: "累计异常分数", prop: "errorScore", formatter: this.formatter},
{
label: "累计异常分数",
prop: "errorScore",
formatter: this.formatter,
},
{label: "本月得分数", prop: "totalScore", formatter: this.formatter},
{
label: "本月得分数",
prop: "totalScore",
formatter: this.formatter,
},
{
label: "操作",
width: 240,
formatter: row => {
formatter: (row) => {
return (
<table-buttons noAdd noEdit noDel row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} />
<table-buttons
noAdd
noEdit
noDel
row={row}
onEdit={this.toEdit}
onView={this.toView}
onDel={this.toDel}
/>
);
}
}
]
}
};
}
},
},
],
},
};
},
};
</script>
......@@ -17,8 +17,8 @@ module.exports = {
hot: true,//自动保存
proxy: {
'/attendance': {
//target: 'http://192.168.0.98:11039',
target: 'http://localhost:17500',
target: 'http://192.168.0.98:11039',
// target: 'http://localhost:17500',
changeOrigin: true,
secure: false,
cookieDomainRewrite: 'localhost',
......
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