无诈调整

lin

2024-05-07 e047fc31f6d9c571b11a8c49072a34edb30176db

 src/components/attach/attach.vue

@@ -1,140 +1,105 @@
<template>
  <basic-container class="hasButTwo">
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      :page.sync="page"
      :permission="permissionList"
      :before-open="beforeOpen"
      v-model="form"
      ref="crud"
      @row-del="rowDel"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
    <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" :permission="permissionList"
      :before-open="beforeOpen" v-model="form" ref="crud" @row-del="rowDel" @search-change="searchChange"
      @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
      @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
      <template slot="type" slot-scope="{ row }">
        <el-tag :class="row.type != 2 ? 'red' : ''">{{
          row.type != 2 ? "未上传" : "已上传"
        }}</el-tag>
      </template>
      <template slot="downtemplate" slot-scope="{ row }">
        <el-tag
          @click="downTemplates(row.template)"
          class="hand"
          :class="row.template == '' ? 'red' : ''"
          >{{ row.template == "" ? "无模板" : "下载模板" }}</el-tag
        >
        <el-tag @click="downTemplates(row.template)" class="hand"
          :class="row.template == '' ? 'red' : ''">{{ row.template == "" ? "无模板" : "下载模板" }}</el-tag>
      </template>
      <template slot-scope="{ type, size, row }" slot="menu">
        <el-button
          icon="el-icon-upload2"
          :size="size"
          :type="type"
          @click="upData(row)"
          >上传</el-button
        >
        <el-button
          icon="el-icon-download"
          :size="size"
          :type="type"
          :disabled="row.type != 2"
          @click="dowmData(row)"
          >下载</el-button
        >
        <el-button icon="el-icon-upload2" :size="size" :type="type" @click="upData(row)">上传</el-button>
        <el-button icon="el-icon-download" :size="size" :type="type" :disabled="row.type != 2"
          @click="dowmData(row)">下载</el-button>
      </template>
    </avue-crud>

    <el-dialog
      title="附件管理"
      append-to-body
      :visible.sync="attachBox"
      width="555px"
    >
      <avue-form
        ref="form"
        :option="attachOption"
        v-model="attachForm"
        :upload-after="uploadAfter"
      >
    <el-dialog title="附件管理" append-to-body :visible.sync="attachBox" width="555px">
      <avue-form ref="form" :option="attachOption" v-model="attachForm" :upload-after="uploadAfter">
      </avue-form>
    </el-dialog>
  </basic-container>
</template>

<script>
import { getUseInfor, getTemplate, addUseInfor } from "@/api/resource/attach";
import { mapGetters } from "vuex";
  import {
    getUseInfor,
    getTemplate,
    addUseInfor
  } from "@/api/resource/attach";
  import {
    mapGetters
  } from "vuex";

export default {
  props: ["type", "opens", "enclosure", "ptype"],
  data() {
    var type = this.type;
    var deptid = this.$route.query.deptId;
    var cardid = this.$store.getters.userInfo.Id;
    return {
      form: {},
      query: {},
      putParam: "",
      loading: false,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0
      },
      attachBox: false,
      selectionList: [],
      option: {
        height: 600,

        calcHeight: 30,
        tip: false,
        align: "center",
        searchShow: false,
        columnBtn: false,
        menuWidth: 180,
        searchMenuSpan: 6,
        border: false,
        index: true,
        delBtn: false,
        stripe: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [
          {
            label: "附件名称",
            prop: "originalname",
            overHidden: true
          },
          {
            label: "附件状态",
            prop: "type",
            width: 110,
            slot: true,
            overHidden: true
          },
          {
            label: "示范模板",
            prop: "downtemplate",
            width: 110,
            // overHidden: true,
            slot: true
          }
        ]
      },
      data: [],
      attachForm: {},
      attachOption: {
        submitBtn: false,
        emptyBtn: false,
        column: [
          {
  export default {
    props: ["type", "opens", "enclosure", "ptype"],
    data() {
      var type = this.type;
      var deptid = this.$route.query.deptId;
      var cardid = this.$store.getters.userInfo.Id;
      return {
        form: {},
        query: {},
        putParam: "",
        loading: false,
        page: {
          pageSize: 10,
          currentPage: 1,
          total: 0
        },
        attachBox: false,
        selectionList: [],
        option: {
          height: 600,
          calcHeight: 30,
          tip: false,
          align: "center",
          searchShow: false,
          columnBtn: false,
          menuWidth: 180,
          searchMenuSpan: 6,
          border: false,
          index: true,
          delBtn: false,
          stripe: true,
          viewBtn: true,
          selection: true,
          dialogClickModal: false,
          column: [{
              label: "附件名称",
              prop: "originalname",
              overHidden: true
            },
            {
              label: "附件状态",
              prop: "type",
              width: 110,
              slot: true,
              overHidden: true
            },
            {
              label: "示范模板",
              prop: "downtemplate",
              width: 110,
              // overHidden: true,
              slot: true
            }
          ]
        },
        data: [{
          file: "name"
        }],
        attachForm: {},
        attachOption: {
          submitBtn: false,
          emptyBtn: false,
          column: [{
            label: "拖拽上传",
            prop: "imgUrl5",
            type: "upload",
@@ -143,292 +108,292 @@
            propsHttp: {
              res: "data"
            },
            tip:
              "支持上传jpg/png/doc/docx/xls/xlsx文件，图片不超过500Kb，文档不超过3Mb",
            tip: "支持上传jpg/png/doc/docx/xls/xlsx文件，图片不超过500Kb，文档不超过3Mb",
            action:
              // "/api/blade-resource/oss/endpoint/put-file-attach",
              "/api/blade-resource/oss/endpoint/put-file-attach?deptid=&type=" +
              type +
              "&cardid=" +
              cardid
          }
        ]
          }]
        },
        imgSee: false,
        imgUrl: "",

        saveIds: [],
        saveLinks: [],
        onceIds: "",
        onceLinks: ""
      };
    },
    computed: {
      ...mapGetters(["permission", "canDoIt"]),
      permissionList() {
        return {
          addBtn: false,
          editBtn: false,
          viewBtn: false,
          delBtn: this.vaildData(this.permission.attach_delete, false)
        };
      },
      imgSee: false,
      imgUrl: "",

      saveIds: [],
      saveLinks: [],
      onceIds: "",
      onceLinks: ""
    };
  },
  computed: {
    ...mapGetters(["permission", "canDoIt"]),
    permissionList() {
      return {
        addBtn: false,
        editBtn: false,
        viewBtn: false,
        delBtn: this.vaildData(this.permission.attach_delete, false)
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    }
  },
  mounted() {
    // console.log(this.enclosure, "enclosure");
    var flag = false,
      i = 0,
      ind = null;
    this.$store.state.tags.tagList.forEach((item, index) => {
      if (item.label == "附件上传") {
        if (flag == false) {
          ind = index;
          flag = true;
        }
        i++;
      }
    });
    if (i > 1) {
      this.$store.state.tags.tagList.splice(ind, 1);
    }
  },
  methods: {
    upData(val) {
      // console.log(val);
      this.onceIds = +val.id + "";
      this.attachBox = true;
    },
    dowmData(val) {
      console.log(val.down);
      window.open(val.down);
      //
    },
    downTemplates(val) {
      // console.log(val);
      if (val == "") {
        return;
      }
      window.open(val);
      // window.open(`/api/examScore/export-template`);
    },
    handleUpload() {
      this.attachBox = true;
    },
    uploadAfter(res, done, loading, column) {
      // window.console.log(res.link);
      var test = /^http:\/\/.*/;
      if (!test.test(res.link)) {
        this.$message.error("上传失败");
        return;
      }
      this.onceLinks = res.link;
      // console.log(res);
      // return;
      var haveit = null;
      for (let k in this.saveIds) {
        if (this.saveIds[k] == this.onceIds) {
          // this.saveLinks[k] = this.onceLinks;
          haveit = k;
          break;
        }
      }
      if (haveit != null) {
        this.saveLinks[haveit] = this.onceLinks;
      } else {
        this.saveIds.push(this.onceIds);
        this.saveLinks.push(this.onceLinks);
      }
      // console.log(this.saveIds);
      // console.log(this.saveLinks);

      //  console.log(this.$store.getters.userInfo.Id);
      var params = {
        userid: this.$store.getters.userInfo.Id,
        ptype: this.ptype,
        templateid: this.saveIds.join(","),
        links: this.saveLinks.join(",")
      };
      // console.log(params);
      // loading();
      // return;
      addUseInfor(params).then(res => {
        // console.log(res);
        this.$message({
          type: "success",
          message: "操作成功!"
      ids() {
        let ids = [];
        this.selectionList.forEach(ele => {
          ids.push(ele.id);
        });
      });
      this.refreshChange();
      this.attachBox = false;
      done();
    },
    handleDownload(row) {
      window.open(`${row.link}`);
    },
    rowDel(row) {
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
        });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning("请选择至少一条数据");
        return;
        return ids.join(",");
      }
      this.$confirm("确定将选择数据删除?", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
          this.$refs.crud.toggleSelection();
        });
    },
    beforeOpen(done, type) {
      if (["edit", "view"].includes(type)) {
        getDetail(this.form.id).then(res => {
          this.form = res.data.data;
        });
      }
      done();
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      var that = this;
      var data = [];
      // console.log(this.$store.getters.userInfo.Id);
      // this.data = this.enclosure;
      params["ptype"] = this.ptype;
      getTemplate(params, 1, 50).then(res => {
        data = res.data.data.records;
        // console.log(data, "::template");
        params["userid"] = this.$store.getters.userInfo.Id;
        getUseInfor(params).then(res => {
          var userInfo = res.data.data.records;
          // console.log(userInfo, "::userInfo");
          if (userInfo.length == 0) {
            for (var k in data) {
              data[k]["type"] = 1;
            }
            that.data = data;
            this.saveIds = [];
            this.saveLinks = [];
          } else {
            this.saveIds = userInfo[0].templateid.split(",");
            this.saveLinks = userInfo[0].links.split(",");
            for (let k in data) {
              for (let i in this.saveIds) {
                if (+data[k].id == this.saveIds[i]) {
                  data[k]["type"] = 2;
                  data[k]["down"] = this.saveLinks[i];
                }
              }
              // data[k]["type"] = 1;
            }
            that.data = data;
    mounted() {
      // console.log(this.enclosure, "enclosure");
      var flag = false,
        i = 0,
        ind = null;
      this.$store.state.tags.tagList.forEach((item, index) => {
        if (item.label == "附件上传") {
          if (flag == false) {
            ind = index;
            flag = true;
          }
        });
          i++;
        }
      });
      if (i > 1) {
        this.$store.state.tags.tagList.splice(ind, 1);
      }
    },
    methods: {
      upData(val) {
        // console.log(val);
        this.onceIds = +val.id + "";
        this.attachBox = true;
      },
      dowmData(val) {
        console.log(val.down);
        window.open(val.down);
        //
      },
      downTemplates(val) {
        // console.log(val);
        if (val == "") {
          return;
        }
        window.open(val);
        // window.open(`/api/examScore/export-template`);
      },
      handleUpload() {
        this.attachBox = true;
      },
      uploadAfter(res, done, loading, column) {
        // window.console.log(res.link);
        var test = /^http:\/\/.*/;
        if (!test.test(res.link)) {
          this.$message.error("上传失败");
          return;
        }
        this.onceLinks = res.link;
        // console.log(res);
        // return;
        var haveit = null;
        for (let k in this.saveIds) {
          if (this.saveIds[k] == this.onceIds) {
            // this.saveLinks[k] = this.onceLinks;
            haveit = k;
            break;
          }
        }
        if (haveit != null) {
          this.saveLinks[haveit] = this.onceLinks;
        } else {
          this.saveIds.push(this.onceIds);
          this.saveLinks.push(this.onceLinks);
        }
        // console.log(this.saveIds);
        // console.log(this.saveLinks);

    seeImages(row) {
      this.imgUrl = "";
      this.imgUrl = "url(" + row.link + ") center center / contain no-repeat";
      // console.log(this.imgUrl);
      // this.imgUrl = row.link;
        //  console.log(this.$store.getters.userInfo.Id);
        var params = {
          userid: this.$store.getters.userInfo.Id,
          ptype: this.ptype,
          templateid: this.saveIds.join(","),
          links: this.saveLinks.join(",")
        };
        // console.log(params);
        // loading();
        // return;
        addUseInfor(params).then(res => {
          // console.log(res);
          this.$message({
            type: "success",
            message: "操作成功!"
          });
        });
        this.refreshChange();
        this.attachBox = false;
        done();
      },
      handleDownload(row) {
        window.open(`${row.link}`);
      },
      rowDel(row) {
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(row.id);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
          });
      },
      handleDelete() {
        if (this.selectionList.length === 0) {
          this.$message.warning("请选择至少一条数据");
          return;
        }
        this.$confirm("确定将选择数据删除?", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          })
          .then(() => {
            return remove(this.ids);
          })
          .then(() => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!"
            });
            this.$refs.crud.toggleSelection();
          });
      },
      beforeOpen(done, type) {
        if (["edit", "view"].includes(type)) {
          getDetail(this.form.id).then(res => {
            this.form = res.data.data;
          });
        }
        done();
      },
      searchReset() {
        this.query = {};
        this.onLoad(this.page);
      },
      searchChange(params, done) {
        this.query = params;
        this.page.currentPage = 1;
        this.onLoad(this.page, params);
        done();
      },
      selectionChange(list) {
        this.selectionList = list;
      },
      selectionClear() {
        this.selectionList = [];
        this.$refs.crud.toggleSelection();
      },
      currentChange(currentPage) {
        this.page.currentPage = currentPage;
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize;
      },
      refreshChange() {
        this.onLoad(this.page, this.query);
      },
      onLoad(page, params = {}) {
        var that = this;
        var data = [];
        // console.log(this.$store.getters.userInfo.Id);
        // this.data = this.enclosure;
        params["ptype"] = this.ptype;
        getTemplate(params, 1, 50).then(res => {
          data = res.data.data.records;
          // console.log(data, "::template");
          params["userid"] = this.$store.getters.userInfo.Id;
          getUseInfor(params).then(res => {
            var userInfo = res.data.data.records;
            // console.log(userInfo, "::userInfo");
            if (userInfo.length == 0) {
              for (var k in data) {
                data[k]["type"] = 1;
              }
              that.data = data;
              this.saveIds = [];
              this.saveLinks = [];
            } else {
              this.saveIds = userInfo[0].templateid.split(",");
              this.saveLinks = userInfo[0].links.split(",");
              for (let k in data) {
                for (let i in this.saveIds) {
                  if (+data[k].id == this.saveIds[i]) {
                    data[k]["type"] = 2;
                    data[k]["down"] = this.saveLinks[i];
                  }
                }
                // data[k]["type"] = 1;
              }
              that.data = data;
            }
          });
        });
      },

      this.imgSee = true;
    },
      seeImages(row) {
        this.imgUrl = "";
        this.imgUrl = "url(" + row.link + ") center center / contain no-repeat";
        // console.log(this.imgUrl);
        // this.imgUrl = row.link;

    fileFormat(row) {
      var index = row.link.lastIndexOf(".");
      var ext = row.link.substr(index + 1);
        this.imgSee = true;
      },

      return (
        [
          "png",
          "jpg",
          "jpeg",
          "bmp",
          "gif",
          "webp",
          "psd",
          "svg",
          "tiff"
        ].indexOf(ext.toLowerCase()) == -1
      );
      fileFormat(row) {
        var index = row.link.lastIndexOf(".");
        var ext = row.link.substr(index + 1);

        return (
          [
            "png",
            "jpg",
            "jpeg",
            "bmp",
            "gif",
            "webp",
            "psd",
            "svg",
            "tiff"
          ].indexOf(ext.toLowerCase()) == -1
        );
      }
    }
  }
};
  };
</script>

<style lang="scss" scoped>
.red {
  border: 1px solid rgba($color: #ff5656, $alpha: 0.3) !important;
  background-color: rgba($color: #ff5151, $alpha: 0.1) !important;
  color: rgba($color: #ff5151, $alpha: 1) !important;
}
.hand:hover {
  cursor: pointer;
}
// .longbut {
//   // background-color: red !important;
//   width: 125px;
// }
// .shortbut {
//   // background-color: green !important;
//   width: 80px;
// }
  .red {
    border: 1px solid rgba($color: #ff5656, $alpha: 0.3) !important;
    background-color: rgba($color: #ff5151, $alpha: 0.1) !important;
    color: rgba($color: #ff5151, $alpha: 1) !important;
  }

  .hand:hover {
    cursor: pointer;
  }

  // .longbut {
  //   // background-color: red !important;
  //   width: 125px;
  // }
  // .shortbut {
  //   // background-color: green !important;
  //   width: 80px;
  // }
</style>