jihe-hs/ruoyi-ui/src/views/JiHeExpressway/pages/service/PublishingChannelManagement/components/AddNEditDialog.vue

<template>
  <Dialog v-model="modelVisible" :title="data ? '修改' : '新增'" width="550px">
    <div class="AddNEditDialog">
      <Form
        v-model="formData"
        class="form"
        ref="FormConfigRef"
        :formList="formList"
        column="1"
        labelWidth="90px"
      />
    </div>

    <template #footer>
      <Button
        style="background-color: rgba(0, 179, 204, 0.3)"
        @click.native="(modelVisible = false), (submitting = false)"
      >
        取消
      </Button>
      <Button @click.native="handleSubmit" :loading="submitting"> 确定 </Button>
    </template>
  </Dialog>
</template>

<script>
import Dialog from "@screen/components/Dialog/index.vue";
import Button from "@screen/components/Buttons/Button.vue";
import Form from "@screen/components/FormConfig";

import request from "@/utils/request";
import { getSelectOptionsStation } from "@screen/pages/control/event/businessDataManagement/utils.js";
import { Message } from "element-ui";
import * as PresetFormItems from "@screen/common/PresetFormItems.js";

export default {
  name: "AddNEditDialog",
  components: {
    Dialog,
    Button,
    Form,
  },
  model: {
    prop: "visible",
    event: "update:value",
  },
  props: {
    visible: Boolean,
    data: Object,
  },
  inject: ["setCurrentPage"],
  data() {
    return {
      submitting: false,
      formData: {},
      formList: [
        {
          label: "信息级别:",
          key: "level",
          type: "RadioGroup",
          isAlone: true,
          options: {
            activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)",
            options: [
              {
                key: "1",
                label: "影响通行",
              },
              {
                key: "2",
                label: "不影响通行",
              },
            ],
          },
        },
        PresetFormItems.releaseChannel,
        {
          label: "审核方式:",
          key: "process",
          type: "RadioGroup",
          isAlone: true,
          options: {
            activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)",
            options: [
              {
                key: "1",
                label: "单人审核",
              },
              {
                key: "2",
                label: "双人审核",
              },
            ],
          },
        },
        {
          label: "启用日期:",
          key: "startDate",
          type: "DatePicker",
          required: true,
        },
      ],
    };
  },
  computed: {
    modelVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("update:value", val);
      },
    },
  },
  watch: {
    modelVisible: {
      immediate: true,
      handler(bool) {
        if (!bool) return;

        this.formData = {
          ...this.data,
        };

        this.getOptions();
      },
    },
  },
  methods: {
    getOptions() {},
    handleSubmit() {},
  },
};
</script>

<style lang="scss" scoped>
.AddNEditDialog {
  width: 450px;
  height: 200px;
  display: flex;
  flex-direction: column;
  gap: 15px;

  .tips {
    font-size: 12px;
  }
}
</style>