|
<!doctype html>
|
<html>
|
<head>
|
<meta charset="utf-8"><meta http-equiv="Expires" content="0"><meta http-equiv="Pragma" content="no-cache"><meta http-equiv="Cache-control" content="no-cache"><meta http-equiv="Cache" content="no-cache">
|
<title>客户清洗平台</title>
|
|
<script type="text/javascript">
|
function loadJsCss(callback) {
|
var jscss_urls = [
|
{id: "css_m1", type: "css", url: "root/css/tree.css"},
|
];
|
window.top.initJsCss(document, jscss_urls, callback);
|
};
|
|
function initVue() {
|
new TreeVue({
|
el: "#vbody",
|
data: {
|
dataname: "md_product_category",
|
title: "客户清洗平台",
|
dataRequest: [],
|
|
tree_title: "清洗进度",
|
treeTxtFormatter: "{name}：{cnt}",
|
isTreeReadonly: true,
|
isTreeRefresh: true,
|
|
initTreeData_d: [
|
{id: "C0", name: "流向总数", cnt: "1200",
|
children: [
|
{id: "C01", name: "正确处理", cnt: "1200", dataname: "md_org_data", filtertxt: "1<>1",
|
children: [
|
{id: "C011", name: "去重客户", cnt: "1200", dataname: "md_org_data", filtertxt: "1<>1",
|
children: [
|
{id: "C0111", name: "自动匹配", cnt: "1180", dataname: "md_org_data", filtertxt: "1<>1"},
|
{id: "C0112", name: "人工待处理", cnt: "12", dataname: "md_org_data", filtertxt: "1<>1"},
|
{id: "C0113", name: "人工已处理", cnt: "0", dataname: "md_org_data", filtertxt: "1<>1"},
|
{id: "C0114", name: "建议新增", cnt: "8", dataname: "md_org_data", filtertxt: "1<>1"},
|
]},
|
]},
|
{id: "C1", name: "处理错误", cnt: "0", dataname: "md_org_data", filtertxt: "1<>1"},
|
]
|
},
|
],
|
|
isRefresh_table1: true,
|
tableFields_table1: [
|
{isshow: "T", field: "field1", name: "原始客户名称", align: "left",width: "100", isminwidth: true},
|
{isshow: "T", field: "field2", name: "最高分", align: "center", width: "80"},
|
{isshow: "T", field: "field3", name: "专有名词", align: "left", width: "100", isminwidth: true},
|
{isshow: "T", field: "field4", name: "渠道", align: "left", width: "120"},
|
{isshow: "T", field: "field5", name: "省份", align: "center", width: "100"},
|
{isshow: "T", field: "field6", name: "城市", align: "center", width: "100"},
|
{isshow: "T", field: "field7", name: "区县", align: "center", width: "100"},
|
{isshow: "T", field: "field8", name: "状态", align: "center", width: "100"},
|
],
|
pagesize_table1: 10,
|
pagenum_table1: 1,
|
total_table1: 0,
|
tableHeight_table1: 100,
|
tablefieldClick_table1: {},
|
tableData_table1: [
|
{id: "001", field1: "宏佳顺医疗器械有限公司", field2: "89", field3: "宏佳顺,医疗器械", field4: "有限公司", field5: "江西省", field6: "", field7: "", field8: "待清洗" },
|
{id: "002", field1: "誉美医疗器械贸易有限公司", field2: "89", field3: "誉美,医疗器械,贸易", field4: "有限公司", field5: "湖南省", field6: "长沙市", field7: "", field8: "待清洗" },
|
{id: "003", field1: "德汇同创医疗器械有限公司", field2: "89", field3: "德汇同创", field4: "有限公司", field5: "广州省", field6: "", field7: "", field8: "待清洗" },
|
{id: "004", field1: "通泰慷医疗科技有限公司", field2: "89", field3: "通泰慷,医疗科技", field4: "有限公司", field5: "上海市", field6: "", field7: "", field8: "待清洗" },
|
],
|
selectedrow_table1: {},
|
|
isRefresh_table2: true,
|
filterAttr: {
|
columnnumber: 4,
|
labelwidth: "80px",
|
labelposition: "right",//"left",//"right",
|
size: "medium",
|
border: "0px solid #c6c6c600"
|
},
|
filterFields_table2: [
|
{isshow: "T", field: "field1", name: "客户名称", filterfield: "", filteroperator: "like"},
|
],
|
filterObj_table2: {},
|
tableFields_table2: [
|
{isshow: "T", field: "field1", name: "客户名称", align: "center",width: "150", isminwidth: true},
|
{isshow: "T", field: "field2", name: "省份", align: "center", width: "100"},
|
{isshow: "T", field: "field3", name: "城市", align: "center", width: "100"},
|
{isshow: "T", field: "field4", name: "区县", align: "center", width: "100"},
|
{isshow: "T", field: "field5", name: "渠道", align: "center", width: "120"},
|
{isshow: "T", field: "field6", name: "区县", align: "center", width: "100"},
|
{isshow: "T", field: "field7",name: "操作", type:"buttons", buttons: [{name:"推荐",code:"tj"},{name: "不推荐", code:"nbj"}]},
|
],
|
pagesize_table2: 10,
|
pagenum_table2: 1,
|
total_table2: 0,
|
tableHeight_table2: 100,
|
tablefieldClick_table2: {},
|
tableData_table2: [],
|
selectedrow_table2: {},
|
|
isRefresh_table3: true,
|
tableAttr_table3: {
|
isborder: false
|
},
|
tableFields_table3: [
|
{isshow: "T", field: "field1", name: "分值", align: "center",width: "100", headercolor: "#0000"},
|
{isshow: "T", field: "field2", name: "客户名称", align: "center", width: "150", headercolor: "#0000"},
|
{isshow: "T", field: "field3", name: "专有名词", width: "100", isminwidth: true, headercolor: "#0000"},
|
{isshow: "T", field: "field5", name: "省份", align: "center", width: "100", headercolor: "#0000"},
|
{isshow: "T", field: "field6", name: "城市", align: "center", width: "100", headercolor: "#0000"},
|
{isshow: "T", field: "field7", name: "区县", align: "center", width: "100", headercolor: "#0000"},
|
{isshow: "T", field: "field8", name: "状态", align: "center", width: "100", headercolor: "#0000"},
|
{isshow: "T", field: "field9",name: "操作", align: "center", width: "100", headercolor: "#0000", type:"buttons", buttons: [{name:"推荐",code:"tj"},{name: "不推荐", code:"nbj"}]},
|
],
|
tableHeight_table3: 100,
|
tableData_table3: [
|
{id: "1"},
|
{id: "2"},
|
{id: "3"},
|
{id: "4"},
|
],
|
tablefieldClick_table3: {},
|
selectedrow_table3: {},
|
|
},
|
created() {
|
let clientHeight = document.documentElement.clientHeight;
|
this.treeHeight = clientHeight - 120;
|
// var currentcapacity = window.top.vue.userinfo.currentcapacity;
|
var dataRequest_ = {
|
name: "md_approval",
|
paramsobj: {
|
filter: "rolecode like '%|" + window.top.vue.userinfo.currentcapacity.code + "|%'"
|
// filter: "rolecode like '%|Capacity-QA|%'"
|
},
|
url: "root/workflow/getOutline",
|
isnotoption: true,
|
}
|
// this.dataRequest.push(dataRequest_);
|
this.tableHeight_table1 = this.treeHeight / 3 + 10;
|
this.tableHeight_table2 = this.treeHeight / 3 + 10;
|
|
this.tableHeight_table3 = this.treeHeight - this.tableHeight_table1 - this.tableHeight_table2 - 10;
|
|
this.fieldClick();
|
},
|
|
mounted() {
|
var me = this;
|
//预加载数据
|
if (this.dataRequest && this.dataRequest.length) {
|
var result = {};
|
this.loadRequestData(this.dataRequest, result, function(data) {
|
console.log("预加载数据：", data);
|
me.dataRequestObj = data;
|
// let md_approval_ = ArrayToTree(clone(data.md_approval.data), "name", "parent_id");
|
// me.initTreeData_d = md_approval_;
|
|
var medataRequest_ = []
|
me.initTreeData_d.map(nodes=>{
|
if (nodes.children) {
|
var isBadge_ = false;
|
nodes.children.map(node=>{
|
if (node.cnt) {
|
isBadge_ = true;
|
node.badgeval = node.cnt
|
}
|
})
|
nodes.isBadge = isBadge_;
|
}
|
})
|
me.initData();
|
// 以服务的方式调用的 Loading 需要异步关闭
|
me.$nextTick(() => {
|
hideLoading();
|
});
|
|
});
|
}
|
else {
|
this.initData(); // 以服务的方式调用的 Loading 需要异步关闭
|
this.$nextTick(() => {
|
hideLoading();
|
});
|
}
|
},
|
|
methods:{
|
initData() {
|
var me = this;
|
me.treeData = me.initTreeData_d;
|
// this.onQuery(function(result, callback) {//查询后的回调，用于获取字段的
|
// me.treeData = me.initTreeData_d;
|
// if (callback) {
|
// callback();
|
// }
|
|
// });
|
|
// me.treeRefresh()
|
},
|
onTableDataAfter() {},
|
treeRefresh() {
|
var me = this;
|
var param_ = {
|
filter: "rolecode like '%|" + window.top.vue.userinfo.currentcapacity.code + "|%'"
|
}
|
Server.call("root/workflow/getOutline", param_, function(result) {
|
let md_approval_ = ArrayToTree(clone(result.data), "name", "parent_id");
|
var medataRequest_ = [];
|
md_approval_.map(nodes=>{
|
if (nodes.children) {
|
var isBadge_ = false;
|
nodes.children.map(node=>{
|
if (node.cnt) {
|
isBadge_ = true;
|
node.badgeval = node.cnt
|
}
|
})
|
nodes.isBadge = isBadge_;
|
}
|
})
|
me.isTreeRefresh = false;
|
me.treeData = md_approval_;
|
me.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
|
me.defaultexpandedkeys = [me.selectednode.id];
|
me.currentnodekey = me.selectednode.id;
|
me.isTreeRefresh = true;
|
});
|
|
me.getData1ByNode();
|
})
|
},
|
|
onNodeClick(obj) {
|
var data = obj.data, node = obj.node, el = obj.el;
|
var val = data.name;
|
if (data.children && data.children.length) {
|
val = "";
|
data.children.map(r=>{
|
if (val == "") {
|
val = r.name;
|
}
|
else {
|
val += "','" + r.name;
|
}
|
})
|
}
|
|
// this.filterObjBydefault.category_name = val
|
this.selectednode = data;
|
this.pagenum_table1 = 1;
|
if (this.selectednode.dataname) {
|
// this.getTable1Meta();
|
// this.getData1ByNode();
|
}
|
},
|
getTable1Meta() {},
|
getData1ByNode() {},
|
|
getData1(page) {
|
this.pagesize_table1 = page.pagesize;
|
this.pagenum_table1 = page.pagenum;
|
|
this.getData1ByNode();
|
},
|
|
table1RowClick(obj) {
|
this.selectedrow_table1 = obj.row;
|
this.getData2ByRowTable1();
|
},
|
|
getData2(page) {
|
this.pagesize_table2 = page.pagesize;
|
this.pagenum_table2 = page.pagenum;
|
},
|
table2RowClick(obj) {
|
this.selectedrow_table2 = obj.row;
|
},
|
getData2ByRowTable1() {},
|
|
onQueryTable2() {},
|
onInitFilterTable2() {
|
//清空
|
this.filterObj = {};
|
this.selectedrow = {};
|
this.onQueryTable2();
|
},
|
getData3(page) {
|
|
},
|
table3RowClick(obj) {
|
this.selectedrow_table3 = obj.row;
|
},
|
|
fieldClick() {
|
this.tablefieldClick_table3 = {
|
field9: {
|
buttons: {
|
onclick: function(row, code) {
|
Root.message({
|
type: 'success',
|
message: code
|
});
|
}
|
}
|
}
|
}
|
this.tablefieldClick_table2 = {
|
field7: {
|
buttons: {
|
onclick: function(row, code) {
|
Root.message({
|
type: 'success',
|
message: code
|
});
|
}
|
}
|
}
|
}
|
},
|
|
//清洗
|
doWash() {
|
var me = this;
|
var config = {
|
totab: false, //true: 以Tab导航的方式打开
|
width: "900px",
|
height: "900px",
|
icon: "icon-product",
|
text: "清洗进度",
|
id: "test_page",//totab: true时需设置，用于判断是否已打开此页面
|
//url: "module/system/page/coming.html",
|
url: "module/flow/page/popup/washProcess.html",
|
data: {},
|
delta: {},
|
sceneCode: "edit", //"add"//"browse",
|
callback: function(obj, callback) {
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
me.doPopupByPublic(config);
|
}
|
|
|
|
}
|
});
|
};
|
|
loadJsCss(function () {
|
initVue();
|
});
|
</script>
|
<style>
|
/* 在vue.js中 v-cloak 这个指令是防止页面加载时出现 vuejs 的变量名而设计的 */
|
[v-cloak] {
|
display: none !important;
|
}
|
.el-tabs__nav-scroll {
|
overflow: hidden;
|
position: relative;
|
padding-left: 20px;
|
}
|
|
.nodeLabel {
|
max-width: 200px !important;
|
}
|
.h_table {
|
margin-top: 0px !important;
|
position: relative;
|
}
|
.el-table--small .el-table__cell {
|
padding: 5px 0!important;
|
}
|
</style>
|
|
</head>
|
|
<body style="margin: 0px;">
|
<div v-cloak id="vbody">
|
<div id="page_root">
|
<div class="topbar">
|
<span>{{title}}</span>
|
|
<!-- <div style="float: right; margin-right: 18px;">
|
<el-button-group style="margin-left: 3px;">
|
<el-button type="primary" @click="doWash">清 洗</el-button>
|
</el-button-group>
|
</div> -->
|
</div>
|
|
<div class="h_dialog__body">
|
<div style="position: absolute;left: 10px; top:45px;width: 320px; bottom: 10px;border: 1px solid #ccc;">
|
<div style="height: 32px;line-height: 32px;border-bottom: 1px solid #ccc ;">
|
<span style="font-size: 14px;margin-left: 20px;">{{tree_title}}</span>
|
</div>
|
<div :style="{padding: '10px 0', height: treeHeight + 'px', overflow: 'auto'}">
|
<h-tree v-if="isTreeRefresh"
|
:tree-data="treeData"
|
:tree-txt-formatter="treeTxtFormatter"
|
:is-readonly="isTreeReadonly"
|
:default-expanded-keys="defaultexpandedkeys"
|
:currentnodekey="currentnodekey"
|
:default-expand-all="true"
|
|
@node-click="onNodeClick"
|
>
|
</h-tree>
|
|
</div>
|
</div>
|
<div style="position: absolute;left: 340px; top:45px; right: 10px; bottom: 10px;border: 1px solid #ccc;">
|
<div>
|
<div style="height: 32px;">
|
<div class="table_title" style="float: left;">
|
<span>人工待清洗数据</span>
|
</div>
|
|
<div style="float: right; margin-right: 18px;">
|
<el-button-group style="margin-left: 3px;">
|
<el-button @click="">来十条</el-button>
|
</el-button-group>
|
</div>
|
</div>
|
<h-table
|
v-if="isRefresh_table1 && tableFields_table1.length"
|
ref="table_table1"
|
:table-fields="tableFields_table1"
|
:table-data="tableData_table1"
|
:pagesize="pagesize_table1"
|
:pagenum="pagenum_table1"
|
:total="total_table1"
|
:table-height="tableHeight_table1 - 32"
|
:is-highlight-row="true"
|
:table-field-click="tablefieldClick_table1"
|
:is-pagination="false"
|
|
v-on:get-data="getData1"
|
v-on:row-click="table1RowClick"
|
>
|
</h-table>
|
<div :style="{height: (tableHeight_table3) + 'px'}">
|
<div style="height: 32px;line-height: 32px;margin-top: 10px;">
|
|
<span style="font-weight: bold;margin-left: 20px;"><i class="el-icon-tickets"></i> 原始客户名称：</span>
|
<span>{{selectedrow_table1.field1}}</span>
|
|
<div style="float: right; margin-right: 18px;">
|
<el-button-group style="margin-left: 3px;">
|
<el-button @click="">建议新增</el-button>
|
<el-button @click="">待 定</el-button>
|
<el-button @click="">清空推荐</el-button>
|
</el-button-group>
|
</div>
|
</div>
|
<h-table
|
v-if="isRefresh_table3 && tableFields_table3.length"
|
ref="table_table3"
|
:table-attr="tableAttr_table3"
|
:table-fields="tableFields_table3"
|
:table-data="tableData_table3"
|
:table-height="tableHeight_table3 - 42"
|
:is-highlight-row="true"
|
:table-field-click="tablefieldClick_table3"
|
:is-pagination="false"
|
:is-show-index="true"
|
:is-within-edit-table-data="true"
|
|
v-on:get-data="getData3"
|
v-on:row-click="table3RowClick"
|
>
|
</h-table>
|
</div>
|
|
<div :style="{height: (tableHeight_table2) + 'px'}">
|
<!-- <div style="height: 32px; margin-top: 20px;">
|
<div class="table_title" style="float: left;">
|
<span> <span v-if="selectedrow && selectedrow.field2">【{{selectedrow.field2}}】</span>对应审批人</span>
|
</div>
|
</div> -->
|
<div class="topbar-line">
|
<div class="query-bar">
|
<h-form-filter v-if="filterFields_table2" ref="form1"
|
:form-attr="filterAttr"
|
:table-fields="filterFields_table2"
|
:form-data="filterObj_table2"
|
:isdraggableorder="false"
|
|
v-on:on-query="onQueryTable2"
|
v-on:on-init-query="onInitFilterTable2"
|
>
|
</h-form-filter>
|
</div>
|
</div>
|
<h-table
|
v-if="isRefresh_table1 && tableFields_table2.length"
|
ref="table_table2"
|
:table-fields="tableFields_table2"
|
:table-data="tableData_table2"
|
:table-height="tableHeight_table2 - 40"
|
:is-highlight-row="true"
|
:table-field-click="tablefieldClick_table2"
|
:is-pagination="true"
|
:is-within-edit-table-data="true"
|
|
v-on:get-data="getData2"
|
v-on:row-click="table2RowClick"
|
>
|
</h-table>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
</div>
|
</div>
|
|
<div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 50vh;">
|
<div class="spinner">
|
<div class="cube1"></div>
|
<div class="cube2"></div>
|
</div>
|
</div>
|
|
<script>document.write('<script src="//' + (location.host || 'localhost').split(':')[0] + ':35929/livereload.js?snipver=1"></' + 'script>')</script><script>document.addEventListener('LiveReloadDisconnect', function() { setTimeout(function() { window.location.reload(); }, 500); })</script></body>
|
</html>
|
