1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
| /**
| * 流程台只读描述列表的响应式列数 mixin
| * 用于各阶段详情组件，根据窗口宽度自适应 el-descriptions 的 column：
| * - >= 1920px：4 列（宽屏）
| * - >= 1200px：3 列（中屏）
| * - >= 768px ：2 列（窄屏）
| * - < 768px ：1 列（手机）
| */
| export default {
| data() {
| return {
| windowWidth: 0
| };
| },
| computed: {
| descriptionColumn() {
| const w = this.windowWidth;
| if (w >= 1920) return 4;
| if (w >= 1200) return 3;
| if (w >= 768) return 2;
| return 1;
| }
| },
| mounted() {
| this.windowWidth = window.innerWidth;
| this.__handleWindowResize = () => {
| this.windowWidth = window.innerWidth;
| };
| window.addEventListener("resize", this.__handleWindowResize);
| },
| beforeDestroy() {
| if (this.__handleWindowResize) {
| window.removeEventListener("resize", this.__handleWindowResize);
| }
| }
| };
|
|
