root/allLikeMall
1
0
Fork 0
Code Issues Pull Requests 2 Packages Projects Releases Wiki Activity

Branch_chensl #117

Merged
root merged 2 commits from Branch_chensl into master 2024-11-13 10:36:32 +08:00
Conversation 0 Commits 2 Files Changed 5 +110 -49
5 changed files with 110 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

129
yudao-admin-vue3/src/components/DiyEditor/components/mobile/MenuGridTow/property.vue
View File

@ -1,33 +1,34 @@
<template> <template>
<ComponentContainerProperty v-model="formData.style"> <ComponentContainerProperty v-model="formData.style">
<!-- 表单 --> <!-- 表单 -->
<el-form label-width="80px" :model="formData" class="m-t-8px"> <el-form label-width="80px" :model="formData" class="m-t-8px">
<el-form-item label="每行数量" prop="column"> <!-- <el-form-item label="每行数量" prop="column">
<el-radio-group v-model="formData.column"> <el-radio-group v-model="formData.column">
<el-radio :label="3">3个</el-radio> <el-radio :label="3">3个</el-radio>
<el-radio :label="4">4个</el-radio> <el-radio :label="4">4个</el-radio>
<el-radio :label="5">5个</el-radio> <el-radio :label="5">5个</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item> -->
<el-card header="菜单设置" class="property-group" shadow="never"> <el-card header="菜单设置" class="property-group" shadow="never">
<Draggable v-model="formData.list" :empty-item="EMPTY_MENU_GRID_ITEM_PROPERTY"> <Draggable v-model="formData.list" handle="false">
<template #default="{ element }"> <template #default="{ element }">
<el-form-item label="图标" prop="iconUrl"> <!-- <el-form-item label="图标" prop="iconUrl">
<UploadImg v-model="element.iconUrl" height="80px" width="80px"> <UploadImg v-model="element.iconUrl" height="80px" width="80px">
<template #tip> 建议尺寸：44 * 44 </template> <template #tip> 建议尺寸：44 * 44 </template>
</UploadImg> </UploadImg>
</el-form-item> </el-form-item> -->
<el-form-item label="标题" prop="title"> <el-form-item label="标题" prop="title">
<InputWithColor v-model="element.title" v-model:color="element.titleColor" /> <!-- <InputWithColor v-model="element.title" v-model:color="element.titleColor" /> -->
</el-form-item> <div>{{element.title}}</div>
<el-form-item label="副标题" prop="subtitle"> </el-form-item>
<!-- <el-form-item label="副标题" prop="subtitle">
<InputWithColor v-model="element.subtitle" v-model:color="element.subtitleColor" /> <InputWithColor v-model="element.subtitle" v-model:color="element.subtitleColor" />
</el-form-item> </el-form-item> -->
<el-form-item label="链接" prop="url"> <el-form-item label="链接" prop="url">
<AppLinkInput v-model="element.url" /> <AppLinkInput v-model="element.url" />
</el-form-item> </el-form-item>
<el-form-item label="显示角标" prop="badge.show"> <!-- <el-form-item label="显示角标" prop="badge.show">
<el-switch v-model="element.badge.show" /> <el-switch v-model="element.badge.show" />
</el-form-item> </el-form-item>
<template v-if="element.badge.show"> <template v-if="element.badge.show">
@ -40,27 +41,67 @@
<el-form-item label="背景颜色" prop="badge.bgColor"> <el-form-item label="背景颜色" prop="badge.bgColor">
<ColorInput v-model="element.badge.bgColor" /> <ColorInput v-model="element.badge.bgColor" />
</el-form-item> </el-form-item>
</template> </template> -->
</template> </template>
</Draggable> </Draggable>
</el-card> </el-card>
</el-form> </el-form>
</ComponentContainerProperty> </ComponentContainerProperty>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { usePropertyForm } from '@/components/DiyEditor/util' import { usePropertyForm } from '@/components/DiyEditor/util'
import { import {
EMPTY_MENU_GRID_ITEM_PROPERTY, EMPTY_MENU_GRID_ITEM_PROPERTY,
MenuGridProperty MenuGridProperty
} from '@/components/DiyEditor/components/mobile/MenuGrid/config' } from '@/components/DiyEditor/components/mobile/MenuGrid/config'
/** 宫格导航属性面板 */ /** 宫格导航属性面板 */
defineOptions({ name: 'MenuGridProperty' }) defineOptions({ name: 'MenuGridProperty' })
const props = defineProps<{ modelValue: MenuGridProperty }>() const props = defineProps<{ modelValue : MenuGridProperty }>()
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue'])
const { formData } = usePropertyForm(props.modelValue, emit) const { formData } = usePropertyForm(props.modelValue, emit)
if (formData.value.list.length == 1 || formData.value.list.length == 2 || formData.value.list.length == 3) {
formData.value = {
column: 3,
list: [
{
title: "今日推荐",
url: '/pages/index/page?id=19'
},
{
title: "热门榜单",
url: '/pages/index/page?id=21'
},
{
title: "首发新品",
url: '/pages/index/page?id=22'
},
{
title: "促销单品",
url: '/pages/index/page?id=23'
}
],
style: {
bgColor: "#fff",
bgType: "color",
borderBottomLeftRadius: 8,
borderBottomRightRadius: 8,
borderRadius: 8,
borderTopLeftRadius: 8,
borderTopRightRadius: 8,
marginBottom: 8,
marginLeft: 8,
marginRight: 8,
padding: 0,
paddingBottom: 0,
paddingLeft: 0,
paddingRight: 0,
paddingTop: 0
}
}
}
</script> </script>
<style scoped lang="scss"></style> <style scoped lang="scss"></style>

4
yudao-admin-vue3/src/components/DiyEditor/index.vue
View File

@ -69,10 +69,10 @@
</draggable> </draggable>
</el-scrollbar> </el-scrollbar>
<!-- 手机底部导航 --> <!-- 手机底部导航 -->
<!-- <div v-if="showTabBar" :class="['editor-design-bottom', 'component', 'cursor-pointer!']"> <div v-if="showTabBar" :class="['editor-design-bottom', 'component', 'cursor-pointer!']">
<ComponentContainer :component="tabBarComponent" :show-toolbar="false" <ComponentContainer :component="tabBarComponent" :show-toolbar="false"
:active="selectedComponent?.id === tabBarComponent.id" @click="handleTabBarSelected" /> :active="selectedComponent?.id === tabBarComponent.id" @click="handleTabBarSelected" />
</div> --> </div>
<!-- 固定布局的组件 操作按钮区 --> <!-- 固定布局的组件 操作按钮区 -->
<div class="fixed-component-action-group"> <div class="fixed-component-action-group">
<el-tag v-if="showPageConfig" size="large" <el-tag v-if="showPageConfig" size="large"

4
yudao-admin-vue3/src/views/mall/promotion/diy/template/ProductCategory.vue
View File

@ -10,11 +10,11 @@
<div class="mainBottom"> <div class="mainBottom">
<div class='item' :class="currItem == 1 ? 'on': ''" @click="clickItem(1)"> <div class='item' :class="currItem == 1 ? 'on': ''" @click="clickItem(1)">
<img class="img" src="https://zysc.fjptzykj.com:3000/shangcheng/a7d0409cbf5335a2780409756914c530fc7c88bec85fc81302b53760d9be4a03.jpg" /> <img class="img" src="https://zysc.fjptzykj.com:3000/shangcheng/921278a710b8035ac2e4fd40a08f64e3652c5130c08c633b7e136714d57c1001.jpg" />
<div class="text">样式1</div> <div class="text">样式1</div>
</div> </div>
<div class='item' :class="currItem == 2 ? 'on': ''" @click="clickItem(2)"> <div class='item' :class="currItem == 2 ? 'on': ''" @click="clickItem(2)">
<img class="img" src="https://zysc.fjptzykj.com:3000/shangcheng/9096b2c04a6e46ea562999a93a1b975100c6b4557e680dcb31de6d3555407841.png" /> <img class="img" src="https://zysc.fjptzykj.com:3000/shangcheng/909ef630cff7cdc957962ae782ee9a882c86c35732140b1c9e013341fa559126.jpg" />
<div class="text">样式2</div> <div class="text">样式2</div>
</div> </div>
</div> </div>

20
yudao-admin-vue3/src/views/mall/promotion/diy/template/ThemeStyle.vue
View File

@ -22,6 +22,14 @@
<div class="le" style="background:rgb(66, 202, 77);"></div> <div class="le" style="background:rgb(66, 202, 77);"></div>
<div class="ri">生鲜绿</div> <div class="ri">生鲜绿</div>
</div> </div>
<div class="item" :class="currItem== 'pink' ? 'on': ''" @click="clickItem('pink')">
<div class="le" style="background:#ff448f;"></div>
<div class="ri">魅力粉</div>
</div>
<div class="item" :class="currItem== 'orange' ? 'on': ''" @click="clickItem('orange')">
<div class="le" style="background:#fe5c2d;"></div>
<div class="ri">活力橙</div>
</div>
</div> </div>
<div class="mainBottom"> <div class="mainBottom">
<div class='item' v-show="currItem== ''"> <div class='item' v-show="currItem== ''">
@ -37,6 +45,14 @@
<img class="img" <img class="img"
src="https://zysc.fjptzykj.com:3000/shangcheng/0d0a7ab210afb5cee674e402ca3ec197a30523687acbec2e8e5f16fb52075e9b.jpg" /> src="https://zysc.fjptzykj.com:3000/shangcheng/0d0a7ab210afb5cee674e402ca3ec197a30523687acbec2e8e5f16fb52075e9b.jpg" />
</div> </div>
<div class='item' v-show="currItem== 'pink'">
<img class="img"
src="https://zysc.fjptzykj.com:3000/shangcheng/0d0a7ab210afb5cee674e402ca3ec197a30523687acbec2e8e5f16fb52075e9b.jpg" />
</div>
<div class='item' v-show="currItem== 'orange'">
<img class="img"
src="https://zysc.fjptzykj.com:3000/shangcheng/0d0a7ab210afb5cee674e402ca3ec197a30523687acbec2e8e5f16fb52075e9b.jpg" />
</div>
</div> </div>
</div> </div>
</div> </div>
@ -66,6 +82,10 @@
setZtClass('lv') setZtClass('lv')
}else if(currItem.value == 'blue'){ }else if(currItem.value == 'blue'){
setZtClass('blue') setZtClass('blue')
}else if(currItem.value == 'pink'){
setZtClass('pink')
}else if(currItem.value == 'orange'){
setZtClass('orange')
}else{ }else{
setZtClass('') setZtClass('')
} }

2
yudao-admin-vue3/src/views/mall/promotion/diy/template/decorate.vue
View File

@ -2,7 +2,7 @@
<DiyEditor v-if="formData && !formLoading" v-model="currentFormData!.property" <DiyEditor v-if="formData && !formLoading" v-model="currentFormData!.property"
:title="templateItems[selectedTemplateItem].name" :libs="libs" :show-page-config="selectedTemplateItem !== 0" :title="templateItems[selectedTemplateItem].name" :libs="libs" :show-page-config="selectedTemplateItem !== 0"
:show-tab-bar="selectedTemplateItem === 0" :show-navigation-bar="selectedTemplateItem !== 0" :show-tab-bar="selectedTemplateItem === 0" :show-navigation-bar="selectedTemplateItem !== 0"
:preview-url="previewUrl" @save="submitForm" @reset="handleEditorReset"> :preview-url="previewUrl" @save="submitForm" @reset="handleEditorReset" :showTabBar = "false">
<template #toolBarLeft> <template #toolBarLeft>
<!-- <el-radio-group <!-- <el-radio-group
v-model="selectedTemplateItem" v-model="selectedTemplateItem"