bzd_lxf
/
health_manage


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640
							<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('规则配置')" />
    <style>
        .rule-form-container {
            background-color: #f5f5f5;
            padding: 15px;
            margin-bottom: 20px;
            border-radius: 5px;
        }

        .rule-item {
            background-color: white;
            padding: 15px;
            margin-bottom: 10px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }

        .rule-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
        }

        .rule-title {
            font-weight: bold;
            color: #333;
        }

        .rule-status {
            margin-left: 10px;
        }

        .rule-content {
            color: #666;
            font-size: 14px;
        }

        .rule-actions {
            margin-top: 10px;
        }

        .condition-group {
            background-color: #f9f9f9;
            padding: 10px;
            margin: 10px 0;
            border-left: 3px solid #1ab394;
        }

        .action-group {
            background-color: #f0f8ff;
            padding: 10px;
            margin: 10px 0;
            border-left: 3px solid #5bc0de;
        }
    </style>
</head>
<body class="gray-bg">
<div class="container-fluid">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox">
                <div class="ibox-title">
                    <h5>字段显示规则配置 - <span th:text="${template.templateName}"></span></h5>
                    <div class="ibox-tools">
                        <button class="btn btn-primary btn-sm" onclick="addRule()">
                            <i class="fa fa-plus"></i> 新增规则
                        </button>
                        <button class="btn btn-default btn-sm" onclick="backToList()">
                            <i class="fa fa-arrow-left"></i> 返回
                        </button>
                    </div>
                </div>

                <div class="ibox-content">
                    <!-- 规则列表 -->
                    <div id="ruleList">
                        <!-- 规则项将通过JavaScript动态生成 -->
                    </div>

                    <!-- 暂无规则提示 -->
                    <div id="emptyTip" class="text-center" style="display: none; padding: 50px;">
                        <i class="fa fa-info-circle fa-3x text-muted"></i>
                        <p class="text-muted" style="margin-top: 10px;">暂无配置规则，点击"新增规则"按钮添加</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 新增/编辑规则弹窗 -->
<div class="modal fade" id="ruleModal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title" id="ruleModalTitle">新增规则</h4>
            </div>
            <div class="modal-body">
                <form id="ruleForm" class="form-horizontal">
                    <input type="hidden" name="id" id="ruleId">
                    <input type="hidden" name="templateId" th:value="${templateId}">

                    <div class="form-group">
                        <label class="col-sm-3 control-label is-required">规则名称：</label>
                        <div class="col-sm-8">
                            <input name="ruleName" class="form-control" type="text" placeholder="请输入规则名称" required>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label is-required">触发条件：</label>
                        <div class="col-sm-8">
                            <div class="condition-group">
                                <div class="row">
                                    <div class="col-sm-5">
                                        <select name="triggerFieldCode" class="form-control" required onchange="loadFieldValues(this.value)">
                                            <option value="">选择字段</option>
                                        </select>
                                    </div>
                                    <div class="col-sm-2 text-center">
                                        <span style="line-height: 34px;">等于</span>
                                    </div>
                                    <div class="col-sm-5">
                                        <select name="triggerFieldValue" class="form-control" required>
                                            <option value="">选择值</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="help-block">当选择的字段值满足条件时，触发相应动作</div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label is-required">触发动作：</label>
                        <div class="col-sm-8">
                            <div class="action-group">
                                <div class="row">
                                    <div class="col-sm-4">
                                        <select name="actionType" class="form-control" required onchange="updateActionFields()">
                                            <option value="">选择动作</option>
                                            <option value="show">显示字段</option>
                                            <option value="hide">隐藏字段</option>
                                            <option value="required">设为必填</option>
                                            <option value="optional">设为选填</option>
                                            <option value="enable">启用字段</option>
                                            <option value="disable">禁用字段</option>
                                        </select>
                                    </div>
                                    <div class="col-sm-8">
                                        <select name="targetFieldCodes" class="form-control select2" multiple="multiple" required>
                                            <option value="">选择目标字段</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="help-block">选择要执行的动作和目标字段</div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">规则逻辑：</label>
                        <div class="col-sm-8">
                            <textarea name="ruleLogic" class="form-control" rows="3" placeholder="可选：输入自定义规则逻辑（JavaScript表达式）"></textarea>
                            <div class="help-block">高级功能：自定义JavaScript逻辑，留空使用默认逻辑</div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">状态：</label>
                        <div class="col-sm-8">
                            <div class="radio-box">
                                <input type="radio" id="isEnabled1" name="isEnabled" value="1" checked>
                                <label for="isEnabled1">启用</label>
                            </div>
                            <div class="radio-box">
                                <input type="radio" id="isEnabled0" name="isEnabled" value="0">
                                <label for="isEnabled0">禁用</label>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" onclick="saveRule()">保存</button>
            </div>
        </div>
    </div>
</div>

<!-- 规则测试弹窗 -->
<div class="modal fade" id="testRuleModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">规则测试</h4>
            </div>
            <div class="modal-body">
                <div id="testRuleContent">
                    <!-- 测试内容将动态生成 -->
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: select2-js" />
<script th:inline="javascript">
    var templateId = [[${templateId}]];
    var prefix = ctx + "gxhpz/followTemplateConfig";
    var rules = [];
    var fields = [];
    var currentRule = null;

    $(function() {
        // 初始化select2
        $('.select2').select2({
            placeholder: "请选择目标字段",
            allowClear: true,
            language: 'zh-CN'
        });

        loadRules();
        loadFields();
    });

    // 加载规则列表
    function loadRules() {
        $.ajax({
            url: prefix + "/ruleList",
            type: "POST",
            data: { templateId: templateId },
            success: function(result) {
                if (result.code == 0) {
                    rules = result.rows;
                    renderRules();
                }
            }
        });
    }

    // 加载字段列表
    function loadFields() {
        $.ajax({
            url: prefix + "/getTemplateFields",
            type: "POST",
            data: { templateId: templateId },
            success: function(result) {
                if (result.code == 0) {
                    fields = result.data;
                    updateFieldSelects();
                }
            }
        });
    }

    // 渲染规则列表
    function renderRules() {
        var html = '';
        if (rules.length === 0) {
            $('#ruleList').hide();
            $('#emptyTip').show();
            return;
        }

        $('#emptyTip').hide();
        $('#ruleList').show();

        rules.forEach(function(rule) {
            var statusHtml = rule.isEnabled == 1
                ? '<span class="label label-success">启用</span>'
                : '<span class="label label-default">禁用</span>';

            var actionText = getActionText(rule.actionType);
            var targetFields = rule.targetFieldCodes ? rule.targetFieldCodes.split(',') : [];
            var targetFieldNames = targetFields.map(function(code) {
                var field = fields.find(f => f.fieldCode === code);
                return field ? field.fieldName : code;
            }).join(', ');

            html += '<div class="rule-item">';
            html += '  <div class="rule-header">';
            html += '    <div>';
            html += '      <span class="rule-title">' + rule.ruleName + '</span>';
            html += '      <span class="rule-status">' + statusHtml + '</span>';
            html += '    </div>';
            html += '    <div class="rule-actions">';
            html += '      <button class="btn btn-xs btn-primary" onclick="editRule(' + rule.id + ')"><i class="fa fa-edit"></i> 编辑</button>';
            html += '      <button class="btn btn-xs btn-info" onclick="testRule(' + rule.id + ')"><i class="fa fa-flask"></i> 测试</button>';
            if (rule.isEnabled == 1) {
                html += '      <button class="btn btn-xs btn-warning" onclick="toggleRuleStatus(' + rule.id + ', 0)"><i class="fa fa-ban"></i> 禁用</button>';
            } else {
                html += '      <button class="btn btn-xs btn-success" onclick="toggleRuleStatus(' + rule.id + ', 1)"><i class="fa fa-check"></i> 启用</button>';
            }
            html += '      <button class="btn btn-xs btn-danger" onclick="deleteRule(' + rule.id + ')"><i class="fa fa-trash"></i> 删除</button>';
            html += '    </div>';
            html += '  </div>';
            html += '  <div class="rule-content">';
            html += '    <p><strong>触发条件：</strong>当 <span class="text-primary">' + getFieldName(rule.triggerFieldCode) + '</span> = <span class="text-info">' + rule.triggerFieldValue + '</span> 时</p>';
            html += '    <p><strong>执行动作：</strong>' + actionText + ' <span class="text-success">' + targetFieldNames + '</span></p>';
            if (rule.ruleLogic) {
                html += '    <p><strong>自定义逻辑：</strong><code>' + rule.ruleLogic + '</code></p>';
            }
            html += '  </div>';
            html += '</div>';
        });

        $('#ruleList').html(html);
    }

    // 获取字段名称
    function getFieldName(fieldCode) {
        var field = fields.find(f => f.fieldCode === fieldCode);
        return field ? field.fieldName : fieldCode;
    }

    // 获取动作文本
    function getActionText(actionType) {
        var actionMap = {
            'show': '显示字段',
            'hide': '隐藏字段',
            'required': '设为必填',
            'optional': '设为选填',
            'enable': '启用字段',
            'disable': '禁用字段'
        };
        return actionMap[actionType] || actionType;
    }

    // 更新字段选择框
    function updateFieldSelects() {
        // 更新触发字段选择框
        var triggerOptions = '<option value="">选择字段</option>';
        fields.forEach(function(field) {
            triggerOptions += '<option value="' + field.fieldCode + '">' + field.fieldName + '</option>';
        });
        $('select[name="triggerFieldCode"]').html(triggerOptions);

        // 更新目标字段选择框
        var targetOptions = '';
        fields.forEach(function(field) {
            targetOptions += '<option value="' + field.fieldCode + '">' + field.fieldName + '</option>';
        });
        $('select[name="targetFieldCodes"]').html(targetOptions);
        $('select[name="targetFieldCodes"]').select2('destroy').select2({
            placeholder: "请选择目标字段",
            allowClear: true,
            language: 'zh-CN'
        });
    }

    // 加载字段值选项
    function loadFieldValues(fieldCode) {
        if (!fieldCode) {
            $('select[name="triggerFieldValue"]').html('<option value="">选择值</option>');
            return;
        }

        var field = fields.find(f => f.fieldCode === fieldCode);
        if (!field) return;

        var valueOptions = '<option value="">选择值</option>';

        // 根据字段类型设置选项
        if (field.fieldType === 'radio' || field.fieldType === 'select') {
            // 这里应该从字段配置中获取选项，暂时使用默认值
            if (fieldCode === 'iscoordinate' || fieldCode === 'medicationStatus') {
                valueOptions += '<option value="是">是</option>';
                valueOptions += '<option value="否">否</option>';
            } else if (fieldCode === 'returnMethod') {
                valueOptions += '<option value="电话">电话</option>';
                valueOptions += '<option value="微信">微信</option>';
                valueOptions += '<option value="面访">面访</option>';
            } else {
                // 默认选项
                valueOptions += '<option value="选项1">选项1</option>';
                valueOptions += '<option value="选项2">选项2</option>';
                valueOptions += '<option value="选项3">选项3</option>';
            }
        } else if (field.fieldType === 'checkbox') {
            valueOptions += '<option value="包含">包含特定选项</option>';
            valueOptions += '<option value="不包含">不包含特定选项</option>';
        } else {
            valueOptions += '<option value="非空">非空</option>';
            valueOptions += '<option value="为空">为空</option>';
        }

        $('select[name="triggerFieldValue"]').html(valueOptions);
    }

    // 更新动作字段
    function updateActionFields() {
        var actionType = $('select[name="actionType"]').val();
        // 可以根据不同的动作类型过滤可选字段
    }

    // 新增规则
    function addRule() {
        currentRule = null;
        $('#ruleModalTitle').text('新增规则');
        $('#ruleForm')[0].reset();
        $('#ruleId').val('');
        $('select[name="targetFieldCodes"]').val(null).trigger('change');
        $('#ruleModal').modal('show');
    }

    // 编辑规则
    function editRule(id) {
        currentRule = rules.find(r => r.id === id);
        if (!currentRule) return;

        $('#ruleModalTitle').text('编辑规则');
        $('#ruleId').val(currentRule.id);
        $('input[name="ruleName"]').val(currentRule.ruleName);
        $('select[name="triggerFieldCode"]').val(currentRule.triggerFieldCode);

        // 加载字段值选项后设置值
        loadFieldValues(currentRule.triggerFieldCode);
        setTimeout(function() {
            $('select[name="triggerFieldValue"]').val(currentRule.triggerFieldValue);
        }, 100);

        $('select[name="actionType"]').val(currentRule.actionType);

        // 设置目标字段
        var targetFields = currentRule.targetFieldCodes ? currentRule.targetFieldCodes.split(',') : [];
        $('select[name="targetFieldCodes"]').val(targetFields).trigger('change');

        $('textarea[name="ruleLogic"]').val(currentRule.ruleLogic || '');
        $('input[name="isEnabled"][value="' + currentRule.isEnabled + '"]').prop('checked', true);

        $('#ruleModal').modal('show');
    }

    // 保存规则
    function saveRule() {
        if (!$('#ruleForm').valid()) {
            return;
        }

        var formData = $('#ruleForm').serializeArray();
        var data = {};
        formData.forEach(function(item) {
            if (item.name === 'targetFieldCodes') {
                if (!data[item.name]) {
                    data[item.name] = [];
                }
                data[item.name].push(item.value);
            } else {
                data[item.name] = item.value;
            }
        });

        // 将目标字段数组转换为逗号分隔的字符串
        if (data.targetFieldCodes && Array.isArray(data.targetFieldCodes)) {
            data.targetFieldCodes = data.targetFieldCodes.join(',');
        }

        var url = currentRule ? prefix + "/updateRule" : prefix + "/saveRule";

        $.ajax({
            url: url,
            type: "POST",
            data: data,
            success: function(result) {
                if (result.code == 0) {
                    $.modal.alertSuccess("保存成功");
                    $('#ruleModal').modal('hide');
                    loadRules();
                } else {
                    $.modal.alertError(result.msg);
                }
            }
        });
    }

    // 测试规则
    function testRule(id) {
        var rule = rules.find(r => r.id === id);
        if (!rule) return;

        var html = '<div class="form-horizontal">';
        html += '<div class="form-group">';
        html += '  <label class="col-sm-4 control-label">规则名称：</label>';
        html += '  <div class="col-sm-8"><p class="form-control-static">' + rule.ruleName + '</p></div>';
        html += '</div>';
        html += '<div class="form-group">';
        html += '  <label class="col-sm-4 control-label">触发条件：</label>';
        html += '  <div class="col-sm-8">';
        html += '    <select class="form-control" id="testTriggerValue">';
        html += '      <option value="">请选择' + getFieldName(rule.triggerFieldCode) + '的值</option>';

        // 添加测试选项
        $('select[name="triggerFieldValue"] option').each(function() {
            if ($(this).val()) {
                html += '<option value="' + $(this).val() + '">' + $(this).text() + '</option>';
            }
        });

        html += '    </select>';
        html += '  </div>';
        html += '</div>';
        html += '<div class="form-group">';
        html += '  <label class="col-sm-4 control-label">测试结果：</label>';
        html += '  <div class="col-sm-8">';
        html += '    <div id="testResult" class="alert alert-info" style="display: none;"></div>';
        html += '  </div>';
        html += '</div>';
        html += '</div>';

        $('#testRuleContent').html(html);

        // 绑定测试事件
        $('#testTriggerValue').change(function() {
            var value = $(this).val();
            var resultHtml = '';

            if (value === rule.triggerFieldValue) {
                resultHtml = '<i class="fa fa-check-circle text-success"></i> 规则触发！<br>';
                resultHtml += '执行动作：' + getActionText(rule.actionType) + ' ';

                var targetFields = rule.targetFieldCodes ? rule.targetFieldCodes.split(',') : [];
                var targetFieldNames = targetFields.map(function(code) {
                    return getFieldName(code);
                }).join(', ');

                resultHtml += '<strong>' + targetFieldNames + '</strong>';
                $('#testResult').removeClass('alert-warning').addClass('alert-success');
            } else {
                resultHtml = '<i class="fa fa-times-circle text-warning"></i> 规则未触发';
                $('#testResult').removeClass('alert-success').addClass('alert-warning');
            }

            $('#testResult').html(resultHtml).show();
        });

        $('#testRuleModal').modal('show');
    }

    // 切换规则状态
    function toggleRuleStatus(id, status) {
        var statusText = status == 1 ? "启用" : "禁用";
        $.modal.confirm("确认要" + statusText + "该规则吗？", function() {
            $.ajax({
                url: prefix + "/updateRuleStatus",
                type: "POST",
                data: {
                    id: id,
                    isEnabled: status
                },
                success: function(result) {
                    if (result.code == 0) {
                        $.modal.alertSuccess(statusText + "成功");
                        loadRules();
                    } else {
                        $.modal.alertError(result.msg);
                    }
                }
            });
        });
    }

    // 删除规则
    function deleteRule(id) {
        $.modal.confirm("确认要删除该规则吗？", function() {
            $.ajax({
                url: prefix + "/deleteRule",
                type: "POST",
                data: { id: id },
                success: function(result) {
                    if (result.code == 0) {
                        $.modal.alertSuccess("删除成功");
                        loadRules();
                    } else {
                        $.modal.alertError(result.msg);
                    }
                }
            });
        });
    }

    // 返回列表
    function backToList() {
        var url = ctx + 'gxhpz/followTemplateConfig';
        $.modal.openTab("随访模版配置", url);
    }

    // 表单验证
    $("#ruleForm").validate({
        rules: {
            ruleName: {
                required: true,
                maxlength: 100
            },
            triggerFieldCode: {
                required: true
            },
            triggerFieldValue: {
                required: true
            },
            actionType: {
                required: true
            },
            targetFieldCodes: {
                required: true
            }
        },
        messages: {
            ruleName: {
                required: "请输入规则名称",
                maxlength: "规则名称不能超过100个字符"
            },
            triggerFieldCode: {
                required: "请选择触发字段"
            },
            triggerFieldValue: {
                required: "请选择触发值"
            },
            actionType: {
                required: "请选择动作类型"
            },
            targetFieldCodes: {
                required: "请选择目标字段"
            }
        }
    });
</script>
</body>
</html>