Przeglądaj źródła

花掌柜-金刚区默认图标列表

ouyang 1 dzień temu
rodzic
commit
4b6286e0a7

+ 33 - 13
hdApp/src/admin/homePageConfig/navGridEdit.vue

@@ -32,7 +32,7 @@
           >上传图片</view>
         </view>
 
-        <!-- 默认图标库:OSS 静态图 hhb/images/navGrid-default/navGrid-defaultN.png -->
+        <!-- 默认图标库:列表由 /home-page-config/get-nav-grid-preset-icons 返回 -->
         <view v-if="iconTab === 'preset'" class="preset-grid">
           <view
             v-for="preset in presetIcons"
@@ -41,8 +41,9 @@
             :class="{ active: form.icon === preset.key && form.iconType === 1 }"
             @click="selectPreset(preset)"
           >
-            <image class="preset-img" :src="iconFullUrl(preset.path)" mode="aspectFill" />
+            <image class="preset-img" :src="preset.url || iconFullUrl(preset.path)" mode="aspectFill" />
           </view>
+          <view v-if="!presetIcons.length" class="preset-empty">暂无默认图标</view>
         </view>
 
         <!-- 上传自定义图标 -->
@@ -142,21 +143,16 @@
 </template>
 
 <script>
+/**
+ * 金刚区单项编辑:名称/图标/关联;默认图标库由后端接口返回
+ */
 import { APIHOST } from '@/config'
 import { getClass } from '@/api/category'
 import { useCaseList } from '@/api/goods'
+import { getNavGridPresetIcons } from '@/api/home-page-config'
 
 const DRAFT_KEY = 'navGridDraft'
 
-/** 默认图标库:icon 仍存 preset:N(iconType=1),展示对应 OSS 静态图 */
-const PRESET_ICONS = Array.from({ length: 12 }, (_, i) => {
-  const n = i + 1
-  return {
-    key: `preset:${n}`,
-    path: `hhb/images/navGrid-default/navGrid-default${n}.png`
-  }
-})
-
 const EMPTY_FORM = () => ({
   id: '',
   name: '',
@@ -174,7 +170,8 @@ export default {
       editId: '',
       form: EMPTY_FORM(),
       iconTab: 'preset',
-      presetIcons: PRESET_ICONS,
+      /** 默认图标库,init 时从 /home-page-config/get-nav-grid-preset-icons 拉取 */
+      presetIcons: [],
       typeOptions: [
         { label: '分类', value: 3 },
         { label: '场景', value: 4 }
@@ -212,10 +209,11 @@ export default {
   },
   methods: {
     /**
-     * 初始化:加载分类/场景选项,并从草稿恢复当前编辑项或新建空表单。
+     * 初始化:加载分类/场景/默认图标库,并从草稿恢复当前编辑项或新建空表单。
      */
     init() {
       this.editId = (this.option && this.option.id) ? String(this.option.id) : ''
+      this.loadPresetIcons()
       this.loadCategory()
       this.loadUseCase()
       this.loadFromDraft()
@@ -223,6 +221,20 @@ export default {
         title: this.editId ? '编辑导航项' : '新增导航项'
       })
     },
+    /**
+     * 拉取默认图标库;失败时列表为空,仍可上传自定义图标
+     */
+    loadPresetIcons() {
+      getNavGridPresetIcons().then((res) => {
+        if (res.code == 1 && res.data && Array.isArray(res.data.list)) {
+          this.presetIcons = res.data.list.map((item) => ({
+            key: item.key || '',
+            path: item.path || '',
+            url: item.url || ''
+          })).filter((item) => item.key)
+        }
+      }).catch(() => {})
+    },
     loadFromDraft() {
       const raw = uni.getStorageSync(DRAFT_KEY)
       if (!raw) {
@@ -546,6 +558,14 @@ export default {
   border-radius: 50%;
 }
 
+.preset-empty {
+  width: 100%;
+  padding: 40upx 0;
+  text-align: center;
+  font-size: 26upx;
+  color: #999;
+}
+
 .upload-area {
   position: relative;
   width: 200upx;

+ 2 - 0
hdApp/src/api/home-page-config/index.js

@@ -15,6 +15,8 @@ export const saveBanner = data => https.post('/home-page-config/save-banner', da
 export const deleteBannerImg = data => https.post('/home-page-config/delete-banner-img', data)
 
 export const getNavGrid = data => https.get('/home-page-config/get-nav-grid', data)
+/** 金刚区默认图标库列表 */
+export const getNavGridPresetIcons = data => https.get('/home-page-config/get-nav-grid-preset-icons', data)
 export const saveNavGrid = data => https.post('/home-page-config/save-nav-grid', data)
 
 export const getSeckill = data => https.get('/home-page-config/get-seckill', data)