real3d-portalsite/src/views/ResourceShare/sharedLocation/components/fieldSetModal.vue

<template>
  <div class="dialog">
    <el-dialog
      :title="formData.name"
      width="40%"
      :visible.sync="dialogVisible"
      :before-close="close"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
    >
      <div class="content">
        <el-table
          ref="multipleTable"
          :data="fieldList"
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column label="序号" width="70px">
            <template slot-scope="scope">{{ scope.$index + 1 }}</template>
          </el-table-column>
          <el-table-column prop="filedName" label="字段名"> </el-table-column>
          <el-table-column
            prop="filedNameZh"
            label="中文名"
            show-overflow-tooltip
          >
          </el-table-column>
          <el-table-column label="是否可共享" width="150">
            <template #default="{ row, $index }">
              <el-checkbox
                v-model="row.checked"
                @change="changeShare(row, $index)"
              >
                可共享
              </el-checkbox>
            </template></el-table-column
          >
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="refresh">刷新字段列表</el-button>
        <el-button type="primary" @click="submit">保存</el-button>
        <el-button @click="close">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { Getfiledslist, fileds } from "@/api/shared.js";
export default {
  components: {},
  props: {},
  data() {
    return {
      formData: {},
      fieldList: [{ label: "sc", name: "字段" }],
      dialogVisible: false,
    };
  },
  created() {},
  methods: {
    // 关闭弹窗
    close() {
      this.dialogVisible = false;
      this.$emit("close");
    },
    Init(rowdata) {
      this.formData = rowdata;
      this.dialogVisible = true;
      this.getfieldList(rowdata.bsm, false);
    },
    async getfieldList(zymlBsm, resetType) {
      this.fieldList = [];
      let res = await Getfiledslist({ zymlBsm, resetType });
      // this.fieldList = res.data;
      res.data.forEach((field) => {
        this.fieldList.push({ ...field, checked: field.shareDisplay == 0 });
      });
    },
    changeShare(row, index) {
      this.fieldList[index].shareDisplay = row.checked ? 0 : 1;
    },
    refresh() {
      this.getfieldList(this.formData.bsm, true);
    },
    async submit() {
      fileds(this.fieldList).then((res) => {
        if ((res.code = 200)) {
          this.$message.success("共享字段设置成功！");
          this.close();
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.dialog {
  .content {
    height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    color: #fff;
    .el-checkbox {
      color: #fff;
    }
  }
}
</style>
<style lang="scss" >
</style>