n20-common-lib 3.2.6 → 3.2.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/assets/css/approve-card.scss +87 -0
- package/src/components/ApprovalCard/index.vue +38 -21
- package/style/index.css +1 -1
- package/theme/blue.css +1 -1
- package/theme/cctcRed.css +1 -1
- package/theme/green.css +1 -1
- package/theme/lightBlue.css +1 -1
- package/theme/orange.css +1 -1
- package/theme/purple.css +1 -1
- package/theme/red.css +1 -1
- package/theme/yellow.css +1 -1
package/package.json
CHANGED
|
@@ -18,7 +18,90 @@
|
|
|
18
18
|
cursor: default;
|
|
19
19
|
}
|
|
20
20
|
.result-left-name {
|
|
21
|
+
flex: 0 0 20%;
|
|
21
22
|
width: 20%;
|
|
23
|
+
min-width: 80px;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.approval-info-grid {
|
|
27
|
+
--approval-info-job-column: minmax(0, 0.9fr);
|
|
28
|
+
--approval-info-app-column: minmax(0, 0.8fr);
|
|
29
|
+
--approval-info-cost-column: minmax(170px, max-content);
|
|
30
|
+
--approval-info-detail-column: minmax(70px, max-content);
|
|
31
|
+
|
|
32
|
+
display: grid;
|
|
33
|
+
grid-template-columns:
|
|
34
|
+
minmax(0, 1.1fr)
|
|
35
|
+
minmax(0, 1.1fr)
|
|
36
|
+
var(--approval-info-job-column)
|
|
37
|
+
minmax(0, 1.4fr)
|
|
38
|
+
minmax(0, 0.8fr)
|
|
39
|
+
var(--approval-info-app-column)
|
|
40
|
+
var(--approval-info-cost-column)
|
|
41
|
+
var(--approval-info-detail-column);
|
|
42
|
+
align-items: center;
|
|
43
|
+
column-gap: 0;
|
|
44
|
+
width: 80%;
|
|
45
|
+
min-width: 0;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.approval-info-grid > * {
|
|
49
|
+
box-sizing: border-box;
|
|
50
|
+
min-width: 0;
|
|
51
|
+
padding-right: 20px;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.approval-info-grid--no-job {
|
|
55
|
+
--approval-info-job-column: 0;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.approval-info-grid--no-app {
|
|
59
|
+
--approval-info-app-column: 0;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.approval-info-grid--no-cost {
|
|
63
|
+
--approval-info-cost-column: 0;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
.approval-info-grid--no-detail {
|
|
67
|
+
--approval-info-detail-column: 0;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.approval-info-member {
|
|
71
|
+
grid-column: 1;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
.approval-info-dept {
|
|
75
|
+
grid-column: 2;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
.approval-info-job {
|
|
79
|
+
grid-column: 3;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.approval-info-role {
|
|
83
|
+
grid-column: 4;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.approval-info-assignee {
|
|
87
|
+
grid-column: 5;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.approval-info-app {
|
|
91
|
+
grid-column: 6;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.approval-info-cost {
|
|
95
|
+
grid-column: 7;
|
|
96
|
+
justify-self: start;
|
|
97
|
+
white-space: nowrap;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.approval-info-detail {
|
|
101
|
+
grid-column: 8;
|
|
102
|
+
justify-self: start;
|
|
103
|
+
padding-right: 0;
|
|
104
|
+
white-space: nowrap;
|
|
22
105
|
}
|
|
23
106
|
|
|
24
107
|
.n20-time {
|
|
@@ -40,6 +123,10 @@
|
|
|
40
123
|
color: $--color-text-primary;
|
|
41
124
|
}
|
|
42
125
|
|
|
126
|
+
.appOrPc-item {
|
|
127
|
+
margin-right: 0;
|
|
128
|
+
}
|
|
129
|
+
|
|
43
130
|
.worker-icon {
|
|
44
131
|
margin-right: 4px;
|
|
45
132
|
color: $--color-text-placeholder;
|
|
@@ -24,22 +24,26 @@
|
|
|
24
24
|
</div>
|
|
25
25
|
<div
|
|
26
26
|
v-title="item.assignee"
|
|
27
|
-
class="flex-
|
|
27
|
+
class="flex-item n20-worker m-r-s approval-info-grid"
|
|
28
|
+
:class="{
|
|
29
|
+
'approval-info-grid--no-job': !item.job,
|
|
30
|
+
'approval-info-grid--no-app':
|
|
31
|
+
item.result === 0 || item.appOrPc === null || item.appOrPc === '' || item.appOrPc === undefined,
|
|
32
|
+
'approval-info-grid--no-detail': item.showConnect !== '1'
|
|
33
|
+
}"
|
|
28
34
|
:show-overflow-tooltip="true"
|
|
29
35
|
>
|
|
30
36
|
<div
|
|
31
37
|
v-title="item.memberName"
|
|
32
38
|
:show-overflow-tooltip="true"
|
|
33
|
-
class="
|
|
34
|
-
style="width: 250px"
|
|
39
|
+
class="n20-worker text-ellipsis approval-info-member"
|
|
35
40
|
>
|
|
36
41
|
{{ item.memberName }}
|
|
37
42
|
</div>
|
|
38
43
|
<div
|
|
39
44
|
v-title="item.deptName"
|
|
40
45
|
:show-overflow-tooltip="true"
|
|
41
|
-
class="
|
|
42
|
-
style="width: 250px"
|
|
46
|
+
class="n20-worker text-ellipsis approval-info-dept"
|
|
43
47
|
>
|
|
44
48
|
{{ item.deptName }}
|
|
45
49
|
</div>
|
|
@@ -47,37 +51,39 @@
|
|
|
47
51
|
v-if="item.job"
|
|
48
52
|
v-title="item.job"
|
|
49
53
|
:show-overflow-tooltip="true"
|
|
50
|
-
class="
|
|
51
|
-
style="width: 250px"
|
|
54
|
+
class="n20-worker text-ellipsis approval-info-job"
|
|
52
55
|
>
|
|
53
56
|
{{ item.job }}
|
|
54
57
|
</div>
|
|
55
58
|
<div
|
|
56
59
|
v-title="item.roleName"
|
|
57
|
-
class="
|
|
60
|
+
class="n20-worker text-ellipsis approval-info-role"
|
|
58
61
|
:show-overflow-tooltip="true"
|
|
59
|
-
style="width: 250px"
|
|
60
62
|
>
|
|
61
63
|
{{ item.roleName }}
|
|
62
64
|
</div>
|
|
63
65
|
<div
|
|
64
66
|
v-if="item.result !== 0"
|
|
65
67
|
v-title="item.assignee"
|
|
66
|
-
class="n20-worker text-ellipsis"
|
|
67
|
-
style="width: 180px"
|
|
68
|
+
class="n20-worker text-ellipsis approval-info-assignee"
|
|
68
69
|
:show-overflow-tooltip="true"
|
|
69
70
|
>
|
|
70
71
|
<span class="worker-icon n20-icon-user"></span>{{ item.assignee }}
|
|
71
72
|
</div>
|
|
72
73
|
<div
|
|
73
74
|
v-if="item.result !== 0 && item.appOrPc !== null && item.appOrPc !== '' && item.appOrPc !== undefined"
|
|
75
|
+
class="n20-worker text-ellipsis appOrPc-item approval-info-app"
|
|
74
76
|
>
|
|
75
77
|
<span v-if="item.outTitle">{{ item.outTitle }}</span>
|
|
76
78
|
<span v-else>
|
|
77
79
|
{{ item.appOrPc === '1' ? 'PC端审批' : item.appOrPc === '2' ? '外部系统审批' : 'App端审批' | $lc }}
|
|
78
80
|
</span>
|
|
79
81
|
</div>
|
|
80
|
-
<div
|
|
82
|
+
<div class="approval-info-cost">
|
|
83
|
+
<span>审批时长：</span>
|
|
84
|
+
<span>{{ item.approvalCost }}</span>
|
|
85
|
+
</div>
|
|
86
|
+
<div v-if="item.showConnect === '1'" class="approval-info-detail">
|
|
81
87
|
<span class="pointer color-ccc f-s-s" @click="seeDetail(item)"
|
|
82
88
|
>{{ '查看详情' | $lc }} <i class="el-icon-arrow-right"></i
|
|
83
89
|
></span>
|
|
@@ -132,38 +138,48 @@
|
|
|
132
138
|
</div>
|
|
133
139
|
<div
|
|
134
140
|
v-title="row.assignee"
|
|
135
|
-
class="flex-
|
|
141
|
+
class="flex-item n20-worker m-r-s approval-info-grid"
|
|
142
|
+
:class="{
|
|
143
|
+
'approval-info-grid--no-job': !row.job,
|
|
144
|
+
'approval-info-grid--no-app': true,
|
|
145
|
+
'approval-info-grid--no-cost': true,
|
|
146
|
+
'approval-info-grid--no-detail': true
|
|
147
|
+
}"
|
|
136
148
|
:show-overflow-tooltip="true"
|
|
137
149
|
>
|
|
138
150
|
<div
|
|
139
151
|
v-title="row.memberName"
|
|
140
152
|
:show-overflow-tooltip="true"
|
|
141
|
-
class="
|
|
142
|
-
style="width: 250px"
|
|
153
|
+
class="n20-worker text-ellipsis approval-info-member"
|
|
143
154
|
>
|
|
144
155
|
{{ row.memberName }}
|
|
145
156
|
</div>
|
|
146
157
|
<div
|
|
147
158
|
v-title="row.deptName"
|
|
148
159
|
:show-overflow-tooltip="true"
|
|
149
|
-
class="
|
|
150
|
-
style="width: 250px"
|
|
160
|
+
class="n20-worker text-ellipsis approval-info-dept"
|
|
151
161
|
>
|
|
152
162
|
{{ row.deptName }}
|
|
153
163
|
</div>
|
|
164
|
+
<div
|
|
165
|
+
v-if="row.job"
|
|
166
|
+
v-title="row.job"
|
|
167
|
+
:show-overflow-tooltip="true"
|
|
168
|
+
class="n20-worker text-ellipsis approval-info-job"
|
|
169
|
+
>
|
|
170
|
+
{{ row.job }}
|
|
171
|
+
</div>
|
|
154
172
|
<div
|
|
155
173
|
v-title="row.roleName"
|
|
156
|
-
class="
|
|
174
|
+
class="n20-worker text-ellipsis approval-info-role"
|
|
157
175
|
:show-overflow-tooltip="true"
|
|
158
|
-
style="width: 250px"
|
|
159
176
|
>
|
|
160
177
|
{{ row.roleName }}
|
|
161
178
|
</div>
|
|
162
179
|
<div
|
|
163
180
|
v-if="row.result !== 0"
|
|
164
181
|
v-title="row.assignee"
|
|
165
|
-
class="n20-worker text-ellipsis"
|
|
166
|
-
style="width: 180px"
|
|
182
|
+
class="n20-worker text-ellipsis approval-info-assignee"
|
|
167
183
|
:show-overflow-tooltip="true"
|
|
168
184
|
>
|
|
169
185
|
<span class="worker-icon n20-icon-user"></span>{{ row.assignee }}
|
|
@@ -518,6 +534,7 @@ export default {
|
|
|
518
534
|
let approvalData = []
|
|
519
535
|
data?.forEach((item) => {
|
|
520
536
|
let _item = {
|
|
537
|
+
approvalCost: item.approvalCost || '--',
|
|
521
538
|
job: item.job || '',
|
|
522
539
|
isShow: item.isShow, //是否显示
|
|
523
540
|
endTime: item.endTime || '',
|