HGSRM/WMS-BS/NFine.Web/Areas/DHAY/Views/IQCQuality/CheckGroupEdit.cshtml


@{
    ViewBag.Title = "";
    Layout = "~/Views/Shared/_Form.cshtml";
}
<script src="~/Content/js/datepicker/WdatePicker.js"></script>
<!--引入 element-ui 的样式，-->
<link rel="stylesheet" href="~/Content/element-ui/lib/theme-chalk/index.css">
<script src="~/Content/vue/dist/vue.js"></script>
<script src="~/Content/element-ui/lib/index.js"></script>

<script src="~/Content/axios.min.js"></script>
<style>
</style>
<form id="form1">
    <div id="app">
        <template>
            <el-form ref="form" :model="form" :rules="rules" label-width="120px">
                <el-divider>主表信息</el-divider>
                <el-row :gutter="24">
                    <el-col :span="6">
                        <el-form-item label="检验项目组代码" prop="GroupCode">
                            <el-input v-model="form.GroupCode" placeholder="请输入内容" size="mini" :disabled="disabled4RulesCode"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                        <el-form-item label="检验项目组名称" prop="GroupName">
                            <el-input v-model="form.GroupName" placeholder="请输入内容" size="mini"></el-input>
                        </el-form-item>
                    </el-col>
                    @*<el-col :span="6">
                            <el-form-item label="Aql描述" prop="RulesDesc">
                                <el-input v-model="form.RulesDesc" placeholder="请输入内容" size="mini"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="Aql类别" prop="Type">
                                <el-input v-model="form.Type" placeholder="请输入内容" size="mini"></el-input>
                            </el-form-item>
                        </el-col>*@
                    @*<el-col :span="6">
                            <el-form-item label="维护人" prop="MUSERName">
                                <el-input v-model="form.MUSERName" placeholder="请输入内容" size="mini"></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="6">
                            <el-form-item label="维护时间" prop="MTIME">
                                <el-input v-model="form.MTIME" placeholder="请输入内容" size="mini"></el-input>
                            </el-form-item>
                        </el-col>*@
                </el-row>
                <el-row :gutter="24">
                    <el-col :span="6">
                        <el-form-item label="启用" prop="Enable">
                            <el-switch v-model="form.Enable" active-color="#13ce66" inactive-color="#ff4949">
                            </el-switch>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-divider>子表信息</el-divider>
                <el-row :gutter="24">
                    <el-col :span="24">
                        @*<el-button type="primary" size="mini" v-on:click="addLine()">新增</el-button>*@
                        <a id="NF-Add" authorize="no" style="margin-left:3px;" class="btn btn-primary" v-on:click="addLine()"><i class="fa fa-pencil-square-o"></i>新增</a>
                    </el-col>
                </el-row>
                <el-row :gutter="24">
                    @*<el-col :span="2">

                        </el-col>*@
                    <el-col :span="24">
                        <el-table ref="singleTable" highlight-current-row
                                  :data="dataSource4Detail"
                                  style="width: 100%"
                                  stripe border
                                  size="mini"
                                  height="500"
                                  v-on:current-change="handleCurrentChange">
                            <el-table-column prop="EATTRIBUTE6" label="检验类型" width="140">
                                <template slot-scope="scope">
                                    <el-select v-model="scope.row.EATTRIBUTE6" placeholder="请选择" size="mini">
                                        <el-option v-for="item in dataSourceType"
                                                   :key="item.Code"
                                                   :label="item.Name"
                                                   :value="item.Code">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-table-column>
                            @*<el-table-column type="index" width="50"></el-table-column>*@
                            <el-table-column prop="ListCode" label="检验项目代码" width="140">
                                <template slot-scope="scope">
                                    <!-- 新增 filterable 和 filter-method 属性 -->
                                    <el-select v-model="scope.row.ListCode"
                                               placeholder="请选择或输入"
                                               size="mini"
                                               filterable
                                               :filter-method="(val) => filterListCode(val, scope.$index)"
                                               v-on:change="(val) => ListCodeChange(val, scope.$index)">
                                        <el-option v-for="item in scope.row.filteredListCode || dataSourceListCode"
                                                   :key="item.Code"
                                                   :label="item.Name"
                                                   :value="item.Code">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-table-column>
                            <el-table-column prop="ListName" label="检验项目名称" width="140">
                                <template slot-scope="scope">
                                    <el-input v-model="scope.row.ListName" controls-position="right" size="small" disabled="disabled"></el-input>
                                </template>
                            </el-table-column>
                            <el-table-column prop="SetValueMin" label="标准下限" width="140">
                                <template slot-scope="scope">
                                    <el-input-number v-model="scope.row.SetValueMin" controls-position="right" :min="0" size="small"></el-input-number>
                                </template>
                            </el-table-column>
                            <el-table-column prop="SetValueMax" label="标准上限" width="140">
                                <template slot-scope="scope">
                                    <el-input-number v-model="scope.row.SetValueMax" controls-position="right" :min="0" size="small"></el-input-number>
                                </template>
                            </el-table-column>
                            <el-table-column prop="Unit" label="单位" width="140">
                                <template slot-scope="scope">
                                    <el-select v-model="scope.row.Unit" placeholder="请选择" size="mini">
                                        <el-option v-for="item in dataSourceUom"
                                                   :key="item.Name"
                                                   :label="item.Name"
                                                   :value="item.Name">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-table-column>
                            <el-table-column prop="EATTRIBUTE7" label="检验仪器" width="140">
                                <template slot-scope="scope">
                                    <!-- 新增 filterable 和 filter-method，绑定检验仪器的查询方法 -->
                                    <el-select v-model="scope.row.EATTRIBUTE7"
                                               placeholder="请选择或输入"
                                               size="mini"
                                               filterable
                                               :filter-method="(val) => filterDevice(val, scope.$index)">
                                        <!-- 优先使用过滤后的选项，无过滤时显示原始数据源 -->
                                        <el-option v-for="item in scope.row.filteredDevice || dataSourceDevice"
                                                   :key="item.Name"
                                                   :label="item.Name"
                                                   :value="item.Name">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-table-column>
                            <el-table-column prop="EATTRIBUTE1" label="检验标准" width="140">
                                <template slot-scope="scope">
                                    <el-input v-model="scope.row.EATTRIBUTE1" controls-position="right" size="small"></el-input>
                                </template>
                            </el-table-column>
                            @*<el-table-column prop="EATTRIBUTE2" label="抽样水准" width="140">
                                    <template slot-scope="scope">
                                        <el-input v-model="scope.row.EATTRIBUTE2" controls-position="right" size="small"></el-input>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="EATTRIBUTE3" label="允收标准" width="140">
                                    <template slot-scope="scope">
                                        <el-input v-model="scope.row.EATTRIBUTE3" controls-position="right" size="small"></el-input>
                                    </template>
                                </el-table-column>*@
                            <el-table-column prop="EATTRIBUTE4" label="检验实际值是否必填" width="150">
                                <template slot-scope="scope">
                                    <el-switch v-model="scope.row.EATTRIBUTE4" active-color="#13ce66" inactive-color="#ff4949">
                                    </el-switch>
                                </template>
                            </el-table-column>
                            <el-table-column prop="EATTRIBUTE5" label="AQL代码" width="140">
                                <template slot-scope="scope">
                                    <!-- 新增 filterable 和 filter-method，绑定AQL代码的查询方法 -->
                                    <el-select v-model="scope.row.EATTRIBUTE5"
                                               placeholder="请选择或输入"
                                               size="mini"
                                               filterable
                                               :filter-method="(val) => filterAqlCode(val, scope.$index)">
                                        <!-- 优先使用过滤后的选项，无过滤时显示原始数据源 -->
                                        <el-option v-for="item in scope.row.filteredAqlCode || dataSourceAql"
                                                   :key="item.Code"
                                                   :label="item.Code"
                                                   :value="item.Code">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-table-column>

                            <el-table-column prop="Enable" label="启用" width="150">
                                <template slot-scope="scope">
                                    <el-switch v-model="scope.row.Enable" active-color="#13ce66" inactive-color="#ff4949">
                                    </el-switch>
                                </template>
                            </el-table-column>
                            <el-table-column label="操作">
                                <template slot-scope="scope">
                                    <a id="NF-Delete" authorize="yes" class="btn btn-primary" v-on:click="handleDelete(scope.$index, scope.row)"><i class="fa fa-trash-o"></i>删除</a>
                                    @*<el-button size="mini" type="danger" v-on:click="handleDelete(scope.$index, scope.row)">删除</el-button>*@
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-col>
                    @*<el-col :span="2">
                            &nbsp;  &nbsp;
                        </el-col>*@
                </el-row>
            </el-form>
        </template>
    </div>
</form>

<script type="text/javascript">
    //const { Console } = require("node:console");
     var Muser = '@NFine.Code.OperatorProvider.Provider.GetCurrent().UserCode'
    var date = GetDate();
    var CurrentRow = 0;
    var vm = new Vue({
        el: '#app',
        data: {
            id:'',
            userCode: "",
            ssList: [],
            dataSourceType: [],
            dataSourceUom: [],
            dataSourceListCode: [],
            dataSourceAql: [],
            dataSourceDevice: [],
            form: {},
            detail: {
                key: 0,
                ListCode: '',
                ListName:'',
                SetValueMin: 0,
                SetValueMax: 0,
                SampleQuantity: 0,
                Unit: '',
                Enable:true,
                EATTRIBUTE1: '',
                //EATTRIBUTE2: '',
                //EATTRIBUTE3: '',
                EATTRIBUTE4: '',
                EATTRIBUTE5: '',
                EATTRIBUTE6: '',
                EATTRIBUTE7: '',
            },
            dataSource4Detail: [],
            disabled4SetValue: false,
            currentRow: null,
            rules: {
                GroupCode: [{ required: true, message: '请输入', trigger: 'blur' },],
                GroupName: [{ required: true, message: '请输入', trigger: 'blur' },],

            },
            disabled4RulesCode:false,
        },
        //挂在DOM 触发
        mounted() {
            let reactiveObject = {
                GroupCode: '',
                GroupName: '',
                Enable: true,
                DetailList: [],
            };
            this.form = reactiveObject;

        // this.loadGrid();
        // this.show();
            this.id = '@ViewData["ids"]';
            this.initControl();
            this.getType();
            this.getListCode();
            this.getUom();
            this.getDevice();
            this.getAql();
           // console.log(this.id);
        },
        beforeDestroy() {
        // this.autoScrol1(true);

        },
        methods: {
            initControl: function () {
                let that = this;
                let orgName = '';
                this.disabled4RulesCode = this.id ? true : false;
                let userName = '@NFine.Code.OperatorProvider.Provider.GetCurrent().UserName';
                //  console.log(userName);
                this.getData();

            },
            //change4EATTRIBUTE6(val) {
            //    debugger;
            //   console.log(val);
            //    let currentSelect = this.dataSourceType.filter(x => x.Code == val)[0];
            //    console.log(currentSelect);
            //    if (currentSelect)
            //        this.disabled4SetValue = currentSelect.Name == "尺寸" ? false : true;
            //    else {
            //        this.disabled4SetValue = true;
            //    }
            //},
            getData() {
                if (!this.id) return;

                axios
                    .get('/DHAY/IQCQuality/GetGroup?keyValue=' + this.id)
                    .then(function (res) {
                       // console.log(res.data);
                        //this.ssList = res.data;
                        //if (res.data != null) {
                        //    res.data.forEach(function (el, i) {
                        //        Vue.set(vm.ssList, i, el)
                        //    });
                        //}
                        debugger;
                        if (res.data) {
                            for (var i in res.data) {
                                Vue.set(vm.form, i, res.data[i]);
                            }

                            res.data.DetailList.forEach(function (el, i) {
                                debugger;
                                if (el.EATTRIBUTE4 == "true") {
                                    el.EATTRIBUTE4 = true;
                                }
                                else
                                {
                                    el.EATTRIBUTE4 = false;
                                }
                                if (el.Enable == "1") {
                                    el.Enable = true;
                                }
                                else {
                                    el.Enable = false;
                                }
                                Vue.set(vm.dataSource4Detail, i, el)

                            });
                        }
                    })
                    .catch(function (error) { // 请求失败处理
                        alert(error);
                    });
            },
            getType() {
                axios
                    .get('/WMS/BasicSettings/GetICSType?Type=EATTRIBUTE6&TableCode=ICSInspectionList')
                    .then(function (res) {

                        if (res.data) {
                            res.data.forEach(function (el, i) {
                                Vue.set(vm.dataSourceType, i, el)
                            });
                        }
                    })
                    .catch(function (error) { // 请求失败处理
                        alert(error);
                    });
            },
            getListCode() {
                axios
                    .get('/WMS/BasicSettings/GetInspectListCode')
                    .then(function (res) {

                        if (res.data) {
                            res.data.forEach(function (el, i) {
                                Vue.set(vm.dataSourceListCode, i, el)
                            });
                        }
                    })
                    .catch(function (error) { // 请求失败处理
                        alert(error);
                    });
            },
            getAql() {
                axios
                    .get('/DHAY/IQCQuality/GetICSAql')
                    .then(function (res) {

                        if (res.data) {
                            res.data.forEach(function (el, i) {
                                Vue.set(vm.dataSourceAql, i, el)
                            });
                        }
                    })
                    .catch(function (error) { // 请求失败处理
                        alert(error);
                    });
            },
            getUom() {
                axios
                    .get('/WMS/BasicSettings/GetUom')
                    .then(function (res) {

                        if (res.data) {
                            res.data.forEach(function (el, i) {
                                Vue.set(vm.dataSourceUom, i, el)
                            });
                        }
                    })
                    .catch(function (error) { // 请求失败处理
                        alert(error);
                    });
            },
            getDevice() {
                axios
                    .get('/WMS/BasicSettings/GetDevice')
                    .then(function (res) {

                        if (res.data) {
                            res.data.forEach(function (el, i) {
                                Vue.set(vm.dataSourceDevice, i, el)
                            });
                        }
                    })
                    .catch(function (error) { // 请求失败处理
                        alert(error);
                    });
            },
            // 【新增】检验项目代码模糊查询方法
            filterListCode(inputVal, index) {
                const row = this.dataSource4Detail[index];
                if (!inputVal) {
                    // 输入为空时，显示所有原始选项
                    row.filteredListCode = null;
                    return;
                }
                // 模糊查询：输入值匹配 编码（Code）或 名称（Name），不区分大小写
                row.filteredListCode = this.dataSourceListCode.filter(item =>
                    item.Code.toLowerCase().includes(inputVal.toLowerCase()) ||
                    item.Name.toLowerCase().includes(inputVal.toLowerCase())
                );
            },
            // 【新增】检验仪器模糊查询方法
            filterDevice(inputVal, index) {
                const row = this.dataSource4Detail[index];
                if (!inputVal) {
                    // 输入为空时，显示所有原始选项
                    row.filteredDevice = null;
                    return;
                }
                // 模糊查询：输入值匹配检验仪器名称（Name），不区分大小写
                row.filteredDevice = this.dataSourceDevice.filter(item =>
                    item.Name.toLowerCase().includes(inputVal.toLowerCase())
                );
            },
            // 【新增】AQL代码模糊查询方法
            filterAqlCode(inputVal, index) {
                const row = this.dataSource4Detail[index];
                if (!inputVal) {
                    // 输入为空时，显示所有原始选项
                    row.filteredAqlCode = null;
                    return;
                }
                // 模糊查询：输入值匹配 AQL代码（Code）或 名称（Name），不区分大小写
                row.filteredAqlCode = this.dataSourceAql.filter(item =>
                    item.Code.toLowerCase().includes(inputVal.toLowerCase())
                );
            },
            addLine() {
                // 不修改原数组的情况下获取最大key
                let maxKey = 0;
                if (this.dataSource4Detail.length > 0) {
                    // 使用reduce替代sort来获取最大key，避免改变原数组顺序
                    maxKey = this.dataSource4Detail.reduce((max, item) => {
                        return item.key > max ? item.key : max;
                    }, 0);
                }

                let obj = {
                    key: maxKey + 1,  // 确保key始终递增
                    ListCode: '',
                    ListName: '',  // 注意修正了拼写错误
                    SetValueMin: 0,
                    SetValueMax: 0,
                    SampleQuantity: 0,
                    Unit: '',
                    Enable: true,
                    EATTRIBUTE1: '',
                    //EATTRIBUTE2: '',
                    //EATTRIBUTE3: '',
                    EATTRIBUTE4: true,
                    EATTRIBUTE5: '',
                    EATTRIBUTE6: '',
                    EATTRIBUTE7: '',
                    filteredListCode: null,  // 【新增】过滤后的选项临时存储字段
                    filteredDevice: null,    // 检验仪器过滤字段（原有）
                    filteredAqlCode: null    // 【新增】AQL代码过滤字段
                };
                this.dataSource4Detail.push(obj);
            },
            //删除行
            handleDelete(index, row) {
               // console.log(index, row);
                this.dataSource4Detail = this.dataSource4Detail.filter(x => x.key != row.key);
            },
            //选中行变化
            handleCurrentChange(val) {
                this.currentRow = val;
               // console.log(val);
            },
            CurrentRowClick(row, column, event) {
                CurrentRow = row.key;
            },
            CurrentCellClick(row, column, event) {
                CurrentRow = row.key;
            },
            ListCodeChange(val, index) {
                // 如果未选择值则清空名称
                if (!val) {
                    this.dataSource4Detail[index].ListName = '';
                    return;
                }

                axios
                    .get('/WMS/BasicSettings/GetListName?ListCode=' + val)
                    .then(function (res) {
                        if (res.data && res.data[0].ListName) {
                            // 填充当前行的检验项目名称
                            vm.dataSource4Detail[index].ListName = res.data[0].ListName;
                        } else {
                            // 未找到对应名称时清空
                            vm.dataSource4Detail[index].ListName = '';
                        }
                    })
                    .catch(function (error) {
                        alert('获取检验项目名称失败：' + error);
                    });
            },
            submitCheck() {
                debugger;
                this.dataSource4Detail = this.dataSource4Detail.sort((a, b) => a.SetValueMin - b.SetValueMin);
                if (this.dataSource4Detail.length == 0) {
                    $.modalMsg("必须存在规则信息行", "warning");
                    return false;
                }

                let allNum = [];
                //debugger;
                for (var i = 0; i < this.dataSource4Detail.length; i++) {
                    let item = this.dataSource4Detail[i];
                    if(item.Enable == true)
                    {
                        debugger;
                        if (item.EATTRIBUTE5=="")
                        {
                            $.modalMsg("当启用时,AQL值必选必填,行号 " + (i + 1), "warning");
                            return false;
                        }

                    }
                    if (item.EATTRIBUTE6 == '') {
                        $.modalMsg("第" + (i + 1)+"行检验类型不能为空!", "warning");
                        return false;
                    }
                    if (item.ListCode == '') {
                        $.modalMsg("第" + (i + 1) + "行检验项目代码不能为空!", "warning");
                        return false;
                    }
                    if (item.EATTRIBUTE6 == "Size") {
                        if ( item.SetValueMax==='' || item.SetValueMin==='') {
                            $.modalMsg("当属性为定量时,最大值最小值单位必填,行号 " + (i + 1), "warning");
                            return false;
                        }
                        // 2. 额外校验：必须是有效数字（避免输入字母、符号等）
                        const minNum = Number(item.SetValueMin);
                        const maxNum = Number(item.SetValueMax);
                        if (isNaN(minNum) || isNaN(maxNum)) {
                            $.modalMsg("当属性为定量时,最大值最小值必须为有效数字,行号 " + (i + 1), "warning");
                            return false;
                        }
                        if (item.SetValueMin != 0 || item.SetValueMax != 0) {
                            if (item.SetValueMin >= item.SetValueMax) {
                                $.modalMsg("下限必须小于上限,行号 " + (i + 1), "warning");
                                return false;
                            }
                        }
                        if (item.Unit == '' || item.EATTRIBUTE7 == '') {
                            $.modalMsg("当属性为定量时,单位与检验仪器必填,行号 " + (i + 1), "warning");
                            return false;
                        }
                    }
                    if (item.EATTRIBUTE6 == "Size") {

                    }
                    else {

                        item.SetValueMax = null;
                        item.SetValueMin = null;
                    }

                    //let item = this.dataSource4Detail[i];
                    //if (item.SetValueMin >= item.SetValueMax) {
                    //    $.modalMsg("下限必须小于上限,行号 "+(i+1), "warning");
                    //    return false;
                    //}
                    allNum.push(item.SetValueMin);
                    allNum.push(item.SetValueMax);
                }


                //for (var i = 0; i < allNum.length; i++) {
                //    if (i == 0) {
                //        continue;
                //    }
                //    if (i <= allNum.length - 1) {
                //        if (allNum[i - 1] >= allNum[i]) {
                //            $.modalMsg("区间范围重复,重复值: " + allNum[i - 1], "warning");
                //            return false;
                //        }
                //    }
                //}

                this.form.DetailList = this.dataSource4Detail;
               this.$refs['form'].validate((valid) => {
                    if (valid) {
                        //alert('submit!');

                         $.submitForm({
                             url: "/DHAY/IQCQuality/SaveCheckGroup",
                             param: { keyValue: JSON.stringify(this.form) },
                             success: function () {
                                $.currentWindow().$("#gridList").trigger("reloadGrid");
                            }
                        })

                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
               // console.log(result);
            },
        },
    });
    function submitForm() {
        //debugger;
        vm.submitCheck();

        //if (!$('#form1').formValid()) {
        //    $.modalMsg("验证未通过", "warning");
        //    return false;
        //}

        //let obj = {
        //    CheckFixtureNo: $("#F_CheckFixtureNo").val(),
        //    CheckFixtureName: $("#F_CheckFixtureName").val(),
        //    CustomerItemCode: $("#F_CustomerItemCode").val(),
        //    ID: $("#ids").val(),
        //    Useage: $("#F_Useage").val(),
        //    Unit: $("#F_Unit").val(),
        //    Remark: $("#F_Remark").val(),
        //    Std: $("#F_Std").val(),
        //};
        ////if (!obj.line) {
        ////    return false;
        ////}
        //if (!obj.CheckFixtureNo) {
        //    return false;
        //}

        //$.submitForm({
        //    url: "/DHAY/CheckingFixture/SaveCheckingFixture",
        //    param: { keyValue: JSON.stringify(obj) },
        //    success: function () {
        //        $.currentWindow().$("#gridList").trigger("reloadGrid");
        //    }
        //})
    }


    function GetDate() {
        let currentTime = new Date();
        let year = currentTime.getFullYear();
        let month = currentTime.getMonth() + 1; // 注意，月份是从0开始的，所以要加1
        let date = currentTime.getDate();
        let hours = currentTime.getHours();
        let minutes = currentTime.getMinutes();
        let seconds = currentTime.getSeconds();

        // 格式化时间，补全前导零
        month = month < 10 ? '0' + month : month;
        date = date < 10 ? '0' + date : date;
        hours = hours < 10 ? '0' + hours : hours;
        minutes = minutes < 10 ? '0' + minutes : minutes;
        seconds = seconds < 10 ? '0' + seconds : seconds;

        // 拼接时间字符串
        let formattedTime = `${year}-${month}-${date} ${hours}:${minutes}:${seconds}`;
        return formattedTime;
    }
</script>