-
+
@@ -83,6 +100,9 @@
const layer = layui.layer;
const $ = layui.$;
+ // 全局应用列表
+ let appsList = [];
+
// 自定义验证规则
form.verify({
alias: function (value) {
@@ -100,7 +120,55 @@
return new Date(dateStr).toLocaleString();
}
+ // 根据应用UUID获取应用名称和ID,并添加颜色徽章
+ function getAppName(appUUID) {
+ if (appUUID === '0') {
+ return '
全局变量';
+ }
+ const app = appsList.find(app => app.uuid === appUUID);
+ if (app) {
+ return '
' + app.name + '(ID:' + app.id + ')' + '';
+ } else {
+ return '
未知应用';
+ }
+ }
+ // 加载应用列表
+ function loadAppList() {
+ $.ajax({
+ url: '/admin/api/apps/simple',
+ type: 'GET',
+ success: function (res) {
+ if (res.code === 0 && res.data) {
+ // 保存应用列表到全局变量
+ appsList = res.data;
+
+ const filterSelect = $('form[lay-filter="variableFilterForm"] select[name="filter_app_uuid"]');
+ const formSelect = $('#variableForm select[name="app_uuid"]');
+
+ // 清空现有选项(保留默认选项:全部应用和全局变量)
+ filterSelect.find('option:not([value=""]):not([value="0"])').remove();
+ formSelect.find('option:not([value=""]):not([value="0"])').remove();
+
+ // 添加应用选项
+ res.data.forEach(function(app) {
+ const option = '
';
+ filterSelect.append(option);
+ formSelect.append(option);
+ });
+
+ // 重新渲染表单
+ form.render('select');
+ }
+ },
+ error: function(xhr) {
+ console.log('加载应用列表失败:', xhr.responseText);
+ }
+ });
+ }
+
+ // 页面加载时获取应用列表
+ loadAppList();
// 渲染表格
const variablesTable = table.render({
@@ -131,6 +199,14 @@
{ type: 'checkbox', width: 50 },
{ field: 'id', title: 'ID', width: 80, sort: true },
{ field: 'number', title: '变量编号', width: 180 },
+ {
+ field: 'app_uuid',
+ title: '关联应用',
+ minWidth: 180,
+ templet: function (d) {
+ return getAppName(d.app_uuid);
+ }
+ },
{ field: 'alias', title: '变量别名', minWidth: 150 },
{
field: 'data',
@@ -164,16 +240,24 @@
return formatDateTime(d.created_at);
}
},
- { title: '操作', width: 180, align: 'center', toolbar: '#tpl-variables-ops', fixed: 'right' }
+ { title: '操作', width: 120, align: 'center', toolbar: '#tpl-variables-ops', fixed: 'right' }
]]
});
// 搜索功能
$('#btnSearchVariables').on('click', function () {
+ const searchData = {
+ search: $('input[name="search"]').val()
+ };
+
+ // 添加应用筛选
+ const appUUID = $('select[name="filter_app_uuid"]').val();
+ if (appUUID) {
+ searchData.app_uuid = appUUID;
+ }
+
variablesTable.reload({
- where: {
- search: $('input[name="search"]').val()
- },
+ where: searchData,
page: {
curr: 1
}
@@ -192,10 +276,31 @@
});
});
+ // 监听应用选择变化,实现联动筛选
+ form.on('select(appSelect)', function (data) {
+ const searchData = {
+ search: $('input[name="search"]').val()
+ };
+
+ // 添加应用筛选
+ if (data.value) {
+ searchData.app_uuid = data.value;
+ }
+
+ variablesTable.reload({
+ where: searchData,
+ page: {
+ curr: 1
+ }
+ });
+ });
+
// 新增变量
$('#btnAddVariable').on('click', function () {
$('#variableForm')[0].reset();
$('input[name="id"]').val('');
+ // 确保新增模式下别名输入框是启用的
+ $('input[name="alias"]').prop('disabled', false);
layer.open({
type: 1,
@@ -295,6 +400,9 @@
$('#variableForm')[0].reset();
$('input[name="uuid"]').val(data.uuid);
$('input[name="alias"]').val(data.alias);
+ // 在编辑模式下禁用别名输入框
+ $('input[name="alias"]').prop('disabled', true);
+ $('select[name="app_uuid"]').val(data.app_uuid || '0');
$('textarea[name="data"]').val(data.data);
$('textarea[name="remark"]').val(data.remark);
@@ -310,16 +418,13 @@
$('#variableForm').find('input, select, textarea').each(function () {
var $this = $(this);
var name = $this.attr('name');
- if (name && name !== 'id') {
+ // 编辑模式下排除alias字段,避免修改别名
+ if (name && name !== 'id' && name !== 'alias') {
formData[name] = $this.val();
}
});
- // 验证必填字段
- if (!formData.alias || formData.alias.trim() === '') {
- layer.msg('请输入变量别名', { icon: 2 });
- return;
- }
+ // 验证必填字段(编辑模式下不验证alias)
if (!formData.data || formData.data.trim() === '') {
layer.msg('请输入变量数据', { icon: 2 });
return;