jsasg/yycea
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init commit

Browse Source
This commit is contained in:
jsasg
2026-03-17 09:56:00 +08:00
commit e2c8ae752d
6827 changed files with 1211784 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

227
application/admin/view/wdsxh/person_center_diy_page/center.html Normal file
View File

@@ -0,0 +1,227 @@
<div class="main-center">
<div class="center-box" style="background: url('/assets/addons/wdsxh/img/phone-bg.png') no-repeat center / contain;">
<div class="box-phone" :style="{backgroundColor: selectPageStyle.backgroundColor}">
<div class="phone-scroll" @scroll="handleScroll($event)">
<div class="scroll-header" :style="{backgroundImage: `url(${selectPageStyle.backgroundImage})`}" @click="handleEdit(-1)" :class="{selected: -1 == selectedIndex}">
<div class="header-status" :style="{background: titleBarStyle.background}">
<img class="status-camera" src="/assets/addons/wdsxh/img/phone-camera.png">
<img class="status-bar" :src="`/assets/addons/wdsxh/img/${titleBarStyle.color || selectPageStyle.titleTextColor}.png`">
<div class="status-title" :style="{color: titleBarStyle.color || selectPageStyle.titleTextColor}">{{ pageData.pageTitle }}</div>
</div>
<div class="header-column layout-1" v-if="pageData.pageLayout == 1">
<div class="column-user">
<img class="user-avatar" src="/assets/addons/wdsxh/img/mine/avatar.png">
<div class="user-info">
<div class="info-name" :style="{color: selectPageStyle.titleTextColor == 'black' ? '#5A5B6E' : selectPageStyle.titleTextColor}">用户001</div>
<div class="info-number" :style="{color: selectPageStyle.titleTextColor == 'black' ? '#5A5B6E' : selectPageStyle.titleTextColor}">188****8888</div>
</div>
</div>
<div class="column-member" v-if="!selectPageStyle.hideMember">
<div class="member-image">
<img class="image-circular" src="/assets/addons/wdsxh/img/mine/member_bg.png">
<img class="image-auth" src="/assets/addons/wdsxh/img/mine/member_blue.png">
</div>
<div class="member-box">
<div class="box-title">
<span class="title">会员</span>
<span class="subtitle"> | 到期时间{{currentDate || "2025/01/01"}}</span>
</div>
<div class="box-btn">
<span class="text">电子会牌</span>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13" fill="none">
<path d="M6 0.5C4.81331 0.5 3.65327 0.851894 2.66658 1.51118C1.67988 2.17047 0.910851 3.10754 0.456725 4.2039C0.00259974 5.30025 -0.11622 6.50665 0.115291 7.67054C0.346802 8.83442 0.918246 9.90352 1.75736 10.7426C2.59648 11.5817 3.66557 12.1532 4.82946 12.3847C5.99334 12.6162 7.19974 12.4974 8.2961 12.0433C9.39245 11.5891 10.3295 10.8201 10.9888 9.83341C11.6481 8.84672 12 7.68668 12 6.5C11.9982 4.90925 11.3655 3.38416 10.2407 2.25933C9.11583 1.1345 7.59075 0.501787 6 0.5ZM6 11.3C5.05065 11.3 4.12262 11.0185 3.33326 10.491C2.54391 9.96362 1.92868 9.21396 1.56538 8.33687C1.20208 7.45979 1.10702 6.49467 1.29223 5.56356C1.47744 4.63245 1.9346 3.77718 2.60589 3.10589C3.27718 2.43459 4.13246 1.97744 5.06357 1.79223C5.99467 1.60702 6.95979 1.70208 7.83688 2.06538C8.71396 2.42868 9.46362 3.04391 9.99105 3.83326C10.5185 4.62262 10.8 5.55065 10.8 6.5C10.7985 7.77259 10.2924 8.99264 9.3925 9.8925C8.49264 10.7924 7.27259 11.2985 6 11.3Z" fill="currentColor" />
<path d="M4.3252 3.96463L6.95494 6.50013L4.3252 9.03588L5.19044 9.86988L8.68694 6.50013L5.19044 3.12988L4.3252 3.96463Z" fill="currentColor" />
</svg>
</div>
</div>
</div>
<div class="column-notice" v-if="!selectPageStyle.hideNotice">
<img class="notice-icon" src="/assets/addons/wdsxh/img/mine/notice.png">
</div>
</div>
<div class="header-column layout-2" v-if="pageData.pageLayout == 2">
<div class="column-user">
<img class="user-avatar" src="/assets/addons/wdsxh/img/mine/avatar.png">
<div class="user-info">
<div class="info-name" :style="{color: selectPageStyle.titleTextColor == 'black' ? '#5A5B6E' : selectPageStyle.titleTextColor}">用户001</div>
<div class="info-number" :style="{color: selectPageStyle.titleTextColor == 'black' ? '#5A5B6E' : selectPageStyle.titleTextColor}">188****8888</div>
</div>
</div>
<div class="column-member" v-if="!selectPageStyle.hideMember">
<img class="box-icon" src="/assets/addons/wdsxh/img/mine/auth.png">
<div class="box-title">
<span class="title">会员</span>
<span class="subtitle">到期时间{{currentDate || "2025/01/01"}}</span>
</div>
<div class="box-btn">
<span class="text">电子会牌</span>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13" fill="none">
<path d="M6 0.5C4.81331 0.5 3.65327 0.851894 2.66658 1.51118C1.67988 2.17047 0.910851 3.10754 0.456725 4.2039C0.00259974 5.30025 -0.11622 6.50665 0.115291 7.67054C0.346802 8.83442 0.918246 9.90352 1.75736 10.7426C2.59648 11.5817 3.66557 12.1532 4.82946 12.3847C5.99334 12.6162 7.19974 12.4974 8.2961 12.0433C9.39245 11.5891 10.3295 10.8201 10.9888 9.83341C11.6481 8.84672 12 7.68668 12 6.5C11.9982 4.90925 11.3655 3.38416 10.2407 2.25933C9.11583 1.1345 7.59075 0.501787 6 0.5ZM6 11.3C5.05065 11.3 4.12262 11.0185 3.33326 10.491C2.54391 9.96362 1.92868 9.21396 1.56538 8.33687C1.20208 7.45979 1.10702 6.49467 1.29223 5.56356C1.47744 4.63245 1.9346 3.77718 2.60589 3.10589C3.27718 2.43459 4.13246 1.97744 5.06357 1.79223C5.99467 1.60702 6.95979 1.70208 7.83688 2.06538C8.71396 2.42868 9.46362 3.04391 9.99105 3.83326C10.5185 4.62262 10.8 5.55065 10.8 6.5C10.7985 7.77259 10.2924 8.99264 9.3925 9.8925C8.49264 10.7924 7.27259 11.2985 6 11.3Z" fill="currentColor" />
<path d="M4.3252 3.96463L6.95494 6.50013L4.3252 9.03588L5.19044 9.86988L8.68694 6.50013L5.19044 3.12988L4.3252 3.96463Z" fill="currentColor" />
</svg>
</div>
</div>
<div class="column-notice" v-if="!selectPageStyle.hideNotice">
<img class="notice-icon" src="/assets/addons/wdsxh/img/mine/notice_w.png">
</div>
</div>
<div class="header-column layout-3" v-if="pageData.pageLayout == 3">
<div class="column-card">
<div class="card-top">
<div class="top-user">
<img class="user-avatar" src="/assets/addons/wdsxh/img/mine/avatar.png">
<div class="user-info">
<div class="info-name">用户001</div>
<div class="info-number">188****8888</div>
</div>
</div>
<div class="top-label" v-if="!selectPageStyle.hideMember">
<div class="bg"></div>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
<path d="M8.90473 2.745V3.115L7.13473 2.09C6.46473 1.705 5.52973 1.705 4.86473 2.09L3.09473 3.12V2.745C3.09473 1.62 3.70973 1 4.83473 1H7.16473C8.28973 1 8.90473 1.62 8.90473 2.745Z" fill="currentColor" />
<path d="M8.92 3.98512L8.85 3.95012L8.17 3.56012L6.76 2.74512C6.33 2.49512 5.67 2.49512 5.24 2.74512L3.83 3.55512L3.15 3.95512L3.06 4.00012C2.185 4.59012 2.125 4.70012 2.125 5.64512V7.90512C2.125 8.85012 2.185 8.96012 3.08 9.56512L5.24 10.8101C5.455 10.9401 5.725 10.9951 6 10.9951C6.27 10.9951 6.545 10.9351 6.76 10.8101L8.94 9.55012C9.82 8.96012 9.875 8.85512 9.875 7.90512V5.64512C9.875 4.70012 9.815 4.59012 8.92 3.98512ZM7.395 6.75012L7.09 7.12512C7.04 7.18012 7.005 7.28512 7.01 7.36012L7.04 7.84012C7.06 8.13512 6.85 8.28512 6.575 8.18012L6.13 8.00012C6.06 7.97512 5.945 7.97512 5.875 8.00012L5.43 8.17512C5.155 8.28512 4.945 8.13012 4.965 7.83512L4.995 7.35512C5 7.28012 4.965 7.17512 4.915 7.12012L4.605 6.75012C4.415 6.52512 4.5 6.27512 4.785 6.20012L5.25 6.08012C5.325 6.06012 5.41 5.99012 5.45 5.93012L5.71 5.53012C5.87 5.28012 6.125 5.28012 6.29 5.53012L6.55 5.93012C6.59 5.99512 6.68 6.06012 6.75 6.08012L7.215 6.20012C7.5 6.27512 7.585 6.52512 7.395 6.75012Z" fill="currentColor" />
</svg>
<span class="text">会员</span>
</div>
<div class="top-icon">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="58" height="53" viewBox="0 0 58 53" fill="none">
<path d="M34 0H58L24 53H0L34 0Z" fill="url(#paint0_linear_95_16249)" />
<defs>
<linearGradient id="paint0_linear_95_16249" x1="21" y1="0" x2="21" y2="53" gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0.2" />
<stop offset="1" stop-color="currentColor" stop-opacity="0" />
</linearGradient>
</defs>
</svg>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="58" height="53" viewBox="0 0 58 53" fill="none">
<path d="M34 0H58L24 53H0L34 0Z" fill="url(#paint0_linear_95_16249)" />
<defs>
<linearGradient id="paint0_linear_95_16249" x1="21" y1="0" x2="21" y2="53" gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0.2" />
<stop offset="1" stop-color="currentColor" stop-opacity="0" />
</linearGradient>
</defs>
</svg>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="58" height="53" viewBox="0 0 58 53" fill="none">
<path d="M34 0H58L24 53H0L34 0Z" fill="url(#paint0_linear_95_16249)" />
<defs>
<linearGradient id="paint0_linear_95_16249" x1="21" y1="0" x2="21" y2="53" gradientUnits="userSpaceOnUse">
<stop stop-color="currentColor" stop-opacity="0.2" />
<stop offset="1" stop-color="currentColor" stop-opacity="0" />
</linearGradient>
</defs>
</svg>
</div>
</div>
<div class="card-bottom" v-if="!selectPageStyle.hideMember">
<div class="box-text">到期时间{{currentDate || "2025/01/01"}}</div>
<div class="box-btn">
<span class="text">电子会牌</span>
<svg class="icon" xmlns="http://www.w3.org/2000/svg" width="12" height="13" viewBox="0 0 12 13" fill="none">
<path d="M6 0.5C4.81331 0.5 3.65327 0.851894 2.66658 1.51118C1.67988 2.17047 0.910851 3.10754 0.456725 4.2039C0.00259974 5.30025 -0.11622 6.50665 0.115291 7.67054C0.346802 8.83442 0.918246 9.90352 1.75736 10.7426C2.59648 11.5817 3.66557 12.1532 4.82946 12.3847C5.99334 12.6162 7.19974 12.4974 8.2961 12.0433C9.39245 11.5891 10.3295 10.8201 10.9888 9.83341C11.6481 8.84672 12 7.68668 12 6.5C11.9982 4.90925 11.3655 3.38416 10.2407 2.25933C9.11583 1.1345 7.59075 0.501787 6 0.5ZM6 11.3C5.05065 11.3 4.12262 11.0185 3.33326 10.491C2.54391 9.96362 1.92868 9.21396 1.56538 8.33687C1.20208 7.45979 1.10702 6.49467 1.29223 5.56356C1.47744 4.63245 1.9346 3.77718 2.60589 3.10589C3.27718 2.43459 4.13246 1.97744 5.06357 1.79223C5.99467 1.60702 6.95979 1.70208 7.83688 2.06538C8.71396 2.42868 9.46362 3.04391 9.99105 3.83326C10.5185 4.62262 10.8 5.55065 10.8 6.5C10.7985 7.77259 10.2924 8.99264 9.3925 9.8925C8.49264 10.7924 7.27259 11.2985 6 11.3Z" fill="currentColor" />
<path d="M4.3252 3.96463L6.95494 6.50013L4.3252 9.03588L5.19044 9.86988L8.68694 6.50013L5.19044 3.12988L4.3252 3.96463Z" fill="currentColor" />
</svg>
</div>
</div>
<div class="card-notice" v-if="!selectPageStyle.hideNotice">
<img class="notice-icon" src="/assets/addons/wdsxh/img/mine/notice.png">
</div>
</div>
</div>
</div>
<div class="scroll-content">
<draggable :list="pageData.items" class="content-drag" @update="handleDrag" :options="{animation: 120, filter: '.diy-float' }">
<div class="drag-column" v-for="(item, index) in pageData.items">
<!-- 商城订单 -->
<div v-if="item.type == 'mallOrderDiy'" class="column-diy" @click="handleEdit(index)" :class="{selected: index === selectedIndex}">
<div class="diy-order" :style="{opacity: item.show ? 1 : 0.5}">
<div class="order-head">
<span class="head-title">商城订单</span>
<div class="head-btn">查看全部</div>
</div>
<div class="order-list">
<div class="list-item" v-for="(menu, number) in item.data">
<div class="item-image" :style="{width: `${item.style.iconSize}px`, height: `${item.style.iconSize}px`}">
<img class="image" :src="menu.imgUrl">
<div class="count" v-if="number == 0">1</div>
</div>
<div class="item-text" :style="{fontSize: `${item.style.fontSize}px`, color: item.style.textColor, marginTop: `${item.style.graphicSpace}px`}">{{menu.text}}</div>
</div>
</div>
</div>
</div>
<!-- 我的名片 -->
<div v-else-if="item.type == 'cardDiy'" class="column-diy" @click="handleEdit(index)" :class="{selected: index === selectedIndex}">
<div class="diy-card" :style="{opacity: item.show ? 1 : 0.5}">
<div class="card-head">
<span class="head-title">我的名片(2)</span>
<div class="head-btn">查看全部</div>
</div>
<div class="card-list">
<div class="list-item">
<img class="item-image" src="/assets/addons/wdsxh/img/mine/card.png">
</div>
<div class="list-item">
<img class="item-image" src="/assets/addons/wdsxh/img/mine/card.png">
</div>
<div class="list-item">
<img class="item-image" src="/assets/addons/wdsxh/img/mine/card.png">
</div>
</div>
</div>
</div>
<!-- 会员中心 -->
<div v-else-if="item.type == 'memberDiy'" class="column-diy" @click="handleEdit(index)" :class="{selected: index === selectedIndex}">
<div class="diy-nav" :style="{opacity: item.show ? 1 : 0.5}">
<div class="nav-title">{{item.name}}</div>
<div class="nav-list" :class="{'vertical-layout': item.style.layout == 2}" :style="{'row-gap': `${item.style.itemSpace}px`}">
<div class="list-item" v-for="(nav, number) in item.data" :style="{width: `calc(100% / ${parseInt(item.style.rowsNum)})`, gap: `${item.style.graphicSpace}px`}">
<div class="item-image" :style="{width: `${item.style.iconSize}px`, height: `${item.style.iconSize}px`}">
<img class="image" :src="nav.imgUrl">
</div>
<div class="item-text" :style="{fontSize: `${item.style.fontSize}px`, color: item.style.textColor}">{{nav.text}}</div>
<i class="item-icon el-icon-arrow-right" :style="{fontSize: `${item.style.fontSize - 2}px`}"></i>
</div>
</div>
</div>
</div>
<!-- 管理员中心 -->
<div v-else-if="item.type == 'adminDiy'" class="column-diy" @click="handleEdit(index)" :class="{selected: index === selectedIndex}">
<div class="diy-nav" :style="{opacity: item.show ? 1 : 0.5}">
<div class="nav-title">{{item.name}}</div>
<div class="nav-list" :class="{'vertical-layout': item.style.layout == 2}" :style="{'row-gap': `${item.style.itemSpace}px`}">
<div class="list-item" v-for="(nav, number) in item.data" :style="{width: `calc(100% / ${parseInt(item.style.rowsNum)})`, gap: `${item.style.graphicSpace}px`}">
<div class="item-image" :style="{width: `${item.style.iconSize}px`, height: `${item.style.iconSize}px`}">
<img class="image" :src="nav.imgUrl">
</div>
<div class="item-text" :style="{fontSize: `${item.style.fontSize}px`, color: item.style.textColor}">{{nav.text}}</div>
<i class="item-icon el-icon-arrow-right" :style="{fontSize: `${item.style.fontSize - 2}px`}"></i>
</div>
</div>
</div>
</div>
<!-- 系统中心 -->
<div v-else-if="item.type == 'navDiy'" class="column-diy" @click="handleEdit(index)" :class="{selected: index === selectedIndex}">
<div class="diy-nav" :style="{opacity: item.show ? 1 : 0.5}">
<div class="nav-title">{{item.name}}</div>
<div class="nav-list" :class="{'vertical-layout': item.style.layout == 2}" :style="{'row-gap': `${item.style.itemSpace}px`}">
<div class="list-item" v-for="(nav, number) in item.data" :style="{width: `calc(100% / ${parseInt(item.style.rowsNum)})`, gap: `${item.style.graphicSpace}px`}">
<div class="item-image" :style="{width: `${item.style.iconSize}px`, height: `${item.style.iconSize}px`}">
<img class="image" :src="nav.imgUrl">
</div>
<div class="item-text" :style="{fontSize: `${item.style.fontSize}px`, color: item.style.textColor}">{{nav.text}}</div>
<i class="item-icon el-icon-arrow-right" :style="{fontSize: `${item.style.fontSize - 2}px`}"></i>
</div>
</div>
</div>
</div>
</div>
</draggable>
</div>
</div>
<div class="phone-footer">
<div class="footer-line"></div>
</div>
</div>
</div>
</div>

28
application/admin/view/wdsxh/person_center_diy_page/index.html Normal file
View File

@@ -0,0 +1,28 @@
<link rel="stylesheet" href="__CDN__/assets/addons/wdsxh/plugins/element-ui/index.css?v=2.15.6">
<link rel="stylesheet" href="__CDN__/assets/addons/wdsxh/css/person_center_diy.css?v=4.3.2">
<el-container id="diy" class="container" style="display: none;">
<el-header class="container-header" height="auto">
<el-button class="header-submit" size="mini" @click.stop="handleReset">重置模板</el-button>
<el-button class="header-submit" size="mini" type="primary" @click.stop="handleSubmit">保存模板</el-button>
</el-header>
<el-main class="container-main">
{include file="wdsxh/person_center_diy_page/center" /}
{include file="wdsxh/person_center_diy_page/right" /}
{include file="wdsxh/person_center_diy_page/typeSelection" /}
</el-main>
</el-container>
<div id="loading" style="position: fixed;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;">
<img src="/assets/addons/wdsxh/img/loading.gif" width="96px" height="96px" alt="">
</div>
<script src="__CDN__/assets/libs/jquery/dist/jquery.min.js"></script>
<script src="__CDN__/assets/addons/wdsxh/plugins/vue/vue.min.js?v=2.6.14"></script>
<script src="__CDN__/assets/libs/Sortable/Sortable.min.js?v=1.1.40"></script>
<script src="__CDN__/assets/addons/wdsxh/plugins/element-ui/index.js?v=2.15.6"></script>
<script src="__CDN__/assets/addons/wdsxh/plugins/vuedraggable/vuedraggable.min.js"></script>
<script>
var pageData = {$jsonPageData};
var defaultData = {$defaultData};
</script>

457
application/admin/view/wdsxh/person_center_diy_page/right.html Normal file
View File

@@ -0,0 +1,457 @@
<div class="main-right">
<!-- 标题 -->
<div class="right-title">
<span v-if="selectedIndex == -1">页面设置</span>
<span v-else>{{ currentData.name }}</span>
</div>
<!-- 内容 -->
<div class="right-content">
<!-- 页面设置 -->
<div v-if="selectedIndex == -1" class="content-form">
<div class="form-column">
<div class="column-item">
<div class="item-label">页面标题</div>
<div class="item-box">
<el-input placeholder="请输入页面标题" type="text" v-model="pageData.pageTitle" size="small" clearable></el-input>
</div>
</div>
<div class="column-item">
<div class="item-label">页面风格</div>
<div class="item-box">
<el-radio-group v-model="pageData.pageLayout" size="small" @change="getPageStyle()">
<el-radio-button :label="1">样式一</el-radio-button>
<el-radio-button :label="2">样式二</el-radio-button>
<el-radio-button :label="3">样式三</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">标题颜色</div>
<div class="item-box">
<el-radio-group v-model="selectPageStyle.titleTextColor" size="small">
<el-radio-button label="black">黑色</el-radio-button>
<el-radio-button label="white">白色</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">背景颜色</div>
<div class="item-box">
<el-color-picker v-model="selectPageStyle.backgroundColor" size="small"></el-color-picker>
<el-button size="mini" @click.stop="handleResetColor(selectPageStyle, 'backgroundColor', '#F6F7FB')">重置</el-button>
</div>
</div>
<div class="column-item">
<div class="item-label">背景图片</div>
<div class="item-box">
<div class="upload-image" v-if="selectPageStyle.backgroundImage">
<img class="image" :src="selectPageStyle.backgroundImage">
<div class="delete" @click="handleDeleteImage(selectPageStyle, 'backgroundImage')"><i class="el-icon-close"></i></div>
</div>
<el-button type="primary" size="mini" @click="handleSelectImage(selectPageStyle, 'backgroundImage')" v-else>选择图片</el-button>
</div>
</div>
<div class="column-item">
<div class="item-label">是否显示会员：</div>
<div class="item-box">
<el-switch v-model="selectPageStyle.hideMember" :active-value="false" :inactive-value="true"></el-switch>
</div>
</div>
<div class="column-item" v-if="!selectPageStyle.hideMember">
<div class="item-label">是否显示立即申请：</div>
<div class="item-box">
<el-tooltip content="仅控制 “立即申请” 按钮显示与隐藏，请于前端查看效果" placement="top" effect="light">
<el-switch v-model="selectPageStyle.hideApply" :active-value="false" :inactive-value="true"></el-switch>
</el-tooltip>
</div>
</div>
<div class="column-item">
<div class="item-label">是否显示消息通知：</div>
<div class="item-box">
<el-switch v-model="selectPageStyle.hideNotice" :active-value="false" :inactive-value="true"></el-switch>
</div>
</div>
</div>
</div>
<!-- 商城订单 -->
<el-tabs v-else-if="currentData.type == 'mallOrderDiy'" class="content-form" v-model="currentData.activeName">
<el-tab-pane label="内容设置" name="first">
<div class="form-column">
<div class="column-item">
<div class="item-label">是否显示：</div>
<div class="item-box">
<el-switch v-model="currentData.show"></el-switch>
</div>
</div>
<el-alert title="最佳图片尺寸100*100" type="info" :closable="false" style="margin-top: 16px;"></el-alert>
<div class="column-list">
<div class="list-item" v-for="(menu, index) in currentData.data">
<div class="item-image">
<img class="image" :src="menu.imgUrl">
</div>
<div class="item-info">
<div class="info-row">
<div class="row-label">状态</div>
<div class="row-text">{{menu.text}}</div>
</div>
<div class="info-row">
<div class="row-label">图片</div>
<el-input class="row-input" placeholder="请选择图片或输入图片地址" type="text" v-model="menu.imgUrl" size="small">
<div slot="append" class="input-btn" @click="handleSelectImage(menu, 'imgUrl')">
<i class="el-icon-picture-outline"></i>
</div>
</el-input>
</div>
</div>
</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="样式设置" name="second">
<div class="form-column">
<div class="column-item">
<div class="item-label">图标尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.iconSize" controls-position="right" :min="0" :max="100" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">文字尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.fontSize" controls-position="right" :min="0" :max="50" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">字体颜色</div>
<div class="item-box">
<el-color-picker v-model="currentData.style.textColor" size="small"></el-color-picker>
<el-button size="mini" @click.stop="handleResetColor(currentData.style, 'textColor', '#5A5B6E')">重置</el-button>
</div>
</div>
<div class="column-item">
<div class="item-label">图文间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.graphicSpace" :min="0" :max="30"></el-slider>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
<!-- 我的名片 -->
<el-tabs v-else-if="currentData.type == 'cardDiy'" class="content-form">
<div class="form-column">
<div class="column-item">
<div class="item-label">是否显示：</div>
<div class="item-box">
<el-switch v-model="currentData.show"></el-switch>
</div>
</div>
</div>
</el-tabs>
<!-- 会员中心 -->
<el-tabs v-else-if="currentData.type == 'memberDiy'" class="content-form" v-model="currentData.activeName">
<el-tab-pane label="内容设置" name="first">
<div class="form-column">
<div class="column-item">
<div class="item-label">是否显示：</div>
<div class="item-box">
<el-switch v-model="currentData.show"></el-switch>
</div>
</div>
<div class="column-item">
<div class="item-label">非会员是否显示：</div>
<div class="item-box">
<el-tooltip content="关闭后非会员不显示该组件，会员正常显示；打开后非会员和会员均显示该组件" placement="top" effect="light">
<el-switch v-model="currentData.memberHide" :active-value="false" :inactive-value="true"></el-switch>
</el-tooltip>
</div>
</div>
<el-alert title="最佳图片尺寸100*100" type="info" :closable="false" style="margin-top: 16px;"></el-alert>
<draggable class="column-list" :list="currentData.data" :options="{ animation: 120, handle: '.item-mover', preventOnFilter: false }">
<div class="list-item" v-for="(nav, index) in currentData.data">
<div class="item-mover">
<img src="/assets/addons/wdsxh/img/drag.png">
</div>
<div class="item-image">
<img class="image" :src="nav.imgUrl">
</div>
<div class="item-info">
<div class="info-row">
<div class="row-label">内容</div>
<el-input class="row-input" placeholder="请输入内容" type="text" v-model="nav.text" size="small" clearable></el-input>
</div>
<div class="info-row">
<div class="row-label">图片</div>
<el-input class="row-input" placeholder="请选择图片或输入图片地址" type="text" v-model="nav.imgUrl" size="small">
<div slot="append" class="input-btn" @click="handleSelectImage(nav, 'imgUrl')">
<i class="el-icon-picture-outline"></i>
</div>
</el-input>
</div>
<div class="info-row">
<div class="row-label">类型</div>
<el-input class="row-input" placeholder="请选择类型" type="text" v-model="nav.link ? nav.link.title : nav.link" size="small" disabled>
<div slot="append" class="input-btn" @click="handleSelectType(nav)">
<i class="el-icon-help"></i>
</div>
</el-input>
</div>
</div>
<div class="item-delete el-icon-close" @click="handleDeleteItem(index)"></div>
</div>
</draggable>
<el-button type="primary" class="column-add" icon="el-icon-circle-plus-outline" @click.stop="handleAddItem">添加导航</el-button>
</div>
</el-tab-pane>
<el-tab-pane label="样式设置" name="second">
<div class="form-column">
<div class="column-item">
<div class="item-label">组件布局</div>
<div class="item-box">
<el-radio-group v-model="currentData.style.layout" size="small">
<el-radio-button :label="1">布局1</el-radio-button>
<el-radio-button :label="2">布局2</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">每行数量</div>
<div class="item-box">
<el-radio-group v-model="currentData.style.rowsNum" size="small">
<el-radio-button label="3">3个</el-radio-button>
<el-radio-button label="4">4个</el-radio-button>
<el-radio-button label="5">5个</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">图标尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.iconSize" controls-position="right" :min="0" :max="100" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">文字尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.fontSize" controls-position="right" :min="0" :max="50" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">字体颜色</div>
<div class="item-box">
<el-color-picker v-model="currentData.style.textColor" size="small"></el-color-picker>
<el-button size="mini" @click.stop="handleResetColor(currentData.style, 'textColor', '#5A5B6E')">重置</el-button>
</div>
</div>
<div class="column-item">
<div class="item-label">图文间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.graphicSpace" :min="0" :max="30"></el-slider>
</div>
</div>
<div class="column-item">
<div class="item-label">成员间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.itemSpace" :min="0" :max="50"></el-slider>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
<!-- 管理员中心 -->
<el-tabs v-else-if="currentData.type == 'adminDiy'" class="content-form" v-model="currentData.activeName">
<el-tab-pane label="内容设置" name="first">
<div class="form-column">
<el-alert title="提示：该组件会根据相关管理员权限自动显示或隐藏" type="warning" :closable="false"></el-alert>
<div class="column-item">
<div class="item-label">是否显示：</div>
<div class="item-box">
<el-switch v-model="currentData.show"></el-switch>
</div>
</div>
<el-alert title="最佳图片尺寸100*100" type="info" :closable="false" style="margin-top: 16px;"></el-alert>
<draggable class="column-list" :list="currentData.data" :options="{ animation: 120, handle: '.item-mover', preventOnFilter: false }">
<div class="list-item" v-for="(nav, index) in currentData.data">
<div class="item-mover">
<img src="/assets/addons/wdsxh/img/drag.png">
</div>
<div class="item-image">
<img class="image" :src="nav.imgUrl">
</div>
<div class="item-info">
<div class="info-row">
<div class="row-label">类型</div>
<div class="row-text">{{nav.text}}</div>
</div>
<div class="info-row">
<div class="row-label">图片</div>
<el-input class="row-input" placeholder="请选择图片或输入图片地址" type="text" v-model="nav.imgUrl" size="small">
<div slot="append" class="input-btn" @click="handleSelectImage(nav, 'imgUrl')">
<i class="el-icon-picture-outline"></i>
</div>
</el-input>
</div>
</div>
</div>
</draggable>
</div>
</el-tab-pane>
<el-tab-pane label="样式设置" name="second">
<div class="form-column">
<div class="column-item">
<div class="item-label">组件布局</div>
<div class="item-box">
<el-radio-group v-model="currentData.style.layout" size="small">
<el-radio-button :label="1">布局1</el-radio-button>
<el-radio-button :label="2">布局2</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">每行数量</div>
<div class="item-box">
<el-radio-group v-model="currentData.style.rowsNum" size="small">
<el-radio-button label="3">3个</el-radio-button>
<el-radio-button label="4">4个</el-radio-button>
<el-radio-button label="5">5个</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">图标尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.iconSize" controls-position="right" :min="0" :max="100" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">文字尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.fontSize" controls-position="right" :min="0" :max="50" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">字体颜色</div>
<div class="item-box">
<el-color-picker v-model="currentData.style.textColor" size="small"></el-color-picker>
<el-button size="mini" @click.stop="handleResetColor(currentData.style, 'textColor', '#5A5B6E')">重置</el-button>
</div>
</div>
<div class="column-item">
<div class="item-label">图文间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.graphicSpace" :min="0" :max="30"></el-slider>
</div>
</div>
<div class="column-item">
<div class="item-label">成员间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.itemSpace" :min="0" :max="50"></el-slider>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
<!-- 系统中心 -->
<el-tabs v-else-if="currentData.type == 'navDiy'" class="content-form" v-model="currentData.activeName">
<el-tab-pane label="内容设置" name="first">
<div class="form-column">
<div class="column-item">
<div class="item-label">是否显示：</div>
<div class="item-box">
<el-switch v-model="currentData.show"></el-switch>
</div>
</div>
<el-alert title="最佳图片尺寸100*100" type="info" :closable="false" style="margin-top: 16px;"></el-alert>
<draggable class="column-list" :list="currentData.data" :options="{ animation: 120, handle: '.item-mover', preventOnFilter: false }">
<div class="list-item" v-for="(nav, index) in currentData.data">
<div class="item-mover">
<img src="/assets/addons/wdsxh/img/drag.png">
</div>
<div class="item-image">
<img class="image" :src="nav.imgUrl">
</div>
<div class="item-info">
<div class="info-row">
<div class="row-label">内容</div>
<el-input class="row-input" placeholder="请输入内容" type="text" v-model="nav.text" size="small" clearable></el-input>
</div>
<div class="info-row">
<div class="row-label">图片</div>
<el-input class="row-input" placeholder="请选择图片或输入图片地址" type="text" v-model="nav.imgUrl" size="small">
<div slot="append" class="input-btn" @click="handleSelectImage(nav, 'imgUrl')">
<i class="el-icon-picture-outline"></i>
</div>
</el-input>
</div>
<div class="info-row">
<div class="row-label">类型</div>
<el-input class="row-input" placeholder="请选择类型" type="text" v-model="nav.link ? nav.link.title : nav.link" size="small" disabled>
<div slot="append" class="input-btn" @click="handleSelectType(nav)">
<i class="el-icon-help"></i>
</div>
</el-input>
</div>
</div>
<div class="item-delete el-icon-close" @click="handleDeleteItem(index)"></div>
</div>
</draggable>
<el-button type="primary" class="column-add" icon="el-icon-circle-plus-outline" @click.stop="handleAddItem">添加导航</el-button>
</div>
</el-tab-pane>
<el-tab-pane label="样式设置" name="second">
<div class="form-column">
<div class="column-item">
<div class="item-label">组件布局</div>
<div class="item-box">
<el-radio-group v-model="currentData.style.layout" size="small">
<el-radio-button :label="1">布局1</el-radio-button>
<el-radio-button :label="2">布局2</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">每行数量</div>
<div class="item-box">
<el-radio-group v-model="currentData.style.rowsNum" size="small">
<el-radio-button label="3">3个</el-radio-button>
<el-radio-button label="4">4个</el-radio-button>
<el-radio-button label="5">5个</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="column-item">
<div class="item-label">图标尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.iconSize" controls-position="right" :min="0" :max="100" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">文字尺寸</div>
<div class="item-box">
<el-input-number v-model="currentData.style.fontSize" controls-position="right" :min="0" :max="50" size="small"></el-input-number>
</div>
</div>
<div class="column-item">
<div class="item-label">字体颜色</div>
<div class="item-box">
<el-color-picker v-model="currentData.style.textColor" size="small"></el-color-picker>
<el-button size="mini" @click.stop="handleResetColor(currentData.style, 'textColor', '#5A5B6E')">重置</el-button>
</div>
</div>
<div class="column-item">
<div class="item-label">图文间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.graphicSpace" :min="0" :max="30"></el-slider>
</div>
</div>
<div class="column-item">
<div class="item-label">成员间距</div>
<div class="item-box">
<el-slider v-model="currentData.style.itemSpace" :min="0" :max="50"></el-slider>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>

84
application/admin/view/wdsxh/person_center_diy_page/typeSelection.html Normal file
View File

@@ -0,0 +1,84 @@
<el-dialog title="选择类型" :modal-append-to-body="false" :visible.sync="selectVisible" custom-class="main-selection">
<div class="selection-box">
<div class="box-header">
<el-tabs v-model="selectType" tab-position="left" @tab-click="tabChange" style="height: 100%;">
<el-tab-pane v-for="item in selectData" :label="item.name" :name="item.type"></el-tab-pane>
</el-tabs>
</div>
<div class="box-content" v-if="selectVisible">
<div class="content-item" v-if="selectType === 'Custom' && selectData">
<el-table :data="selectData.Custom.list" header-cell-class-name="table-head" size="mini" height="420">
<el-table-column property="title" label="标题"></el-table-column>
<el-table-column property="path" label="路径"></el-table-column>
<el-table-column label="页面参数（选填）">
<template slot-scope="scope">
<el-input style="width: 100%;" v-model="scope.row.parameter" placeholder="例：id=2，2代表分类id" size="mini"></el-input>
</template>
</el-table-column>
<el-table-column label="操作" width="120">
<template slot-scope="scope">
<el-button @click.native.prevent="selectCallback('Custom', selectData.Custom.list[scope.$index])" size="mini" plain type="primary"> 选择</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="content-item" v-if="selectType === 'Editor' && selectData">
<el-form ref="form" @submit.native.prevent :model="selectForm" size="small" label-width="100px">
<el-form-item label="页面标题">
<el-input placeholder="选填，默认图文详情" v-model="selectForm.title"></el-input>
</el-form-item>
</el-form>
<form role="form">
<textarea id="Editor" class="editor">{{selectForm.content}}</textarea>
</form>
</div>
<div class="content-item" v-if="selectType === 'WXMp' && selectData">
<el-form ref="form" :model="selectForm" label-width="120px">
<el-form-item label="小程序APPID">
<el-input v-model="selectForm.appid"></el-input>
</el-form-item>
<el-form-item label="小程序路径">
<el-input v-model="selectForm.path"></el-input>
</el-form-item>
</el-form>
</div>
<div class="content-item" v-if="selectType === 'Outside' && selectData">
<el-alert title="说明" type="info" :closable="false">
<div>
<p>1.必须添加业务域名，才可以跳转；</p>
<p>2.业务域名添加方式：（1）登录小程序（https://mp.weixin.qq.com/）；（2）左侧菜单开发→开发管理→开发设置→业务域名</p>
</div>
</el-alert>
<el-input style="margin-top: 22px;" placeholder="请输入链接" v-model="selectForm.url">
<el-select v-model="selectForm.protocol" slot="prepend" placeholder="请选择" style="width: 100px;">
<el-option label="http://" value="http://"></el-option>
<el-option label="https://" value="https://"></el-option>
</el-select>
</el-input>
</div>
<div class="content-item" v-if="selectType === 'Phone' && selectData">
<el-form ref="form" @submit.native.prevent :model="selectForm">
<el-form-item label="电话号码">
<el-input type="tel" v-model="selectForm.phone" placeholder="请输入电话号码"></el-input>
</el-form-item>
</el-form>
</div>
<div class="content-item" v-if="selectType === 'Service' && selectData">
<el-alert title="说明" type="info" :closable="false">
<div>
<p>1. 仅微信小程序可用，其他平台无法使用</p>
<p>2. 在本小程序打开小程序客服</p>
</div>
</el-alert>
</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button v-if="selectType === 'Editor' && selectData" @click.native.prevent="selectCallback('Editor',selectData.Editor)" type="primary">确 定</el-button>
<el-button v-if="selectType === 'WXMp' && selectData" @click.native.prevent="selectCallback('WXMp',selectData.WXMp)" type="primary">确 定</el-button>
<el-button v-if="selectType === 'Outside' && selectData" @click.native.prevent="selectCallback('Outside',selectData.Outside)" type="primary">确 定</el-button>
<el-button v-if="selectType === 'Phone' && selectData" @click.native.prevent="selectCallback('Phone',selectData.Phone)" type="primary">确 定</el-button>
<el-button v-if="selectType === 'Service' && selectData" @click.native.prevent="selectCallback('Service',selectData.Service)" type="primary">确 定</el-button>
<el-button @click="selectVisible = false">取 消</el-button>
</div>
</el-dialog>