<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="utf-8">
|
<title>隐私投诉</title>
|
<meta name="viewport" content="width=device-width, viewport-fit=cover, initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
<script type="text/javascript" src="layui/layui.js" charset="utf-8"></script>
|
<script src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script>
|
<script src="../js/app.js"></script>
|
<style>
|
body {
|
margin: 0;
|
padding: 0;
|
background: #FFFFFF;
|
font-size: 0;
|
}
|
</style>
|
|
<script>
|
window.onresize = function() {
|
document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
|
};
|
window.onresize();
|
</script>
|
<style>
|
body {
|
padding: 0.4rem;
|
box-sizing: content-box;
|
}
|
|
.btn {
|
width: 100%;
|
height: 0.84rem;
|
line-height: 0.84rem;
|
border-radius: 1rem;
|
background: #0052F6;
|
font-size: 0.32rem;
|
text-align: center;
|
font-size: 0.32rem;
|
border-style: none;
|
color: #F4DE4A;
|
margin: 0 auto;
|
margin-top: 0.5rem;
|
border: none;
|
|
|
}
|
|
textarea {
|
width: 100%;
|
height: 3rem;
|
background: #E8E8E8;
|
border-radius: 0.10rem;
|
border-style: none;
|
padding: 0.2rem;
|
box-sizing: border-box;
|
}
|
|
.remarks {
|
font-size: 0.22rem;
|
color: #9B9B9B;
|
margin-top: 0.28rem;
|
}
|
|
.images {
|
margin-top: 0.25rem;
|
display: flex;
|
flex-wrap: wrap;
|
}
|
|
.images .item {
|
position: relative;
|
margin-right: 0.3rem;
|
margin-bottom: 0.3rem;
|
}
|
|
.images .item .img {
|
height: 1.2rem;
|
width: 1.2rem;
|
border-radius: 0.10rem;
|
background-size: cover;
|
}
|
|
.images .item .delete {
|
width: 0.3rem;
|
height: 0.3rem;
|
position: absolute;
|
right: -0.15rem;
|
top: -0.15rem;
|
}
|
|
|
.add {
|
width: 1.2rem;
|
height: 1.2rem;
|
border-radius: 0.10rem;
|
text-align: center;
|
background: #DBDBDB;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.add img {
|
width: 0.42rem;
|
height: 0.36rem;
|
}
|
|
.layui-upload-file {
|
display: none !important;
|
}
|
</style>
|
</head>
|
<body>
|
|
|
<textarea placeholder="在此输入您遇见的隐私问题，很抱歉给您带来不好的体验，我们将尽快核实并解决你遇到的问题..."></textarea>
|
|
<div class="images">
|
<div class="add">
|
<img src="img/icon_camera.png" />
|
</div>
|
</div>
|
<div class="remarks">非必填项</div>
|
|
|
<button class="btn">提交</button>
|
|
</body>
|
|
<script>
|
//初始化上传控件
|
var uploadTool = {
|
callback: null,
|
chooseImage: {},
|
uploadArray: new Array(),
|
init: function(upload) {
|
this.uploadArray = new Array();
|
this.uploadArray.push(upload.render({
|
elem: '.add', //绑定元素
|
url: '', //上传接口
|
data: {
|
|
},
|
auto: false,
|
accept: 'images',
|
acceptMime: 'image/*',
|
field: "file_",
|
multiple: true,
|
number: 10,
|
choose: function(obj) {
|
//将每次选择的文件追加到文件队列
|
var files = obj.pushFile();
|
//预读本地文件，如果是多文件，则会遍历。(不支持ie8/9)
|
obj.preview(function(index, file, result) {
|
console.log("index:" + index); //得到文件索引
|
// $("#img_${value.key}").attr("src", result);
|
var html =
|
"<div class='item'><div class='img' style='background-image:url(" + result +
|
")'></div><img src='img/icon_delete.png' index='" + index + "' class='delete' /></div>"
|
uploadTool.chooseImage[index] = file;
|
$(".add").before(html);
|
$(".delete").bind("click", function() {
|
$(this).parent().remove();
|
delete uploadTool.chooseImage[$(this).attr("index")];
|
});
|
});
|
},
|
before: function(obj) {
|
layer.load();
|
},
|
done: function(res, index, upload) {
|
layer.closeAll('loading'); //关闭loading
|
//上传完毕后删除
|
if (res.code == 0) {
|
//获取链接
|
$("input[name='${value.key}']").val(res.data.url);
|
delete chooseImage["${value.key}"];
|
if (Object.keys(chooseImage).length == 0) {
|
//全部上传成功
|
callback();
|
}
|
} else {
|
layer.msg(res.msg);
|
}
|
},
|
error: function(index, upload) {
|
layer.msg("上传出错");
|
layer.closeAll('loading'); //关闭loading
|
}
|
}));
|
|
|
},
|
upload: function(result) {
|
if (this.uploadArray.length > 0) {
|
this.callback = result;
|
//同时上传
|
for (var i = 0; i < this.uploadArray.length; i++) {
|
this.uploadArray[i].upload();
|
}
|
} else {
|
result();
|
}
|
}
|
};
|
</script>
|
|
<script>
|
var layer = null;
|
layui.use(['form', 'layer', 'jquery', 'upload'], function() {
|
$ = layui.jquery;
|
var form = layui.form,
|
upload = layui.upload;
|
layer = layui.layer;
|
//渲染上传控件
|
uploadTool.init(upload);
|
$(".btn").click(function() {
|
if ($("textarea").val() != null && $("textarea").val().length > 0) {
|
uploadFile($("textarea").val());
|
setTimeout(function() {
|
// yestv.toast("提交成功");
|
// window.history.go(-1);
|
}, 1000);
|
}
|
});
|
});
|
|
//上传文件
|
function uploadFile(content) {
|
var formData = new FormData();
|
var textData = {
|
content: content
|
};
|
ksbridge.call("getRequestBaseParams", textData, function(res) {
|
textData = JSON.parse(res);
|
for (var key in textData) {
|
formData.append(key, textData[key])
|
}
|
var index = 0;
|
for (var key in uploadTool.chooseImage) {
|
formData.append("images", uploadTool.chooseImage[key])
|
index++;
|
}
|
|
|
|
$.ajax({
|
url: "http://192.168.3.122:8082/api/v1/feedback/privacyComplain",
|
type: 'POST',
|
cache: false,
|
data: formData,
|
processData: false,
|
contentType: false,
|
beforeSend: function() {
|
ksbridge.call("showLoading");
|
},
|
success: function(res) {
|
console.log("返回内容", res);
|
var data = JSON.parse(res);
|
if (data.code == 0) {
|
ksbridge.call("toast", {
|
msg: "提交成功"
|
});
|
ksbridge.call("finishPage");
|
} else {
|
ksbridge.call("toast", {
|
msg: data.msg
|
});
|
}
|
},
|
error: function(res) {
|
console.log("error", res);
|
console.log("status", res.status);
|
ksbridge.call("toast", {
|
msg: "提交失败"
|
});
|
},
|
complete: function(XHR, TS) {
|
ksbridge.call("hideLoading");
|
}
|
|
});
|
|
|
});
|
|
}
|
</script>
|
|
|
|
|
</html>
|
