water-dispatch-web/src/views/order/component/adjust.vue

<template>
  <div>
    <xy-dialog
      ref="dialog"
      :is-show.sync="isShow"
      type="form"
      title="调令调整"
      :form="form"
      :rules="rules"
      @submit="submit"
    >
      <template v-slot:content>
        <div class="xy-table-item">
          <div class="xy-table-item-label">调令内容 ：</div>
          <div class="xy-table-item-content">
            <el-input
              type="textarea"
              :autosize="{ minRows: 2 }"
              v-model="form.content"
              clearable
              placeholder="请输入调令内容"
              style="width: 300px"
            ></el-input>
          </div>
        </div>
      </template>
      <template v-slot:tiaozhengleixing>
        <div class="xy-table-item">
          <div class="xy-table-item-label">调整类型 ：</div>
          <div class="xy-table-item-content">
            <el-select
              v-model="form.tiaozhengleixing"
              clearable
              placeholder="请选择调整类型"
              style="width: 300px"
            >
              <el-option
                v-for="item in tiaozhengleixings"
                :key="item.id"
                :label="item.value"
                :value="item.id"
              ></el-option>
            </el-select>
          </div>
        </div>
      </template>
    </xy-dialog>
  </div>
</template>

<script>
import { show, save } from "@/api/system/baseForm";
export default {
  props: {
    tiaozhengleixings: {
      type: Array,
      default: () => [
        {
          id: 0,
          value: "关闭"
        },
        {
          id: 1,
          value: "新开"
        },
        {
          id: 2,
          value: "其他"
        }
      ],
    },
  },
  data() {
    return {
      isShow: false,
      id: "",
      type: "",

      form: {
        content: "",
        tiaozhengleixing: "",
      },
      rules: {},
      originalData: "",
    };
  },
  methods: {
    show() {
      this.isShow = true;
    },
    hidden() {
      this.isShow = false;
    },
    init() {
      for (let key in this.form) {
        if (this.form[key] instanceof Array) {
          this.form[key] = [];
        } else {
          this.form[key] = "";
        }
      }
      this.$refs["dialog"].clearValidate();
    },
    setId(id) {
      if (typeof id == "number") {
        this.id = id;
      } else {
        console.error("error typeof id: " + typeof id);
      }
    },
    getId() {
      return this.id;
    },
    setType(type = "add") {
      let types = ["add", "editor"];
      if (types.includes(type)) {
        this.type = type;
      } else {
        console.warn("Unknown type: " + type);
      }
    },
    setForm(key = [], value = []) {
      if (key instanceof Array) {
        key.forEach((key, index) => {
          this.form[key] = value[index] ?? "";
        });
      }
      if (typeof key === "string") {
        this.form[key] = value;
      }
      if (!key) {
        this.init();
      }
    },

    async getDetail() {
      const res = await show({ id: this.id, table_name: "transfers" });
      this.$integrateData(this.form, res);
      this.originalData = JSON.stringify(this.form);
    },

    submit() {
      let updateData = JSON.stringify(this.form);
      if (this.type === "add") {
        if (this.form.hasOwnProperty("id")) {
          delete this.form.id;
        }
      }
      if (this.type === "editor") {
        Object.defineProperty(this.form, "id", {
          value: this.id,
          enumerable: true,
          configurable: true,
          writable: true,
        });
      }
      save({
        table_name: "transfers",
        ...this.form,
        status: 2
      }).then((res) => {
        if (updateData !== this.originalData) {
          let originalData = JSON.parse(this.originalData)
          let nowData = JSON.parse(updateData)
          let kv = new Map([
            ['content','调令内容'],
            ['tiaozhengleixing','调整状态']
          ])
          let text = ""
          for (let key in nowData) {
            text += nowData[key] === originalData[key] ? "" : (`【${kv.get(key)}】从"${this.tiaozhengleixings.find(i => i.id === originalData[key])?.value || originalData[key] || " "}"更改为"${this.tiaozhengleixings.find(i => i.id === nowData[key])?.value || nowData[key]}"` || " ")
          }
          save({
            table_name: "logs",
            transfer_id: this.getId(),
            content: text
          },false)
        }
        this.$message({
          type: "success",
          message: "操作成功",
        });
        this.isShow = false;
        this.$emit("refresh");
      });
    },
  },
  watch: {
    isShow(val) {
      if (val) {
        if (this.type === "editor") {
          this.getDetail();
        }
      } else {
        this.id = "";
        this.type = "";
        this.originalData = "";
        this.init();
        this.$refs["dialog"].clearValidate();
        delete this.form.id;
      }
    },
  },
};
</script>

<style scoped lang="scss">
::v-deep .el-input__inner {
  text-align: left;
}
</style>