083b1ac3 by lihua

清理没用的图片信息

1 parent dc1a7e5e
Showing 39 changed files with 9 additions and 745 deletions
...@@ -16,8 +16,6 @@ ...@@ -16,8 +16,6 @@
16 }, 16 },
17 "dependencies": { 17 "dependencies": {
18 "@antv/g6": "^4.8.21", 18 "@antv/g6": "^4.8.21",
19 "@antv/s2": "^1.48.0",
20 "@antv/s2-vue": "^1.5.0",
21 "@vueuse/core": "^10.1.0", 19 "@vueuse/core": "^10.1.0",
22 "@vueuse/integrations": "^10.1.0", 20 "@vueuse/integrations": "^10.1.0",
23 "@wangeditor/editor": "^5.1.23", 21 "@wangeditor/editor": "^5.1.23",
...@@ -50,7 +48,6 @@ ...@@ -50,7 +48,6 @@
50 "pinia": "^2.0.35", 48 "pinia": "^2.0.35",
51 "pinia-plugin-persistedstate": "^2.2.0", 49 "pinia-plugin-persistedstate": "^2.2.0",
52 "pinyin-pro": "^3.24.2", 50 "pinyin-pro": "^3.24.2",
53 "qs": "^6.11.1",
54 "sortablejs": "^1.15.1", 51 "sortablejs": "^1.15.1",
55 "vant": "^4.9.8", 52 "vant": "^4.9.8",
56 "vue": "^3.2.47", 53 "vue": "^3.2.47",
...@@ -99,7 +96,6 @@ ...@@ -99,7 +96,6 @@
99 "vite-plugin-compression": "^0.5.1", 96 "vite-plugin-compression": "^0.5.1",
100 "vite-plugin-mock": "^2.9.8", 97 "vite-plugin-mock": "^2.9.8",
101 "vite-plugin-pages": "^0.29.0", 98 "vite-plugin-pages": "^0.29.0",
102 "vite-plugin-spritesmith": "^0.1.1",
103 "vite-plugin-svg-icons": "^2.0.1", 99 "vite-plugin-svg-icons": "^2.0.1",
104 "vite-plugin-vue-inspector": "^3.4.1", 100 "vite-plugin-vue-inspector": "^3.4.1",
105 "vite-plugin-vue-meta-layouts": "^0.2.2", 101 "vite-plugin-vue-meta-layouts": "^0.2.2",
......
1 <script lang="ts" setup name="TableS2">
2 import { TableSheet, DataCell } from '@antv/s2';
3 import { debounce } from 'lodash-es'
4 import { shallowRef, reactive, computed, ref } from "vue";
5
6 const props = defineProps({
7 tableInfo: {
8 type: Object,
9 default: {}
10 }
11 })
12
13 const s2Options = {
14 width: 600,
15 height: 480,
16 showSeriesNumber: true,
17 };
18
19 const BORDER_COLOR = '#d9d9d9';
20 const BACK_COLOR = '#fff';
21 const HEADER_BACK_COLOR = '#f2f2f2';
22 const CELL_ACTIVE_BACK_COLOR = '#F5F8FF';
23
24 const customTheme = {
25 background: {
26 color: HEADER_BACK_COLOR,
27 },
28 cornerCell: {
29 cell: {
30 horizontalBorderColor: BORDER_COLOR,
31 verticalBorderColor: BORDER_COLOR,
32 backgroundColor: HEADER_BACK_COLOR,
33 },
34 text: {
35 fill: 'var(--el-color-regular)',
36 fontSize: 12,
37 textAlign: 'left',
38 },
39 bolderText: {
40 fill: 'var(--el-color-regular)',
41 fontSize: 12,
42 opacity: 1,
43 fontWeight: 400
44 },
45 },
46 splitLine: {
47 horizontalBorderColor: BORDER_COLOR,
48 horizontalBorderColorOpacity: 1,
49 horizontalBorderWidth: 2,
50 verticalBorderColor: BORDER_COLOR,
51 verticalBorderColorOpacity: 1,
52 verticalBorderWidth: 2,
53 showRightShadow: true,
54 shadowWidth: 10,
55 shadowColors: {
56 left: 'rgba(0,0,0,0.1)',
57 right: 'rgba(0,0,0,0)',
58 },
59 },
60 rowCell: {
61 text: {
62 fill: 'var(--el-color-regular)',
63 opacity: 1,
64 fontSize: 12,
65 fontWeight: 400,
66 textAlign: 'left'
67 },
68 cell: {
69 backgroundColor: HEADER_BACK_COLOR,
70 interactionState: {
71 hover: {
72 backgroundColor: CELL_ACTIVE_BACK_COLOR,
73 backgroundOpacity: 1,
74 },
75 selected: {
76 backgroundColor: 'rgb(63, 69, 97)',
77 },
78 },
79 horizontalBorderColor: BORDER_COLOR,
80 verticalBorderColor: BORDER_COLOR,
81 verticalBorderWidth: 1,
82 },
83 },
84 colCell: {
85 cell: {
86 horizontalBorderColor: BORDER_COLOR,
87 verticalBorderColor: BORDER_COLOR,
88 verticalBorderWidth: 2,
89 horizontalBorderWidth: 2,
90 backgroundColor: HEADER_BACK_COLOR,
91 interactionState: {
92 hover: {
93 backgroundColor: HEADER_BACK_COLOR,
94 backgroundOpacity: 1,
95 },
96 selected: {
97 backgroundColor: 'rgb(63, 69, 97)',
98 },
99 },
100 },
101 text: {
102 fill: 'var(--el-color-regular)',
103 fontSize: 12,
104 textAlign: 'left'
105 },
106 bolderText: {
107 fill: 'var(--el-color-regular)',
108 opacity: 1,
109 fontSize: 12,
110 textAlign: 'left',
111 fontWeight: 400
112 },
113 },
114 dataCell: {
115 icon: {
116 size: 14,
117 margin: {
118 left: 10,
119 },
120 },
121 cell: {
122 interactionState: {
123 hover: {
124 backgroundColor: CELL_ACTIVE_BACK_COLOR,
125 backgroundOpacity: 1,
126 },
127 hoverFocus: {
128 backgroundColor: CELL_ACTIVE_BACK_COLOR,
129 backgroundOpacity: 1,
130 // borderColor: 'blue',
131 },
132 selected: {
133 backgroundColor: CELL_ACTIVE_BACK_COLOR,
134 backgroundOpacity: 1,
135 },
136 unselected: {
137 backgroundOpacity: 1,
138 opacity: 1,
139 },
140 prepareSelect: {
141 borderColor: CELL_ACTIVE_BACK_COLOR,
142 },
143 },
144 crossBackgroundColor: BACK_COLOR,
145 horizontalBorderColor: BORDER_COLOR,
146 verticalBorderColor: BORDER_COLOR,
147 verticalBorderWidth: 2,
148 horizontalBorderWidth: 2,
149 backgroundColorOpacity: 0.9,
150 backgroundColor: HEADER_BACK_COLOR,
151 },
152 text: {
153 fill: 'var(--el-color-regular)',
154 fontSize: 14,
155 textAlign: 'left'
156 },
157 },
158 };
159
160 const s2DataConfig = {
161 fields: {
162 columns: ['province', 'city', 'type', 'price', 'cost'],
163 },
164 meta: [
165 {
166 field: 'province',
167 name: '省份',
168 },
169 {
170 field: 'city',
171 name: '城市',
172 },
173 {
174 field: 'type',
175 name: '商品类别',
176 },
177 {
178 field: 'price',
179 name: '价格',
180 },
181 {
182 field: 'cost',
183 name: '成本',
184 },
185 ],
186 data: [
187 {
188 "province": "浙江",
189 "city": "杭州",
190 "type": "笔",
191 "price": 1
192 },
193 {
194 "province": "浙江",
195 "city": "杭州",
196 "type": "纸张",
197 "price": 2
198 },
199 {
200 "province": "浙江",
201 "city": "舟山",
202 "type": "笔",
203 "price": 17
204 },
205 {
206 "province": "浙江",
207 "city": "舟山",
208 "type": "纸张",
209 "price": 6
210 },
211 {
212 "province": "吉林",
213 "city": "长春",
214 "type": "笔",
215 "price": 8
216 },
217 {
218 "province": "吉林",
219 "city": "白山",
220 "type": "笔",
221 "price": 12
222 },
223 {
224 "province": "吉林",
225 "city": "长春",
226 "type": "纸张",
227 "price": 3
228 },
229 {
230 "province": "吉林",
231 "city": "白山",
232 "type": "纸张",
233 "price": 25
234 },
235 {
236 "province": "浙江",
237 "city": "杭州",
238 "type": "笔",
239 "price": 20
240 },
241 {
242 "province": "浙江",
243 "city": "杭州",
244 "type": "纸张",
245 "price": 10
246 },
247 {
248 "province": "浙江",
249 "city": "舟山",
250 "type": "笔",
251 "price": 15
252 },
253 {
254 "province": "浙江",
255 "city": "舟山",
256 "type": "纸张",
257 "price": 2
258 },
259 {
260 "province": "吉林",
261 "city": "长春",
262 "type": "笔",
263 "price": 15
264 },
265 {
266 "province": "吉林",
267 "city": "白山",
268 "type": "笔",
269 "price": 30
270 },
271 {
272 "province": "吉林",
273 "city": "长春",
274 "type": "纸张",
275 "price": 40
276 },
277 {
278 "province": "吉林",
279 "city": "白山",
280 "type": "纸张",
281 "price": 50
282 }
283 ],
284 };
285
286 onBeforeMount(() => {
287
288 })
289
290 onMounted(() => {
291 const s2Container = document.getElementById(props.tableInfo.id);
292 const s2 = new TableSheet(s2Container, s2DataConfig, s2Options);
293 s2.setThemeCfg({ theme: customTheme });
294 s2.render();
295
296 const debounceRender = debounce((width, height) => {
297 s2.changeSheetSize(width, height)
298 s2.render(false) // 不重新加载数据
299 }, 100)
300
301 const resizeObserver = new ResizeObserver(([entry] = []) => {
302 const [size] = entry.borderBoxSize || [];
303 debounceRender(size.inlineSize, size.blockSize)
304 });
305 resizeObserver.observe(s2Container);
306 })
307 </script>
308
309 <template>
310 <div class="table_panel" :id="props.tableInfo.id"></div>
311 </template>
312
313 <style lang="scss" scoped>
314 .table_panel {
315 width: 100%;
316 height: 100%;
317 }
318 </style>
1 <script lang="ts" setup name="TableS2Vue">
2 import { SheetComponent } from "@antv/s2-vue";
3 import { shallowRef, reactive, computed, ref } from "vue";
4 import "@antv/s2-vue/dist/style.min.css";
5 import "ant-design-vue/dist/antd.css";
6
7 const props = defineProps({
8 tableInfo: {
9 type: Object,
10 default: {}
11 }
12 })
13
14 // 数据
15 const rawDataCfg = ref<Object>({});
16
17 // 色板
18 const s2Palette = {
19 basicColors: [
20 'var(--el-color-regular)', // 角头、行头、列头 单元格文本及图标颜色、数据单元格图标颜色
21 '#ffffff', // 行头、数据 单元格背景填充色
22 '#F5F8FF', // 行头、数据 单元格 鼠标悬停/选中/聚焦 状态的背景填充色
23 '#f2f2f2', // 角头、列头 背景填充色
24 '#f2f2f2', // 列头 鼠标悬停/选中 背景填充色
25 '#f2f2f2', // 刷选预选中状态蒙板背景填充色
26 '#f2f2f2', // 行头单元格链接文本颜色
27 '#EBF6F7', // 数据单元格柱状图填充色 resize 蒙层背景色、热区参考线颜色、热区悬停态背景颜色
28 '#f2f2f2', // 数据单元格背景填充色、表格背景填充色
29 '#d9d9d9', // 行头、数据 单元格边框颜色
30 '#d9d9d9', // 角头、列头 单元格边框颜色
31 '#d9d9d9', // 表体水平边框颜色(一级横向分割线)
32 '#d9d9d9', // 表体垂直边框颜色(一级纵向分割线)
33 'var(--el-color-regular)', // 数据单元格文本颜色
34 'var(--el-color-regular)', // 行头 链接文本颜色、数据单元格鼠标悬停聚焦/鼠标刷选预中 边框颜色
35 ],
36
37 // ---------- semantic colors ----------
38 semanticColors: {
39 red: '#FF4D4F',
40 green: '#29A294',
41 },
42 };
43
44 // 组件参数
45 const rawOptions = {
46 width: 600,
47 height: 400,
48 showSeriesNumber: props.tableInfo.showIndex == undefined ? true : props.tableInfo.showIndex,
49 showDefaultHeaderActionIcon: false,
50 pagination: {
51 pageSize: 50,
52 current: 1,
53 },
54 };
55
56 // dataCfg 数据字段较多,建议使用 shallow, 如果有数据更改直接替换整个对象
57 const dataCfg = shallowRef(rawDataCfg);
58 const options = reactive(rawOptions);
59 const adaptive = ref<Object>({});
60
61 const themeCfg = {
62 theme: {
63 colCell: {
64 bolderText: {
65 textAlign: 'left'
66 }
67 },
68 dataCell: {
69 text: {
70 textAlign: 'left'
71 }
72 }
73 },
74 palette: s2Palette
75 }
76
77 const setTableData = (info) => {
78 rawDataCfg.value = {
79 fields: info.fields,
80 meta: info.meta,
81 data: info.data
82 }
83 }
84
85 onBeforeMount(() => {
86 setTableData(props.tableInfo)
87 })
88
89 onMounted(() => {
90 adaptive.value = {
91 width: true,
92 height: true,
93 getContainer: () => document.getElementById(props.tableInfo.id),
94 }
95 })
96 </script>
97
98 <template>
99 <div class="table_panel" :id="tableInfo.id">
100 <SheetComponent sheetType="table" :dataCfg="dataCfg" :options="options" :adaptive="adaptive" :themeCfg="themeCfg"
101 :showPagination="true" />
102 </div>
103 </template>
104
105 <style lang="scss" scoped>
106 .table_panel {
107 width: 100%;
108 height: 100%;
109 }
110 </style>
1 <script lang="ts" setup name="FixedActionBar">
2 const isBottom = ref(false)
3
4 onMounted(() => {
5 onScroll()
6 window.addEventListener('scroll', onScroll)
7 })
8
9 onUnmounted(() => {
10 window.removeEventListener('scroll', onScroll)
11 })
12
13 function onScroll() {
14 // 变量scrollTop是滚动条滚动时,滚动条上端距离顶部的距离
15 const scrollTop = document.documentElement.scrollTop || document.body.scrollTop
16 // 变量windowHeight是可视区的高度
17 const windowHeight = document.documentElement.clientHeight || document.body.clientHeight
18 // 变量scrollHeight是滚动条的总高度(当前可滚动的页面的总高度)
19 const scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight
20 // 滚动条到底部
21 isBottom.value = Math.ceil(scrollTop + windowHeight) >= scrollHeight
22 }
23 </script>
24
25 <template>
26 <div class="actionbar" :class="{ shadow: !isBottom }" data-fixed-calc-width>
27 <slot />
28 </div>
29 </template>
30
31 <style lang="scss" scoped>
32 .actionbar {
33 z-index: 4;
34 bottom: 0;
35 padding: 20px;
36 text-align: center;
37 background-color: var(--g-app-bg);
38 box-shadow: 0 0 1px 0 var(--g-box-shadow-color);
39 transition: all 0.3s, var(--el-transition-box-shadow);
40
41 &.shadow {
42 box-shadow: 0 -10px 10px -10px var(--g-box-shadow-color);
43 }
44 }
45
46 :deep(.el-form-item) {
47 margin-bottom: 0;
48 }
49 </style>
1 <script lang="ts" setup name="topbar">
2 import { ref, watch } from 'vue';
3
4 const props = defineProps({
5 isGraphDisplay: {
6 type: Boolean,
7 default: true
8 },
9 });
10
11 const isGraph = ref(false);
12
13 watch(() => props.isGraphDisplay, (val) => {
14 isGraph.value = val;
15 }, {
16 immediate: true
17 })
18
19 const emits = defineEmits(["displaySwitchChange"]);
20
21 const switchChange = (val) => {
22 isGraph.value = val
23 emits('displaySwitchChange', val);
24 }
25
26 </script>
27
28 <template>
29 <div className='g6-component-topbar-content'>
30 <div :class="isGraph ? 'selected g6-component-topbar-item' : 'g6-component-topbar-item'" @click="switchChange(true)">
31 关系网
32 </div>
33 <div :class="!isGraph ? 'selected g6-component-topbar-item' : 'g6-component-topbar-item'" @click="switchChange(false)">
34 桑基图
35 </div>
36 </div>
37 </template>
38
39 <style scoped lang="scss">
40 .g6-component-topbar-content {
41 display: flex;
42 flex-direction: row;
43 justify-content: center;
44 align-items: center;
45 background: #fff;
46 border: 1px solid var(--el-color-primary);
47 border-radius: 32px;
48 padding: 4px;
49 width: 138px;
50 height: 32px;
51 }
52
53 .g6-component-topbar-item {
54 width: 50%;
55 height: 100%;
56 display: flex;
57 align-items: center;
58 justify-content: center;
59 font-size: 14px;
60 color: #999999;
61 cursor: pointer;
62
63 &.selected {
64 background: #4FA1A4;
65 border-radius: 32px;
66 color: #fff;
67 }
68 }
69 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <script setup lang="ts">
2 import eventBus from '@/utils/eventBus'
3
4 const isShow = ref(false)
5
6 const { pkg, lastBuildTime } = __SYSTEM_INFO__
7
8 onMounted(() => {
9 eventBus.on('global-system-info-toggle', () => {
10 isShow.value = !isShow.value
11 })
12 })
13 </script>
14
15 <template>
16 <div>
17 <el-drawer v-model="isShow" title="系统信息" direction="rtl" :size="360">
18 <el-descriptions direction="vertical" :column="1" border>
19 <el-descriptions-item label="最后编译时间" align="center">
20 {{ lastBuildTime }}
21 </el-descriptions-item>
22 </el-descriptions>
23 <el-descriptions title="生产环境依赖" :column="1" size="small" border>
24 <el-descriptions-item v-for="(val, key) in (pkg.dependencies as object)" :key="key" :label="key">
25 {{ val }}
26 </el-descriptions-item>
27 </el-descriptions>
28 <el-descriptions title="开发环境依赖" :column="1" size="small" border>
29 <el-descriptions-item v-for="(val, key) in (pkg.devDependencies as object)" :key="key" :label="key">
30 {{ val }}
31 </el-descriptions-item>
32 </el-descriptions>
33 </el-drawer>
34 </div>
35 </template>
36
37 <style lang="scss" scoped>
38 :deep(.el-drawer__header) {
39 margin-bottom: initial;
40 padding-bottom: 20px;
41 border-bottom: 1px solid var(--el-border-color);
42 transition: var(--el-transition-border);
43 }
44
45 :deep(.el-descriptions) {
46 margin-bottom: 20px;
47 }
48 </style>
1 <script lang="ts" setup name="Trend">
2 const props = defineProps({
3 value: {
4 type: String,
5 required: true,
6 },
7 type: {
8 type: String as () => 'up' | 'down',
9 default: 'up',
10 },
11 prefix: {
12 type: String,
13 default: '',
14 },
15 suffix: {
16 type: String,
17 default: '',
18 },
19 reverse: {
20 type: Boolean,
21 default: false,
22 },
23 })
24
25 const isUp = computed(() => {
26 let isUp = props.type === 'up'
27 if (props.reverse) {
28 isUp = !isUp
29 }
30 return isUp
31 })
32 </script>
33
34 <template>
35 <div :class="`trend ${isUp ? 'up' : 'down'}`">
36 <span v-if="prefix" class="prefix">{{ prefix }}</span>
37 <span class="text">{{ value }}</span>
38 <span v-if="suffix" class="suffix">{{ suffix }}</span>
39 <el-icon>
40 <svg-icon name="ep:caret-top" />
41 </el-icon>
42 </div>
43 </template>
44
45 <style lang="scss" scoped>
46 .trend {
47 display: flex;
48 align-items: center;
49 transition: var(--el-transition-color);
50
51 &.up {
52 color: var(--el-color-success);
53 }
54
55 &.down {
56 color: var(--el-color-danger);
57
58 .el-icon {
59 transform: rotate(180deg);
60 }
61 }
62
63 .el-icon {
64 margin-left: 5px;
65 transition: transform 0.3s;
66 }
67 }
68 </style>
1 const useDataFinanceStore = defineStore(
2 /** 流通撮合guid */
3 'circuGUid',
4 () => {
5 const circuGUid = ref<string>('');
6 /** 商品名称 */
7 const goodsName = ref('');
8 function setGoodsName(v: string) {
9 goodsName.value = v;
10 }
11
12 function setCircuGUid(v: string) {
13 circuGUid.value = v;
14 }
15
16 return {
17 goodsName,
18 setGoodsName,
19 circuGUid,
20 setCircuGUid
21 }
22 },
23 )
24
25 export default useDataFinanceStore
...\ No newline at end of file ...\ No newline at end of file
...@@ -23,7 +23,6 @@ declare module '@vue/runtime-core' { ...@@ -23,7 +23,6 @@ declare module '@vue/runtime-core' {
23 Dialog_pane: typeof import('./../components/Dialog/dialog_pane.vue')['default'] 23 Dialog_pane: typeof import('./../components/Dialog/dialog_pane.vue')['default']
24 DialogPlus: typeof import('./../components/DialogPlus/src/DialogPlus.vue')['default'] 24 DialogPlus: typeof import('./../components/DialogPlus/src/DialogPlus.vue')['default']
25 Drawer: typeof import('./../components/Drawer/index.vue')['default'] 25 Drawer: typeof import('./../components/Drawer/index.vue')['default']
26 EchartsMap: typeof import('./../components/EchartsMap/index.vue')['default']
27 Editor: typeof import('./../components/Editor/src/Editor.vue')['default'] 26 Editor: typeof import('./../components/Editor/src/Editor.vue')['default']
28 EllipsisTooltip: typeof import('./../components/EllipsisTooltip.vue')['default'] 27 EllipsisTooltip: typeof import('./../components/EllipsisTooltip.vue')['default']
29 FileUpload: typeof import('./../components/FileUpload/index.vue')['default'] 28 FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
......
...@@ -28,7 +28,7 @@ export default ({ mode, command }) => { ...@@ -28,7 +28,7 @@ export default ({ mode, command }) => {
28 server: { 28 server: {
29 open: true, 29 open: true,
30 host: '0.0.0.0', 30 host: '0.0.0.0',
31 port: 9000, 31 port: 9001,
32 proxy: { 32 proxy: {
33 '/api': { 33 '/api': {
34 target: env.VITE_API_BASEURL, 34 target: env.VITE_API_BASEURL,
...@@ -54,7 +54,12 @@ export default ({ mode, command }) => { ...@@ -54,7 +54,12 @@ export default ({ mode, command }) => {
54 target: '//csbr-daop.obs.cn-north-1.myhuaweicloud.com:443', 54 target: '//csbr-daop.obs.cn-north-1.myhuaweicloud.com:443',
55 changeOrigin: env.VITE_OPEN_PROXY === 'true', 55 changeOrigin: env.VITE_OPEN_PROXY === 'true',
56 rewrite: path => path.replace(/\/obs/, ''), 56 rewrite: path => path.replace(/\/obs/, ''),
57 } 57 },
58 // '/idaas': {
59 // target: env.VITE_API_IDAAS_URL,
60 // changeOrigin: env.VITE_OPEN_PROXY === 'true',
61 // // rewrite: path => path.replace(/\/api/, ''),
62 // }
58 }, 63 },
59 }, 64 },
60 // 构建选项 https://cn.vitejs.dev/config/#server-fsserve-root 65 // 构建选项 https://cn.vitejs.dev/config/#server-fsserve-root
......
...@@ -10,7 +10,7 @@ import createSvgIcon from './svg-icon' ...@@ -10,7 +10,7 @@ import createSvgIcon from './svg-icon'
10 import createLayouts from './layouts' 10 import createLayouts from './layouts'
11 import createPages from './pages' 11 import createPages from './pages'
12 import createCompression from './compression' 12 import createCompression from './compression'
13 import createSpritesmith from './spritesmith' 13 //import createSpritesmith from './spritesmith'
14 import createBanner from './banner' 14 import createBanner from './banner'
15 import AutoImport from 'unplugin-auto-import/vite'; 15 import AutoImport from 'unplugin-auto-import/vite';
16 import Components from 'unplugin-vue-components/vite'; 16 import Components from 'unplugin-vue-components/vite';
...@@ -36,7 +36,7 @@ export default function createVitePlugins(viteEnv, isBuild = false) { ...@@ -36,7 +36,7 @@ export default function createVitePlugins(viteEnv, isBuild = false) {
36 vitePlugins.push(createLayouts()) 36 vitePlugins.push(createLayouts())
37 vitePlugins.push(createPages()) 37 vitePlugins.push(createPages())
38 isBuild && vitePlugins.push(...createCompression(viteEnv)) 38 isBuild && vitePlugins.push(...createCompression(viteEnv))
39 vitePlugins.push(...createSpritesmith(isBuild)) 39 //vitePlugins.push(...createSpritesmith(isBuild))
40 vitePlugins.push(createBanner()) 40 vitePlugins.push(createBanner())
41 vitePlugins.push(createMock(viteEnv.VITE_APP_CHECK_BASEURL, isBuild)) 41 vitePlugins.push(createMock(viteEnv.VITE_APP_CHECK_BASEURL, isBuild))
42 return vitePlugins 42 return vitePlugins
......
1 import fs from 'fs'
2 import spritesmith from 'vite-plugin-spritesmith'
3
4 export default function createSpritesmith(isBuild) {
5 const spriteDirnames: string[] = []
6 fs.readdirSync('src/assets/sprites').forEach((dirname) => {
7 if (fs.statSync(`src/assets/sprites/${dirname}`).isDirectory()) {
8 spriteDirnames.push(dirname)
9 }
10 })
11 const plugin: any[] = []
12 spriteDirnames.forEach((item) => {
13 plugin.push(
14 spritesmith({
15 watch: !isBuild,
16 src: {
17 cwd: `./src/assets/sprites/${item}`,
18 glob: '*.png',
19 },
20 target: {
21 image: `./src/assets/sprites/${item}.png`,
22 css: [
23 [
24 `./src/assets/sprites/_${item}.scss`,
25 {
26 format: 'handlebars_based_template',
27 },
28 ],
29 ],
30 },
31 apiOptions: {
32 cssImageRef: `@/assets/sprites/${item}.png`,
33 spritesheet_info: {
34 name: item,
35 format: 'handlebars_based_template',
36 },
37 },
38 customTemplates: {
39 handlebars_based_template: './scss.template.hbs',
40 },
41 spritesmithOptions: {
42 algorithm: 'binary-tree',
43 padding: 10,
44 },
45 }),
46 )
47 })
48 return plugin
49 }
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!