bri-components 1.4.93 → 1.4.95

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.
Files changed (156) hide show
  1. package/README.md +83 -83
  2. package/lib/0.bri-components.min.js +1 -0
  3. package/lib/1.bri-components.min.js +1 -0
  4. package/lib/10.bri-components.min.js +1 -0
  5. package/lib/11.bri-components.min.js +1 -0
  6. package/lib/2.bri-components.min.js +1 -0
  7. package/lib/3.bri-components.min.js +1 -0
  8. package/lib/4.bri-components.min.js +1 -0
  9. package/lib/5.bri-components.min.js +1 -0
  10. package/lib/6.bri-components.min.js +1 -0
  11. package/lib/7.bri-components.min.js +1 -0
  12. package/lib/8.bri-components.min.js +1 -0
  13. package/lib/9.bri-components.min.js +1 -0
  14. package/lib/bri-components.min.js +18 -0
  15. package/lib/styles/bundle.css +12 -12
  16. package/lib/styles/font/fontello.svg +31 -31
  17. package/package.json +125 -125
  18. package/src/.DS_Store +0 -0
  19. package/src/components/.DS_Store +0 -0
  20. package/src/components/Error/Error403.vue +42 -42
  21. package/src/components/Error/Error404.vue +40 -40
  22. package/src/components/Error/Error500.vue +51 -51
  23. package/src/components/Error/error.less +162 -162
  24. package/src/components/Error/errorBack.vue +40 -40
  25. package/src/components/controls/.DS_Store +0 -0
  26. package/src/components/controls/DshControlInput.vue +195 -195
  27. package/src/components/controls/base/BriUpload/BriUpload.vue +434 -434
  28. package/src/components/controls/base/BriUpload/BriUploadImage.vue +373 -373
  29. package/src/components/controls/base/BriUpload/uploadList.vue +724 -724
  30. package/src/components/controls/base/BriUpload/uploadMixin.js +446 -446
  31. package/src/components/controls/base/DshCascader/DshCascader.vue +210 -210
  32. package/src/components/controls/base/DshCascader/components/cascaderModal.vue +366 -366
  33. package/src/components/controls/base/DshCascader/components/cascaderPicker.vue +416 -416
  34. package/src/components/controls/base/DshCascader/components/cascaderSimple.vue +143 -143
  35. package/src/components/controls/base/DshCoordinates.vue +577 -577
  36. package/src/components/controls/base/DshDate/DshDate.vue +191 -191
  37. package/src/components/controls/base/DshDate/DshDaterange.vue +186 -186
  38. package/src/components/controls/base/DshDivider.vue +201 -201
  39. package/src/components/controls/base/DshEditor.vue +274 -274
  40. package/src/components/controls/base/DshInput/BriInputs.vue +166 -166
  41. package/src/components/controls/base/DshInput/DshInput.vue +255 -255
  42. package/src/components/controls/base/DshNumber/BriInputNumber/BriInputNumber.vue +435 -435
  43. package/src/components/controls/base/DshNumber/BriInputNumber/mixins/emitter.js +34 -34
  44. package/src/components/controls/base/DshNumber/BriInputNumber/mixins/form.js +14 -14
  45. package/src/components/controls/base/DshNumber/BriInputNumber/utils/assist.js +322 -322
  46. package/src/components/controls/base/DshNumber/DshNumber.vue +143 -143
  47. package/src/components/controls/base/DshNumber/DshNumberange.vue +109 -109
  48. package/src/components/controls/base/DshSelect/DshCheckbox.vue +168 -168
  49. package/src/components/controls/base/DshSelect/DshSelect.vue +180 -180
  50. package/src/components/controls/base/DshSwitch/DshSwitch.vue +115 -115
  51. package/src/components/controls/control.less +324 -324
  52. package/src/components/controls/controlMap.js +114 -114
  53. package/src/components/controls/extra/DshColor.vue +81 -81
  54. package/src/components/controls/extra/themeColor.vue +104 -104
  55. package/src/components/controls/extra/themeIcon.vue +114 -114
  56. package/src/components/controls/mixins/cascaderMixin.js +295 -295
  57. package/src/components/controls/mixins/cascaderPickerMixin.js +216 -216
  58. package/src/components/controls/mixins/cascaderTableMixin.js +130 -130
  59. package/src/components/controls/mixins/controlMixin.js +368 -368
  60. package/src/components/controls/mixins/dateMixin.js +149 -149
  61. package/src/components/controls/mixins/flatTableMixin.js +111 -111
  62. package/src/components/controls/mixins/numberMixin.js +112 -112
  63. package/src/components/controls/mixins/selectMixin.js +233 -233
  64. package/src/components/controls/mixins/switchMixin.js +87 -87
  65. package/src/components/controls/mixins/userAndDepartMixin.js +218 -218
  66. package/src/components/controls/senior/.DS_Store +0 -0
  67. package/src/components/controls/senior/DshLabels.vue +331 -331
  68. package/src/components/controls/senior/DshPackage.vue +57 -57
  69. package/src/components/controls/senior/cascaderTable.vue +210 -210
  70. package/src/components/controls/senior/flatTable.vue +135 -135
  71. package/src/components/controls/senior/selectDepartments.vue +438 -438
  72. package/src/components/controls/senior/selectUsers/departMenu.vue +293 -293
  73. package/src/components/controls/senior/selectUsers/selectUsers.vue +752 -752
  74. package/src/components/controls/special/DshBack.vue +42 -42
  75. package/src/components/controls/special/DshUndeveloped.vue +41 -41
  76. package/src/components/form/DshAdvSearch.vue +510 -510
  77. package/src/components/form/DshDefaultSearch.vue +258 -258
  78. package/src/components/form/DshForm.vue +494 -494
  79. package/src/components/form/searchMixin.js +375 -375
  80. package/src/components/list/BriCard.vue +95 -95
  81. package/src/components/list/BriTable.vue +205 -205
  82. package/src/components/list/BriTree.vue +529 -529
  83. package/src/components/list/BriTreeItem.vue +163 -163
  84. package/src/components/list/DshBox/DshBox.vue +219 -219
  85. package/src/components/list/DshBox/DshCard.vue +446 -446
  86. package/src/components/list/DshBox/DshCrossTable.vue +827 -827
  87. package/src/components/list/DshBox/DshList.vue +404 -404
  88. package/src/components/list/DshBox/DshPanel.vue +669 -669
  89. package/src/components/list/DshBox/DshSingleData.vue +119 -119
  90. package/src/components/list/DshBox/DshTable.vue +239 -239
  91. package/src/components/list/DshCascaderTable.vue +115 -115
  92. package/src/components/list/DshFlatTable.vue +339 -339
  93. package/src/components/list/DshPage.vue +194 -194
  94. package/src/components/list/DshTreeTable.vue +113 -113
  95. package/src/components/list/common/importModal.vue +243 -243
  96. package/src/components/list/common/quoteListModal.vue +206 -206
  97. package/src/components/list/mixins/DshCascaderTableMixin.js +278 -278
  98. package/src/components/list/mixins/DshFlatTableMixin.js +493 -493
  99. package/src/components/list/mixins/DshTreeTableMixin.js +286 -286
  100. package/src/components/list/mixins/tableBaseMixin.js +1661 -1661
  101. package/src/components/list/mixins/treeTableBaseMixin.js +149 -149
  102. package/src/components/other/BriAvatar.vue +166 -166
  103. package/src/components/other/BriCode.vue +125 -125
  104. package/src/components/other/BriCollapseTree.vue +207 -207
  105. package/src/components/other/BriGantt.vue +1084 -1084
  106. package/src/components/other/BriIframe.vue +116 -116
  107. package/src/components/other/BriLoading.vue +171 -171
  108. package/src/components/other/BriSvg.vue +28 -28
  109. package/src/components/other/DshColorPanel.vue +128 -128
  110. package/src/components/other/DshMenuNav.vue +188 -188
  111. package/src/components/small/BriButton.vue +71 -71
  112. package/src/components/small/BriDrawer.vue +169 -169
  113. package/src/components/small/BriTooltip.vue +87 -87
  114. package/src/components/small/DshBtnModal.vue +68 -68
  115. package/src/components/small/DshButtons.vue +324 -324
  116. package/src/components/small/DshDropdown.vue +225 -225
  117. package/src/components/small/DshIcons.vue +59 -59
  118. package/src/components/small/DshListRender.js +21 -21
  119. package/src/components/small/DshModal.vue +160 -160
  120. package/src/components/small/DshSteps.vue +141 -141
  121. package/src/components/small/DshTabs.vue +598 -598
  122. package/src/components/small/DshTabsSet.vue +309 -309
  123. package/src/components/small/DshTags.vue +251 -251
  124. package/src/components/small/DshTitle.vue +50 -50
  125. package/src/components/small/render.js +20 -20
  126. package/src/components/unit/DshFormUnit.vue +398 -398
  127. package/src/components/unit/DshListUnit.vue +115 -115
  128. package/src/components/unit/unitMixin.js +86 -86
  129. package/src/data/index.js +9 -9
  130. package/src/index.js +271 -271
  131. package/src/styles/.DS_Store +0 -0
  132. package/src/styles/bundle.css +12 -12
  133. package/src/styles/components/.DS_Store +0 -0
  134. package/src/styles/components/BriButton.less +292 -292
  135. package/src/styles/components/BriTable.less +344 -344
  136. package/src/styles/components/DshModal.less +257 -250
  137. package/src/styles/components/index.less +3 -3
  138. package/src/styles/global/animate.less +11 -11
  139. package/src/styles/global/base.less +45 -45
  140. package/src/styles/global/box.less +186 -186
  141. package/src/styles/global/control.less +122 -122
  142. package/src/styles/global/flex.less +282 -282
  143. package/src/styles/global/global.less +8 -8
  144. package/src/styles/global/text.less +59 -59
  145. package/src/styles/global/variables.less +79 -85
  146. package/src/styles/iconfont/iconfont.css +254 -254
  147. package/src/styles/iconfont/iconfont.json +422 -422
  148. package/src/styles/iconfont/iconfont.svg +137 -137
  149. package/src/styles/index.less +11 -11
  150. package/src/styles/reset-easytable.less +21 -21
  151. package/src/styles/reset-iview-controls.less +145 -145
  152. package/src/styles/reset-iview-other.less +49 -49
  153. package/src/styles/reset-iview-variables.less +34 -34
  154. package/src/styles/reset.less +45 -45
  155. package/src/utils/index.js +5 -5
  156. package/src/utils/table.js +175 -175
@@ -1,114 +1,114 @@
1
- const controlConfig = window.controlConfig || {
2
- componentNameMap: {},
3
- pathMap: {},
4
- registerComponents: () => {
5
- return {};
6
- }
7
- };
8
-
9
- // TODO: 特别声明:每一个开发的控件必须要加一个change回调事件!
10
- const componentNameMap = {
11
- // base类型
12
- text: "DshInput",
13
- textarea: "DshInput",
14
- idcard: "DshInput",
15
- email: "DshInput",
16
- phone: "DshInput",
17
- url: "DshInput",
18
- password: "DshInput",
19
- serialNumber: "DshInput",
20
-
21
- number: "DshNumber",
22
- numberange: "DshNumberange",
23
- date: "DshDate",
24
- daterange: "DshDaterange",
25
-
26
- switch: "DshSwitch",
27
- select: "DshSelect",
28
- checkbox: "DshCheckbox",
29
- region: "DshCascader",
30
- regions: "DshCascader",
31
- cascader: "DshCascader",
32
- cascaders: "DshCascader",
33
-
34
- file: "BriUpload",
35
- coordinates: "DshCoordinates",
36
- editor: "DshEditor",
37
- tag: "DshDivider",
38
-
39
- users: "selectUsers",
40
- departments: "selectDepartments",
41
- labels: "DshLabels",
42
- package: "DshPackage",
43
- flatTable: "flatTable",
44
- cascaderTable: "cascaderTable",
45
-
46
- themeColor: "themeColor",
47
- themeIcon: "themeIcon",
48
- color: "DshColor",
49
-
50
- back: "DshBack",
51
- undefined: "DshUndeveloped",
52
-
53
- ...controlConfig.componentNameMap
54
- };
55
-
56
- // 组件相对路径映射图
57
- const pathMap = {
58
- base: {
59
- // DshInput: "./base/DshInput/DshInput.vue", // 全局已注册
60
- // DshNumber: "./base/DshNumber/DshNumber.vue", // 全局已注册
61
- DshDate: "./base/DshDate/DshDate.vue",
62
- DshDaterange: "./base/DshDate/DshDaterange.vue",
63
- DshSwitch: "./base/DshSwitch/DshSwitch.vue",
64
- // DshSelect: "./base/DshSelect/DshSelect.vue", // 全局已注册
65
- // DshCheckbox: "./base/DshSelect/DshCheckbox.vue", // 全局已注册
66
- // DshCascader: "./base/DshCascader/DshCascader.vue", // 全局已注册
67
- BriUpload: "./base/BriUpload/BriUpload.vue",
68
- DshCoordinates: "./base/DshCoordinates.vue",
69
- DshEditor: "./base/DshEditor.vue",
70
- DshDivider: "./base/DshDivider.vue"
71
- },
72
- senior: {
73
- selectUsers: "./senior/selectUsers/selectUsers.vue",
74
- selectDepartments: "./senior/selectDepartments.vue",
75
- DshLabels: "./senior/DshLabels.vue",
76
- DshPackage: "./senior/DshPackage.vue",
77
- flatTable: "./senior/flatTable.vue",
78
- cascaderTable: "./senior/cascaderTable"
79
- },
80
- extra: {
81
- themeColor: "./extra/themeColor.vue",
82
- themeIcon: "./extra/themeIcon.vue",
83
- DshColor: "./extra/DshColor.vue"
84
- },
85
- special: {
86
- DshBack: "./special/DshBack.vue",
87
- DshUndeveloped: "./special/DshUndeveloped.vue"
88
- }
89
- };
90
-
91
- // 得到组件注册对象
92
- function registerComponents (map = pathMap) {
93
- let loop = (map, obj) => {
94
- return Object.entries(map).reduce((obj, arr) => {
95
- if (Object.prototype.toString.call(arr[1]) === "[object Object]") {
96
- return loop(arr[1], obj);
97
- } else {
98
- return Object.assign(obj, {
99
- [arr[0]]: () => import(`${arr[1]}`)
100
- });
101
- }
102
- }, obj);
103
- };
104
- return {
105
- ...loop(map, {}),
106
- ...controlConfig.registerComponents()
107
- };
108
- };
109
-
110
- export {
111
- componentNameMap,
112
- pathMap,
113
- registerComponents
114
- };
1
+ const controlConfig = window.controlConfig || {
2
+ componentNameMap: {},
3
+ pathMap: {},
4
+ registerComponents: () => {
5
+ return {};
6
+ }
7
+ };
8
+
9
+ // TODO: 特别声明:每一个开发的控件必须要加一个change回调事件!
10
+ const componentNameMap = {
11
+ // base类型
12
+ text: "DshInput",
13
+ textarea: "DshInput",
14
+ idcard: "DshInput",
15
+ email: "DshInput",
16
+ phone: "DshInput",
17
+ url: "DshInput",
18
+ password: "DshInput",
19
+ serialNumber: "DshInput",
20
+
21
+ number: "DshNumber",
22
+ numberange: "DshNumberange",
23
+ date: "DshDate",
24
+ daterange: "DshDaterange",
25
+
26
+ switch: "DshSwitch",
27
+ select: "DshSelect",
28
+ checkbox: "DshCheckbox",
29
+ region: "DshCascader",
30
+ regions: "DshCascader",
31
+ cascader: "DshCascader",
32
+ cascaders: "DshCascader",
33
+
34
+ file: "BriUpload",
35
+ coordinates: "DshCoordinates",
36
+ editor: "DshEditor",
37
+ tag: "DshDivider",
38
+
39
+ users: "selectUsers",
40
+ departments: "selectDepartments",
41
+ labels: "DshLabels",
42
+ package: "DshPackage",
43
+ flatTable: "flatTable",
44
+ cascaderTable: "cascaderTable",
45
+
46
+ themeColor: "themeColor",
47
+ themeIcon: "themeIcon",
48
+ color: "DshColor",
49
+
50
+ back: "DshBack",
51
+ undefined: "DshUndeveloped",
52
+
53
+ ...controlConfig.componentNameMap
54
+ };
55
+
56
+ // 组件相对路径映射图
57
+ const pathMap = {
58
+ base: {
59
+ // DshInput: "./base/DshInput/DshInput.vue", // 全局已注册
60
+ // DshNumber: "./base/DshNumber/DshNumber.vue", // 全局已注册
61
+ DshDate: "./base/DshDate/DshDate.vue",
62
+ DshDaterange: "./base/DshDate/DshDaterange.vue",
63
+ DshSwitch: "./base/DshSwitch/DshSwitch.vue",
64
+ // DshSelect: "./base/DshSelect/DshSelect.vue", // 全局已注册
65
+ // DshCheckbox: "./base/DshSelect/DshCheckbox.vue", // 全局已注册
66
+ // DshCascader: "./base/DshCascader/DshCascader.vue", // 全局已注册
67
+ BriUpload: "./base/BriUpload/BriUpload.vue",
68
+ DshCoordinates: "./base/DshCoordinates.vue",
69
+ DshEditor: "./base/DshEditor.vue",
70
+ DshDivider: "./base/DshDivider.vue"
71
+ },
72
+ senior: {
73
+ selectUsers: "./senior/selectUsers/selectUsers.vue",
74
+ selectDepartments: "./senior/selectDepartments.vue",
75
+ DshLabels: "./senior/DshLabels.vue",
76
+ DshPackage: "./senior/DshPackage.vue",
77
+ flatTable: "./senior/flatTable.vue",
78
+ cascaderTable: "./senior/cascaderTable"
79
+ },
80
+ extra: {
81
+ themeColor: "./extra/themeColor.vue",
82
+ themeIcon: "./extra/themeIcon.vue",
83
+ DshColor: "./extra/DshColor.vue"
84
+ },
85
+ special: {
86
+ DshBack: "./special/DshBack.vue",
87
+ DshUndeveloped: "./special/DshUndeveloped.vue"
88
+ }
89
+ };
90
+
91
+ // 得到组件注册对象
92
+ function registerComponents (map = pathMap) {
93
+ let loop = (map, obj) => {
94
+ return Object.entries(map).reduce((obj, arr) => {
95
+ if (Object.prototype.toString.call(arr[1]) === "[object Object]") {
96
+ return loop(arr[1], obj);
97
+ } else {
98
+ return Object.assign(obj, {
99
+ [arr[0]]: () => import(`${arr[1]}`)
100
+ });
101
+ }
102
+ }, obj);
103
+ };
104
+ return {
105
+ ...loop(map, {}),
106
+ ...controlConfig.registerComponents()
107
+ };
108
+ };
109
+
110
+ export {
111
+ componentNameMap,
112
+ pathMap,
113
+ registerComponents
114
+ };
@@ -1,81 +1,81 @@
1
- <template>
2
- <div class="DshColor">
3
- <ColorPicker
4
- class="DshColor-picker"
5
- v-model="curVal"
6
- :disabled="disabled"
7
- :format="selfPropsObj._format"
8
- :editable="selfPropsObj._editable"
9
- :alpha="selfPropsObj._alpha"
10
- :hue="selfPropsObj._hue"
11
- :recommend="selfPropsObj._recommend"
12
- :colors="colors"
13
- :size="selfPropsObj._size"
14
- :transfer="selfPropsObj._transfer"
15
- @on-change="change"
16
- @on-active-change="onActiveChange"
17
- @on-open-change="onOpenChange"
18
- />
19
- </div>
20
- </template>
21
-
22
- <script>
23
- import controlMixin from "../mixins/controlMixin.js";
24
- import { resourceData } from "../../../data/index.js";
25
-
26
- export default {
27
- name: "DshColor",
28
- mixins: [
29
- controlMixin
30
- ],
31
- components: {},
32
- props: {},
33
- data () {
34
- return {};
35
- },
36
- computed: {
37
- selfPropsObj () {
38
- return {
39
- _editable: true, // 是否可以输入色值
40
- _alpha: false, // 是否支持透明度选择
41
- _hue: true, // 是否支持色彩选择
42
- _recommend: true, // 是否显示推荐的颜色预设
43
- _colors: Object.values(resourceData.colorMap).slice(1), // 自定义颜色预设
44
- _size: "default", // 尺寸,可选值为large、small、default或者不设置
45
- _transfer: true,
46
- ...this.propsObj,
47
- ...this.commonDealPropsObj,
48
-
49
- _format: this.propsObj._format || (this.propsObj._alpha ? "rgb" : "hex") // 颜色的格式,可选值 hsl、hsv、hex、rgb;开启alpha时为rgb,其它为hex
50
- };
51
- },
52
- colors () {
53
- return this.selfPropsObj._colors;
54
- }
55
- },
56
- created () {},
57
- methods: {
58
- // 面板中当前显示的颜色发生改变时触发
59
- onActiveChange () {
60
-
61
- },
62
- // 下拉框展开或收起时触发
63
- onOpenChange () {
64
-
65
- }
66
- }
67
- };
68
- </script>
69
-
70
- <style lang="less" scoped>
71
- .DshColor {
72
- &-picker {
73
- width: 100%;
74
- }
75
- }
76
- </style>
77
- <style lang="less">
78
- .ivu-color-picker-transfer {
79
- max-width: 360px;
80
- }
81
- </style>
1
+ <template>
2
+ <div class="DshColor">
3
+ <ColorPicker
4
+ class="DshColor-picker"
5
+ v-model="curVal"
6
+ :disabled="disabled"
7
+ :format="selfPropsObj._format"
8
+ :editable="selfPropsObj._editable"
9
+ :alpha="selfPropsObj._alpha"
10
+ :hue="selfPropsObj._hue"
11
+ :recommend="selfPropsObj._recommend"
12
+ :colors="colors"
13
+ :size="selfPropsObj._size"
14
+ :transfer="selfPropsObj._transfer"
15
+ @on-change="change"
16
+ @on-active-change="onActiveChange"
17
+ @on-open-change="onOpenChange"
18
+ />
19
+ </div>
20
+ </template>
21
+
22
+ <script>
23
+ import controlMixin from "../mixins/controlMixin.js";
24
+ import { resourceData } from "../../../data/index.js";
25
+
26
+ export default {
27
+ name: "DshColor",
28
+ mixins: [
29
+ controlMixin
30
+ ],
31
+ components: {},
32
+ props: {},
33
+ data () {
34
+ return {};
35
+ },
36
+ computed: {
37
+ selfPropsObj () {
38
+ return {
39
+ _editable: true, // 是否可以输入色值
40
+ _alpha: false, // 是否支持透明度选择
41
+ _hue: true, // 是否支持色彩选择
42
+ _recommend: true, // 是否显示推荐的颜色预设
43
+ _colors: Object.values(resourceData.colorMap).slice(1), // 自定义颜色预设
44
+ _size: "default", // 尺寸,可选值为large、small、default或者不设置
45
+ _transfer: true,
46
+ ...this.propsObj,
47
+ ...this.commonDealPropsObj,
48
+
49
+ _format: this.propsObj._format || (this.propsObj._alpha ? "rgb" : "hex") // 颜色的格式,可选值 hsl、hsv、hex、rgb;开启alpha时为rgb,其它为hex
50
+ };
51
+ },
52
+ colors () {
53
+ return this.selfPropsObj._colors;
54
+ }
55
+ },
56
+ created () {},
57
+ methods: {
58
+ // 面板中当前显示的颜色发生改变时触发
59
+ onActiveChange () {
60
+
61
+ },
62
+ // 下拉框展开或收起时触发
63
+ onOpenChange () {
64
+
65
+ }
66
+ }
67
+ };
68
+ </script>
69
+
70
+ <style lang="less" scoped>
71
+ .DshColor {
72
+ &-picker {
73
+ width: 100%;
74
+ }
75
+ }
76
+ </style>
77
+ <style lang="less">
78
+ .ivu-color-picker-transfer {
79
+ max-width: 360px;
80
+ }
81
+ </style>
@@ -1,104 +1,104 @@
1
- <template>
2
- <div class="themeColor">
3
- <div class="themeColor-colors">
4
- <div
5
- v-for="(colorItem, colorKey) in themeColorMap"
6
- :key="colorKey"
7
- class="item"
8
- @click="curVal = colorKey"
9
- >
10
- <div
11
- class="item-content"
12
- :style="{
13
- backgroundColor: colorItem.color
14
- }"
15
- ></div>
16
- <Icon
17
- v-if="colorKey === curVal"
18
- class="item-icon"
19
- type="ios-checkmark-circle"
20
- size="16"
21
- />
22
- </div>
23
- </div>
24
- </div>
25
- </template>
26
-
27
- <script>
28
- import controlMixin from "../mixins/controlMixin.js";
29
-
30
- export default {
31
- name: "themeColor",
32
- mixins: [
33
- controlMixin
34
- ],
35
- components: {},
36
- props: {},
37
- data () {
38
- return {};
39
- },
40
- computed: {
41
- selfPropsObj () {
42
- return {
43
- _relateColorkey: "colorType",
44
-
45
- ...this.propsObj,
46
- ...this.commonDealPropsObj
47
- };
48
- },
49
- themeColorMap () {
50
- return this.$appData.themeColors || {};
51
- }
52
- },
53
- created () {
54
- // this.init();
55
- },
56
- methods: {
57
- init () {
58
- if (!this.curVal) {
59
- this.curVal = Object.keys(this.themeColorMap)[0];
60
- }
61
- }
62
- }
63
- };
64
- </script>
65
-
66
- <style lang="less" scoped>
67
- .themeColor {
68
- width: 100%;
69
-
70
- &-colors {
71
- display: flex;
72
-
73
- .item {
74
- display: inlile-block;
75
- width: 54px;
76
- height: 54px;
77
- margin-right: 7px;
78
- cursor: pointer;
79
- position: relative;
80
-
81
- &-content {
82
- width: 38px;
83
- height: 38px;
84
- margin: 8px auto;
85
- border-radius: 50%;
86
- }
87
-
88
- &-icon {
89
- position: absolute;
90
- bottom: 7px;
91
- right: 7px;
92
-
93
- border-radius: 50%;
94
- background-color: rgba(255, 255, 255, 0.85);
95
- color: @themeColor;
96
- }
97
-
98
- &:last-of-type {
99
- margin-right: 0px;
100
- }
101
- }
102
- }
103
- }
104
- </style>
1
+ <template>
2
+ <div class="themeColor">
3
+ <div class="themeColor-colors">
4
+ <div
5
+ v-for="(colorItem, colorKey) in themeColorMap"
6
+ :key="colorKey"
7
+ class="item"
8
+ @click="curVal = colorKey"
9
+ >
10
+ <div
11
+ class="item-content"
12
+ :style="{
13
+ backgroundColor: colorItem.color
14
+ }"
15
+ ></div>
16
+ <Icon
17
+ v-if="colorKey === curVal"
18
+ class="item-icon"
19
+ type="ios-checkmark-circle"
20
+ size="16"
21
+ />
22
+ </div>
23
+ </div>
24
+ </div>
25
+ </template>
26
+
27
+ <script>
28
+ import controlMixin from "../mixins/controlMixin.js";
29
+
30
+ export default {
31
+ name: "themeColor",
32
+ mixins: [
33
+ controlMixin
34
+ ],
35
+ components: {},
36
+ props: {},
37
+ data () {
38
+ return {};
39
+ },
40
+ computed: {
41
+ selfPropsObj () {
42
+ return {
43
+ _relateColorkey: "colorType",
44
+
45
+ ...this.propsObj,
46
+ ...this.commonDealPropsObj
47
+ };
48
+ },
49
+ themeColorMap () {
50
+ return this.$appData.themeColors || {};
51
+ }
52
+ },
53
+ created () {
54
+ // this.init();
55
+ },
56
+ methods: {
57
+ init () {
58
+ if (!this.curVal) {
59
+ this.curVal = Object.keys(this.themeColorMap)[0];
60
+ }
61
+ }
62
+ }
63
+ };
64
+ </script>
65
+
66
+ <style lang="less" scoped>
67
+ .themeColor {
68
+ width: 100%;
69
+
70
+ &-colors {
71
+ display: flex;
72
+
73
+ .item {
74
+ display: inlile-block;
75
+ width: 54px;
76
+ height: 54px;
77
+ margin-right: 7px;
78
+ cursor: pointer;
79
+ position: relative;
80
+
81
+ &-content {
82
+ width: 38px;
83
+ height: 38px;
84
+ margin: 8px auto;
85
+ border-radius: 50%;
86
+ }
87
+
88
+ &-icon {
89
+ position: absolute;
90
+ bottom: 7px;
91
+ right: 7px;
92
+
93
+ border-radius: 50%;
94
+ background-color: rgba(255, 255, 255, 0.85);
95
+ color: @themeColor;
96
+ }
97
+
98
+ &:last-of-type {
99
+ margin-right: 0px;
100
+ }
101
+ }
102
+ }
103
+ }
104
+ </style>