<!DOCTYPE html>
< html lang = "zh" xmlns:th = "http://www.thymeleaf.org" >
< head >
< th:block th:include = "include :: header('新增载体制作')" / >
< th:block th:include = "include :: select2-css" / >
< th:block th:include = "include :: bootstrap-select-css" / >
< th:block th:include = "include :: datetimepicker-css" / >
< / head >
< body class = "white-bg" >
< div class = "wrapper wrapper-content animated fadeInRight ibox-content" >
< form class = "form-horizontal m" id = "form-fileprovide-add" >
< div class = "row" >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 所属地市：< / label >
< div class = "col-sm-8" >
< select id = "City" name = "areaCity" required class = "form-control m-b" >
< option value = "" > ---请选择---< / option >
< / select >
< / div >
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 所属区县：< / label >
< div class = "col-sm-8" >
< select id = "Area" name = "areaDistrict" required class = "form-control m-b" >
< option value = "" > ---请选择---< / option >
< / select >
< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 载体名称：< / label >
< div class = "col-sm-8" >
< input name = "carrierName" placeholder = "请输入载体名称" required class = "form-control" type = "text" >
< / div >
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 载体类型：< / label >
< div class = "col-sm-8" >
< select name = "carrierLevel" required class = "form-control m-b" th:with = "type=${@dict.getType('sys_provide_level')}" >
< option value = "" > ---请选择---< / option >
< option th:each = "dict : ${type}" th:text = "${dict.dictLabel}" th:value = "${dict.dictValue}" > < / option >
< / select >
< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 载体数量：< / label >
< div class = "col-sm-8" >
< input name = "carrierCount" digits = "true" placeholder = "请输入载体数量" required class = "form-control" type = "text" >
< / div >
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 密级：< / label >
< div class = "col-sm-8" >
< select name = "carrierSecret" required class = "form-control m-b" th:with = "type=${@dict.getType('sys_file_miji')}" >
< option value = "" > ---请选择---< / option >
< option th:each = "dict : ${type}" th:text = "${dict.dictLabel}" th:value = "${dict.dictValue}" > < / option >
< / select >
< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 紧急程度：< / label >
< div class = "col-sm-8" >
< select name = "carrierExtent" required class = "form-control m-b" th:with = "type=${@dict.getType('sys_file_jinjichengdu')}" >
< option value = "" > ---请选择---< / option >
< option th:each = "dict : ${type}" th:text = "${dict.dictLabel}" th:value = "${dict.dictValue}" > < / option >
< / select >
< / div >
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label" > 编号：< / label >
< div class = "col-sm-8" >
< input name = "carrierNumber" placeholder = "请输入编号" class = "form-control" type = "text" >
< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 保密期限：< / label >
< div class = "col-sm-8" >
< input name = "carrierTerm" placeholder = "请输入保密期限" required class = "form-control" type = "text" >
< / div >
< / div >
< / div >
< div class = "col-sm-6" >
< div class = "form-group" >
< label class = "col-sm-4 control-label is-required" > 发放范围：< / label >
< div class = "col-sm-8" >
< input name = "carrierContent" placeholder = "请输入发放范围" required class = "form-control" type = "text" >
< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-sm-12" >
< div class = "form-group" >
< label class = "col-sm-2 control-label is-required" > 定密依据：< / label >
< div class = "col-sm-10" >
< textarea name = "carrierAlliance" placeholder = "请输入定密依据" required class = "form-control" type = "text" > < / textarea >
< / div >
< / div >
< / div >
< / div >
< / form >
< / div >
< th:block th:include = "include :: footer" / >
< th:block th:include = "include :: select2-js" / >
< th:block th:include = "include :: bootstrap-select-js" / >
< th:block th:include = "include :: datetimepicker-js" / >
< script th:inline = "javascript" >
var prefix = ctx + "system/carrier"
$("#form-fileprovide-add").validate({
focusCleanup: true
});
$(document).ready(function() {
// 获取市级数据并填充到城市下拉框
$.ajax({
url: ctx + "system/area/getSysAreaList",
method: 'GET',
success: function(res) {
var cities = res.data; // 假设返回的数据中有一个叫做 'cities' 的字段包含市级数据
var $citySelect = $('#City');
// 填充城市下拉框
cities.forEach(function(city) {
$citySelect.append($('< option > ', {
value: city.id,
text: city.name
}));
});
// 初始化 select2 插件
$citySelect.select2();
},
error: function(err) {
console.error('Failed to load city data:', err);
}
});
// 监听城市下拉框的变化事件
$('#City').on('change', function() {
var selectedCityId = $(this).val();
// 如果未选择城市，则不执行后续操作
if (!selectedCityId) return;
// 根据选中的城市ID发送请求获取对应的区级数据
$.ajax({
url: ctx + "system/area/getSysAreaList",
data:{parentId:selectedCityId},
method: 'GET',
success: function(res) {
var areas = res.data; // 假设返回的数据中有一个叫做 'areas' 的字段包含区级数据
var $areaSelect = $('#Area');
// 清空区级下拉框并填充数据
$areaSelect.empty().append($('< option > ', {
value: '',
text: '请选择区'
}));
areas.forEach(function(area) {
$areaSelect.append($('< option > ', {
value: area.id,
text: area.name
}));
});
// 更新 select2 插件
$areaSelect.select2();
},
error: function(err) {
console.error('Failed to load area data:', err);
}
});
});
});
function submitHandler() {
if ($.validate.form()) {
$.operate.save(prefix + "/add", $('#form-fileprovide-add').serialize());
}
}
< / script >
< / body >
< / html >
