生产监控页面样式调整

src/utils/moveElement.js

@@ -0,0 +1,46 @@
+/**
+ * div拖拽
+ */
+class MoveElement {
+  constructor(el) {
+    this.$el = el;
+    this.init();
+  }
+  init() {
+    const dv = this.$el;
+
+  // 🔴 关键修复：检查 dv 是否为有效 DOM 元素
+  if (!dv || typeof dv !== 'object' || !dv.nodeType) {
+    console.warn('MoveElement: 传入的 el 不是有效的 DOM 元素', dv);
+    return;
+  }
+
+  let x = 0;
+  let l = 0;
+  let isDown = false;
+
+  dv.onmousedown = function(e) {
+    x = e.clientX;
+    l = dv.offsetLeft;
+    isDown = true;
+    dv.style.cursor = 'move';
+    e.preventDefault();
+  };
+
+  dv.onmousemove = function(e) {
+    e.preventDefault();
+    if (!isDown) return;
+    const nx = e.clientX;
+    const nl = nx - (x - l);
+    dv.style.left = nl + 'px';
+  };
+
+  dv.onmouseup = function(e) {
+    e.preventDefault();
+    isDown = false;
+    dv.style.cursor = 'default';
+  };
+  }
+}
+
+export default MoveElement;

src/views/workRate/processView.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="scrollContent">
+    <div class="scrollBox">
+      <ul v-for="(item, index) of list" :key="index" :style="`border-color:${color[item.status]}`">
+        <li>3333</li>
+      </ul>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'processView',
+  props: {
+    // list: {
+    //   default: () => [],
+    //   type: Array,
+    // },
+    woId: {
+      default: Number,
+      type: '',
+    },
+  },
+  data() {
+    return {
+      color: {
+        1: '#707070',
+        2: '#22ac38',
+        3: '#22ac38',
+        5: '#00b7ee',
+      },
+      list: [
+        {
+          status: 1,
+          text: '用户信息填写完成',
+          link: '',
+          orders: 'wo-09090909',
+          procedureSet: {
+            ppsName: '工序',
+          },
+        },
+      ],
+    };
+  },
+  mounted() {},
+};
+</script>
+<style lang="scss" scoped>
+
+</style>