simulation-front/src/views/sceneLibrary/gradingRule.vue

<template>
    <div>
        <el-form ref="form" :model="form" :rules="rules" label-width="108px">
            <el-form-item label="规则名称:" prop="ruleName">
                <el-input
                    placeholder="请输入"
                    maxlength="60"
                    v-autoTrim="{ obj: form, key: 'ruleName' }"
                    v-model="form.ruleName"
                >
                </el-input>
            </el-form-item>

            <el-form-item label="规则描述:" prop="ruleDescription">
                <el-input
                    placeholder="请输入"
                    maxlength="120"
                    v-autoTrim="{ obj: form, key: 'ruleDescription' }"
                    v-model="form.ruleDescription"
                >
                </el-input>
            </el-form-item>

            <el-form-item label="规则详情:" prop="ruleDetails">
                <el-input
                    v-autoTrim="{
                        obj: form,
                        key: 'ruleDetails',
                    }"
                    v-model="form.ruleDetails"
                    type="textarea"
                    placeholder="请输入"
                    :autosize="{ minRows: 8, maxRows: 8 }"
                    maxlength="500"
                ></el-input>
            </el-form-item>

            <div class="btns">
                <!-- 公有列表进，另存为+取消 另存为为新增一天数据 新增数据均为私有 1 -->
                <!-- 私有列表进，保存+另存为+取消 0 -->
                <!-- 新增进，保存+取消 -1 -->
                <el-button
                    type="primary"
                    v-if="share === '0' || share === '-1'"
                    @click="save(false)"
                    >保存</el-button
                >
                <el-button
                    type="primary"
                    v-if="share === '0' || share === '1'"
                    @click="save(true)"
                    >另存为</el-button
                >
                <el-button type="primary" plain @click="cancel">取消</el-button>
            </div>
        </el-form>
    </div>
</template>

<script>
//import  from '';

export default {
    name: "gradingRule", // 打分规则
    components: {},
    data() {
        return {
            share: "-1", //控制显示按钮
            form: {
                rulesId: "",
                ruleName: "",
                share: "-1",
                ruleDescription: "",
                ruleDetails: "",
            },
            rules: {
                ruleName: [
                    { required: true, message: "请输入", trigger: "blur" },
                ],
                ruleDescription: [
                    { required: true, message: "请输入", trigger: "blur" },
                ],
                ruleDetails: [
                    { required: true, message: "请输入", trigger: "blur" },
                ],
            },
        };
    },

    computed: {},

    methods: {
        save(isAdd) {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    if (isAdd || !this.$route.query.formData) {
                        // 另存为或新增页面
                        this.form.rulesId = "";
                        this.form.share = "0";
                    }

                    this.$axios({
                        method: "post",
                        url: this.$api.sceneLibrary.saveScoringRules,
                        data: {
                            ...this.form,
                        },
                    }).then((res) => {
                        if (res.code == 200) {
                            this.$message.success("保存成功");
                            this.cancel();
                        } else {
                            this.$message.error(res.message || "保存失败");
                        }
                    });
                    // .catch((error) => {
                    //     this.$message.error(error || "保存失败！");
                    // });
                }
            });
        },
        cancel() {
            this.$router.replace({ path: "/gradingRulesList" });
        },
    },

    mounted() {
        if (this.$route.query.formData) {
            let rulesId = "";
            this.form.rulesId = rulesId = this.$route.query.formData.rulesId;
            this.form.share = this.share = this.$route.query.formData.share;

            if (rulesId) {
                this.$axios({
                    method: "post",
                    url: this.$api.sceneLibrary.queryScoringRules,
                    data: {
                        rulesId,
                    },
                }).then((res) => {
                    if (res.code == 200 && res.info) {
                        this.form = res.info;
                    }
                });
            }
        }
    },
};
</script>

<style lang='less' scoped>
.el-form {
    width: 60%;
    padding-top: 60px;
    margin: 0 auto;

    .el-input {
        width: 100%;
    }
}

.btns {
    padding-top: 30px;
    text-align: center;
}
</style>