510 lines
24 KiB
Plaintext
510 lines
24 KiB
Plaintext
@*
|
||
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
|
||
*@
|
||
@model WxworkCustomerModel
|
||
@{
|
||
ViewData["Title"] = "销售线索-客户详情";
|
||
var json = Model.ToJson();
|
||
}
|
||
<link rel="stylesheet" href="~/css/customer.css?v=1" />
|
||
<style type="text/css">
|
||
.paytab{
|
||
display:inline-block;
|
||
padding:5px 10px;
|
||
border:1px solid #ccc;
|
||
color:#888;
|
||
margin-right:5px;
|
||
margin-bottom:5px;
|
||
border-radius:5px;
|
||
}
|
||
|
||
.paytab_active{
|
||
background-color:#00a2e8;
|
||
color:#fff;
|
||
}
|
||
</style>
|
||
<script>
|
||
!(function (n, e) {
|
||
function setViewHeight() {
|
||
var windowVH = e.innerHeight / 100
|
||
n.documentElement.style.setProperty('--vh', windowVH + 'px')
|
||
}
|
||
var i = 'orientationchange' in window ? 'orientationchange' : 'resize'
|
||
n.addEventListener('DOMContentLoaded', setViewHeight)
|
||
e.addEventListener(i, setViewHeight)
|
||
})(document, window)
|
||
</script>
|
||
<script type="text/javascript">
|
||
var fontSize = 100;
|
||
(function (doc, win) {
|
||
var docEl = doc.documentElement,
|
||
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
|
||
recalc = function () {
|
||
var clientWidth = docEl.clientWidth;
|
||
if (!clientWidth) return;
|
||
if (clientWidth > 750) clientWidth = 750;
|
||
docEl.style.fontSize = (50 * (clientWidth / 375)).toFixed(1) + 'px'; fontSize = 50 * (clientWidth / 375);
|
||
};
|
||
if (!doc.addEventListener) return;
|
||
win.addEventListener(resizeEvt, recalc, false);
|
||
doc.addEventListener('DOMContentLoaded', recalc, false);
|
||
})(document, window);
|
||
</script>
|
||
@*@Html.Raw(json);*@
|
||
<div id="app">
|
||
<div class="main">
|
||
<div class="tabs" style="display:inline;">
|
||
<div :class="tabs == 1 ? 'tab active' : 'tab' " @@click="tabs = 1">客户信息</div>
|
||
<div :class="tabs == 2 ? 'tab active' : 'tab' " @@click="tabs = 2">跟进记录</div>
|
||
<div :class="tabs == 3 ? 'tab active' : 'tab' " @@click="tabs = 3" style="margin-left:1em;">支付</div>
|
||
<div :class="tabs == 4 ? 'tab active' : 'tab' " @@click="tabs = 4" style="margin-left:1em;">风险标记</div>
|
||
</div>
|
||
<div class="info" v-if="tabs == 1">
|
||
<div class="capital">
|
||
<div class="title">
|
||
<span>资金量：</span>
|
||
<p @@click="sheetShow = true"><img src="~/images/add.png" /><span>请选择</span></p>
|
||
</div>
|
||
<div>@Html.Raw(ViewBag.Capital)</div>
|
||
</div>
|
||
<van-action-sheet v-model="sheetShow" :actions="capitals" cancel-text="取消" close-on-click-action
|
||
@@cancel="sheetShow = false" @@select="onSelect" />
|
||
</div>
|
||
<div class="record" v-if="tabs == 2">
|
||
<div class="infoRecord">
|
||
<div class="title">
|
||
<span>信息记录：</span>
|
||
<p @@click="addRecord()">
|
||
<img src="~/images/add.png" />
|
||
<span>添加</span>
|
||
</p>
|
||
</div>
|
||
<div class="details">
|
||
@{
|
||
@foreach (var item in Model.FollowUpRecord.FollowUpRecordDetails.Where(x => x.RecordType == "报价" || x.RecordType == "电话").GroupBy(x => x.RecordType)
|
||
.Select(x => new { record = x.Key, count = x.Count() }))
|
||
{
|
||
<p>@Html.Raw($"{item.count}次{item.record}")</p>
|
||
}
|
||
}
|
||
</div>
|
||
</div>
|
||
<div class="content">
|
||
@{
|
||
var count = 0;
|
||
var data = Model.FollowUpRecord.FollowUpRecordDetails.OrderByDescending(x => x.Date)
|
||
.GroupBy(x =>
|
||
new
|
||
{
|
||
Date = x.Date.ToString("yyyy-MM-dd"),
|
||
DateStr = x.DateStr,
|
||
Title = x.Title,
|
||
User = x.User,
|
||
Hidden = x.Hidden
|
||
}).Select(x =>
|
||
new
|
||
{
|
||
x.Key.Date,
|
||
x.Key.Title,
|
||
x.Key.User,
|
||
x.Key.DateStr,
|
||
x.Key.Hidden
|
||
}).ToList();
|
||
foreach (var record in data)
|
||
{
|
||
<div class="item">
|
||
<div class="item-title">
|
||
<div class="title-time">@Html.Raw(record.DateStr)</div>
|
||
<span>@Html.Raw(record.User)</span>
|
||
<span>@Html.Raw(record.Title)</span>
|
||
</div>
|
||
@foreach (var recodeDetail in Model.FollowUpRecord.FollowUpRecordDetails.Where(x => x.Date.ToString("yyyy-MM-dd") == record.Date
|
||
&& x.Title == record.Title
|
||
&& x.User == record.User)
|
||
.OrderByDescending(x => x.Date))
|
||
{
|
||
count++;
|
||
<div class="item-head">
|
||
<span class="contentIcon"><img src="images/cr.png" alt=""></span>
|
||
<div class="time">@Html.Raw(recodeDetail.Date.ToString("HH:mm"))</div>
|
||
<span>@Html.Raw(recodeDetail.RecordType)</span>
|
||
@if (recodeDetail.Private)
|
||
{
|
||
<span id="messageShow_@Html.Raw(count)" class="click" @@click="messageShow('@Html.Raw(recodeDetail.Hidden)', '@Html.Raw(count)')">查看更多</span>
|
||
}
|
||
</div>
|
||
<div class="info-box">
|
||
@if (recodeDetail.Private)
|
||
{
|
||
<div id="description_@Html.Raw(count)" data-value="@Html.Raw(recodeDetail.Description)" class="remarks">
|
||
***
|
||
</div>
|
||
}
|
||
else
|
||
{
|
||
<div class="remarks">
|
||
@Html.Raw(recodeDetail.Description)
|
||
</div>
|
||
}
|
||
</div>
|
||
}
|
||
</div>
|
||
}
|
||
}
|
||
</div>
|
||
<div class="shade" v-if="recordShow">
|
||
<div class="popup">
|
||
<div class="pop-title">跟进记录</div>
|
||
<div class="p3">
|
||
<div class="radio">
|
||
@{
|
||
foreach (var orderType in Model.OrderTypes)
|
||
{
|
||
<van-tag id="orderType_@Html.Raw(orderType.Id)" type="primary" plain size="large" @@click="clickOrderType(@Html.Raw(orderType.Id))">
|
||
@Html.Raw(orderType.TypeName)
|
||
</van-tag>
|
||
}
|
||
}
|
||
</div>
|
||
@*<div class="addTag">
|
||
<van-checkbox v-model="addTag" shape="square">自动添加企微个人标签</van-checkbox>
|
||
</div>*@
|
||
<textarea cols="30" rows="10" maxlength="2000" @@keyup="checkMsg()" v-model="msg" placeholder="备注内容"></textarea>
|
||
<p style="font-size: 14px"><span id="text-count">0</span>/2000</p>
|
||
@*<van-field v-model="msg"
|
||
rows="2"
|
||
autosize
|
||
label="备注内容"
|
||
type="textarea"
|
||
maxlength="50"
|
||
placeholder="请输入..."
|
||
show-word-limit />*@
|
||
<div class="btn">
|
||
<button @@click="onSure">确定</button>
|
||
<button @@click="recordShow = false">取消</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div v-if="tabs == 3">
|
||
<div class="capital" style="height:auto;">
|
||
<div class="title">
|
||
开户行：招商银行股份有限公司北京东四环支行<br />
|
||
户 名：东高（广东）科技发展有限公司<br />
|
||
账 号：110905783010611<br />
|
||
</div>
|
||
<div style="height:5px;border-bottom:2px dotted #ccc;margin: 15px 0;"></div>
|
||
<div>
|
||
<span :class="paytab == 1 ? 'paytab paytab_active' : 'paytab' " @@click="paytab = 1">主要付款二维码</span>
|
||
<span :class="paytab == 2 ? 'paytab paytab_active' : 'paytab' " @@click="paytab = 2">备用付款二维码</span>
|
||
</div>
|
||
<div v-if="paytab == 1">
|
||
@for (var i = 0; i < ViewBag.PayImgItems.Count; i++)
|
||
{
|
||
var item = ViewBag.PayImgItems[i];
|
||
<div style="display:flex;margin-top:10px;background-color:#fff;">
|
||
<div style="flex:1;text-align:center;">
|
||
<div style="height:2em;line-height:2em;color:#ed1c24;">@(item.Title??"")</div>
|
||
<img id="_img_wxpay" src="@item.WxpayImg" style="max-width:100%;" />
|
||
</div>
|
||
<!--<div style="width:4em;text-align:right;" onclick="copyImg(this,'_img_wxpay')">复制</div>-->
|
||
</div>
|
||
<div v-if="!HidePayUrl" style="display:flex;margin-top:10px;">
|
||
<div style="flex:1;">
|
||
<a href="javascript:;" @@click="wxpayurl@(i)=!wxpayurl@(i)">{{wxpayurl@(i)?'收起链接':'显示链接'}}</a>
|
||
</div>
|
||
<div style="width:4em;text-align:right;" onclick="copy(this,'@item.WxpayUrl')">复制</div>
|
||
</div>
|
||
<div v-if="wxpayurl@(i)" style="word-break:break-all;">@item.WxpayUrl</div>
|
||
<div style="display:flex;margin-top:10px;background-color:#fff;">
|
||
<div style="flex:1;text-align:center;">
|
||
<div style="height:2em;line-height:2em;color:#ed1c24;">@(item.Title??"")</div>
|
||
<img id="_img_alipay" src="@item.AlipayImg" style="max-width:100%;" />
|
||
</div>
|
||
<!--<div style="width:4em;text-align:right;" onclick="copyImg(this,'_img_alipay')">复制</div>-->
|
||
</div>
|
||
<div v-if="!HidePayUrl" style="display:flex;margin-top:10px;">
|
||
<div style="flex:1;">
|
||
<a href="javascript:;" @@click="alipayurl@(i)=!alipayurl@(i)">{{alipayurl@(i)?'收起链接':'显示链接'}}</a>
|
||
</div>
|
||
<div style="width:4em;text-align:right;" onclick="copy(this,'@item.AlipayUrl')">复制</div>
|
||
</div>
|
||
<div v-if="alipayurl@(i)" style="word-break:break-all;">@item.AlipayUrl</div>
|
||
}
|
||
</div>
|
||
<div v-if="paytab == 2">
|
||
@for (var i = 0; i < ViewBag.PayImgItems2.Count; i++)
|
||
{
|
||
var item = ViewBag.PayImgItems2[i];
|
||
<div style="display:flex;margin-top:10px;background-color:#fff;">
|
||
<div style="flex:1;text-align:center;">
|
||
<div style="height:2em;line-height:2em;color:#ed1c24;">@(item.Title??"")</div>
|
||
<img id="_img_wxpay2" src="@item.WxpayImg" style="max-width:100%;" />
|
||
</div>
|
||
<!--<div style="width:4em;text-align:right;" onclick="copyImg(this,'_img_wxpay')">复制</div>-->
|
||
</div>
|
||
<div v-if="!HidePayUrl" style="display:flex;margin-top:10px;">
|
||
<div style="flex:1;">
|
||
<a href="javascript:;" @@click="wxpayurl_2_@(i)=!wxpayurl_2_@(i)">{{wxpayurl_2_@(i)?'收起链接':'显示链接'}}</a>
|
||
</div>
|
||
<div style="width:4em;text-align:right;" onclick="copy(this,'@item.WxpayUrl')">复制</div>
|
||
</div>
|
||
<div v-if="wxpayurl_2_@(i)" style="word-break:break-all;">@item.WxpayUrl</div>
|
||
<div style="display:flex;margin-top:10px;background-color:#fff;">
|
||
<div style="flex:1;text-align:center;">
|
||
<div style="height:2em;line-height:2em;color:#ed1c24;">@(item.Title??"")</div>
|
||
<img id="_img_alipay2" src="@item.AlipayImg" style="max-width:100%;" />
|
||
</div>
|
||
<!--<div style="width:4em;text-align:right;" onclick="copyImg(this,'_img_alipay')">复制</div>-->
|
||
</div>
|
||
<div v-if="!HidePayUrl" style="display:flex;margin-top:10px;">
|
||
<div style="flex:1;">
|
||
<a href="javascript:;" @@click="alipayurl_2_@(i)=!alipayurl_2_@(i)">{{alipayurl_2_@(i)?'收起链接':'显示链接'}}</a>
|
||
</div>
|
||
<div style="width:4em;text-align:right;" onclick="copy(this,'@item.AlipayUrl')">复制</div>
|
||
</div>
|
||
<div v-if="alipayurl_2_@(i)" style="word-break:break-all;">@item.AlipayUrl</div>
|
||
}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="~/js/vue.min.js" asp-append-version="true"></script>
|
||
<script src="~/js/vant.min.js" asp-append-version="true"></script>
|
||
<script src="~/js/axios.min.js" asp-append-version="true"></script>
|
||
<script>
|
||
window.onload = function () {
|
||
var app = new Vue({
|
||
el: "#app",
|
||
data: {
|
||
tabs: @Html.Raw(ViewBag.Tabs),
|
||
sheetShow: false,
|
||
recordShow: false,
|
||
capitals: @Html.Raw(ViewBag.CapitalSelect),
|
||
msg: '',
|
||
amount: '',
|
||
capital: '@Html.Raw(Model.WxworkCustomerInfo.CustomerCapital)',
|
||
addTag: false,
|
||
orderType: null,
|
||
paytab: 1,
|
||
wxpayurl0: false,
|
||
alipayurl0: false,
|
||
wxpayurl1: false,
|
||
alipayurl1: false,
|
||
wxpayurl2: false,
|
||
alipayurl2: false,
|
||
wxpayurl3: false,
|
||
alipayurl3: false,
|
||
wxpayurl4: false,
|
||
alipayurl4: false,
|
||
wxpayurl_2_0: false,
|
||
alipayurl_2_0: false,
|
||
wxpayurl_2_1: false,
|
||
alipayurl_2_1: false,
|
||
wxpayurl_2_2: false,
|
||
alipayurl_2_2: false,
|
||
wxpayurl_2_3: false,
|
||
alipayurl_2_3: false,
|
||
wxpayurl_2_4: false,
|
||
alipayurl_2_4: false,
|
||
HidePayUrl: @(!string.IsNullOrEmpty(ViewBag.HidePayUrl) ? "true" : "false")
|
||
},
|
||
methods: {
|
||
// 选择资金量
|
||
onSelect(item) {
|
||
var data = {
|
||
resid: '@Html.Raw(Model.FollowUpRecord.Resid)',
|
||
capital: item.name,
|
||
appid: '@Html.Raw(Model.Appid)'
|
||
}
|
||
axios.post('/customer/capital', data)
|
||
.then(res => {
|
||
if (res.data.code == 0) {
|
||
vant.Toast.success(res.data.message);
|
||
this.replaceParamVal('tabs', '1');
|
||
} else{
|
||
vant.Toast.fail(res.data.message);
|
||
}
|
||
})
|
||
.catch(function (error) { // 请求失败处理
|
||
console.log(error);
|
||
});
|
||
},
|
||
// 确定提交跟进记录
|
||
onSure() {
|
||
if (!this.orderType) {
|
||
vant.Toast.fail('请选择工单类型');
|
||
return;
|
||
}
|
||
vant.Dialog.confirm({
|
||
title: '确认',
|
||
message: '是否确认提交工单？',
|
||
})
|
||
.then(() => {
|
||
var data = {
|
||
resid: '@Html.Raw(Model.FollowUpRecord.Resid)',
|
||
eid: @Html.Raw(Model.Eid),
|
||
appid: '@Html.Raw(Model.Appid)',
|
||
typeid: this.orderType,
|
||
content: this.msg,
|
||
addTag: this.addTag
|
||
};
|
||
axios.post('/customer/customerOrder', data)
|
||
.then(res => {
|
||
if (res.data.code == 0) {
|
||
this.recordShow = false;
|
||
vant.Toast.success(res.data.message);
|
||
this.replaceParamVal('tabs', '2');
|
||
} else {
|
||
vant.Toast.fail(res.data.message);
|
||
}
|
||
})
|
||
.catch(function (error) { // 请求失败处理
|
||
console.log(error);
|
||
});
|
||
})
|
||
.catch(() => {
|
||
// on cancel
|
||
});
|
||
},
|
||
messageShow(hide, id) {
|
||
if (hide != 'False') {
|
||
vant.Dialog.alert({
|
||
message: '该报价工单为私密信息，请联系创建人或其上级查看!',
|
||
}).then(() => {
|
||
// on close
|
||
});
|
||
} else {
|
||
document.getElementById('description_' + id).innerHTML = document.getElementById('description_' + id).getAttribute('data-value')
|
||
document.getElementById('messageShow_' + id).setAttribute("class", "hide");
|
||
}
|
||
},
|
||
replaceParamVal(paramName, replaceWith) {
|
||
var oUrl = location.href;
|
||
var re = eval('/('+ paramName+'=)([^&]*)/gi');
|
||
var nUrl = oUrl.replace(re,paramName+'='+replaceWith);
|
||
if (oUrl.indexOf('&' + paramName + '=') > 0) {
|
||
re = eval('/(&' + paramName + '=)([^&]*)/gi');
|
||
nUrl = oUrl.replace(re, '&' + paramName + '=' + replaceWith);
|
||
} else {
|
||
if (oUrl.indexOf("?") > 0) {
|
||
nUrl = oUrl + "&" + paramName + "=" + replaceWith;
|
||
} else {
|
||
nUrl = oUrl + "?" + paramName + "=" + replaceWith;
|
||
}
|
||
}
|
||
console.log(nUrl);
|
||
window.location.href = nUrl;
|
||
},
|
||
clickOrderType(id) {
|
||
var tags = document.getElementsByClassName('van-tag');
|
||
for (var i = 0; i < tags.length; i++) {
|
||
tags[i].setAttribute("class", "van-tag van-tag--plain van-tag--large van-tag--primary");
|
||
}
|
||
document.getElementById('orderType_' + id).setAttribute("class", "van-tag van-tag--large van-tag--primary");
|
||
this.orderType = id;
|
||
},
|
||
addRecord() {
|
||
this.orderType = null;
|
||
this.addTag = false;
|
||
this.msg = '';
|
||
this.recordShow = true;
|
||
},
|
||
checkMsg() {
|
||
if (this.msg.length > 2000) {
|
||
vant.Toast.fail('备注内容请在2000字以内。');
|
||
}
|
||
var count = this.msg.length;
|
||
document.getElementById('text-count').innerText = count;
|
||
}
|
||
},
|
||
})
|
||
}
|
||
|
||
function copy(sender,text){
|
||
var textArea = document.createElement('textarea');
|
||
textArea.style.position = 'fixed';
|
||
textArea.style.top = 0;
|
||
textArea.style.left = 0;
|
||
textArea.style.width = '2em';
|
||
textArea.style.height = '2em';
|
||
textArea.style.padding = 0;
|
||
textArea.style.border = 'none';
|
||
textArea.style.outline = 'none';
|
||
textArea.style.boxShadow = 'none';
|
||
textArea.style.background = 'transparent';
|
||
textArea.value = text;
|
||
document.body.appendChild(textArea);
|
||
textArea.select();
|
||
document.execCommand('copy');
|
||
document.body.removeChild(textArea);
|
||
|
||
show_button_msg(sender, '已复制');
|
||
}
|
||
|
||
function copyImg(sender, id) {
|
||
var el = document.getElementById(id);
|
||
var content = el.getAttribute('src');
|
||
const base64ToBlob = function (code) {
|
||
let parts = code.split(';base64,');
|
||
let contentType = parts[0].split(':')[1];
|
||
let raw = window.atob(parts[1]);
|
||
let rawLength = raw.length;
|
||
let uInt8Array = new Uint8Array(rawLength);
|
||
for (let i = 0; i < rawLength; ++i) {
|
||
uInt8Array[i] = raw.charCodeAt(i);
|
||
}
|
||
return new Blob([uInt8Array], {
|
||
type: contentType
|
||
});
|
||
};
|
||
var blob = base64ToBlob(content);
|
||
navigator.clipboard.write([
|
||
new ClipboardItem({
|
||
[blob.type]: blob
|
||
})
|
||
]);
|
||
show_button_msg(sender, '已复制');
|
||
}
|
||
|
||
function show_toast(msg, bgColor, color, ms) {
|
||
if (!bgColor) {
|
||
bgColor = '#22b14c';
|
||
}
|
||
if (!color) {
|
||
color = '#fff';
|
||
}
|
||
if (ms == null){
|
||
ms = 1500;
|
||
}
|
||
|
||
var el = document.createElement('div');
|
||
el.style.position = 'fixed';
|
||
el.style.left = '0px';
|
||
el.style.top = '0px';
|
||
el.style.height = '100%';
|
||
el.style.width = '100%';
|
||
el.style.display = 'grid';
|
||
el.style.placeItems = 'center';
|
||
var sb = '<div style="border-radius:5px;background-color:' + bgColor + ';color:' + color + ';font-size:14px;padding:10px 20px;">' + msg + '</div>';
|
||
el.innerHTML = sb;
|
||
document.body.appendChild(el);
|
||
if (ms > 0) {
|
||
setTimeout(function () {
|
||
document.body.removeChild(el);
|
||
}, ms);
|
||
}
|
||
}
|
||
|
||
function show_button_msg(sender,text){
|
||
var sb = sender.innerHTML;
|
||
sender.innerHTML = '<span style="color:#22b14c;">✔' + text + '</span>';
|
||
setTimeout(function () {
|
||
sender.innerHTML = sb;
|
||
}, 1500);
|
||
}
|
||
</script>
|
||
|