<%--
|
Created by IntelliJ IDEA.
|
User: Lenovo
|
Date: 2024/10/31
|
Time: 16:58
|
To change this template use File | Settings | File Templates.
|
--%>
|
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
|
<html>
|
<head>
|
<title>Title</title>
|
<link rel="stylesheet" href="../../CSS/layui2.css">
|
<link rel="stylesheet" href="../../CSS/layer.css">
|
<script src="JiChuJs/vue.js"></script>
|
<!-- 引入样式 -->
|
<link rel="stylesheet" href="css/index.css">
|
<!-- 引入组件库 -->
|
<script src="JiChuJs/index.js"></script>
|
</head>
|
<body>
|
<div id="app">
|
<div id="qrsc" style="display: none;border-radius: 15px;width: 20%;height: 15%;padding: 2%;position: fixed;top: 30%;bottom: 45%;z-index: 9999;right: 40%;left: 40%;background-color: #E9E7E7;box-shadow: black 1px 1px 1px">
|
<p style="width: 20%;height: 60%;display: inline-block;"><img src="JiChuImg/image.png" width="60"/></p>
|
<p style="width: 70%;display: inline-block" id="msgt">
|
|
</p>
|
<p style="display: inline-block;float: right">
|
<button class="layui-btn" onclick="QueSc()">确认</button>
|
<button class="layui-btn layui-btn-primary" style="float: right" onclick="QueQx()">取消</button>
|
</p>
|
</div>
|
|
<div class="heimu" style="display: none;width: 100%;height: 100%;position: fixed;top: 0px;left: 0px;z-index: 999;background-color: black;opacity: 0.8"></div>
|
<div class="add" style="display: none;width: 600px;height:600px;overflow-y: scroll;background-color: #f6f6f6;border: 1px solid #cccccc;padding: 50px;position: fixed;top: 10%;left: 30%;z-index: 99999;bottom: 10%">
|
<form class="layui-form" action="/hxzkuwb/addModel" method="post" lay-filter="example" onsubmit="return checkup()">
|
|
<div class="layui-form-item">
|
<label class="layui-form-label languages1">模型名称</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="modelname" id="bumenname" required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages2">所属类型</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="modeltype" required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages2">模型大小</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="modelsize" required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages3">模型文件</label>
|
<div class="layui-input-block">
|
<el-upload
|
ref="upload"
|
action="/hxzkuwb/addModelGLB"
|
list-type="picture-card"
|
:auto-upload="true"
|
:multiple="false"
|
:on-exceed="onExceed"
|
:on-success="onSuccessglb"
|
:on-error="onError"
|
:limit="1"
|
:file-list="fileList"
|
@change="handleChange" style="margin-left: 1%"> <!-- 监听 change 事件 -->
|
<i slot="default" class="el-icon-plus" style="position: relative; top: 5vh"></i>
|
<div slot="file" slot-scope="{file}" style="">
|
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
<span class="el-upload-list__item-actions">
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleRemoveglb(file)">
|
<i class="el-icon-delete"></i>
|
</span>
|
</span>
|
</div>
|
</el-upload>
|
<el-dialog :visible.sync="dialogVisible">
|
<img width="100%" :src="dialogImageUrl" alt="">
|
</el-dialog> </div>
|
</div>
|
<input type="hidden" value="" name="modelurl" id="modelurl"/>
|
<input type="hidden" value="" name="modelimg" id="modelimg"/>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages3">模型图片</label>
|
<div class="layui-input-block">
|
<el-upload
|
ref="upload1"
|
action="/hxzkuwb/addModelImg"
|
list-type="picture-card"
|
:auto-upload="true"
|
:multiple="false"
|
:on-exceed="onExceed"
|
:on-success="onSuccessimg"
|
:on-error="onError"
|
:limit="1"
|
:file-list="fileList"
|
@change="handleChange" style="margin-left: 1%"> <!-- 监听 change 事件 -->
|
<i slot="default" class="el-icon-plus" style="position: relative; top: 5vh"></i>
|
<div slot="file" slot-scope="{file}" style="">
|
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
<span class="el-upload-list__item-actions">
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleRemoveimg(file)">
|
<i class="el-icon-delete"></i>
|
</span>
|
</span>
|
</div>
|
</el-upload>
|
<el-dialog :visible.sync="dialogVisible">
|
<img width="100%" :src="dialogImageUrl" alt="">
|
</el-dialog> </div>
|
</div>
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<button type="submit" class="layui-btn languages8" lay-submit="" lay-filter="" id="baocun">立即提交</button>
|
<button type="button" class="layui-btn layui-btn-normal languages9" lay-filter="" onclick="quxiao()" style="">取消</button>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="update" style="display: none;width: 600px;height:600px;overflow-y: scroll;background-color: #f6f6f6;border: 1px solid #cccccc;padding: 50px;position: fixed;top: 10%;left: 30%;z-index: 99999;bottom: 10%">
|
<form class="layui-form" action="/hxzkuwb/upModel" method="post" lay-filter="example">
|
<div class="layui-form-item">
|
<label class="layui-form-label languages1">序号</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="id" id="up1" readonly required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages1">模型名称</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="modelname" id="up2" required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages2">所属类型</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="modeltype" id="up3"required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages2">模型大小</label>
|
<div class="layui-input-block">
|
<input type="text" minlength="1" maxlength="20" pattern="^[^<>&\`#%]*$" lay-verify="title" name="modelsize" id="up4"required autocomplete="off" class="layui-input">
|
</div>
|
</div>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages3">模型文件</label>
|
<div class="layui-input-block">
|
<el-upload
|
ref="upload"
|
action="/hxzkuwb/addModelGLB"
|
list-type="picture-card"
|
:auto-upload="true"
|
:multiple="false"
|
:on-exceed="onExceed"
|
:on-success="onSuccessglb"
|
:on-error="onError"
|
:limit="1"
|
:file-list="fileList"
|
@change="handleChange" style="margin-left: 1%"> <!-- 监听 change 事件 -->
|
<i slot="default" class="el-icon-plus" style="position: relative; top: 5vh"></i>
|
<div slot="file" slot-scope="{file}" style="">
|
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
<span class="el-upload-list__item-actions">
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleRemoveglb(file)">
|
<i class="el-icon-delete"></i>
|
</span>
|
</span>
|
</div>
|
</el-upload>
|
<el-dialog :visible.sync="dialogVisible">
|
<img width="100%" :src="dialogImageUrl" alt="">
|
</el-dialog> </div>
|
</div>
|
<input type="hidden" value="" name="modelurl" id="upmodelurl"/>
|
<input type="hidden" value="" name="modelimg" id="upmodelimg"/>
|
<div class="layui-form-item">
|
<label class="layui-form-label languages3">模型图片</label>
|
<div class="layui-input-block">
|
<el-upload
|
ref="upload1"
|
action="/hxzkuwb/addModelImg"
|
list-type="picture-card"
|
:auto-upload="true"
|
:multiple="false"
|
:on-exceed="onExceed"
|
:on-success="onSuccessimg"
|
:on-error="onError"
|
:limit="1"
|
:file-list="fileList"
|
@change="handleChange" style="margin-left: 1%"> <!-- 监听 change 事件 -->
|
<i slot="default" class="el-icon-plus" style="position: relative; top: 5vh"></i>
|
<div slot="file" slot-scope="{file}" style="">
|
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
|
<span class="el-upload-list__item-actions">
|
<span
|
v-if="!disabled"
|
class="el-upload-list__item-delete"
|
@click="handleRemoveimg(file)">
|
<i class="el-icon-delete"></i>
|
</span>
|
</span>
|
</div>
|
</el-upload>
|
<el-dialog :visible.sync="dialogVisible">
|
<img width="100%" :src="dialogImageUrl" alt="">
|
</el-dialog> </div>
|
</div>
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<button type="submit" class="layui-btn languages8" lay-submit="" lay-filter="" id="baocun">立即提交</button>
|
<button type="button" class="layui-btn layui-btn-normal languages9" lay-filter="" onclick="quxiao()" style="">取消</button>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="layui-container" style="width: 100%;margin: 0px;padding: 0px">
|
<div class="layui-row">
|
<div class="layui-col-xs12 layui-col-md12">
|
<table class="layui-hide" id="Model" lay-filter="Model"></table>
|
</div>
|
</div>
|
</div>
|
</div>
|
</body>
|
<script type="text/html" id="titleTplimg">
|
<img src="../../{{d.modelimg}}" width="35"/>
|
</script>
|
<script type="text/html" id="toolbarDemo">
|
<div>
|
<button class="layui-btn layui-btn-normal" id="btnAdd" style="" lay-event="getadd">新增</button>
|
<button class="layui-btn layui-btn-warm" id="btnUpdate" style="" lay-event="getUpdate">修改</button>
|
<button class="layui-btn layui-btn-danger" id="btnDelete" style="" lay-event="getdelete">删除</button>
|
<button class="layui-btn layui-btn-primary" id="btnShuaXin" style="" lay-event="getshuaxin">刷新</button>
|
|
</div>
|
</script>
|
<script src="/hxzkuwb/HouTai/Js/jquery-3.5.1.js"></script>
|
<script src="../../JS/layui.js"></script>
|
<script src="../../JS/layer.js"></script>
|
<script>
|
$.ajaxSetup({
|
headers: {
|
'x-access-token': localStorage.getItem("hxzkmars3d")
|
}
|
});
|
|
var modelGLB = "";
|
var modelImg = ""
|
var shanchu = "";
|
var dst = "";
|
var dsa = "";
|
new Vue({
|
el: '#app',
|
data: {
|
fileList: [], // 用来存储当前上传的文件列表
|
dialogImageUrl: '',
|
dialogVisible: false,
|
disabled: false,
|
value: ''
|
},
|
methods: {
|
onExceed() {
|
this.$message.warning('最多只能上传一个文件'); // 提示用户
|
},
|
handleChange(file, fileList) {
|
this.fileList = fileList.slice(-1); // 保留最后一个文件
|
},
|
handleRemoveglb(file) {
|
this.$refs.upload.clearFiles(); // 清空上传的文件列表
|
this.$notify({
|
title: '移除',
|
message: '移除模型成功!请重新上传',
|
type: 'error'
|
});
|
},
|
onError() {
|
this.$notify({
|
title: '失败',
|
message: '已经上传过了,请更换图片试试!',
|
type: 'error'
|
});
|
this.$message.error('上传失败,请重试');
|
},
|
onSuccessglb(response, file) {
|
this.$notify({
|
title: '成功',
|
message: '上传模型成功',
|
type: 'success'
|
});
|
modelGLB = file.name
|
$("#modelurl").val("Home/model/model/"+file.name)
|
$("#upmodelurl").val("Home/model/model/"+file.name)
|
},
|
onSuccessimg(response, file) {
|
this.$notify({
|
title: '成功',
|
message: '上传图片成功',
|
type: 'success'
|
});
|
modelImg = file.name
|
$("#modelimg").val("Home/model/img/"+file.name)
|
$("#upmodelimg").val("Home/model/img/"+file.name)
|
|
},
|
handleRemoveimg(file) {
|
this.$refs.upload1.clearFiles(); // 清空上传的文件列表
|
this.$notify({
|
title: '移除',
|
message: '移除图片成功!请重新上传',
|
type: 'error'
|
});
|
},
|
|
}
|
});
|
|
layui.use('table', function(){
|
var table = layui.table;
|
var layer = layui.layer;
|
var form = layui.form;
|
table.render({
|
elem: '#Model'
|
,url: '/hxzkuwb/FindModelListAll'
|
,page: true //开启分页
|
,toolbar:'#toolbarDemo' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
|
,cols: [[ //表头
|
{type:'checkbox',sort: true,fixed: "left",width:80}
|
,{ field: 'id', title: '序号'}
|
,{ field: 'modelname', title: '模型名称'}
|
,{ field: 'modelsize', title: '模型大小'}
|
,{ field: 'modeltype', title: '模型类型'}
|
,{ field: 'modelimg', title: '模型图片',templet: '#titleTplimg'}
|
]]
|
,limits: [10, 20, 30, 40, 50,60,70,80,90,100,100000]
|
,limit: 20,
|
});
|
|
|
table.on('toolbar(Model)', function(obj) {
|
var checkStatus = table.checkStatus(obj.config.id);
|
var ds = "username="+sessionStorage.getItem("username")
|
var data = checkStatus.data;
|
var add = "Yes";
|
var udelete = "Yes";
|
var uupdate = "Yes";
|
$.ajax({
|
url: "/hxzkuwb/findUserRole",
|
type: "GET",
|
data:ds,
|
dataType: "json",
|
async: false, // 设置为同步
|
success: function(data) {
|
if (data.uadd == "No") {
|
add = "No";
|
}
|
if (data.udelete == "No") {
|
udelete = "No";
|
}
|
if (data.uupdate == "No") {
|
uupdate = "No";
|
}
|
}
|
});
|
switch(obj.event) {
|
case 'getadd' :
|
$(".add").show()
|
$(".heimu").show();
|
break;
|
case 'getUpdate':
|
if (data.length > 1) {
|
layer.msg("请选择一条数据进行修改")
|
} else if (data.length == 0) {
|
layer.msg("请选择一条数据进行修改")
|
} else {
|
$("#up1").val(data[0].id)
|
$("#up2").val(data[0].modelname)
|
$("#up3").val(data[0].modeltype)
|
$("#up4").val(data[0].modelsize)
|
$(".update").show()
|
$(".heimu").show();
|
}
|
|
break;
|
case 'getshuaxin':
|
layer.msg("刷新成功")
|
setTimeout(function (){
|
location.reload();
|
},500)
|
break;
|
case 'getdelete':
|
if (udelete == "Yes") {
|
var data = checkStatus.data;
|
if (data < 1) {
|
layer.msg("请选择一条数据")
|
} else {
|
shanchu = data;
|
for (var i = 0; i < data.length; i++) {
|
dst += data[i].modelname+","
|
dsa += data[i].id+","
|
|
}
|
$("#msgt").text("你确定要删除吗?删除后无法恢复!名称为:"+dst)
|
$("#qrsc").toggle()
|
dst = ""
|
dsa = ""
|
}
|
}
|
break;
|
case 'getsearch':
|
|
break;
|
}
|
})
|
|
|
});
|
|
function quxiao(){
|
layer.msg("已取消")
|
setTimeout(function() {
|
$(".add").hide();
|
$(".update").hide();
|
$(".heimu").hide();
|
}, 500);
|
|
}
|
|
function checkup(){
|
|
if (modelGLB == ""){
|
layer.alert("请上传模型")
|
return false
|
|
}
|
if (modelImg ==""){
|
layer.alert("请上传模型图片")
|
return false
|
}
|
}
|
function QueSc(){
|
for (var i = 0; i < shanchu.length; i++) {
|
var ds = "id=" + shanchu[i].id
|
$.post("/hxzkuwb/deModel", ds, function (data) {
|
setTimeout(function () {
|
location.reload();
|
}, 1000)
|
})
|
}
|
}
|
function QueQx(){
|
|
$("#qrsc").toggle()
|
}
|
</script>
|
</html>
|