U 不良品列表页 滚动调整

he wei

2024-08-09 a5219998f6d09f02c0bae1864e1c0635a6737fce

 src/pages/resourceManage/defective/list.vue

@@ -15,7 +15,7 @@
            @refresh="onRefresh"
            @reset="onReset"
            :format-conditions="true"
            :scroll="{ x: 400, y }"
            :scroll="{ x: 1800, y }"
            :pagination="{
              current: pageCurr,
              pageSize: pageSize,
@@ -37,10 +37,7 @@
            <template slot="title">
              <a-space class="operator">
                <span class="title">不良品中心</span>
                <a-button
                  v-if="canUploadBom"
                  type="primary"
                  @click="uploadDefective"
                <a-button type="primary" @click="uploadDefective"
                  >新增</a-button
                >
              </a-space>
@@ -188,6 +185,14 @@
    >
      <img alt="example" style="width: 100%" :src="imgUrl" />
    </a-modal>
    <pop
      :visible.sync="popVisible"
      :x="popPosition.x"
      :y="popPosition.y"
      :position="popPosition.dir"
    >
    <pop-info :info="popInfo" v-if="popVisible"></pop-info>
  </pop>
  </div>
</template>

@@ -202,11 +207,14 @@
import filesList from "@/pages/components/filesList";

import getWebUrl from "@/assets/js/tools/getWebUrl";

import { getUserList } from "../../permission/apis";
import { stopDefective } from "./apis";
import { mapGetters } from "vuex";
import checkPermit from "@/assets/js/tools/checkPermit";
import PERMITS from "@/assets/js/const/const_permits";
import Pop from "../components/pop";
import popInfo from './popInfo';
import offset from "@/assets/js/tools/offset";

import createWs from "@/assets/js/websocket";
import DiffList from "@/pages/components/diffList";
@@ -220,6 +228,13 @@
  mixins: [WSMixin],
  data() {
    return {
      popVisible: false,
      popPosition: {
        x: 0,
        y: 0,
        dir: "bottom",
      },
      popInfo: [],
      previewVisible: false,
      imgUrl: "",
      fileList: [],
@@ -282,6 +297,8 @@
          width: 60,
          noSearch: true,
          scopedSlots: { customRender: "dataIndex" },
          customCell: this.customCell,
          
        },
        {
          title: "物料名称",
@@ -291,6 +308,7 @@
          align: "center",
          // searchAble: true,
          noSearch: true,
          customCell: this.customCell,
        },
        {
          title: "型号",
@@ -299,6 +317,7 @@
          align: "center",
          width: 180,
          noSearch: true,
          customCell: this.customCell,
        },
        {
          title: "厂商名称",
@@ -308,6 +327,7 @@
          width: 180,
          // searchAble: true,
          noSearch: true,
          customCell: this.customCell,
        },
        {
          title: "入料时间",
@@ -317,6 +337,7 @@
          width: 160,
          searchAble: true,
          dataType: "dateRange",
          customCell: this.customCell,
        },
        {
          title: "创建人",
@@ -329,6 +350,7 @@
            default: "",
            selectOptions: [],
          },
          customCell: this.customCell,
        },
        {
          title: "状态",
@@ -361,6 +383,7 @@
              },
            ],
          },
          customCell: this.customCell,
        },
        {
          title: "总数量",
@@ -377,6 +400,7 @@
          // searchAble: true,
          noSearch: true,
          // visible: false,
          customCell: this.customCell,
        },
        {
          title: "不良描述",
@@ -385,6 +409,7 @@
          // searchAble: true,
          noSearch: true,
          // visible: false,
          customCell: this.customCell,
        },
        {
          title: "操作",
@@ -412,8 +437,63 @@
    DownloadReason,
    DownloadLogs,
    OwnerDownload,
    Pop,
    popInfo,
  },
  methods: {
    cellMouseenter(e, obj) {
      // console.log("enter", e, obj);
      const wraper = this.$refs.wraper;
      const { clientHeight, clientWidth } = wraper;
      const { target, clientX, clientY } = e;
      let { left: x, top: y } = offset(wraper);
      x = clientX - x;
      y = clientY - y;
      // 如果clientHeight 小于380 * 2 则左右布局
      let dir = "bottom";
      if (clientHeight < 380 * 2) {
        if (x + 420 + 18 > clientWidth) {
          dir = "left";
        } else {
          dir = "right";
        }
        if (y < 180) {
          y = 180;
        } else if (y > clientHeight - 378) {
          y = clientHeight / 2;
        }
      } else {
        if (y + 18 + 360 > clientHeight) {
          // y = clientHeight - 378;
          dir = "top";
        } else {
          dir = "bottom";
        }
        if (x < 300) {
          x = 300;
        }
        if (x + 300 > clientWidth) {
          x = clientWidth - 300;
        }
      }
      this.popPosition.x = x;
      this.popPosition.y = y;
      this.popPosition.dir = dir;
      this.popInfo = obj;
      this.popVisible = true;
    },
    cellMouseleave(e, obj) {
      // console.log("leave", obj);
      this.popVisible = false;
    },
    customCell(record) {
      return {
        on: {
          mouseenter: (e) => this.cellMouseenter(e, record),
          mouseleave: (e) => this.cellMouseleave(e, record),
        },
      };
    },
    rowClassFn(record) {
      let classList = [];
      classList.push("level-" + record.confirmStatus);
@@ -639,6 +719,29 @@
    logCancel() {
      this.logVisible = false;
    },
    searchAllUserList() {
      getUserList()
        .then((res) => {
          let rs = res.data;
          if (rs.code && rs.data) {
            let list = rs.data2
              .map((v) => ({ title: v.name, value: v.id }))
              .filter((v) => v.title != this.user.name);
            list.unshift(
              { title: "全部", value: "" },
              { title: this.user.name, value: this.user.id }
            );
            this.columns.forEach((v) => {
              if (v.dataIndex == "recorder") {
                v.search.selectOptions = list;
              }
            });
          }
        })
        .catch((error) => {
          console.log(error);
        });
    },
  },
  watch: {
    update(n) {
@@ -683,9 +786,6 @@
      "user",
    ]),
    ...mapGetters("setting", ["affixed"]),
    canUploadBom() {
      return checkPermit(PERMITS.uploadBom, this.permits);
    },
    canDownloadBom() {
      return checkPermit(PERMITS.downloadBom, this.permits);
    },
@@ -738,6 +838,7 @@
    },
  },
  mounted() {
    this.searchAllUserList();
    this.sendMessage();
    window.addEventListener("resize", this.resize);
  },