mirror of
				https://gitee.com/hhyykk/ipms-sjy-ui.git
				synced 2025-11-04 12:18:43 +08:00 
			
		
		
		
	📖 code review:店铺装修逻辑
This commit is contained in:
		@@ -35,8 +35,6 @@ export const enum APP_LINK_TYPE_ENUM {
 | 
			
		||||
  PRODUCT_DETAIL_NORMAL,
 | 
			
		||||
  // 拼团商品详情
 | 
			
		||||
  PRODUCT_DETAIL_COMBINATION,
 | 
			
		||||
  // 积分商品详情
 | 
			
		||||
  PRODUCT_DETAIL_POINT,
 | 
			
		||||
  // 秒杀商品详情
 | 
			
		||||
  PRODUCT_DETAIL_SECKILL
 | 
			
		||||
}
 | 
			
		||||
@@ -80,10 +78,6 @@ export const APP_LINK_GROUP_LIST = [
 | 
			
		||||
        name: '系统设置',
 | 
			
		||||
        path: '/pages/public/setting'
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '问题反馈',
 | 
			
		||||
        path: '/pages/public/feedback'
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '常见问题',
 | 
			
		||||
        path: '/pages/public/faq'
 | 
			
		||||
@@ -112,11 +106,6 @@ export const APP_LINK_GROUP_LIST = [
 | 
			
		||||
        name: '秒杀商品详情',
 | 
			
		||||
        path: '/pages/goods/seckill',
 | 
			
		||||
        type: APP_LINK_TYPE_ENUM.PRODUCT_DETAIL_SECKILL
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '积分商品详情',
 | 
			
		||||
        path: '/pages/goods/score',
 | 
			
		||||
        type: APP_LINK_TYPE_ENUM.PRODUCT_DETAIL_POINT
 | 
			
		||||
      }
 | 
			
		||||
    ]
 | 
			
		||||
  },
 | 
			
		||||
@@ -145,10 +134,6 @@ export const APP_LINK_GROUP_LIST = [
 | 
			
		||||
        name: '签到中心',
 | 
			
		||||
        path: '/pages/app/sign'
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '积分商城',
 | 
			
		||||
        path: '/pages/app/score-shop'
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '优惠券中心',
 | 
			
		||||
        path: '/pages/coupon/list'
 | 
			
		||||
@@ -242,10 +227,6 @@ export const APP_LINK_GROUP_LIST = [
 | 
			
		||||
        name: '地址管理',
 | 
			
		||||
        path: '/pages/user/address/list'
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '发票管理',
 | 
			
		||||
        path: '/pages/user/invoice/list'
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        name: '用户佣金',
 | 
			
		||||
        path: '/pages/user/wallet/commission'
 | 
			
		||||
 
 | 
			
		||||
@@ -100,6 +100,7 @@ const emits = defineEmits<{
 | 
			
		||||
  (e: 'copy'): void
 | 
			
		||||
  (e: 'delete'): void
 | 
			
		||||
}>()
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * 移动组件
 | 
			
		||||
 * @param direction 移动方向
 | 
			
		||||
@@ -107,12 +108,14 @@ const emits = defineEmits<{
 | 
			
		||||
const handleMoveComponent = (direction: number) => {
 | 
			
		||||
  emits('move', direction)
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * 复制组件
 | 
			
		||||
 */
 | 
			
		||||
const handleCopyComponent = () => {
 | 
			
		||||
  emits('copy')
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * 删除组件
 | 
			
		||||
 */
 | 
			
		||||
 
 | 
			
		||||
@@ -4,6 +4,7 @@ import { floatToFixed2 } from '@/utils'
 | 
			
		||||
import { formatDate } from '@/utils/formatTime'
 | 
			
		||||
 | 
			
		||||
// 优惠值
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
export const CouponDiscount = defineComponent({
 | 
			
		||||
  name: 'CouponDiscount',
 | 
			
		||||
  props: {
 | 
			
		||||
 
 | 
			
		||||
@@ -24,6 +24,7 @@ export interface CouponCardProperty {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'CouponCard',
 | 
			
		||||
  name: '优惠券',
 | 
			
		||||
 
 | 
			
		||||
@@ -9,6 +9,7 @@ export interface HotZoneProperty {
 | 
			
		||||
  // 组件样式
 | 
			
		||||
  style: ComponentStyle
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/** 热区项目属性 */
 | 
			
		||||
export interface HotZoneItemProperty {
 | 
			
		||||
  // 链接的名称
 | 
			
		||||
 
 | 
			
		||||
@@ -13,6 +13,7 @@ export interface MagicCubeProperty {
 | 
			
		||||
  // 组件样式
 | 
			
		||||
  style: ComponentStyle
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/** 广告魔方项目属性 */
 | 
			
		||||
export interface MagicCubeItemProperty {
 | 
			
		||||
  // 图标链接
 | 
			
		||||
@@ -30,6 +31,7 @@ export interface MagicCubeItemProperty {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:有 idea 爆红告警
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'MagicCube',
 | 
			
		||||
  name: '广告魔方',
 | 
			
		||||
 
 | 
			
		||||
@@ -10,6 +10,7 @@ export interface MenuGridProperty {
 | 
			
		||||
  // 组件样式
 | 
			
		||||
  style: ComponentStyle
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/** 宫格导航项目属性 */
 | 
			
		||||
export interface MenuGridItemProperty {
 | 
			
		||||
  // 图标链接
 | 
			
		||||
 
 | 
			
		||||
@@ -8,6 +8,7 @@ export interface MenuListProperty {
 | 
			
		||||
  // 组件样式
 | 
			
		||||
  style: ComponentStyle
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
/** 列表导航项目属性 */
 | 
			
		||||
export interface MenuListItemProperty {
 | 
			
		||||
  // 图标链接
 | 
			
		||||
 
 | 
			
		||||
@@ -12,7 +12,6 @@
 | 
			
		||||
      <el-form-item label="文字颜色" prop="文字颜色">
 | 
			
		||||
        <ColorInput v-model="formData.textColor" />
 | 
			
		||||
      </el-form-item>
 | 
			
		||||
 | 
			
		||||
      <el-card header="公告内容" class="property-group" shadow="never">
 | 
			
		||||
        <Draggable v-model="formData.contents">
 | 
			
		||||
          <template #default="{ element }">
 | 
			
		||||
 
 | 
			
		||||
@@ -59,6 +59,7 @@ export interface ProductCardFieldProperty {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'ProductCard',
 | 
			
		||||
  name: '商品卡片',
 | 
			
		||||
 
 | 
			
		||||
@@ -134,6 +134,7 @@ watch(
 | 
			
		||||
    deep: true
 | 
			
		||||
  }
 | 
			
		||||
)
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * 计算商品的间距
 | 
			
		||||
 * @param index 商品索引
 | 
			
		||||
 
 | 
			
		||||
@@ -38,6 +38,7 @@ export interface ProductListFieldProperty {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'ProductList',
 | 
			
		||||
  name: '商品栏',
 | 
			
		||||
 
 | 
			
		||||
@@ -6,6 +6,7 @@ import { PromotionArticleProperty } from './config'
 | 
			
		||||
import * as ArticleApi from '@/api/mall/promotion/article/index'
 | 
			
		||||
 | 
			
		||||
/** 营销文章 */
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
defineOptions({ name: 'PromotionArticle' })
 | 
			
		||||
// 定义属性
 | 
			
		||||
const props = defineProps<{ property: PromotionArticleProperty }>()
 | 
			
		||||
 
 | 
			
		||||
@@ -29,6 +29,7 @@ export interface PromotionCombinationProperty {
 | 
			
		||||
  // 组件样式
 | 
			
		||||
  style: ComponentStyle
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 商品字段
 | 
			
		||||
export interface PromotionCombinationFieldProperty {
 | 
			
		||||
  // 是否显示
 | 
			
		||||
@@ -38,6 +39,7 @@ export interface PromotionCombinationFieldProperty {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'PromotionCombination',
 | 
			
		||||
  name: '拼团',
 | 
			
		||||
 
 | 
			
		||||
@@ -17,6 +17,7 @@ export interface SearchProperty {
 | 
			
		||||
export type PlaceholderPosition = 'left' | 'center'
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:idea 这里爆红,可以卡看咋优化下哇:is missing the following properties from type DiyComponent<SearchProperty>: uid, position
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'SearchBar',
 | 
			
		||||
  name: '搜索框',
 | 
			
		||||
 
 | 
			
		||||
@@ -19,6 +19,7 @@ export interface VideoPlayerStyle extends ComponentStyle {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 定义组件
 | 
			
		||||
// TODO @疯狂:idea 有告警
 | 
			
		||||
export const component = {
 | 
			
		||||
  id: 'VideoPlayer',
 | 
			
		||||
  name: '视频播放',
 | 
			
		||||
 
 | 
			
		||||
@@ -103,6 +103,7 @@ export function usePropertyForm<T>(modelValue: T, emit: Function): { formData: R
 | 
			
		||||
    }
 | 
			
		||||
  )
 | 
			
		||||
 | 
			
		||||
  // TODO @疯狂:这个 idea 爆红,看看怎么可以解决哈
 | 
			
		||||
  return { formData }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -27,10 +27,11 @@
 | 
			
		||||
  </DiyEditor>
 | 
			
		||||
</template>
 | 
			
		||||
<script setup lang="ts">
 | 
			
		||||
// TODO @疯狂:要不要建个 decorate 目录,然后挪进去,改成 index.vue,这样可以更明确看到是个独立界面哈,更好找
 | 
			
		||||
import * as DiyTemplateApi from '@/api/mall/promotion/diy/template'
 | 
			
		||||
import * as DiyPageApi from '@/api/mall/promotion/diy/page'
 | 
			
		||||
import { useTagsViewStore } from '@/store/modules/tagsView'
 | 
			
		||||
import { DiyComponentLibrary, PAGE_LIBS } from '@/components/DiyEditor/util'
 | 
			
		||||
import { DiyComponentLibrary, PAGE_LIBS } from '@/components/DiyEditor/util' // 商城的 DIY 组件,在 DiyEditor 目录下
 | 
			
		||||
import { toNumber } from 'lodash-es'
 | 
			
		||||
 | 
			
		||||
/** 装修模板表单 */
 | 
			
		||||
@@ -51,7 +52,7 @@ const formData = ref<DiyTemplateApi.DiyTemplatePropertyVO>()
 | 
			
		||||
const formRef = ref() // 表单 Ref
 | 
			
		||||
// 当前编辑的属性
 | 
			
		||||
const currentFormData = ref<DiyTemplateApi.DiyTemplatePropertyVO | DiyPageApi.DiyPageVO>()
 | 
			
		||||
// 商城H5预览地址
 | 
			
		||||
// 商城 H5 预览地址
 | 
			
		||||
const previewUrl = ref('')
 | 
			
		||||
 | 
			
		||||
// 获取详情
 | 
			
		||||
 
 | 
			
		||||
@@ -205,7 +205,7 @@ const handleUse = async (row: DiyTemplateApi.DiyTemplateVO) => {
 | 
			
		||||
    // 使用模板的二次确认
 | 
			
		||||
    await message.confirm(`是否使用模板“${row.name}”?`)
 | 
			
		||||
    // 发起删除
 | 
			
		||||
    await DiyTemplateApi.useDiyTemplate(row.id)
 | 
			
		||||
    await DiyTemplateApi.useDiyTemplate(row.id!)
 | 
			
		||||
    message.success('使用成功')
 | 
			
		||||
    // 刷新列表
 | 
			
		||||
    await getList()
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user