You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

280 lines
9.2 KiB
Plaintext

9 months ago
<template>
<div id="Complete">
<el-form :inline="true" ref="ruleForm" :model="formInline" :rules="rules" class="demo-form-inline">
<el-form-item label="关键字" prop="keyWord">
<el-input v-model="formInline.keyWord" placeholder="关键字"></el-input>
</el-form-item>
<el-form-item label="发起日期" prop="RageDate">
<el-date-picker v-model="formInline.RageDate" type="daterange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('ruleForm')">查询</el-button>
</el-form-item>
</el-form>
<div style="display: flex">
<!-- 没有内容 -->
<!-- <div style="width: 25%">
<el-menu default-active="2" class="el-menu-vertical-demo">
<el-menu-item v-for="item in dataTree" :key="item.label" @click="handleNodeClick(item.WorkID)">
<i class="el-icon-paperclip"></i>
<span slot="title">{{ item.label }}</span>
</el-menu-item>
</el-menu>
</div> -->
<div style="padding: 0 10px;">
<el-table :data="tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)" height="75vh"
style="flex: 1" row-key="WorkID" default-expand-all :row-class-name="tableRowClassName"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
<el-table-column prop="Title" label="标题" fixed min-width="250" width="250" align="center">
<template slot-scope="scope">
<span v-if="scope.row.type != null">{{ scope.row.Title }}</span>
<span v-else>
<el-link :underline="false" @click="sikpMyflow(scope.row)" type="primary">
{{ scope.row.Title }}
</el-link>
</span>
</template>
</el-table-column>
<el-table-column prop="StarterName" label="发起人/部门" width="160" align="center">
<template slot-scope="scope">
<span>{{ scope.row.StarterName }};{{ scope.row.DeptName }}</span>
</template>
</el-table-column>
<el-table-column prop="FlowName" label="流程类型" width="200" align="center">
</el-table-column>
<el-table-column prop="RDT" label="发起时间" width="180" align="center">
</el-table-column>
<el-table-column prop="SendDT" label="完成时间" width="180" align="center">
</el-table-column>
<el-table-column label="操作" width="150" align="center">
<template slot-scope="scope">
<el-button v-show="scope.row.type == null" @click="DialogOpen(scope.row)" type="primary" size="mini"
plain>轨迹</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="currentPage" :page-sizes="[5, 10, 15, 20]" :page-size="pageSize"
layout="total,sizes, prev, pager, next" :total="total" v-show="total > 0"></el-pagination>
</div>
</div>
<el-dialog :title="title" :visible.sync="dialogFormVisible" :before-close="handleClose">
</el-dialog>
</div>
</template>
<script>
import { openMyView } from "./api/Dev2Interface"; // 轨迹
export default {
name: "complete",
data() {
return {
title: "已完成",
data: {},
dialogFormVisible: false, //弹出框显示
titile: "", //标题
formInline: {
keyWord: "",
RageDate: "",
},
rules: {},
tableData: [],
dataTree: [],
total: 0, // 总数
currentPage: 1, // 当前页
pageSize: 15, //一页显示的行数
selevalue: "",
};
},
beforeCreate() { },
created() {
this.loadData();
this.timeDefault();
},
methods: {
// 默认时间
timeDefault() {
let date = new Date()
// 通过时间戳计算
let defalutStartTime = date.getTime() - 30 * 24 * 3600 * 1000 // 转化为时间戳
let defalutEndTime = date.getTime()
let startDateNs = new Date(defalutStartTime)
let endDateNs = new Date(defalutEndTime)
// 月,日 不够10补0
defalutStartTime = startDateNs.getFullYear() + '-' + ((startDateNs.getMonth() + 1) >= 10 ? (startDateNs.getMonth() + 1) : '0' + (startDateNs.getMonth() + 1)) + '-' + (startDateNs.getDate() >= 10 ? startDateNs.getDate() : '0' + startDateNs.getDate())
defalutEndTime = endDateNs.getFullYear() + '-' + ((endDateNs.getMonth() + 1) >= 10 ? (endDateNs.getMonth() + 1) : '0' + (endDateNs.getMonth() + 1)) + '-' + (endDateNs.getDate() >= 10 ? endDateNs.getDate() : '0' + endDateNs.getDate())
this.formInline.RageDate = [defalutStartTime, defalutEndTime];
},
tableRowClassName({ row }) {
if (row.type === null) return "";
if (row.type === 1) {
return "success-row";
}
return "";
},
// 获取数据
loadData() {
let handler = new this.HttpHandler("BP.WF.HttpHandler.WF");
let data = handler.DoMethodReturnString("Complete_Init");
if (data.indexOf("err@") != -1) {
this.$message.error(data);
console.log(data);
return;
}
this.data = JSON.parse(data);
this.filterData();
},
// 分页
paging() {
/*this.total = this.tableData.length;
let start = (this.currentPage - 1) * this.pageSize;
let end = this.currentPage * this.pageSize;
let arr = this.tableData.slice(start, end);*/
//this.filterData(arr);
},
// 查询
// onSubmit() {},
// handleSizeChange(val) {
// this.pageSize = val;
// this.currentPage = 1;
// console.log(`每页 ${val} 条`);
// },
// handleCurrentChange(val) {
// this.currentPage = val;
// console.log(`当前页: ${val}`);
// },
// 过滤数据
filterData() {
this.tableData = [];
var flowNos = "";
this.data.forEach((item) => {
this.tableData.push(item);
if (flowNos.indexOf(item.FK_Flow + ",") == -1) {
var childrenWork = this.GetChildren(item.FK_Flow);
this.total = childrenWork.length;
this.dataTree.push({
label: item.FlowName + " (" + childrenWork.length + ")",
name: item.FlowName,
WorkID: parseInt(item.FK_Flow),
childrenWork: childrenWork,
count: childrenWork.length,
});
flowNos += item.FK_Flow + ",";
}
});
},
GetChildren(flowNo) {
var data = [];
this.data.forEach((item) => {
if (item.FK_Flow == flowNo) {
if (item.TodoEmps.indexOf(",") != -1)
item.TodoEmps = item.TodoEmps.substring(
item.TodoEmps.indexOf(",") + 1
);
data.push(item);
}
});
return data;
},
handleNodeClick(data) {
this.tableData = this.GetChildren(data);
this.total = this.tableData.length;
//this.GetChildren(data.name,data.childrenWork)
//this.paging();
},
// 查询
onSubmit(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
console.log(this.tableData);
const Data = this.tableData.filter((data) => {
if (
data.Title.toLowerCase().includes(
this.formInline.keyWord.toLowerCase()
)
) {
return data;
}
});
this.tableData = Data;
if (this.formInline.RageDate !== "") {
let time = this.formInline.RageDate;
let startTime = this.moment(time[0]).unix() * 1000;
let endTime = this.moment(time[1]).unix() * 1000;
const NewData = Data.filter((data) => {
let nowTime = this.moment(data.RDT).unix() * 1000;
if (nowTime >= startTime && nowTime <= endTime) {
return data;
}
});
this.tableData = NewData;
}
console.log(this.formInline);
} else {
console.log("error submit!!");
return false;
}
});
},
handleSizeChange(val) {
this.pageSize = val;
this.currentPage = 1;
this.paging();
console.log(`每页 ${val} 条`);
},
handleCurrentChange(val) {
this.currentPage = val;
this.paging();
console.log(`当前页: ${val}`);
},
//跳转到jflow页面
sikpMyflow(work) {
let params = {};
params.WorkID = work.WorkID;
params.FK_Flow = work.FK_Flow;
params.FK_Node = work.FK_Node;
params.FID = work.FID;
params.FromPage = "Complete";
openMyView(params, this);
},
DialogOpen: function (rowData) {
this.$store.commit("setData", rowData);
// 如果是轨迹图 先请求接口
this.title = "查看轨迹图";
this.dialogFormVisible = true;
this.judgeOperation = "track";
},
//关闭
handleClose() {
this.dialogFormVisible = false;
this.judgeOperation = "";
},
},
//监听
computed: {},
//监听后执行动作
watch: {},
};
</script>
<style lang="less" scoped>
.mb-10 {
margin-bottom: 10px;
}
</style>