<!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">
|
var pageVue = null;
|
function loadJsCss(callback) {
|
var jscss_urls = [];
|
window.top.initJsCss(document, jscss_urls, callback);
|
};
|
|
function initVue() {
|
new BasicsVue({
|
el: "#vbody",
|
data: {
|
title: "销售首页",
|
tableData: [],
|
dataRequest: [
|
{
|
name: "channel_qtysum",// 我的渠道数量汇总模块
|
dataname: "",
|
isnotoption: true, //true:不是选项
|
url: "root/account/customerCount",
|
paramsobj: {},
|
},
|
|
{
|
name: "implant_alter_date",//植入上报
|
url: "root/data/getEntitySet",
|
paramsobj: {dataname: "md_calendar", filter: "year=" + new Date().getFullYear() + " and is_implant_open='T'"},
|
isnotoption: true, //true:不是选项
|
},
|
{
|
name: "implant_alter_date_day",//植入上报
|
url: "root/data/getEntitySet",
|
paramsobj: {dataname: "md_calendar", filter: "doc_date='" + dateFormat(new Date(), "yyyy-MM-dd") + "'"},
|
isnotoption: true, //true:不是选项
|
},
|
],
|
|
// 首页模板列表
|
modulelist: [
|
{isshow: "T", code: "M001", title: "我的通知", layout: "left", width: "100%", height: "30%", order_no: 1},
|
// {isshow: "T", code: "M002", title: "我的申请", layout: "left", width: "50%", height: "30%", order_no: 2},
|
{isshow: "T", code: "M003", title: "我的指标", layout: "left", width: "100%", height: "306px", order_no: 3},
|
{isshow: "T", code: "M004", title: "我的客户", layout: "left", width: "100%", height: "148px", order_no: 4},
|
{isshow: "T", code: "M005", title: "植入日历", layout: "right", width: "100%", height: "50%", order_no: 5},
|
{isshow: "T", code: "M006", title: "快捷入口", layout: "right", width: "100%", height: "50%", order_no: 6},
|
],
|
moduleLayout: {},
|
|
dataobj: {
|
M001: [],
|
M002: [],
|
M003: {
|
shangcai: {
|
amt: {
|
year: {},
|
quarter: {},
|
month: {},
|
|
// year: {year:"2023", quarter: "3", month:"7", val_target: 600, val_sale: 300, rate_completion: 50},
|
// quarter: {year:"2023", quarter: "3", month:"7", val_target: 150, val_sale: 100, rate_completion: 66},
|
// month: {year:"2023", quarter: "3", month:"7", val_target: 50, val_sale: 40, rate_completion: 80},
|
},
|
qty: {
|
year: {},
|
quarter: {},
|
month: {},
|
// year: {year:"2023", quarter: "3", month:"7", val_target: 600, val_sale: 300, rate_completion: 50},
|
// quarter: {year:"2023", quarter: "3", month:"7", val_target: 150, val_sale: 100, rate_completion: 66},
|
// month: {year:"2023", quarter: "3", month:"7", val_target: 50, val_sale: 40, rate_completion: 80},
|
}
|
},
|
zhiru: {
|
amt: {
|
year: {},
|
quarter: {},
|
month: {},
|
// year: {year:"2023", quarter: "3", month:"7", val_target: 600, val_sale: 300, rate_completion: 50},
|
// quarter: {year:"2023", quarter: "3", month:"7", val_target: 150, val_sale: 100, rate_completion: 66},
|
// month: {year:"2023", quarter: "3", month:"7", val_target: 50, val_sale: 40, rate_completion: 80},
|
},
|
qty: {
|
year: {},
|
quarter: {},
|
month: {},
|
// year: {year:"2023", quarter: "3", month:"7", val_target: 600, val_sale: 300, rate_completion: 50},
|
// quarter: {year:"2023", quarter: "3", month:"7", val_target: 150, val_sale: 100, rate_completion: 66},
|
// month: {year:"2023", quarter: "3", month:"7", val_target: 50, val_sale: 40, rate_completion: 80},
|
}
|
|
}
|
},
|
M004: {
|
Customer: [
|
{type:"Customer", actor: "直采客商", cnt: 6},
|
{type:"Customer", actor: "平台商", cnt: 1},
|
{type:"Customer", actor: "非直采客商", cnt: 5},
|
{type:"Customer", actor: "配送商", cnt: 3},
|
],
|
Hospital: [
|
{type:"hospital", actor: "三级医院", cnt: 62},
|
{type:"hospital", actor: "其它医院", cnt: 12},
|
]
|
},
|
|
},
|
|
implantDates: [],
|
implantAlterCancelDates: [],
|
calendar_day: {}, // 当天的日历设置，含是否允许植入，是否允许订单
|
|
p_height: 0,
|
|
//植入上报
|
openDate: "",
|
currentDate: "",
|
cancelDate: "",
|
isConnected: false, // 是否关联经销商
|
salesreport_button_open: true,
|
|
target_type: "amt",
|
year: "",
|
month: "",
|
season: "",
|
|
isSale: false, // 销售角色
|
isSalesLeader: false, // 大区经理角色
|
|
},
|
created() {
|
this.isSale = window.top.vue.isSale
|
|
var notifyMessage = {
|
name: "sys_notify_message",//通知模块
|
dataname: "sys_notify_message",
|
isnotoption: true, //true:不是选项
|
url: "root/data/getEntitySet",
|
paramsobj: {dataname: "sys_notify_message", orderby: "create_time desc", filter: "sys_notify_message_user.user_id='" + window.top.vue.userinfo.id + "'"},
|
}
|
this.dataRequest.push(notifyMessage);
|
|
// 获取年、季、月
|
var newDate_ = new Date();
|
var year_ = newDate_.getFullYear();
|
var month_ = newDate_.getMonth() + 1;
|
var season_ = "";
|
// 根据月份判断当前所属的季度
|
if (month_ >= 1 && month_ <= 3) {
|
season_ = 1;
|
} else if (month_ >= 4 && month_ <= 6) {
|
season_ = 2;
|
} else if (month_ >= 7 && month_ <= 9) {
|
season_ = 3;
|
} else if (month_ >= 10 && month_ <= 12) {
|
season_ = 4;
|
}
|
|
this.year = year_;
|
this.month = month_;
|
this.season = season_;
|
|
var business_data_summary_sc_ = {
|
name: "business_data_summary_sc",// 商采指标
|
dataname: "business_data_summary",
|
isnotoption: true, //true:不是选项
|
url: "root/data/getSummary",
|
paramsobj: {dataname: "business_data_summary",
|
sum: ["year_qty_target", "year_qty_achieve", "season_qty_target", "season_qty_achieve", "month_qty_target", "month_qty_achieve",
|
"year_amt_target", "year_amt_achieve", "season_amt_target", "season_amt_achieve", "month_amt_target", "month_amt_achieve"
|
],
|
filter: "year='"+year_+"' and month='"+month_+"' and season='"+season_+"' and title_code='dealer'"},
|
}
|
var business_data_summary_zr_ = {
|
name: "business_data_summary_zr",// 植入指标
|
dataname: "business_data_summary",
|
isnotoption: true, //true:不是选项
|
url: "root/data/getSummary",
|
paramsobj: {dataname: "business_data_summary",
|
sum: ["year_qty_target", "year_qty_achieve", "season_qty_target", "season_qty_achieve", "month_qty_target", "month_qty_achieve",
|
"year_amt_target", "year_amt_achieve", "season_amt_target", "season_amt_achieve", "month_amt_target", "month_amt_achieve"
|
],
|
filter: "year='"+year_+"' and month='"+month_+"' and season='"+season_+"' and title_code='implant'"},
|
}
|
this.dataRequest.push(business_data_summary_sc_);
|
this.dataRequest.push(business_data_summary_zr_);
|
|
if (window.top.vue.userinfo && window.top.vue.userinfo.currentactor && window.top.vue.userinfo.currentactor.code == "Capacity-Connected") { // 如果是关联经销
|
// org_id_ = window.top.vue.userinfo.org.relationid
|
this.isConnected = true;
|
}
|
|
// this.p_height = document.documentElement.clientHeight - 61;
|
this.p_height = document.documentElement.clientHeight - 10;
|
},
|
|
mounted() {
|
var me = this;
|
//预加载数据
|
if (this.dataRequest.length) {
|
var result = {};
|
this.loadRequestData(this.dataRequest, result, function(data) {
|
me.dataRequestObj = data;
|
//预加载数据后给哪些字段设置options或formatterjson
|
|
if(me.dataRequestObj.modulelist) {
|
me.modulelist = me.dataRequestObj.modulelist;
|
me.onModuleLayout();
|
}
|
else {
|
var dataobj_ = clone(me.dataobj)
|
if (me.dataRequestObj.sys_notify_message && me.dataRequestObj.sys_notify_message.data && me.dataRequestObj.sys_notify_message.data.entityset) {
|
dataobj_.M001 = clone(me.dataRequestObj.sys_notify_message.data.entityset)
|
var file_ = {
|
id: "111", type_code: "sale", title: "《客户DMS操作手册-简版-1.1》", create_time: "2024-03-20 15:48:04",
|
files: [
|
{filename: "客户DMS操作手册-简版-1.1.pdf", fileid: "11111", dataname: "sys_notify_message"},
|
]}
|
dataobj_.M001.unshift(file_);
|
|
}
|
if (me.dataRequestObj.sys_alert && me.dataRequestObj.sys_alert.data && me.dataRequestObj.sys_alert.data.entityset) {
|
dataobj_.M002 = clone(me.dataRequestObj.sys_alert.data.entityset)
|
}
|
// 商采
|
if (me.dataRequestObj.business_data_summary_sc && me.dataRequestObj.business_data_summary_sc.data) {
|
var summary_obj_dealer = clone(me.dataRequestObj.business_data_summary_sc.data)
|
// 商采金额指标
|
var M003_sc_amt = {
|
year: {year: me.year, quarter: me.season, month: me.month,
|
val_target: window.top.toMoney(summary_obj_dealer.year_amt_target_sum/10000), val_sale: window.top.toMoney(summary_obj_dealer.year_amt_achieve_sum/10000),
|
rate_completion: summary_obj_dealer.year_amt_target_sum ? window.top.toPercent(summary_obj_dealer.year_amt_achieve_sum / summary_obj_dealer.year_amt_target_sum * 100) : ""},
|
quarter: {year: me.year, quarter: me.season, month: me.month,
|
// amt_target: 150, val_sale: 100, rate_completion: 66},
|
val_target: window.top.toMoney(summary_obj_dealer.season_amt_target_sum/10000), val_sale: window.top.toMoney(summary_obj_dealer.season_amt_achieve_sum/10000),
|
rate_completion: summary_obj_dealer.season_amt_target_sum ? window.top.toPercent((summary_obj_dealer.season_amt_achieve_sum / summary_obj_dealer.season_amt_target_sum) * 100) : ""},
|
month: {year: me.year, quarter: me.season, month: me.month,
|
// amt_target: 50, val_sale: 40, rate_completion: 80},
|
val_target: window.top.toMoney(summary_obj_dealer.month_amt_target_sum/10000), val_sale: window.top.toMoney(summary_obj_dealer.month_amt_achieve_sum/10000),
|
rate_completion: summary_obj_dealer.month_amt_target_sum ? window.top.toPercent((summary_obj_dealer.month_amt_achieve_sum / summary_obj_dealer.month_amt_target_sum) * 100) : ""},
|
}
|
// 商采数量指标
|
var M003_sc_qty = {
|
year: {year: me.year, quarter: me.season, month: me.month,
|
val_target: summary_obj_dealer.year_qty_target_sum, val_sale: summary_obj_dealer.year_qty_achieve_sum,
|
rate_completion: summary_obj_dealer.year_qty_target_sum ? window.top.toPercent(summary_obj_dealer.year_qty_achieve_sum / summary_obj_dealer.year_qty_target_sum * 100) : ""},
|
quarter: {year: me.year, quarter: me.season, month: me.month,
|
val_target: summary_obj_dealer.season_qty_target_sum, val_sale: summary_obj_dealer.season_qty_achieve_sum,
|
rate_completion: summary_obj_dealer.season_qty_target_sum ? window.top.toPercent((summary_obj_dealer.season_qty_achieve_sum / summary_obj_dealer.season_qty_target_sum) * 100) : ""},
|
month: {year: me.year, quarter: me.season, month: me.month,
|
val_target: summary_obj_dealer.month_qty_target_sum, val_sale: summary_obj_dealer.month_qty_achieve_sum,
|
rate_completion: summary_obj_dealer.month_qty_target_sum ? window.top.toPercent((summary_obj_dealer.month_qty_achieve_sum / summary_obj_dealer.month_qty_target_sum) * 100) : ""},
|
}
|
dataobj_.M003.shangcai.amt = clone(M003_sc_amt);
|
dataobj_.M003.shangcai.qty = clone(M003_sc_qty);
|
}
|
// 植入
|
if (me.dataRequestObj.business_data_summary_zr && me.dataRequestObj.business_data_summary_zr.data) {
|
var summary_obj_implant = clone(me.dataRequestObj.business_data_summary_zr.data)
|
// 植入金额指标
|
var M003_zr_amt = {
|
year: {year: me.year, quarter: me.season, month: me.month,
|
val_target: window.top.toMoney(summary_obj_implant.year_amt_target_sum/10000), val_sale: window.top.toMoney(summary_obj_implant.year_amt_achieve_sum/10000),
|
rate_completion: summary_obj_implant.year_amt_target_sum ? window.top.toPercent(summary_obj_implant.year_amt_achieve_sum / summary_obj_implant.year_amt_target_sum * 100) : ""},
|
quarter: {year: me.year, quarter: me.season, month: me.month,
|
// amt_target: 150, val_sale: 100, rate_completion: 66},
|
val_target: window.top.toMoney(summary_obj_implant.season_amt_target_sum/10000), val_sale: window.top.toMoney(summary_obj_implant.season_amt_achieve_sum/10000),
|
rate_completion: summary_obj_implant.season_amt_target_sum ? window.top.toPercent((summary_obj_implant.season_amt_achieve_sum / summary_obj_implant.season_amt_target_sum) * 100) : ""},
|
month: {year: me.year, quarter: me.season, month: me.month,
|
// amt_target: 50, val_sale: 40, rate_completion: 80},
|
val_target: window.top.toMoney(summary_obj_implant.month_amt_target_sum/10000), val_sale: window.top.toMoney(summary_obj_implant.month_amt_achieve_sum/10000),
|
rate_completion: summary_obj_implant.month_amt_target_sum ? window.top.toPercent((summary_obj_implant.month_amt_achieve_sum / summary_obj_implant.month_amt_target_sum) * 100) : ""},
|
}
|
|
// 植入数量指标
|
var M003_zr_qty = {
|
year: {year: me.year, quarter: me.season, month: me.month,
|
val_target: summary_obj_implant.year_qty_target_sum, val_sale: summary_obj_implant.year_qty_achieve_sum,
|
rate_completion: summary_obj_implant.year_qty_target_sum ? window.top.toPercent(summary_obj_implant.year_qty_achieve_sum / summary_obj_implant.year_qty_target_sum * 100) : ""},
|
quarter: {year: me.year, quarter: me.season, month: me.month,
|
val_target: summary_obj_implant.season_qty_target_sum, val_sale: summary_obj_implant.season_qty_achieve_sum,
|
rate_completion: summary_obj_implant.season_qty_target_sum ? window.top.toPercent((summary_obj_implant.season_qty_achieve_sum / summary_obj_implant.season_qty_target_sum) * 100) : ""},
|
month: {year: me.year, quarter: me.season, month: me.month,
|
val_target: summary_obj_implant.month_qty_target_sum, val_sale: summary_obj_implant.month_qty_achieve_sum,
|
rate_completion: summary_obj_implant.month_qty_target_sum ? window.top.toPercent((summary_obj_implant.month_qty_achieve_sum / summary_obj_implant.month_qty_target_sum) * 100) : ""},
|
}
|
|
dataobj_.M003.zhiru.amt = clone(M003_zr_amt);
|
dataobj_.M003.zhiru.qty = clone(M003_zr_qty);
|
}
|
if (me.dataRequestObj.channel_qtysum) {
|
var channel_qtysum_obj = {}
|
if (me.dataRequestObj.channel_qtysum) {
|
channel_qtysum_obj = clone(me.dataRequestObj.channel_qtysum)
|
}
|
|
/*
|
M004: {
|
Customer: [
|
{type:"Customer", actor: "直采客商", cnt: 6},
|
{type:"Customer", actor: "平台商", cnt: 1},
|
{type:"Customer", actor: "非直采客商", cnt: 5},
|
{type:"Customer", actor: "配送商", cnt: 3},
|
],
|
Hospital: [
|
{type:"hospital", actor: "三级医院", cnt: 62},
|
{type:"hospital", actor: "其它医院", cnt: 12},
|
]
|
},
|
*/
|
var M004_ = {
|
Customer: [
|
{type:"first", actor: "直采客商", cnt: channel_qtysum_obj.first ? channel_qtysum_obj.first : 0},
|
{type:"platform", actor: "平台商", cnt: channel_qtysum_obj.platform ? channel_qtysum_obj.platform : 0},
|
{type:"second", actor: "非直采客商", cnt: channel_qtysum_obj.second ? channel_qtysum_obj.second : 0},
|
{type:"distribute", actor: "配送商", cnt: channel_qtysum_obj.distribute ? channel_qtysum_obj.distribute : 0},
|
],
|
Hospital: [
|
{type:"hospital", actor: "辖区医院", cnt: channel_qtysum_obj.hospital ? channel_qtysum_obj.hospital : 0},
|
// {type:"hospital", actor: "其它医院", cnt: 12},
|
]
|
}
|
|
dataobj_.M004 = clone(M004_)
|
}
|
me.onModuleLayout();
|
me.dataobj = clone(dataobj_);
|
}
|
|
me.implantDates = []
|
me.implantAlterCancelDates = []
|
|
if (me.dataRequestObj.implant_alter_date) {
|
var implantDates_ = []
|
me.dataRequestObj.implant_alter_date.data.entityset.map(r=>{
|
var date_ = dateFormat(new Date(r.doc_date), "yyyy-MM-dd")
|
implantDates_.push(date_)
|
})
|
me.implantDates = implantDates_
|
}
|
if (me.dataRequestObj.implant_alter_date_day) {
|
var calendar_day_ = {}
|
calendar_day_ = clone(me.dataRequestObj.implant_alter_date_day.data.entityset[0]);
|
me.calendar_day = calendar_day_
|
}
|
|
if(me.dataRequestObj.status && me.dataRequestObj.status.data) {
|
if(me.dataRequestObj.status.data.is_implant_open != "") {
|
me.openDate = me.dataRequestObj.status.data.is_implant_open;
|
}
|
|
if(me.dataRequestObj.status.data.currentdate != "") {
|
me.currentDate = me.dataRequestObj.status.data.currentdate;
|
}
|
|
if(me.dataRequestObj.status.data.is_implant_cancel_open != "") {
|
me.cancelDate = me.dataRequestObj.status.data.is_implant_cancel_open;
|
}
|
}
|
if(me.dataRequestObj.status && me.dataRequestObj.status.data && me.dataRequestObj.status.data.is_salesreport_open) {
|
if(me.dataRequestObj.status.data.is_salesreport_open =="F") {
|
me.salesreport_button_open = false;
|
}
|
}
|
|
me.initData();
|
});
|
}
|
else {
|
me.onModuleLayout();
|
this.initData();
|
}
|
|
this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
|
hideLoading();
|
});
|
},
|
|
methods:{
|
// 模板布局分组
|
onModuleLayout() {
|
var moduleLayout_ = {};
|
this.modulelist.map(m=>{
|
if (!moduleLayout_[m.layout]) {
|
moduleLayout_[m.layout] = [];
|
}
|
moduleLayout_[m.layout].push(m);
|
})
|
this.moduleLayout = clone(moduleLayout_);
|
},
|
initData() {
|
let me = this;
|
},
|
targetTypeChange() {
|
|
},
|
|
showFileImgByFileId(file_id, file_name, dataname){
|
let me = this;
|
if(file_id) {
|
var fileid = file_id;
|
let fileName = clone(file_name);
|
let index1 = fileName.lastIndexOf(".");
|
let index2 = fileName.length;
|
let suffix = fileName.substring(index1, index2).toLowerCase(); //后缀名
|
if (suffix == ".png" || suffix == ".jpg" || suffix == ".pdf") {
|
var row = {
|
fileid: fileid,
|
filename: fileName,
|
dataname: dataname
|
}
|
|
var config = {
|
totab: false,
|
width: "1200px",
|
height: 800,
|
icon: "icon-product",
|
text: "附件预览",
|
id: "pdf_" + fileid,
|
url: "module/tool/page/popup_file_pdf.html",
|
data: row,
|
delta: {},
|
callback: function(obj, callback) {
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
this.doPopupByPublic(config);
|
}
|
else {//只可下载，不可预览
|
// handleDownloadUrl(fileid,false);
|
handleDownload(fileid, dataname);
|
}
|
}
|
},
|
|
setDateClass(slotDate, slotData) {
|
var class_ = "";
|
if ((this.implantDates).includes(slotData.day)) {
|
class_ = "implant";
|
}
|
else if ((this.implantAlterCancelDates).includes(slotData.day)) {
|
class_ = "implantAlterCancel";
|
}
|
|
return class_;
|
},
|
|
setDateTooltip(slotDate, slotData) {
|
var tooltip_ = "";
|
if ((this.implantDates).includes(slotData.day)) {
|
tooltip_ = "允许植入上报";
|
}
|
else if ((this.implantAlterCancelDates).includes(slotData.day)) {
|
tooltip_ = "允许植入调整撤销";
|
}
|
return tooltip_;
|
},
|
|
// 快捷入口
|
arriveAddOrder() {
|
console.log("Order");
|
|
var me = this;
|
var config = {
|
totab: true, //true: 以Tab导航的方式打开
|
width: "900px",
|
height: "900px",
|
icon: "icon-product",
|
text: "直销订单信息",
|
id: "direct_order_list_info" + "add",//totab: true时需设置，用于判断是否已打开此页面
|
url: "module/order/page/direct_order_list_info.html",
|
data: {},
|
delta: {},
|
sceneCode: "add",//"refuseedit",//"approval", //"add"//"browse",
|
callback: function(obj, callback) {
|
// me.onQuery();
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
me.doPopupByPublic(config);
|
},
|
|
//打开客户主数据或辖区医院列表页
|
onOpenMenu(type) {
|
var me = this;
|
var text = "";
|
var id = "";
|
var url = "";
|
if (type == "org") {
|
text = "客商管理";
|
id = "M-B-M003-001";
|
page_id = "B-001";
|
url = "module/md/page/customer/page/customer_list_account.html";
|
}
|
else if (type == "hospital") {
|
text = "医院管理";
|
id = "M-B-M004-001";
|
page_id = "C-001";
|
url = "module/md/page/terminal/page/hospital_list.html";
|
}
|
|
//3. popup
|
var config = {
|
totab: true, //true: 以Tab导航的方式打开
|
icon: "icon-product",
|
text: text,
|
id: id,//totab: true时需设置，用于判断是否已打开此页面
|
page_id: page_id,
|
url: url,
|
data: null,
|
delta: null,
|
callback: function(obj, callback) {
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
me.doPopupByPublic(config);
|
},
|
|
confirmReceived() {
|
console.log("Received");
|
|
//还没想好怎么打开这个页面
|
var me = this;
|
var config = {
|
totab: true, //true: 以Tab导航的方式打开
|
width: "900px",
|
height: "900px",
|
icon: "icon-product",
|
text: "订单收货",
|
id: "A1-04",//totab: true时需设置，用于判断是否已打开此页面
|
page_id: "A1-04",
|
url: "module/order/page/receiving_list.html",
|
data: {},
|
delta: {},
|
// sceneCode: "browse",//"refuseedit",//"approval", //"add"//"browse",
|
callback: function(obj, callback) {
|
// me.onQuery();
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
me.doPopupByPublic(config);
|
},
|
|
toPage(row) {
|
let me = this;
|
// var row = me.selectTabObj.selectedrow;
|
if(!row){
|
Root.message({
|
type: 'warning',
|
message: '请选择一条数据'
|
});
|
return;
|
}
|
var config = {
|
totab: true, //true: 以Tab导航的方式打开
|
width: "1100px",
|
height: "520px",
|
icon: "icon-product",
|
text: row.doc_code + (row.title ? ("-" + row.title) : ""),
|
id: row.doc_id + row.id,//totab: true时需设置，用于判断是否已打开此页面
|
url: row.sys_alert_setting__url,
|
data: {id: row.doc_id},
|
// delta: me.selectednode,
|
sceneCode: "browse",//"refuseedit",//"approval", //"add"//"browse",
|
callback: function(obj, callback) {
|
// me.getDataByNode();//刷新该树节点的待审批列表
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
me.doPopupByPublic(config);
|
},
|
}
|
});
|
};
|
|
loadJsCss(function () {
|
initVue();
|
});
|
</script>
|
<style>
|
/* 在vue.js中 v-cloak 这个指令是防止页面加载时出现 vuejs 的变量名而设计的 */
|
[v-cloak] {
|
display: none !important;
|
}
|
html {
|
overflow: hidden;
|
}
|
.h_card {
|
width: 100%;
|
height: 100%;
|
}
|
.h_card .el-card__body {
|
padding: 0px;
|
}
|
.h_card .h_card_title {
|
background-color: #fff;
|
border-top: 3px solid #0270c1;
|
border-bottom: 1px solid #e7e7e7;
|
padding: 5px 8px;
|
font-size: 14px;
|
}
|
.h_card .h_card_body {
|
box-sizing: border-box;
|
position: absolute;
|
top: 33px;
|
left: 10px;
|
right: 10px;
|
bottom: 10px;
|
overflow: auto;
|
}
|
.h_card .h_card_row {
|
padding: 3px 5px;
|
box-sizing: border-box;
|
border-bottom: 1px solid #e7e7e7;
|
font-size: 12px;
|
line-height: 30px;
|
}
|
.h_card .h_card_row:hover {
|
color: #0055ff;
|
cursor: pointer;
|
}
|
.h_div_flex {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
flex-wrap: wrap;
|
padding: 0 10%;
|
box-sizing: border-box;
|
}
|
.h_title_fontsize {
|
text-align: center;
|
height: 32px;
|
line-height: 32px;
|
}
|
.h_card_fontsize {
|
height: 80px;
|
}
|
.h_card_fontsize .h_card_fontsize_dc{
|
line-height: 40px;
|
}
|
.h_card_fontsize .h_card_fontsize_dc .h_cnt20_fontsize {
|
color: #00557f;
|
}
|
|
.h_cnt_div {
|
padding-left: 10px;
|
}
|
.h_cnt_fontsize {
|
font-size: 16px;
|
font-weight: bold;
|
}
|
.h_cnt20_fontsize {
|
font-size: 18px;
|
font-weight: bold;
|
}
|
|
/* 日历 */
|
.h_card .el-calendar {
|
background-color: #edf3f8;
|
}
|
|
.h_card .el-calendar__body {
|
padding: 5px 2px;
|
}
|
|
.h_card .el-calendar__title {
|
font-size: 12px;
|
/* width: 50%; */
|
text-align: left;
|
margin-left: 10px;
|
}
|
|
.h_card .el-calendar__header {
|
padding: 1px;
|
}
|
|
.h_card .el-calendar-table thead th {
|
padding: 2px 0;
|
color: #606266;
|
font-weight: 400;
|
font-size: small;
|
}
|
|
.h_card .el-calendar-table td {
|
min-height: 100px;
|
min-width: 100px;
|
border-right: 0px;
|
}
|
|
.h_card .el-button-group>.el-button {
|
padding: 5px;
|
background-color: #f3f3f6d5;
|
}
|
|
.h_card .el-calendar-table .el-calendar-day {
|
-webkit-box-sizing: border-box;
|
box-sizing: border-box;
|
padding: 1px !important;
|
margin: 2px 10px;
|
height: 26px !important;
|
line-height: 26px !important;
|
text-align: center;
|
font-size: 12px;
|
}
|
|
.el-tooltip__popper.is-dark {
|
background: #e3e3e3 !important;
|
color: #0a0a0a !important;
|
}
|
|
.h_card .el-calendar-table .el-calendar-day .item:hover {
|
cursor:default;
|
background-color: #b9d3ef;
|
border-radius: 5px;
|
}
|
|
.h_card .el-calendar-table tr td:first-child {
|
border-left: 0px;
|
}
|
|
.h_card .nulldate {
|
border: 1px solid #00000000;
|
}
|
.h_card .implant {
|
/* background-color: #6495ed; */
|
border: 1px solid #92baed;
|
border-radius: 5px;
|
cursor: pointer;
|
}
|
|
/* 快捷键 */
|
.button-wrap {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
flex-wrap: wrap;
|
padding: 0 15%;
|
box-sizing: border-box;
|
}
|
|
.button-wrap .button {
|
width: 30%;
|
height: 0;
|
padding-top: 1%;
|
padding-bottom: 27%;
|
margin-bottom: 0%;
|
margin-top: 10%;
|
margin-left: 5%;
|
margin-right: 5%;
|
background-color: #1861ae;
|
color: #fff;
|
border: 4px solid #fff;
|
border-radius: 16px;
|
position: relative;
|
display: block;
|
text-decoration: none;
|
letter-spacing: 2px;
|
text-align: center;
|
border-radius: 20px;
|
box-shadow: -2px -2px 8px rgb(161, 156, 156),
|
-2px -2px 12px rgba(255, 255, 255, 0.5),
|
inset 2px 2px 4px rgba(255, 255, 255, 0.1),
|
2px 2px 8px rgba(0, 0, 0, 0.15);
|
}
|
|
.button-wrap .click_button:hover {
|
cursor: pointer;
|
border: 0px solid #1861ae;
|
box-shadow: -2px -2px 14px rgb(161, 156, 156),
|
-2px -2px 12px rgba(255, 255, 255, 0.5),
|
inset 2px 2px 4px rgba(255, 255, 255, 0.1),
|
2px 2px 8px rgba(0, 0, 0, 0.15);
|
}
|
|
.button-wrap .button span {
|
position: relative;
|
color: #d6d5d3;
|
font-weight: 400;
|
font-size: 14px;
|
}
|
|
.icon-button {
|
display: block;
|
width: 35%;
|
margin: 0 auto;
|
margin-top: 10%;
|
}
|
|
.el-radio-button--mini .el-radio-button__inner {
|
padding: 4px 6px !important
|
}
|
</style>
|
|
</head>
|
|
<body style="margin: 0px; height:100vh;" class = "test">
|
<div v-cloak id="vbody">
|
<div id="page_root">
|
<div style="padding: 0px;">
|
<div :style="{height: p_height + 'px'} ">
|
<!-- 左侧模块组 --> <!-- moduleLayout.left -->
|
<div class="h_layout_left" :style="{float: 'left', width: '70%', height: p_height - 20 + 'px', 'overflow-y': 'auto', padding: '10px 0px'}">
|
<template v-for="(module_l, key_l) in moduleLayout.left">
|
<div :style="{float: 'left', width: module_l.width, height: module_l.height, padding: '8px', 'box-sizing': 'border-box'}">
|
<el-card class="h_card" :body-style="{width: '100%', height: '100%', 'overflow-y': 'auto', position: 'relative'}" shadow="always">
|
<div class="h_card_title">
|
<span>{{module_l.title}}</span>
|
|
<el-radio-group style="float: right;" v-if="module_l.code == 'M003'" v-model="target_type" size="mini" @input="targetTypeChange">
|
<el-radio-button label="amt">金额</el-radio-button>
|
<el-radio-button label="qty">数量</el-radio-button>
|
</el-radio-group>
|
</div>
|
|
<!-- 我的通知 -->
|
<div v-if="module_l.code == 'M001'" class="h_card_body">
|
<template v-if="dataobj[module_l.code].length">
|
<el-row v-for="(data_1, key1) in dataobj[module_l.code]" class="h_card_row" :key="'k1_' + key1">
|
<el-col :span="24" >
|
<div v-if="data_1.type_code == 'sale'">
|
{{key1 + 1}}、{{data_1.create_time}} {{data_1.title}} {{data_1.remark}}
|
<template v-if="data_1.files">
|
<br />
|
<template v-for="(file, key) in data_1.files">
|
<span class="h_cellclick" @click="showFileImgByFileId(file.fileid, file.filename, file.dataname)">{{file.filename}}</span>
|
<br />
|
</template>
|
</template>
|
</div>
|
<div v-else @click="toPage(data_1)">
|
{{key1 + 1}}、{{data_1.create_time}} {{data_1.title}} {{data_1.remark}}
|
</div>
|
|
</el-col>
|
</el-row>
|
</template>
|
</div>
|
|
<!-- 我的指标 -->
|
<div v-else-if="module_l.code == 'M003'" class="h_card_body">
|
<!-- 商采指标 -->
|
<el-row >
|
<el-col :span="8">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize">
|
<span style="border-bottom: 1px solid #0270c1;">商采指标 {{dataobj[module_l.code].shangcai[target_type].year.year}}年度</span>
|
</div>
|
<div class="h_card_fontsize" style="text-align: left;">
|
<el-col :span="15">
|
<div class="h_cnt_div"><span>指标{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].shangcai[target_type].year.val_target ? '0':'0'}}</span>
|
</div>
|
<div class="h_cnt_div"><span>达成{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].shangcai[target_type].year.val_sale}}</span>
|
</div>
|
</el-col>
|
<el-col :span="9" class="h_card_fontsize_dc">
|
<div><span class="h_cnt20_fontsize">{{dataobj[module_l.code].shangcai[target_type].year.rate_completion ? '0':'0'}}</span></div>
|
<div>达成率</div>
|
</el-col>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="8">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize">
|
<span style="border-bottom: 1px solid #0270c1;">商采指标 {{dataobj[module_l.code].shangcai[target_type].year.year}} - {{dataobj[module_l.code].shangcai[target_type].quarter.quarter}}季度</span>
|
</div>
|
<div class="h_card_fontsize" style="text-align: left;">
|
<el-col :span="15" style="border-left: 1px solid #0270c1;">
|
<div class="h_cnt_div"><span>指标{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].shangcai[target_type].quarter.val_target ? '0':'0'}}</span>
|
</div>
|
<div class="h_cnt_div"><span>达成{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].shangcai[target_type].quarter.val_sale}}</span>
|
</div>
|
</el-col>
|
<el-col :span="9" class="h_card_fontsize_dc">
|
<div><span class="h_cnt20_fontsize">{{dataobj[module_l.code].shangcai[target_type].quarter.rate_completion ? '0':'0'}}</span></div>
|
<div>达成率</div>
|
</el-col>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="8">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize">
|
<span style="border-bottom: 1px solid #0270c1;">商采指标 {{dataobj[module_l.code].shangcai[target_type].year.year}} - {{dataobj[module_l.code].shangcai[target_type].month.month}}月度</span>
|
</div>
|
<div class="h_card_fontsize" style="text-align: left;">
|
<el-col :span="15" style="border-left: 1px solid #0270c1;">
|
<div class="h_cnt_div"><span>指标{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].shangcai[target_type].month.val_target ? '0':'0'}}</span>
|
</div>
|
<div class="h_cnt_div"><span>达成{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].shangcai[target_type].month.val_sale}}</span>
|
</div>
|
</el-col>
|
<el-col :span="9" class="h_card_fontsize_dc">
|
<div><span class="h_cnt20_fontsize">{{dataobj[module_l.code].shangcai[target_type].month.rate_completion ? '0':'0'}}</span></div>
|
<div>达成率</div>
|
</el-col>
|
</div>
|
</div>
|
|
</el-col>
|
</el-row>
|
<!-- 植入指标 -->
|
<el-row >
|
<el-col :span="8">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize">
|
<span style="border-bottom: 1px solid #0270c1;">植入指标 {{dataobj[module_l.code].zhiru[target_type].year.year}}年度</span>
|
</div>
|
<div class="h_card_fontsize" style="text-align: left;">
|
<el-col :span="15">
|
<div class="h_cnt_div"><span>指标{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].zhiru[target_type].year.val_target ? '0':'0'}}</span>
|
</div>
|
<div class="h_cnt_div"><span>达成{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].zhiru[target_type].year.val_sale}}</span>
|
</div>
|
</el-col>
|
<el-col :span="9" class="h_card_fontsize_dc">
|
<div><span class="h_cnt20_fontsize">{{dataobj[module_l.code].zhiru[target_type].year.rate_completion ? '0':'0'}}</span></div>
|
<div>达成率</div>
|
</el-col>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="8">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize">
|
<span style="border-bottom: 1px solid #0270c1;">植入指标 {{dataobj[module_l.code].zhiru[target_type].year.year}} - {{dataobj[module_l.code].zhiru[target_type].quarter.quarter}}季度</span>
|
</div>
|
<div class="h_card_fontsize" style="text-align: left;">
|
<el-col :span="15" style="border-left: 1px solid #0270c1;">
|
<div class="h_cnt_div"><span>指标{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].zhiru[target_type].quarter.val_target ? '0':'0'}}</span>
|
</div>
|
<div class="h_cnt_div"><span>达成{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].zhiru[target_type].quarter.val_sale}}</span>
|
</div>
|
</el-col>
|
<el-col :span="9" class="h_card_fontsize_dc">
|
<div><span class="h_cnt20_fontsize">{{dataobj[module_l.code].zhiru[target_type].quarter.rate_completion ? '0':'0'}}</span></div>
|
<div>达成率</div>
|
</el-col>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="8">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize">
|
<span style="border-bottom: 1px solid #0270c1;">植入指标 {{dataobj[module_l.code].zhiru[target_type].year.year}} - {{dataobj[module_l.code].zhiru[target_type].month.month}}月度</span>
|
</div>
|
<div class="h_card_fontsize" style="text-align: left;">
|
<el-col :span="15" style="border-left: 1px solid #0270c1;">
|
<div class="h_cnt_div"><span>指标{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].zhiru[target_type].month.val_target ? '0':'0'}}</span>
|
</div>
|
<div class="h_cnt_div"><span>达成{{target_type == 'amt'? '金额(万元)' : '数量' }}：</span>
|
<br />
|
<span class="h_cnt_fontsize"> {{dataobj[module_l.code].zhiru[target_type].month.val_sale}}</span>
|
</div>
|
</el-col>
|
<el-col :span="9" class="h_card_fontsize_dc">
|
<div><span class="h_cnt20_fontsize">{{dataobj[module_l.code].zhiru[target_type].month.rate_completion ? '0':'0'}}</span></div>
|
<div>达成率</div>
|
</el-col>
|
</div>
|
</div>
|
|
</el-col>
|
</el-row>
|
</div>
|
|
<!-- 我的客户 -->
|
<div v-else-if="module_l.code == 'M004'" class="h_card_body">
|
<el-row >
|
<el-col :span="20">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize" >
|
<i class="iconfont icon-gongwenbao h_cellclick" style="color: #ff5500;" @click="onOpenMenu('org')"></i>
|
<span class="h_cellclick" @click="onOpenMenu('org')">经销商</span>
|
</div>
|
<div class="h_div_flex">
|
<div v-for="(data_1, key1) in dataobj[module_l.code].Customer" style="display: block;">
|
<div><span class="h_cnt20_fontsize">{{data_1.cnt}}</span>家</div>
|
<div>{{data_1.actor}}</div>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="4">
|
<div style="font-size: 14px;">
|
<div class="h_title_fontsize" >
|
<i class="iconfont icon-yiyuan h_cellclick" style="color: #ff5500;" @click="onOpenMenu('hospital')"></i>
|
<span class=" h_cellclick" @click="onOpenMenu('hospital')">医院</span>
|
</div>
|
<div class="h_div_flex" style="border-left: 1px solid #0270c1; justify-content: center;">
|
<div v-for="(data_1, key1) in dataobj[module_l.code].Hospital" style="display: block;">
|
<div style="text-align: center;"><span class="h_cnt20_fontsize">{{data_1.cnt}}</span>家</div>
|
<div>{{data_1.actor}}</div>
|
</div>
|
</div>
|
</div>
|
</el-col>
|
</el-row>
|
</div>
|
</el-card>
|
</div>
|
</template>
|
</div>
|
|
<!-- 右侧模块组 -->
|
<div class="h_layout_right" :style="{float: 'right', width: '30%', height: p_height - 20 + 'px', 'overflow-y': 'auto', padding: '10px 0px'}">
|
<template v-for="(module_r, key_r) in moduleLayout.right">
|
<div :style="{float: 'left', width: module_r.width, height: module_r.height, padding: '8px', 'box-sizing': 'border-box'}">
|
<el-card class="h_card" :body-style="{width: '100%', height: '100%', 'overflow-y': 'auto', 'background-color': '#edf3f8', position: 'relative'}" shadow="always">
|
<div class="h_card_title">
|
<span>{{module_r.title}}</span>
|
</div>
|
<!-- 植入日历 -->
|
<div v-if="module_r.code == 'M005'" class="h_card_body">
|
<el-calendar ref="ref_calendar">
|
<template slot="dateCell" slot-scope="{date, data}">
|
<el-tooltip :disabled="setDateTooltip(date, data) == ''" class="item" effect="dark" :content="setDateTooltip(date, data)" placement="top">
|
<div :class="setDateClass(date, data)">
|
{{ data.day.split('-').slice(2).join('-')}}
|
</div>
|
</el-tooltip>
|
</template>
|
</el-calendar>
|
</div>
|
<!-- 快捷入口 -->
|
<div v-else-if="module_r.code == 'M006'" class="h_card_body">
|
<!-- <div class="button-wrap">
|
<div class="button implanted click_button" @click = "">
|
<img class="icon-button" src="implanted.png" alt="cart">
|
<span>协 议</span>
|
</div>
|
<div class="button order click_button" @click = "">
|
<img class="icon-button" src="implanted.png" alt="cart">
|
<span>备 案</span>
|
</div>
|
<div class="button receive click_button" @click = "">
|
<img class="icon-button" src="implanted.png" alt="cart">
|
<span>辖 区</span>
|
</div>
|
<div class="button receive click_button" @click = "">
|
<img class="icon-button" src="implanted.png" alt="cart">
|
<span>授 权</span>
|
</div>
|
</div> -->
|
</div>
|
</el-card>
|
</div>
|
</template>
|
</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>
|
</div>
|
|
</body>
|
</html>
|
