更新主从表添加、修改、删除时对从表的对应操作

hutongqing

2024-08-21 b5bc0d6eb2d2e55ea830a1b286252b9754cbf8e9

 WIDESEAWCS_Client/src/views/quartzJob/deviceProtocol.vue

@@ -0,0 +1,229 @@

<template>
  <view-grid
    ref="grid"
    :columns="columns"
    :detail="detail"
    :editFormFields="editFormFields"
    :editFormOptions="editFormOptions"
    :searchFormFields="searchFormFields"
    :searchFormOptions="searchFormOptions"
    :table="table"
    :extend="extend"
  >
  </view-grid>
</template>
  <script>
import extend from "@/extension/quartzJob/deviceProtocol.js";
import { ref, defineComponent } from "vue";
export default defineComponent({
  setup() {
    const table = ref({
      key: "id",
      footer: "Foots",
      cnName: "设备协议信息",
      name: "deviceProtocol",
      url: "/DeviceProtocol/",
      sortName: "id",
    });
    const editFormFields = ref({
      deviceCode: "",
      deviceName: "",
      deviceType: "",
      deviceStatus: "",
      deviceIp: "",
      devicePort: "",
      devicePlcType: "",
      deviceRemark: "",
    });
    const editFormOptions = ref([
      [
        {
          title: "设备编号",
          required: true,
          field: "deviceCode",
          type: "string",
        },
        {
          title: "设备名称",
          required: true,
          field: "deviceName",
          type: "string",
        },
        {
          title: "设备类型",
          required: true,
          field: "deviceType",
          type: "string",
        },
        {
          title: "设备状态",
          required: true,
          field: "deviceStatus",
          type: "string",
        },
      ],
      [
        { title: "设备IP", required: true, field: "deviceIp", type: "string" },
        {
          title: "设备端口",
          required: true,
          field: "devicePort",
          type: "string",
        },
        {
          title: "PLC类型",
          required: true,
          field: "devicePlcType",
          type: "string",
        },
        {
          title: "备注",
          field: "deviceRemark",
          type: "string",
        },
      ],
    ]);
    const searchFormFields = ref({
      deviceCode: "",
      deviceType: "",
      deviceStatus: "",
    });
    const searchFormOptions = ref([
      [
        { title: "设备编号", field: "deviceCode" },
        { title: "设备类型", field: "deviceType" },
        { title: "设备状态", field: "deviceStatus" },
      ],
    ]);
    const columns = ref([
      {
        field: "id",
        title: "Id",
        type: "int",
        width: 90,
        hidden: true,
        readonly: true,
        require: true,
        align: "left",
      },
      {
        field: "deviceId",
        title: "设备主键",
        type: "string",
        width: 90,
        align: "left",
      },
      {
        field: "deviceChildCode",
        title: "设备子编号",
        type: "string",
        width: 150,
        align: "left",
      },
      {
        field: "deviceProDataBlock",
        title: "协议数据块",
        type: "string",
        width: 150,
        align: "left",
      },
      {
        field: "deviceProOffset",
        title: "偏移量",
        type: "decimal",
        width: 90,
        align: "left",
      },
      {
        field: "deviceProDataType",
        title: "数据类型",
        type: "string",
        width: 90,
        align: "left",
      },
      {
        field: "deviceProDataLength",
        title: "数据长度",
        type: "int",
        width: 120,
        align: "left",
      },
      {
        field: "deviceProParamName",
        title: "参数名称",
        type: "string",
        width: 200,
        align: "left",
      },
      {
        field: "deviceProParamType",
        title: "参数类型",
        type: "string",
        width: 180,
        align: "left",
      },
      {
        field: "deviceProParamDes",
        title: "参数说明",
        type: "string",
        width: 120,
        align: "left",
      },
      {
        field: "creater",
        title: "创建人",
        type: "string",
        width: 90,
        align: "left",
      },
      {
        field: "createDate",
        title: "创建时间",
        type: "datetime",
        width: 160,
        align: "left",
      },
      {
        field: "modifier",
        title: "修改人",
        type: "string",
        width: 100,
        align: "left",
      },
      {
        field: "modifyDate",
        title: "修改时间",
        type: "datetime",
        width: 160,
        align: "left",
      },
      {
        field: "deviceProRemark",
        title: "备注",
        type: "string",
        width: 100,
        align: "left",
      },
    ]);
    const detail = ref({
      cnName: "",
      table: "",
      columns: [],
      sortName: "",
      key: "",
    });
    return {
      table,
      extend,
      editFormFields,
      editFormOptions,
      searchFormFields,
      searchFormOptions,
      columns,
      detail,
    };
  },
});
</script>