mali-applet-ui 0.0.48 → 0.0.51

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.
@@ -4,7 +4,7 @@
4
4
  <view class="ml-approval-record-header-title">审批记录</view>
5
5
  </view>
6
6
  <view class="ml-approval-record-body">
7
- <view class="ml-approval-record-list" v-for="(group, gIndex) in options" :key="gIndex">
7
+ <view class="ml-approval-record-list" v-for="(group, gIndex) in flowOptions" :key="gIndex">
8
8
  <view class="ml-approval-record-flow-line"></view>
9
9
  <view class="ml-approval-record-item">
10
10
  <view class="ml-approval-record-item-title">{{ group.name }}</view>
@@ -37,11 +37,46 @@
37
37
  </template>
38
38
 
39
39
  <script>
40
+ import globalStore from '../../config/store'
41
+
40
42
  export default {
41
43
  name: 'MlApprovalRecord',
42
44
  props: {
43
45
  value: Array,
46
+ code: String,
44
47
  options: Array
48
+ },
49
+ data () {
50
+ return {
51
+ flowOptions: []
52
+ }
53
+ },
54
+ watch: {
55
+ code () {
56
+ this.load()
57
+ }
58
+ },
59
+ created () {
60
+ this.flowOptions = this.options || []
61
+ this.load()
62
+ },
63
+ methods: {
64
+ load () {
65
+ if (!this.code) {
66
+ return
67
+ }
68
+ if (globalStore.approval && globalStore.approval.record) {
69
+ const optionMethod = globalStore.approval.record.optionMethod
70
+ if (optionMethod) {
71
+ Promise.resolve(optionMethod({
72
+ value: this.value,
73
+ code: this.code
74
+ })).then(options => {
75
+ this.flowOptions = options
76
+ })
77
+ }
78
+ }
79
+ }
45
80
  }
46
81
  }
47
82
  </script>
@@ -4,7 +4,8 @@
4
4
  <view class="ml-approval-select-header-title">审批流程</view>
5
5
  </view>
6
6
  <view class="ml-approval-select-body">
7
- <view class="ml-approval-select-list" v-for="(group, gIndex) in options" :key="gIndex">
7
+ <view class="ml-approval-select-list" v-for="(group, gIndex) in flowOptions" :key="gIndex">
8
+ <view class="ml-approval-select-flow-line"></view>
8
9
  <view class="ml-approval-select-item">
9
10
  <view class="ml-approval-select-item-title">{{ group.name }}</view>
10
11
  </view>
@@ -12,9 +13,6 @@
12
13
  <view class="ml-approval-select-user-item" v-for="(item, uIndex) in group.users" :key="uIndex">
13
14
  <image class="ml-approval-select-user-picture" :src="item.picture" mode="scaleToFill"></image>
14
15
  <view class="ml-approval-select-user-name">{{ item.name }}</view>
15
- <view class="ml-approval-select-user-remove">
16
- <ml-icon name="close"></ml-icon>
17
- </view>
18
16
  </view>
19
17
  <view class="ml-approval-select-user-add" @click="openAddUser">
20
18
  <view class="ml-approval-select-user-add-icon">
@@ -24,24 +22,49 @@
24
22
  </view>
25
23
  </view>
26
24
  </view>
27
-
28
- <uni-popup ref="popup" type="bottom">
29
- <text>Popup</text>
30
- <button @click="close">关闭</button>
31
- </uni-popup>
32
25
  </view>
33
26
  </template>
34
27
 
35
28
  <script>
29
+ import globalStore from '../../config/store'
30
+
36
31
  export default {
37
32
  name: 'MlApprovalSelect',
38
33
  props: {
39
34
  value: Array,
35
+ code: String,
40
36
  options: Array
41
37
  },
38
+ data () {
39
+ return {
40
+ flowOptions: []
41
+ }
42
+ },
43
+ watch: {
44
+ code () {
45
+ this.load()
46
+ }
47
+ },
48
+ created () {
49
+ this.flowOptions = this.options || []
50
+ this.load()
51
+ },
42
52
  methods: {
43
- openAddUser () {
44
- this.$refs.popup.open()
53
+ load () {
54
+ if (!this.code) {
55
+ return
56
+ }
57
+ if (globalStore.approval && globalStore.approval.select) {
58
+ const optionMethod = globalStore.approval.select.optionMethod
59
+ if (optionMethod) {
60
+ Promise.resolve(optionMethod({
61
+ value: this.value,
62
+ code: this.code
63
+ })).then(options => {
64
+ this.flowOptions = options
65
+ })
66
+ }
67
+ }
45
68
  }
46
69
  }
47
70
  }
@@ -59,49 +82,77 @@ export default {
59
82
  line-height: 60rpx;
60
83
  }
61
84
  .ml-approval-select-list {
85
+ position: relative;
62
86
  padding-bottom: 10rpx;
87
+ .ml-approval-select-flow-line {
88
+ position: absolute;
89
+ top: 0;
90
+ left: 0;
91
+ height: 100%;
92
+ width: 4rpx;
93
+ background: #D9D9D9;
94
+ &::before {
95
+ content: "";
96
+ position: absolute;
97
+ top: 12rpx;
98
+ left: -10rpx;
99
+ width: 24rpx;
100
+ height: 24rpx;
101
+ border-radius: 50%;
102
+ background: #D9D9D9;
103
+ }
104
+ }
105
+ &:first-child {
106
+ .ml-approval-select-flow-line {
107
+ top: 12rpx;
108
+ &::before {
109
+ top: 0;
110
+ }
111
+ }
112
+ }
113
+ &:last-child {
114
+ .ml-approval-select-flow-line {
115
+ height: 30rpx;
116
+ }
117
+ }
63
118
  }
64
119
  .ml-approval-select-item-title {
65
- padding-left: 20rpx;
120
+ padding-left: 40rpx;
66
121
  line-height: 50rpx;
67
122
  }
68
123
  .ml-approval-select-users {
69
124
  display: flex;
70
125
  flex-direction: row;
71
- flex-wrap: wrap;
126
+ padding-left: 40rpx;
72
127
  }
73
128
  .ml-approval-select-user-item {
74
- position: relative;
129
+ display: flex;
130
+ flex-direction: column;
75
131
  padding: 10rpx;
76
- width: 150rpx;
77
132
  text-align: center;
133
+ width: 140rpx;
78
134
  .ml-approval-select-user-picture {
79
135
  width: 100rpx;
80
136
  height: 100rpx;
81
137
  border-radius: 50%;
138
+ margin: 0 auto;
82
139
  }
83
140
  .ml-approval-select-user-name {
141
+ display: inline-block;
142
+ vertical-align: middle;
143
+ max-width: 150rpx;
84
144
  overflow: hidden;
85
145
  text-overflow: ellipsis;
86
146
  white-space: nowrap;
147
+ margin-right: 10rpx;
87
148
  font-size: 24rpx;
88
- }
89
- .ml-approval-select-user-remove {
90
- position: absolute;
91
- top: 0;
92
- right: 10rpx;
93
- width: 40rpx;
94
- height: 40rpx;
95
- line-height: 40rpx;
96
- border-radius: 50%;
97
- text-align: center;
98
- color: #ffffff;
99
- background: rgba(0, 0, 0, 0.45);
149
+ color: rgba(0, 0, 0, 0.85);
100
150
  }
101
151
  }
102
152
  .ml-approval-select-user-add {
153
+ display: flex;
154
+ flex-direction: column;
103
155
  padding: 10rpx;
104
- width: 160rpx;
105
156
  text-align: center;
106
157
  .ml-approval-select-user-add-icon {
107
158
  width: 100rpx;
@@ -114,4 +165,4 @@ export default {
114
165
  overflow: hidden;
115
166
  }
116
167
  }
117
- </style>
168
+ </style>
@@ -45,8 +45,9 @@ export default {
45
45
  .ml-chunk-item {
46
46
  display: flex;
47
47
  flex-direction: column;
48
- padding: 20rpx 10rpx;
48
+ padding: 20rpx;
49
49
  line-height: 50rpx;
50
+ font-size: $uni-font-size-base;
50
51
  $spans: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%,
51
52
  37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%,
52
53
  70.83333%, 75%, 79.16667%, 83.33333%, 87.5%, 91.66667%, 95.83333%, 100%;
@@ -3,7 +3,17 @@
3
3
  <slot>
4
4
  <view v-for="(item, index) in items" :key="index">
5
5
  <ml-form-group v-if="item.children && item.children.length" :title="item.title">
6
- <ml-form-item v-for="(cItem, cIndex) in item.children" :key="cIndex" :title="cItem.title" :field="cItem.field" :itemRender="cItem.itemRender" @modelvalue="updateModel"></ml-form-item>
6
+ <ml-form-item
7
+ v-for="(cItem, cIndex) in item.children"
8
+ :key="cIndex"
9
+ :title="cItem.title"
10
+ :field="cItem.field"
11
+ :vertical="cItem.vertical"
12
+ :align="cItem.align"
13
+ :titleAlign="cItem.titleAlign"
14
+ :itemRender="cItem.itemRender"
15
+ @modelvalue="updateModel">
16
+ </ml-form-item>
7
17
  </ml-form-group>
8
18
  <ml-form-item v-else :title="item.title" :field="item.field" :itemRender="item.itemRender" @modelvalue="updateModel"></ml-form-item>
9
19
  </view>
@@ -183,5 +183,6 @@ export default {
183
183
  .ml-form-item-content-warpper {
184
184
  flex-grow: 1;
185
185
  width: 100%;
186
+ padding: 10rpx 0;
186
187
  }
187
188
  </style>
@@ -4,6 +4,7 @@
4
4
  <scroll-view scroll-y>
5
5
  <slot></slot>
6
6
  </scroll-view>
7
+ <uni-load-more v-if="loadMore" v-show="!loading" :status="loadStatus"></uni-load-more>
7
8
  </view>
8
9
  </view>
9
10
  </template>
@@ -16,6 +17,7 @@ export default {
16
17
  },
17
18
  props: {
18
19
  title: String,
20
+ loadMore: Boolean,
19
21
  className: String
20
22
  }
21
23
  }
@@ -59,7 +59,7 @@ export default {
59
59
  display: flex;
60
60
  flex-direction: row;
61
61
  padding: 20rpx;
62
- margin: 10rpx 0;
62
+ margin: 20rpx 0;
63
63
  border-radius: 10rpx;
64
64
  background: #ffffff;
65
65
  .ml-list-item-content {
@@ -55,6 +55,10 @@ export default {
55
55
  }
56
56
  .ml-month-picker-text {
57
57
  flex-grow: 1;
58
+ padding-right: 10rpx;
59
+ overflow: hidden;
60
+ text-overflow: ellipsis;
61
+ white-space: nowrap;
58
62
  }
59
63
  .ml-month-picker-icon {
60
64
  color: #6a6a6a;
@@ -118,6 +118,7 @@ export default {
118
118
  }
119
119
  .ml-select-picker-text {
120
120
  flex-grow: 1;
121
+ padding-right: 10rpx;
121
122
  overflow: hidden;
122
123
  text-overflow: ellipsis;
123
124
  white-space: nowrap;
@@ -1,5 +1,5 @@
1
1
  <template>
2
- <view class="ml-upload" :class="className">
2
+ <view class="ml-upload" :class="[className || '']">
3
3
  <view v-if="isFromReadonly">
4
4
  <view v-if="mediatype === 'image'" class="ml-upload-image-list">
5
5
  <view class="ml-upload-file-item" v-for="(item, index) in value" :key="index">
@@ -55,6 +55,10 @@ export default {
55
55
  }
56
56
  .ml-year-picker-text {
57
57
  flex-grow: 1;
58
+ padding-right: 10rpx;
59
+ overflow: hidden;
60
+ text-overflow: ellipsis;
61
+ white-space: nowrap;
58
62
  }
59
63
  .ml-year-picker-icon {
60
64
  color: #6a6a6a;
package/config/store.js CHANGED
@@ -16,6 +16,17 @@ const globalStore = {
16
16
  downloadFile: null,
17
17
  // 删除附件方法
18
18
  removeFile: null
19
+ },
20
+ // 审批组件
21
+ approval: {
22
+ // 审批流程
23
+ select: {
24
+ optionMethod: null
25
+ },
26
+ // 审批记录
27
+ record: {
28
+ optionMethod: null
29
+ }
19
30
  }
20
31
  }
21
32
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mali-applet-ui",
3
- "version": "0.0.48",
3
+ "version": "0.0.51",
4
4
  "description": "码里云小程序组件库",
5
5
  "files": [
6
6
  "components",
@@ -14,6 +14,19 @@
14
14
  "devDependencies": {
15
15
  "xe-utils": "3.5.6"
16
16
  },
17
+ "uni-app": {
18
+ "scripts": {
19
+ "mp-dingtalk": {
20
+ "title": "钉钉小程序",
21
+ "env": {
22
+ "UNI_PLATFORM": "mp-alipay"
23
+ },
24
+ "define": {
25
+ "MP-DINGTALK": true
26
+ }
27
+ }
28
+ }
29
+ },
17
30
  "author": "xu_liangzhan@163.com",
18
31
  "keywords": [
19
32
  "mali-ui",