TG.WXCRM.V4/WEB/Views/TS/Friendscircle/SendFriendScircle.cshtml

430 lines
17 KiB
Plaintext

@using WX.CRM.WebHelper;
@using WX.CRM.Model
@using WX.CRM.WEB.Handler
@model WX.CRM.Model.MAP.WX_FriendScirclePhone
@{
ViewBag.Title = "发送朋友圈";
Layout = "~/Views/Shared/_Index_LayoutEdit.cshtml";
}
@*<link href="~/Scripts/layer/css/layui.css" rel="stylesheet" />*@
@*<script src="~/Scripts/layer/layer.min.js"></script>*@
@*<script src="~/Scripts/layer/layui.js"></script>*@
<link href="~/Scripts/layui-v2.3.0/css/layui.css" rel="stylesheet" />
<script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/layui-v2.3.0/layui.all.js"></script>
<script src="~/Scripts/layui-v2.3.0/layui.js"></script>
<style>
.hiddenClass {
display: none;
}
.attention {
color: red;
padding: 5px;
}
.movestyle {
}
</style>
<style type="text/css">
.WoCao td {
padding: 3px;
}
.layim-face-list {
position: relative;
width: 372px;
padding: 10px;
border: 1px solid #D9D9D9;
background-color: #fff;
box-shadow: 0 0 20px rgba(0,0,0,.2);
}
.layim-face-list li {
cursor: pointer;
float: left;
border: 1px solid #e8e8e8;
height: 22px;
width: 26px;
overflow: hidden;
/*margin: -1px 0 0 -1px;*/
padding: 4px 2px;
text-align: center;
}
.face_onMouseOver {
border: 1px solid red;
}
.MsgCount {
width: 14px;
background-color: red;
color: white;
line-height: 14px;
margin-top: 5px;
text-align: center;
height: 14px;
border-radius: 14px;
border: red solid 2px;
}
.Imggray {
-webkit-filter: grayscale(100%);
}
.nEmpty {
}
.msgCountCs {
display: block;
height: 25px;
padding: 0px;
margin: 0px;
}
.msgIsGuoQi {
display: block;
height: 25px;
width: 40px;
line-height:14px;
padding: 2px 0px 0px 0px;
margin: 0px;
color: gray;
}
body .demo-class .layui-layer-title {
background: #c00;
color: #fff;
border: none;
}
body .demo-class .layui-layer-btn {
border-top: 1px solid #E9E7E7;
}
body .demo-class .layui-layer-btn a {
background: #333;
}
body .demo-class .layui-layer-btn .layui-layer-btn1 {
background: #999;
}
#ChatCore_chatmore .ChatCore_chatlist li {
padding: 0 20px 0 5px;
}
.Hidden {
display: none;
}
.nmnimage {
max-height: 120px;
max-width: 120px;
}
#nubl {
position: relative;
width: 440px;
height: auto;
padding: 5px;
/*border: 1px solid #D9D9D9;*/
background-color: #fff;
}
#nubl li {
float: left;
border: 1px solid #e8e8e8;
height: 130px;
width: 130px;
overflow: hidden;
/* margin: -1px 0 0 -1px; */
padding: 2px 1px;
text-align: center;
}
.listyle {
box-shadow: 0 0 10px 0px #FF5722 inset;
}
.nfloat {
/*z-index: 999;*/
position: absolute;
/*left: 47px;
top: 4px;*/
cursor: pointer;
}
</style>
<script>
var face = [{ name: "[微笑]", imgpath: "0.png" }, { name: "[撇嘴]", imgpath: "1.png" }, { name: "[色]", imgpath: "2.png" }, { name: "[发呆]", imgpath: "3.png" },
{ name: "[得意]", imgpath: "4.png" }, { name: "[流泪]", imgpath: "5.png" }, { name: "[害羞]", imgpath: "6.png" }, { name: "[闭嘴]", imgpath: "7.png" },
{ name: "[睡]", imgpath: "8.png" }, { name: "[大哭]", imgpath: "9.png" }, { name: "[尴尬]", imgpath: "10.png" }, { name: "[发怒]", imgpath: "11.png" },
{ name: "[调皮]", imgpath: "12.png" },
{ name: "[呲牙]", imgpath: "13.png" }, { name: "[惊讶]", imgpath: "14.png" }, { name: "[难过]", imgpath: "15.png" },
{ name: "[囧]", imgpath: "17.png" }, { name: "[抓狂]", imgpath: "18.png" }, { name: "[吐]", imgpath: "19.png" }, { name: "[偷笑]", imgpath: "20.png" },
{ name: "[愉快]", imgpath: "21.png" }, { name: "[白眼]", imgpath: "22.png" }, { name: "[傲慢]", imgpath: "23.png" },
{ name: "[困]", imgpath: "25.png" }, { name: "[惊恐]", imgpath: "26.png" },
{ name: "[流汗]", imgpath: "27.png" }, { name: "[憨笑]", imgpath: "28.png" }, { name: "[悠闲]", imgpath: "29.png" }, { name: "[奋斗]", imgpath: "30.png" },
{ name: "[咒骂]", imgpath: "31.png" }, { name: "[疑问]", imgpath: "32.png" }, { name: "[嘘]", imgpath: "33.png" }, { name: "[晕]", imgpath: "34.png" },
{ name: "[衰]", imgpath: "36.png" }, { name: "[骷髅]", imgpath: "37.png" },
{ name: "[敲打]", imgpath: "38.png" }, { name: "[再见]", imgpath: "39.png" }, { name: "[擦汗]", imgpath: "40.png" },
{ name: "[抠鼻]", imgpath: "41.png" }, { name: "[鼓掌]", imgpath: "42.png" },
{ name: "[坏笑]", imgpath: "44.png" }, { name: "[左哼哼]", imgpath: "45.png" },
{ name: "[右哼哼]", imgpath: "46.png" }, { name: "[哈欠]", imgpath: "47.png" },
{ name: "[鄙视]", imgpath: "48.png" }, { name: "[委屈]", imgpath: "49.png" },
{ name: "[快哭了]", imgpath: "50.png" }, { name: "[阴险]", imgpath: "51.png" },
{ name: "[亲亲]", imgpath: "52.png" },
{ name: "[可怜]", imgpath: "54.png" }, { name: "[菜刀]", imgpath: "55.png" },
{ name: "[西瓜]", imgpath: "56.png" }, { name: "[啤酒]", imgpath: "57.png" },
{ name: "[咖啡]", imgpath: "60.png" },
{ name: "[猪头]", imgpath: "62.png" }, { name: "[玫瑰]", imgpath: "63.png" },
{ name: "[凋谢]", imgpath: "64.png" }, { name: "[嘴唇]", imgpath: "65.png" },
{ name: "[爱心]", imgpath: "66.png" }, { name: "[心碎]", imgpath: "67.png" },
{ name: "[蛋糕]", imgpath: "68.png" }, { name: "[炸弹]", imgpath: "70.gif" }, { name: "[便便]", imgpath: "71.gif" },
{ name: "[月亮]", imgpath: "72.gif" }, { name: "[太阳]", imgpath: "73.gif" }, { name: "[拥抱]", imgpath: "74.png" }, { name: "[强]", imgpath: "75.gif" },
{ name: "[弱]", imgpath: "76.gif" },
{ name: "[握手]", imgpath: "77.gif" }, { name: "[胜利]", imgpath: "78.gif" }, { name: "[抱拳]", imgpath: "79.gif" }, { name: "[勾引]", imgpath: "80.gif" },
{ name: "[拳头]", imgpath: "81.gif" }, { name: "[OK]", imgpath: "82.gif" }, { name: "[跳跳]", imgpath: "83.gif" }, { name: "[发抖]", imgpath: "84.gif" },
{ name: "[怄火]", imgpath: "85.png" }, { name: "[转圈]", imgpath: "86.gif" }, { name: "😄", imgpath: "87.png" },
{ name: "😷", imgpath: "90.png" }, { name: "😂", imgpath: "91.png" }, { name: "😝", imgpath: "92.png" }, { name: "😳", imgpath: "93.png" },
{ name: "[嘿哈]", imgpath: "97.png" }, { name: "[捂脸]", imgpath: "98.png" }, { name: "[奸笑]", imgpath: "99.png" },
{ name: "[机智]", imgpath: "100.png" }, { name: "[皱眉]", imgpath: "101.png" }, { name: "[耶]", imgpath: "102.png" },
{ name: "[红包]", imgpath: "108.png" }
];
</script>
<script type="text/javascript">
(function ($) {
$.fn.extend({
insertAtCaret: function (myValue) {
var $t = $(this)[0];
//IE
if (document.selection) {
this.focus();
sel = document.selection.createRange();
sel.text = myValue;
this.focus();
} else
//!IE
if ($t.selectionStart || $t.selectionStart == "0") {
var startPos = $t.selectionStart;
var endPos = $t.selectionEnd;
var scrollTop = $t.scrollTop;
$t.value = $t.value.substring(0, startPos) + myValue + $t.value.substring(endPos, $t.value.length);
this.focus();
$t.selectionStart = startPos + myValue.length;
$t.selectionEnd = startPos + myValue.length;
$t.scrollTop = scrollTop;
} else {
this.value += myValue;
this.focus();
}
}
})
})(jQuery);
layui.use(['layer'], function () {
var layer = layui.layer; //独立版的layer无需执行这一句
});
$(function () {
$("#btnSave").click(function () {
var hllomsg = $("#content").val();
if (hllomsg.length < 4) {
alert("字数不能少于4个字!");
return;
}
var imgPath = "";
$("#nubl").find("[imgfile]").each(function (x, i) {
if (x == 0)
imgPath += $(this).attr("imgfile");
else
imgPath += ";"+$(this).attr("imgfile");
});
$("#imgPath").val(imgPath);
$.r_ajax({
url: "/TS/Friendscircle/SendFriendScircleSave",
type: "Post",
data: $("#CreateForm").serialize(),
dataType: "json",
loading: true,
success: function (data) {
if (data.type == 1) {
window.parent.frameReturnByMes('发送成功!');
window.parent.frameReturnByReload(true);
window.parent.frameReturnByClose();
}
else {
window.parent.frameReturnByMes(data.message);
}
}
});
return false;
});
$("#timeType").change(function () {
var sltValue = $(this).val();
if (sltValue == "2") {
$("#hiddTime").removeClass("hiddenClass");
} else {
$("#hiddTime").addClass("hiddenClass");
}
});
ChatCore = {};
ChatCore.showFace = function () {
var nhtml = "<ul id=\"layimFace\" class='layui-clear layim-face-list'>";
$(face).each(function (e, x) {
nhtml += "<li title=\"" + x.name + "\" code=\"" + x.name + "\" ><img src=\"/Face/" + x.imgpath + "\"></li>";
});
nhtml += "</ul>";
layer.open({
title: '选择表情',
type: 1,
skin: 'layui-layer-rim',
area: ['410px', '400px'],
content: nhtml
});
$(".layim-face-list li").mouseover(function () {
$(this).attr("style", "border: 1px solid red;");
}).mouseout(function () {
$(this).removeAttr("style");
}).click(function () {
var imwriht = $("#content");
//imwriht.val(imwriht.val() + $(this).attr("code"));
$(imwriht).insertAtCaret($(this).attr("code"));
//var indexs = $("#layimFace").parent().parent().attr("times");
//layer.close(indexs);
});
};
$("#btn_ShowFace").click(function () {
ChatCore.showFace();
});
layui.use('upload', function () {
var upload = layui.upload;
//var form = layui.form();
//执行实例
var uploadInst = upload.render({
elem: '#test1' //绑定元素
, url: '/TS/Friendscircle/UploadImage' //上传接口
, accept: 'images'
, size: 500 //最大允许上传的文件大小
, done: function (res) {
if (res.result) {
$("#nubl").removeAttr("style");
//<span class=\"layui-badge nfloat\">X</span>
var liid = "li_" + RndNum(6);
var imageli = "<li id='" + liid + "' class='movestyle' imgfile='" + res.filename + "'><img clas='nmnimage' style='max-height:120px;max-width:120px;padding-top:10px;'src='/fsfile/" + res.filename + "' /></li>";
$("#nubl").append(imageli);
if ($("#nubl").find("li").length >= 9) {
$("#test1").attr("style", "display:none;");
}
$("#" + liid).hover(
function () {
$(this).addClass("listyle");
var xspanid = "span_" + liid;
var imgfile1 = $(this).attr("imgfile");
$(this).children("img").before("<span spimgfile='" + imgfile1 + "' id=\"" + xspanid + "\" class=\"layui-badge nfloat\">X</span>");
$("#" + xspanid).click(function () {
var mf = $(this).attr("spimgfile");
$(this).parent().remove();
if ($("#nubl").find("li").length < 9) {
$("#test1").removeAttr("style");
}
$.ajax({
type: "POST",
url: "/TS/Friendscircle/DeleteImag?imagefile=" + mf,
dataType: "json",
success: function (data) {
}
});
});
},
function () {
$(this).removeClass("listyle");
$(this).find(".nfloat").remove();
}
);
} else {
}
}
, error: function () {
//请求异常回调
}
});
});
});
function RndNum(n) {
var rnd = "";
for (var i = 0; i < n; i++)
rnd += Math.floor(Math.random() * 10);
return rnd;
}
</script>
<div class="mvctool bgb">
@Html.ToolButtonPlain("btnSave", "icon-save", "发送", false, "")
</div>
<div class="formContent">
@using (Html.BeginForm("SendFriendScircleSave", "Friendscircle", null, FormMethod.Post, new { Id = "CreateForm" }))
{
@Html.ValidationSummary(true)
<table class="fromEditTable ">
<tbody>
<tr>
<td style="width:80px;">
内容:
</td>
<td style="width:580px">
@Html.TextAreaFor(m => m.content, new { rows = "20", cols = "70" })
<img id="btn_ShowFace" style="cursor:pointer" src="~/Content/Images/biaoqing.png" width="25px" height="25px" />
</td>
<td>
@Html.ValidationMessageFor(m => m.content)
</td>
</tr>
<tr>
<td style="width:80px;height:100px;">
图片:
</td>
<td style="width:580px" class="nmalgeb">
<input name="imgPath" id="imgPath" type="hidden" />
<ul id="nubl" style="display:none"></ul>
</td>
<td></td>
</tr>
<tr>
<td style="20px;"></td>
<td colspan="2">
<button type="button" class="layui-btn" id="test1">
<i class="layui-icon">&#xe67c;</i>上传图片
</button>
</td>
</tr>
<tr>
<td style="width:80px;">
执行时间:
</td>
<td style="width:580px">
<select name="timeType" id="timeType">
<option value="1">2~3分钟左右执行</option>
<option value="2">自定义时间</option>
</select>
<span id="hiddTime" class="hiddenClass">
<input name="exe_date" type="text" style="width:100px;" class="Wdate" onclick="WdatePicker({dateFmt:'yyyy-MM-dd'})" value="@Html.Raw(DateTime.Now.ToString("yyyy-MM-dd"))" />
<input name="exe_time" type="text" style="width:60px;" class="Wdate" onclick="WdatePicker({dateFmt:'HH:mm'})" value="@Html.Raw(DateTime.Now.ToString("HH:mm"))" />
</span>
</td>
<td></td>
</tr>
</tbody>
</table>
}
</div>