HTCloud/HT.Cloud.Web/Areas/SystemManage/Views/Flowscheme/LineInfo.cshtml

@{
    ViewBag.Title = "Form";
    Layout = "~/Views/Shared/_Form.cshtml";
}
<div class="layui-input-item layui-hide" id="divInputTemplate">
    <label class="layui-form-label required">条件规则</label>
    <div class="layui-input-block" style="padding-right: 70px;">
        <div class="layui-input-block" style="margin-left:0px">
            <select id="ComparesCondition" name="ComparesCondition" lay-verify="required" lay-search>
                <option value="and" selected>并且</option>
                <option value="or">或者</option>
            </select>
        </div>
        <div class="layui-input-inline" style="width:145px">
            <select id="ComparesFieldName" name="ComparesFieldName" lay-verify="required" lay-search>
                <option value="" selected>请选择</option>
            </select>
        </div>
        <div class="layui-input-inline" style="width:100px">
            <select id="ComparesOperation" name="ComparesOperation" lay-verify="required" lay-search>
                <option value="" selected>请选择</option>
                <option value=">">></option>
                <option value=">=">>=</option>
                <option value="<"><</option>
                <option value="<="><=</option>
                <option value="=">=</option>
                <option value="!=">!=</option>
                <option value="in">in</option>
                <option value="not in">not in</option>
            </select>
        </div>
        <div class="layui-input-inline" style="width:180px">
            <input type="text" id="ComparesName" name="ComparesName" class="layui-input" lay-verify="required" value="" placeholder="请输入值">
            <input type="text" id="ComparesValue" name="ComparesValue" lay-verify="required" class="layui-input layui-hide">
        </div>
        <button class="layui-btn layui-btn-danger" style="position: absolute;top: 0;right: 6px;cursor: pointer;" onclick="deleteRule('divInputTemplate')"><i class="layui-icon">&#xe67e;</i></button>
        <button class="layui-btn layui-btn-primary" style="position: absolute;top: 0;right: 6px;cursor: pointer;margin-top:40px" onclick="search(searchCout)">...</button>
    </div>
</div>
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form layuimini-form" lay-filter="adminform">
            <div class="layui-form-item">
                <label class="layui-form-label">连线标识</label>
                <div class="layui-input-block">
                    <input type="text" name="LineCode" id="LineCode" readonly lay-verify="required"
                           placeholder="连线编号" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">连线名称</label>
                <div class="layui-input-block">
                    <input type="text" name="LineName" id="LineName" required lay-verify="required"
                           placeholder="连线名称" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">源节点</label>
                <div class="layui-input-block">
                    <input type="text" name="NodeForm" id="NodeForm" readonly lay-verify="required"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">目标节点</label>
                <div class="layui-input-block">
                    <input type="text" name="NodeTo" id="NodeTo" readonly lay-verify="required"
                           class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">连线条件</label>
                <div class="layui-input-block" style="padding-right: 70px;">
                    <button id="NF-add" class="layui-btn"><i class="layui-icon">&#xe654;</i></button>
                </div>
            </div>
            <div id="ruledata">
            </div>
        </div>
    </div>
</div>
<script>
    var FlowDesignObject, valueList;
    function initForm(data) {
        FlowDesignObject = data.FlowDesignObject;
        valueList = data.valueList;
    }
    layui.use(['form', 'layer', 'element', 'jquery', 'common', 'optimizeSelectOption'], function () {
        var layer = layui.layer,
            $ = layui.jquery,
            common = layui.common;
        var form = layui.form;
        var Method = $.request("Method");
        //从flowschemes.js进入的节点信息
        var line = FlowDesignObject;
        var valuelist = valueList;
        $('#ComparesFieldName').append($("<option></option>").val("申请人").html("申请人"));
        $('#ComparesFieldName').append($("<option></option>").val("所属部门").html("所属部门"));
        for (var i = 0; i < valuelist.length; i++) {
            $('#ComparesFieldName').append($("<option></option>").val(valuelist[i]).html(valuelist[i]));
        }
        var tmp = {
            LineName: line.name,
            LineCode: line.id,//默认的code
            NodeForm: line.from,
            NodeTo: line.to,
            ComparesOperation0: "",
            ComparesFieldName0: "",
            ComparesValue0: "",
            ComparesName0: "",
            ComparesCondition0: "and",
        };
        var cout = 0;
        $(document).on('click', '#NF-add', function () {
            var target = $('#ruledata');
            var html = $("#divInputTemplate").prop("outerHTML");
            html = html.replace(/ComparesFieldName/g, "ComparesFieldName" + cout); // 替换多个
            html = html.replace(/条件规则/g, "条件规则" + (cout + 1)); // 替换多个
            html = html.replace(/ComparesOperation/g, "ComparesOperation" + cout); // 替换多个
            html = html.replace(/ComparesValue/g, "ComparesValue" + cout); // 替换多个
            html = html.replace(/ComparesName/g, "ComparesName" + cout); // 替换多个
            html = html.replace(/ComparesCondition/g, "ComparesCondition" + cout); // 替换多个
            html = html.replace(/divInputTemplate/g, "divInput" + cout);
            html = html.replace(/searchCout/g, cout);
            var obj = $(html);
            obj.removeClass("layui-hide");
            obj.appendTo(target);
            cout++;
            form.render();
        });
        //初始化节点设置信息
        if (!!line.Compares) {
            for (var i = 0; i < line.Compares.length; i++) {
                $('#NF-add').click();
                tmp['ComparesOperation' + i] = line.Compares[i].Operation;
                tmp['ComparesFieldName' + i] = line.Compares[i].FieldName;
                tmp['ComparesValue' + i] = line.Compares[i].Value;
                tmp['ComparesName' + i] = line.Compares[i].Name;
                tmp['ComparesCondition' + i] = line.Compares[i].Condition;
            }
        }
        else {
            if (Method != "Details") {
                $('#NF-add').click();
            }
        }
        if (Method == "Details") {
            var readForm = layui.$('[lay-filter="adminform"]');
            readForm.find('button').prop('disabled', true);
            common.setReadOnly('adminform');
        }
        common.val('adminform', tmp);
        form.render(); //重新渲染，防止radio/select等失效
        wcLoading.close();
        //select验证
        form.verify({
            required: function (value, item) {
                var msg = "必填项不能为空";
                value = $.trim(value);
                var isEmpty = !value || value.length < 1;
                // 当前验证元素是select且为空时,将页面定位至layui渲染的select处，或自定义想定位的位置
                if (item.tagName == 'SELECT' && isEmpty) {
                    $("html").animate({
                        scrollTop: $(item).siblings(".layui-form-select").offset().top - 74
                    }, 50);
                }
                if (isEmpty) {
                    return msg;
                }
            }
        });
        //提供给上父页面调用
        getVal = function () {
            tmp.LineName = $('#LineName').val();
            var result = {
                LineName: tmp.LineName,
                LineCode: tmp.LineCode,
                Compares: [],
            };
            for (var i = 0; i < cout; i++) {
                var FieldName = $('#ComparesFieldName' + i).val();
                if (!FieldName) {
                    continue;
                }
                var Operation = $('#ComparesOperation' + i).val();
                var Value = $('#ComparesValue' + i).val();
                var Name = $('#ComparesName' + i).val();
                var Condition = $('#ComparesCondition' + i).val();
                if (!Value) {
                    Value = Name;
                }
                var temp = { //节点指定操作人
                    FieldName: FieldName,
                    Operation: Operation,
                    Value: Value,
                    Name: Name,
                    Condition: Condition,
                };
                result.Compares.push(temp);
            }
            return result;
        }
    })
    function deleteRule(data) {
        var obj = document.getElementById(data);//建议使用ID
        if (obj != null) {
            obj.parentNode.removeChild(obj);
        }
        layui.use(['jquery', 'form'], function () {
            layui.form.render();
        });
    }
    function search(data) {
        var fields = $('#ComparesFieldName' + data).val();
        if (fields != '申请人' && fields != '所属部门') {
            return false;
        }
        $('#ComparesName' + data).val(null);
        $('#ComparesValue' + data).val(null);
        layui.use(['jquery', 'form', 'common'], function () {
            var form = layui.form,
                $ = layui.$,
                common = layui.common;
            //不同弹窗
            if (fields == '申请人') {
                common.modalOpen({
                    title: "选择用户",
                    url: "/SystemOrganize/User/AddForm?name=" + "ComparesName" + data + "&value=" + "ComparesValue" + data,
                    width: "650px",
                    height: "600px",
                });
            }
            else if (fields == '所属部门') {
                common.modalOpen({
                    title: "选择组织",
                    url: "/SystemOrganize/Organize/AddForm?name=" + "ComparesName" + data + "&value=" + "ComparesValue" + data,
                    width: "650px",
                    height: "600px",
                });
            }
            else {
                return false;
            }
        });
    }
</script>