表单特殊权限控制

\rg3-cli-oapp\src\components\basis\bs-form\method-bridge-data.js

路由注入

  routerUsed: {
    path: "/batools",
    name: "batools-main",
    parentId:"error", //上级路径,对应name或Id
    root:true, //同时添加到根路由
    meta: {
      keepAlive: true,
      name: "batools-main",
    },
    component: (r) =>
      require.ensure([], () => r(require("./index")), "bs-batools"),
  },

组件注入

  componentsUsed: {
    name: "batools-main",
  },

案例

<template>
  <section class="boostrap-main">
    <div class="page-wrapper batools-pdf">
      <div class="page-content">
        <!--end row-->
        <div class="row">
          <div class="col-xl-9 mx-auto">
            <select v-model=" datas.currentKey"
              @change="handleChangedTemplate"
              class="form-select mb-3"
            >
            <!-- @click.prevent="handleChangedTemplate(item)" -->
              <option v-for="(item) in datas.template" :selected="item.key===datas.current.key" :key="`${item.key}`" :value="item.key" >{{item.name}}</option>
            </select>
<!-- {{datas.current}} -->
            <div class="d-flex align-items-center">
              <div>
                <p class="mb-0">社保下载({{ datas.current.name || "-" }})</p>
              </div>
              <div class="ms-auto">
                <a class="cursor-p" @click.prevent="handleDownTemplate({})"
                  >模板</a
                >
              </div>
            </div>
            <hr />
            <bs-upload
              class="float-center"
              :open-stream="true"
              :onHttpRequestStream="handleHttpRequestStream"
              @change="
                (val, valT) => {
                  value.icLogo = val;
                  changeField.icLogo = val;
                  changeField.changed = true;
                  handleSetChangeField(changeField);
                }
              "
              :primary-change-state="value.primaryChangeState"
              :on-callback-root-data="handleCallBackRootData"
              :item="{
                field: 'icLogo',
                attrs: {
                  accept: '.xlsx',
                  'data-field-show': true,
                  drag: true,
                  hideTitle: 'show',
                  label: '奖品图片',
                  limit: '1',
                  'limit-type':
                    'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
                  listType: 'text',
                  maxSize: '4000',
                  multiple: false,
                  'verify-method': 'file',
                  'remote-hide': true,
                  clear: true,
                },
                meta: {
                  edit: true,
                  rowId: '1',
                  tabId: '1',
                  span: 24,
                  dataType: 'string2file',
                },
              }"
              v-model="value.icLogo"
            />
            <div class="card" v-if="datas.table.length > 0">
              <div class="card-body">
                <ul class="list-group">
                  <li
                    class="list-group-item d-flex justify-content-between align-items-center"
                    v-for="(item, i) in datas.table"
                    :key="`pdfd${i}`"
                  >
                    {{ item.name }}
                    <span
                      class="badge bg-primary rounded-pill cursor-p"
                      @click.prevent="handleDownPdf(item)"
                      >下载</span
                    >
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
        <!--end row-->
      </div>
    </div>

    <!-- <el-button @click="handleExcel2Pdf">Excel转PDF</el-button> -->

    <!-- {{datas.table}} -->
  </section>
</template>
<style lang="scss">
.batools-pdf {
}
</style>
<script>
import {
  doExcel2PdfByPath,
  doExcel2PdfByFile,
  doExcel2PdfTemplate,
} from "@/actions/pdf/excel2pdf.js";
export default {
  name: "batools-main",
  componentsUsed: {
    name: "batools-main",
  },
  data() {
    return {
      value: {},
      datas: {
        currentKey:"",
        mapper: {},
        form: {},
        table: [],
        template: [],
        current: {},
      },
      //公共必须参数 start
      // value: {},
      //公共参数 end
      //变更的数据存储
      changeField: {
        changed: false,
      },
      data: {},
      //特殊处理补充字段 start
      valueT: {
        auditStatus: {
          value: null,
          namel: null,
        },
      },
      showHide: {
        auditStatus: false,
      },
      dimData: {
        auditStatus: [],
      },
      //特殊处理补充字段 end
    };
  },
  routerUsed: {
    path: "/batools",
    name: "batools-main",
    parentId:"error", //上级路径,对应name或Id
    redirect: "/bc-design/dashboard/list", //重定向地址
    root:true, //同时添加到根路由
    meta: {
      keepAlive: true,
      name: "batools-main",
    },
    component: (r) =>
      require.ensure([], () => r(require("./index")), "bs-batools"),
  },
  created() {
    this.handleLoadExcel2PdfTemplate();
  },
  methods: {
    handleChangedTemplate(){
      this.datas.current=this.datas.template.filter(t=>t.key=== this.datas.currentKey)[0];
    },
    handleLoadExcel2PdfTemplate() {
      doExcel2PdfTemplate({}, {}).then((res) => {
        this.datas.template = res.data.data;
        this.datas.current = this.datas.template[0];
        this.datas.currentKey=  this.datas.current.key;
      });
    },
    //接收文件流信息
    handleHttpRequestStream(thatC) {
      let that = this;
      const params = {
        template: that.datas.current.key,
      };
      thatC.loading = true;
      const formData = new FormData();
      formData.append("file", thatC.fileRaw);

      doExcel2PdfByFile(formData, params)
        .then((res) => {
          that.$msgBox.success("转换成功");
          thatC.loading = false;
          that.datas.table = res.data.data.files;
          thatC.clearFiles();
          // that.$forceUpdate();
        })
        .catch(() => {
          that.$msgBox.error("转换失败");
          thatC.clearFiles();
          thatC.loading = false;
        });
    },
    handleSetChangeField() {},
    handleCallBackRootData(callback) {
      //开放原始入口配置文件,便于子组件调用根组件,进行直接修改数据
      callback(this);
    },
    handleExcel2Pdf() {
      let that = this;
      const params = {
        template: that.datas.current.key,
      };
      doExcel2PdfByPath({}, params)
        .then((res) => {
          that.$msgBox.success(res);
        })
        .catch(() => {
          that.$msgBox.error("转换失败");
        });
    },
    handleDownTemplate() {
      let item = this.datas.current;
      this.$bsAjax.doDown(item.value, null, true, item.name);
    },
    handleDownPdf(item) {
      this.$bsAjax.doDown(item.value, null, true, item.name);
    },
  },
  // beforeRouteEnter(to, from, next) {
  //   console.log(to);
  //   next(vm => {
  //     vm.$router.replace(from.path);
  //   });
  // }
};
</script>
文档更新时间: 2024-06-15 08:46   作者:admin