inkreachhub/inkreach-uni
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首次提交

Browse Source
This commit is contained in:
RyRh
2026-08-20 18:29:49 +08:00
commit 76827aedfe
77 changed files with 24937 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
App.vue
+20
View File
@@ -0,0 +1,20 @@
<script>
export default {
data() {
return {};
},
globalData: {
userInfo: null,
baseUrl: 'https://api.inkreach.com'
},
onLaunch() {
const sysInfo = uni.getWindowInfo();
this.globalData.statusBarHeight = sysInfo.statusBarHeight;
this.globalData.windowWidth = sysInfo.windowWidth;
this.globalData.windowHeight = sysInfo.windowHeight;
}
};
</script>
<style>
@import './app.css';
</style>
README.md
+87
View File
@@ -0,0 +1,87 @@
# miniprogram-to-uniapp 转换说明
## 0x00 转换模式
根据转换模式，转换后的项目使用相应的工具打开，目前有两种模式：
### HBuilder X 模式
转换后的目录(以_uni结尾的目录), 需使用HBuilder X导入，进行运行和调试。
如果项目使用了npm模块，需先使用npm install等命令进行安装，然后再运行
### Vue-cli 模式
转换后的目录(以_vue-cli结尾的目录), 需使用命令行安装依赖、运行和打包。
详见文档：https://uniapp.dcloud.io/quickstart-cli.html#%E8%BF%90%E8%A1%8C%E3%80%81%E5%8F%91%E5%B8%83uni-app
注：
上述两种项目类型，可以相互转换。
[uni-app HBuilderX 工程与 vue-cli 工程相互转换](https://ask.dcloud.net.cn/article/35750)
## 0x01 调试建议
如果您想转换小程序为uni-app项目，并发布为App，
建议运行到H5平台，因为H5平台速度快，而且与App平台贴合度更高。
只有当强依赖硬件时，才使用真机调试，这样可以节约时间！
## 0x02 常见问题
### 1.命令行提示：“'wtu'不是内部或外部命令, 也不是可运行的程序”
一般是node未安装在默认目录导致的，参照文章 [解决“npm不是内部或外部命令“](https://www.cnblogs.com/ldq678/p/10291824.html) 解决。
### 2.PowerShell里提示：无法加载文件 XXXXXXXXX.ps1，因为在此系统上禁止运行脚本。
以管理员身份运行`powershell`，执行
```
set-executionpolicy remotesigned
```
输入 y 即可
或者，在PowerShell输入 `cmd` 后回车也行
### 3.setData为什么没有转换？需要我手动改吗？那我有100多个页面怎么改呀？
`setData`函数已内置，在main.js通过mixin全局混入，所以不用转换，可直接使用`setData`函数！！！
### 4.命令行报错："cannot read property ‘某某某’ of undefined"
报错解释：有代码“`xx.某某某`”，但xx的值是undefined，因此，需要进报错的页面，调试调试，为啥xx为undefined，相应的调试代码即可。
常见原因：可能接口跨域，可能真的没值，也可能没声明变量，也可能是工具转换问题等。
### 5.为什么我运行到H5或app时，拿不到小程序用户的信息？为什么登录失败？
转换后的uni-app项目，如需运行到其他小程序、H5和App时，登录和支付功能均需“重新对接”，需要增加 “新” 接口！
### 6.跨域问题：为什么我的接口都没有返回数据呀？
控制台有“CORS”、“Access-Control-Allow-Origin”等关键字时，不要犹豫，果断判断是因为跨域，导致访问接口失败。
跨域，前端老生常谈，有N种解决办法，最简单的办法是运行到“内置浏览器”。
PS: 仅仅 H5 平台存在跨域问题！发布后上传到服务器无此问题！
### 7.Vant项目怎么转换呀？
Vant项目比较常见的报错是：代码`<button class="{{ utils.bem('action-sheet__item', { disabled: item.disabled || item.loading }) }} {{ item.className || '' }}"></button>`转到后，运行会报错，因为uni-app不支持在class里面写函数）
由于Vant的一些语法uni-app并不支持，因此需要特殊处理一下，这里分享三种方案，可以根据自己的情况进行选择。
#### 方案一：【替换Vant组件】
转换前，将vant组件全部用别的组件库替换掉再转换。
#### 方案二：【替换Vant组件】
转换后，将vant组件使用uview1.x替换掉同功能组件。
#### 方案三：【不替换Vant组件】
转换后，按uniapp引入小程序组件文档重新引入vant组件（小程序自定义组件支持：
https://uniapp.dcloud.io/tutorial/miniprogram-subject.html#%E5%B0%8F%E7%A8%8B%E5%BA%8F%E8%87%AA%E5%AE%9A%E4%B9%89%E7%BB%84%E4%BB%B6%E6%94%AF%E6%8C%81）
### 8.小程序转换为uni-app项目后，还能转换成其他小程序项目吗？
当然可以，必须可以！
小程序转换为uni-app项目后，就是uni-app项目了，uni-app项目能做啥就能做啥，
能再次生成为各种小程序、发布H5和App。
### 9.uni-app生成的小程序项目，还能再转换回uni-app项目吗？
不能。不支持这种项目的转换！
### 其他
- 因各种原因，本工具并非100%完美转换！有问题实属正常！
- 如遇运行报错，请在https://github.com/zhangdaren/miniprogram-to-uniapp，将详细情况提交Issue！
app.css
+230
View File
@@ -0,0 +1,230 @@
/* 全局样式 - 印美达 Inkreach 微信小程序 */
page {
--color-primary: #ff6800;
--color-primary-light: #fff0e5;
--color-primary-dark: #e55a00;
--color-secondary: #f26522;
--color-dark: #121212;
--color-text-primary: #333333;
--color-text-secondary: #666666;
--color-text-tertiary: #999999;
--color-bg-page: #f5f5f5;
--color-bg-card: #ffffff;
--color-border: #eeeeee;
--color-tag-bg: #f2f2f2;
--color-success: #52c41a;
--color-warning: #faad14;
--radius-sm: 8rpx;
--radius-md: 12rpx;
--radius-lg: 20rpx;
--radius-xl: 32rpx;
--spacing-xs: 8rpx;
--spacing-sm: 16rpx;
--spacing-md: 24rpx;
--spacing-lg: 32rpx;
--spacing-xl: 48rpx;
font-size: 28rpx;
color: var(--color-text-primary);
background-color: var(--color-bg-page);
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
}
/* 通用样式 */
.container {
min-height: 100vh;
background-color: var(--color-bg-page);
}
.flex-row {
display: flex;
flex-direction: row;
align-items: center;
}
.flex-col {
display: flex;
flex-direction: column;
}
.flex-center {
display: flex;
align-items: center;
justify-content: center;
}
.flex-between {
display: flex;
align-items: center;
justify-content: space-between;
}
.flex-1 {
flex: 1;
}
.flex-wrap {
display: flex;
flex-wrap: wrap;
}
/* 文字样式 */
.text-primary {
color: var(--color-primary);
}
.text-secondary {
color: var(--color-text-secondary);
}
.text-tertiary {
color: var(--color-text-tertiary);
}
.text-white {
color: #ffffff;
}
.text-bold {
font-weight: 600;
}
.text-center {
text-align: center;
}
.text-sm {
font-size: 24rpx;
}
.text-md {
font-size: 28rpx;
}
.text-lg {
font-size: 32rpx;
}
.text-xl {
font-size: 40rpx;
}
.text-xxl {
font-size: 56rpx;
}
/* 间距 */
.mt-xs {
margin-top: 8rpx;
}
.mt-sm {
margin-top: 16rpx;
}
.mt-md {
margin-top: 24rpx;
}
.mt-lg {
margin-top: 32rpx;
}
.mt-xl {
margin-top: 48rpx;
}
.mb-xs {
margin-bottom: 8rpx;
}
.mb-sm {
margin-bottom: 16rpx;
}
.mb-md {
margin-bottom: 24rpx;
}
.mb-lg {
margin-bottom: 32rpx;
}
.p-sm {
padding: 16rpx;
}
.p-md {
padding: 24rpx;
}
.p-lg {
padding: 32rpx;
}
.px-md {
padding-left: 24rpx;
padding-right: 24rpx;
}
.px-lg {
padding-left: 32rpx;
padding-right: 32rpx;
}
/* 按钮 */
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
background-color: var(--color-primary);
color: #ffffff;
font-size: 28rpx;
font-weight: 500;
padding: 20rpx 48rpx;
border-radius: var(--radius-lg);
border: none;
line-height: 1.5;
}
.btn-primary::after {
border: none;
}
.btn-outline {
display: inline-flex;
align-items: center;
justify-content: center;
background-color: transparent;
color: var(--color-primary);
font-size: 28rpx;
font-weight: 500;
padding: 20rpx 48rpx;
border-radius: var(--radius-lg);
border: 2rpx solid var(--color-primary);
line-height: 1.5;
}
.btn-outline::after {
border: none;
}
/* 卡片 */
.card {
background-color: var(--color-bg-card);
border-radius: var(--radius-md);
padding: 24rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}
/* 标签 */
.tag {
display: inline-flex;
align-items: center;
padding: 4rpx 16rpx;
border-radius: var(--radius-sm);
font-size: 20rpx;
background-color: var(--color-tag-bg);
color: var(--color-text-secondary);
}
.tag-primary {
background-color: var(--color-primary-light);
color: var(--color-primary);
}
/* 分割线 */
.divider {
width: 100%;
height: 1rpx;
background-color: var(--color-border);
}
/* 安全区底部 */
.safe-bottom {
padding-bottom: env(safe-area-inset-bottom);
}
index.html
+20
View File
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<script>
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
CSS.supports('top: constant(a)'))
document.write(
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
</script>
<title></title>
<!--preload-links-->
<!--app-context-->
</head>
<body>
<div id="app"><!--app-html--></div>
<script type="module" src="/main.js"></script>
</body>
</html>
main.js
+28
View File
@@ -0,0 +1,28 @@
import App from './App';
// 全局mixins，用于实现setData等功能，请勿删除！';
import zpMixins from '@/uni_modules/zp-mixins/index.js';
// #ifndef VUE3
import Vue from 'vue';
Vue.use(zpMixins);
Vue.config.productionTip = false;
App.mpType = 'app';
const app = new Vue({
...App
});
app.$mount();
// #endif
// #ifdef VUE3
import { createSSRApp } from 'vue';
export function createApp() {
const app = createSSRApp(App);
app.mixin(zpMixins);
return {
app
};
}
// #endif
manifest.json
+70
View File
@@ -0,0 +1,70 @@
{
"name": "inkreach-miniprogram",
"appid": "",
"description": "",
"versionName": "1.0.0",
"versionCode": "100",
"transformPx": false,
"app-plus": {
"usingComponents": true,
"nvueStyleCompiler": "uni-app",
"compilerVersion": 3,
"splashscreen": {
"alwaysShowBeforeRender": true,
"waiting": true,
"autoclose": true,
"delay": 0
},
"modules": {},
"distribute": {
"android": {
"permissions": [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
"ios": {},
"sdkConfigs": {}
}
},
"quickapp": {},
"mp-weixin": {
"appid": "wxd0e6eff3c220337b",
"setting": {
"urlCheck": false
},
"usingComponents": true,
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示"
}
},
"plugins": {}
},
"mp-alipay": {
"usingComponents": true
},
"mp-baidu": {
"usingComponents": true
},
"mp-toutiao": {
"usingComponents": true
},
"uniStatistics": {
"enable": false
},
"vueVersion": "2"
}
package.json
+12
View File
@@ -0,0 +1,12 @@
{
"name": "inkreach-miniprogram",
"version": "1.0.0",
"description": "",
"main": "main.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"dependencies": {},
"license": "ISC"
}
pages.json
+54
View File
@@ -0,0 +1,54 @@
{
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "印美达 Inkreach",
"navigationStyle": "custom",
"usingComponents": {}
}
},
{
"path": "pages/products/products",
"style": {
"navigationBarTitleText": "产品中心",
"usingComponents": {}
}
},
{
"path": "pages/product-detail/product-detail",
"style": {
"navigationBarTitleText": "产品详情",
"usingComponents": {}
}
}
],
"tabBar": {
"color": "#999999",
"selectedColor": "#FF6800",
"backgroundColor": "#ffffff",
"borderStyle": "white",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页"
},
{
"pagePath": "pages/products/products",
"text": "产品"
}
]
},
"style": "v2",
"sitemapLocation": "sitemap.json",
"lazyCodeLoading": "requiredComponents",
"globalStyle": {
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "印美达 Inkreach",
"backgroundColor": "#f5f5f5",
"backgroundTextStyle": "dark",
"enablePullDownRefresh": false
},
"subPackages": []
}
pages/index/index.css
+828
View File
@@ -0,0 +1,828 @@
/* 首页样式 - 印美达 Inkreach */
.home {
min-height: 100vh;
background: #ffffff;
overflow-x: hidden;
}
/* 导航栏 */
.nav-bar {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
background: #ffffff;
box-shadow: 0 1rpx 0 rgba(0, 0, 0, 0.05);
}
.nav-content {
height: 88rpx;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 32rpx;
}
.nav-logo {
display: flex;
align-items: baseline;
gap: 8rpx;
}
.logo-text {
font-size: 32rpx;
font-weight: 700;
color: #ff6800;
font-style: italic;
}
.logo-cn {
font-size: 24rpx;
color: #333;
font-weight: 500;
}
.nav-actions {
display: flex;
align-items: center;
gap: 24rpx;
}
.nav-btn {
font-size: 26rpx;
color: #333;
}
.nav-login {
font-size: 24rpx;
color: #ff6800;
border: 2rpx solid #ff6800;
padding: 8rpx 24rpx;
border-radius: 32rpx;
}
/* Hero 首屏 */
.hero {
position: relative;
padding: 60rpx 32rpx 80rpx;
overflow: hidden;
background: linear-gradient(180deg, #fff5ee 0%, #ffffff 100%);
}
.hero-bg {
position: absolute;
top: -100rpx;
right: -200rpx;
width: 600rpx;
height: 600rpx;
background: radial-gradient(circle, rgba(255, 104, 0, 0.06) 0%, transparent 70%);
border-radius: 50%;
}
.hero-content {
position: relative;
z-index: 2;
}
.hero-title {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.hero-title-main {
font-size: 72rpx;
font-weight: 800;
color: #1a1a1a;
line-height: 1.2;
letter-spacing: 2rpx;
}
.hero-subtitle {
font-size: 30rpx;
color: #666;
margin-top: 24rpx;
}
.hero-tags {
display: flex;
gap: 16rpx;
margin-top: 32rpx;
}
.hero-tag {
font-size: 22rpx;
color: #ff6800;
background: rgba(255, 104, 0, 0.08);
padding: 8rpx 20rpx;
border-radius: 24rpx;
font-weight: 500;
}
.hero-cta {
display: inline-flex;
align-items: center;
justify-content: center;
background: #ff6800;
color: #ffffff;
font-size: 30rpx;
font-weight: 600;
padding: 24rpx 64rpx;
border-radius: 48rpx;
margin-top: 48rpx;
box-shadow: 0 8rpx 24rpx rgba(255, 104, 0, 0.3);
}
/* 3D插画区 */
.hero-illustration {
position: relative;
height: 400rpx;
margin-top: 40rpx;
}
.hero-illust-item {
position: absolute;
}
.hero-illist-tshirt {
top: 20rpx;
left: 20rpx;
transform: rotate(-8deg);
}
.hero-illist-bag {
top: 60rpx;
right: 40rpx;
transform: rotate(12deg);
}
.hero-illist-box {
bottom: 0;
left: 50%;
transform: translateX(-50%) rotate(-3deg);
}
.illust-placeholder {
border-radius: 24rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 80rpx;
}
.illust-placeholder.tshirt {
width: 200rpx;
height: 220rpx;
background: linear-gradient(135deg, #ff6800 0%, #ff8c40 100%);
}
.illust-placeholder.bag {
width: 180rpx;
height: 200rpx;
background: linear-gradient(135deg, #f26522 0%, #ff8855 100%);
}
.illust-placeholder.box {
width: 240rpx;
height: 180rpx;
background: linear-gradient(135deg, #ff6800 0%, #ffa040 100%);
}
/* 通用 section */
.section-title {
font-size: 40rpx;
font-weight: 700;
color: #1a1a1a;
text-align: center;
display: block;
}
.section-subtitle {
font-size: 26rpx;
color: #999;
text-align: center;
margin-top: 12rpx;
display: block;
}
.section-title-small {
font-size: 28rpx;
color: #666;
text-align: center;
display: block;
margin-bottom: 32rpx;
}
/* 信任指标 */
.trust-section {
padding: 64rpx 32rpx;
background: #ffffff;
}
.trust-grid {
display: flex;
flex-wrap: wrap;
gap: 24rpx;
}
.trust-card {
flex: 1;
min-width: 160rpx;
background: #fff8f3;
border-radius: 16rpx;
padding: 28rpx 16rpx;
text-align: center;
}
.trust-number {
font-size: 40rpx;
font-weight: 700;
color: #ff6800;
display: block;
}
.trust-label {
font-size: 24rpx;
color: #666;
margin-top: 8rpx;
display: block;
}
/* 4步流程 */
.steps-section {
padding: 64rpx 32rpx;
background: #fafafa;
}
.steps-list {
margin-top: 40rpx;
}
.step-item {
display: flex;
align-items: center;
padding: 24rpx;
background: #ffffff;
border-radius: 16rpx;
margin-bottom: 16rpx;
transition: all 0.3s;
border: 2rpx solid transparent;
}
.step-item.active {
border-color: #ff6800;
box-shadow: 0 4rpx 16rpx rgba(255, 104, 0, 0.1);
}
.step-number {
font-size: 36rpx;
font-weight: 800;
color: #ddd;
width: 80rpx;
flex-shrink: 0;
}
.step-item.active .step-number {
color: #ff6800;
}
.step-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 6rpx;
}
.step-title {
font-size: 30rpx;
font-weight: 600;
color: #333;
}
.step-desc {
font-size: 24rpx;
color: #999;
}
.step-visual {
margin-top: 32rpx;
}
.step-visual-card {
background: #ffffff;
border-radius: 20rpx;
padding: 48rpx 32rpx;
text-align: center;
border: 2rpx solid #ff6800;
}
.step-visual-icon {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
background: #fff0e5;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 24rpx;
}
.step-visual-emoji {
font-size: 56rpx;
}
.step-visual-text {
font-size: 28rpx;
color: #666;
line-height: 1.6;
}
/* 全球POD货盘 */
.catalog-section {
padding: 64rpx 0;
background: #ffffff;
}
.catalog-section .section-title {
padding: 0 32rpx;
}
.category-tabs {
white-space: nowrap;
padding: 24rpx 32rpx;
}
.cat-tab {
display: inline-block;
padding: 12rpx 32rpx;
margin-right: 16rpx;
font-size: 26rpx;
color: #666;
background: #f5f5f5;
border-radius: 32rpx;
transition: all 0.3s;
}
.cat-tab.active {
background: #ff6800;
color: #ffffff;
}
.product-preview-grid {
display: flex;
flex-wrap: wrap;
padding: 0 32rpx;
gap: 24rpx;
}
.product-preview-card {
width: calc(50% - 12rpx);
background: #ffffff;
border-radius: 16rpx;
overflow: hidden;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}
.product-preview-img {
width: 100%;
height: 280rpx;
display: flex;
align-items: center;
justify-content: center;
}
.product-preview-emoji {
font-size: 80rpx;
}
.product-preview-info {
padding: 16rpx;
}
.product-preview-name {
font-size: 26rpx;
color: #333;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.product-preview-price {
font-size: 28rpx;
color: #ff6800;
font-weight: 600;
margin-top: 8rpx;
display: block;
}
.see-more {
display: flex;
align-items: center;
justify-content: center;
gap: 8rpx;
padding: 24rpx;
font-size: 28rpx;
color: #ff6800;
}
.see-more .arrow {
font-size: 24rpx;
}
/* 平台功能 */
.features-section {
padding: 64rpx 32rpx;
background: #fafafa;
}
.features-grid {
display: flex;
flex-wrap: wrap;
gap: 24rpx;
margin-top: 40rpx;
}
.feature-card {
width: calc(50% - 12rpx);
background: #ffffff;
border-radius: 16rpx;
padding: 32rpx 24rpx;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12rpx;
}
.feature-icon {
width: 80rpx;
height: 80rpx;
border-radius: 20rpx;
display: flex;
align-items: center;
justify-content: center;
}
.feature-emoji {
font-size: 40rpx;
}
.feature-title {
font-size: 30rpx;
font-weight: 600;
color: #333;
}
.feature-desc {
font-size: 24rpx;
color: #999;
line-height: 1.5;
}
/* 为什么选择 */
.why-section {
padding: 64rpx 32rpx;
background: #ffffff;
}
.why-grid {
display: flex;
flex-wrap: wrap;
gap: 24rpx;
margin-top: 40rpx;
}
.why-card {
width: calc(50% - 12rpx);
text-align: center;
padding: 32rpx 16rpx;
background: #fff8f3;
border-radius: 16rpx;
}
.why-icon {
width: 72rpx;
height: 72rpx;
margin: 0 auto 16rpx;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
border-radius: 50%;
}
.why-emoji {
font-size: 36rpx;
}
.why-title {
font-size: 28rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 8rpx;
}
.why-desc {
font-size: 22rpx;
color: #999;
display: block;
}
/* 公司简介 */
.company-section {
padding: 64rpx 32rpx;
background: #fafafa;
}
.company-card {
background: #ffffff;
border-radius: 20rpx;
padding: 40rpx 32rpx;
margin-top: 32rpx;
}
.company-headline {
display: flex;
flex-direction: column;
font-size: 32rpx;
font-weight: 600;
color: #1a1a1a;
line-height: 1.6;
margin-bottom: 32rpx;
}
.company-content {
display: flex;
flex-direction: column;
gap: 24rpx;
}
.company-block-title {
font-size: 26rpx;
font-weight: 600;
color: #ff6800;
display: block;
margin-bottom: 8rpx;
}
.company-block-text {
font-size: 24rpx;
color: #666;
line-height: 1.7;
}
.company-stats {
display: flex;
justify-content: space-around;
margin-top: 32rpx;
padding-top: 32rpx;
border-top: 1rpx solid #eee;
}
.company-stat {
text-align: center;
}
.company-stat-number {
font-size: 36rpx;
font-weight: 700;
color: #ff6800;
display: block;
}
.company-stat-label {
font-size: 22rpx;
color: #999;
margin-top: 4rpx;
display: block;
}
/* 用户案例 */
.cases-section {
padding: 64rpx 0;
background: #ffffff;
}
.cases-section .section-title {
padding: 0 32rpx;
}
.cases-scroll {
white-space: nowrap;
padding: 32rpx;
}
.case-card {
display: inline-block;
width: 480rpx;
background: #ffffff;
border-radius: 20rpx;
overflow: hidden;
margin-right: 24rpx;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
vertical-align: top;
}
.case-image {
width: 100%;
height: 320rpx;
display: flex;
align-items: center;
justify-content: center;
}
.case-emoji {
font-size: 80rpx;
}
.case-info {
padding: 24rpx;
}
.case-title {
font-size: 28rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 12rpx;
}
.case-tags {
display: flex;
gap: 8rpx;
margin-bottom: 16rpx;
}
.case-tag {
font-size: 20rpx;
padding: 4rpx 12rpx;
background: #fff0e5;
color: #ff6800;
border-radius: 8rpx;
}
.case-metrics {
display: flex;
gap: 24rpx;
padding-top: 16rpx;
border-top: 1rpx solid #eee;
}
.case-metric-value {
font-size: 32rpx;
font-weight: 700;
color: #ff6800;
display: block;
}
.case-metric-label {
font-size: 22rpx;
color: #999;
display: block;
}
/* 最终CTA */
.cta-section {
position: relative;
padding: 80rpx 32rpx;
overflow: hidden;
}
.cta-bg {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(135deg, #ff6800 0%, #ff8c40 100%);
}
.cta-content {
position: relative;
z-index: 2;
text-align: center;
}
.cta-title {
display: flex;
flex-direction: column;
font-size: 48rpx;
font-weight: 700;
color: #ffffff;
line-height: 1.4;
}
.cta-desc {
font-size: 26rpx;
color: rgba(255, 255, 255, 0.85);
margin-top: 16rpx;
display: block;
}
.cta-input-wrap {
display: flex;
gap: 16rpx;
margin-top: 40rpx;
padding: 0 16rpx;
}
.cta-input {
flex: 1;
height: 80rpx;
background: rgba(255, 255, 255, 0.95);
border-radius: 40rpx;
padding: 0 32rpx;
font-size: 26rpx;
color: #333;
}
.cta-placeholder {
color: #ccc;
}
.cta-btn {
display: flex;
align-items: center;
justify-content: center;
background: #1a1a1a;
color: #ffffff;
font-size: 28rpx;
font-weight: 600;
padding: 0 40rpx;
border-radius: 40rpx;
}
/* 底部 */
.footer {
background: #121212;
padding: 48rpx 32rpx;
padding-bottom: calc(48rpx + env(safe-area-inset-bottom));
}
.footer-top {
text-align: center;
margin-bottom: 40rpx;
}
.footer-logo {
display: flex;
align-items: baseline;
justify-content: center;
gap: 8rpx;
margin-bottom: 16rpx;
}
.footer-logo-en {
font-size: 36rpx;
font-weight: 700;
color: #ff6800;
font-style: italic;
}
.footer-logo-cn {
font-size: 28rpx;
color: #fff;
}
.footer-slogan {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.5);
}
.footer-links {
display: flex;
justify-content: space-around;
margin-bottom: 40rpx;
}
.footer-col {
display: flex;
flex-direction: column;
gap: 12rpx;
}
.footer-col-title {
font-size: 26rpx;
font-weight: 600;
color: #fff;
margin-bottom: 8rpx;
}
.footer-link {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.5);
}
.footer-bottom {
text-align: center;
padding-top: 32rpx;
border-top: 1rpx solid rgba(255, 255, 255, 0.1);
}
.footer-copyright {
font-size: 20rpx;
color: rgba(255, 255, 255, 0.3);
}
pages/index/index.vue
+532
View File
@@ -0,0 +1,532 @@
<template>
<!-- 首页 - 印美达 Inkreach 按需定制平台 -->
<view class="home">
<!-- 自定义导航栏 -->
<view class="nav-bar" :style="'padding-top: ' + statusBarHeight + 'px;'">
<view class="nav-content">
<view class="nav-logo" @tap="goHome">
<text class="logo-text">inkreach</text>
<text class="logo-cn">印美达</text>
</view>
<view class="nav-actions">
<text class="nav-btn" @tap="goProducts">产品中心</text>
<view class="nav-login" @tap="goProducts">立即开始</view>
</view>
</view>
</view>
<!-- 占位 -->
<view :style="'height: ' + (statusBarHeight + 44) + 'px;'"></view>
<!-- Hero 首屏 -->
<view class="hero">
<view class="hero-bg"></view>
<view class="hero-content">
<view class="hero-title">
<text class="hero-title-main">一站定制</text>
<text class="hero-title-main">链通全球</text>
</view>
<text class="hero-subtitle">从定制设计到生产发货如此简单</text>
<view class="hero-tags">
<view class="hero-tag">0库存</view>
<view class="hero-tag">1件起订</view>
<view class="hero-tag">全球配送</view>
</view>
<view class="hero-cta" @tap="goProducts">
<text>免费开始</text>
</view>
</view>
<!-- 3D插画区域 -->
<view class="hero-illustration">
<view class="hero-illust-item hero-illist-tshirt">
<view class="illust-placeholder tshirt"></view>
</view>
<view class="hero-illust-item hero-illist-bag">
<view class="illust-placeholder bag"></view>
</view>
<view class="hero-illust-item hero-illist-box">
<view class="illust-placeholder box"></view>
</view>
</view>
</view>
<!-- 信任指标 -->
<view class="trust-section">
<text class="section-title-small">全球5000+卖家信赖我们的平台</text>
<view class="trust-grid">
<view class="trust-card">
<text class="trust-number">1000万+</text>
<text class="trust-label">订单履约</text>
</view>
<view class="trust-card">
<text class="trust-number">20+</text>
<text class="trust-label">国家覆盖</text>
</view>
<view class="trust-card">
<text class="trust-number">500+</text>
<text class="trust-label">合作工厂</text>
</view>
<view class="trust-card">
<text class="trust-number">24H</text>
<text class="trust-label">极速发货</text>
</view>
</view>
</view>
<!-- 4步流程 -->
<view class="steps-section">
<text class="section-title">4步开始你的按需定制生意</text>
<view class="steps-list">
<view :class="'step-item ' + (currentStep === 1 ? 'active' : '')" @tap="selectStep" data-step="1">
<view class="step-number">01</view>
<view class="step-info">
<text class="step-title">选择产品</text>
<text class="step-desc">从全球POD货盘中选择热销产品</text>
</view>
</view>
<view :class="'step-item ' + (currentStep === 2 ? 'active' : '')" @tap="selectStep" data-step="2">
<view class="step-number">02</view>
<view class="step-info">
<text class="step-title">上传设计</text>
<text class="step-desc">使用在线设计工具创建专属图案</text>
</view>
</view>
<view :class="'step-item ' + (currentStep === 3 ? 'active' : '')" @tap="selectStep" data-step="3">
<view class="step-number">03</view>
<view class="step-info">
<text class="step-title">在线销售</text>
<text class="step-desc">一键上架到Shopify等电商平台</text>
</view>
</view>
<view :class="'step-item ' + (currentStep === 4 ? 'active' : '')" @tap="selectStep" data-step="4">
<view class="step-number">04</view>
<view class="step-info">
<text class="step-title">生产配送</text>
<text class="step-desc">自动生产全球发货履约无忧</text>
</view>
</view>
</view>
<view class="step-visual">
<view class="step-visual-card">
<view :class="'step-visual-icon step-icon-' + currentStep">
<text class="step-visual-emoji">{{ stepEmoji }}</text>
</view>
<text class="step-visual-text">{{ stepDesc }}</text>
</view>
</view>
</view>
<!-- 全球POD货盘 -->
<view class="catalog-section">
<text class="section-title">全球POD货盘</text>
<text class="section-subtitle">多元化产品选择，满足场景化需求</text>
<scroll-view class="category-tabs" :scroll-x="true" :enhanced="true" :show-scrollbar="false">
<view :class="'cat-tab ' + (activeCategory === item.id ? 'active' : '')" @tap="selectCategory" :data-id="item.id" v-for="(item, index) in categories" :key="index">
{{ item.name }}
</view>
</scroll-view>
<view class="product-preview-grid">
<view class="product-preview-card" @tap="goProductDetail" :data-id="item.id" v-for="(item, index) in previewProducts" :key="index">
<view class="product-preview-img" :style="'background: ' + item.color + ';'">
<text class="product-preview-emoji">{{ item.emoji }}</text>
</view>
<view class="product-preview-info">
<text class="product-preview-name">{{ item.name }}</text>
<text class="product-preview-price">¥{{ item.price }}起</text>
</view>
</view>
</view>
<view class="see-more" @tap="goProducts">
<text>查看更多产品</text>
<text class="arrow">></text>
</view>
</view>
<!-- 平台功能 -->
<view class="features-section">
<text class="section-title">用强大功能，开启盈利快车道</text>
<view class="features-grid">
<view class="feature-card" v-for="(item, index) in features" :key="index">
<view class="feature-icon" :style="'background: ' + item.bgColor + ';'">
<text class="feature-emoji">{{ item.emoji }}</text>
</view>
<text class="feature-title">{{ item.title }}</text>
<text class="feature-desc">{{ item.desc }}</text>
</view>
</view>
</view>
<!-- 为什么选择 -->
<view class="why-section">
<text class="section-title">为什么选择Inkreach?</text>
<view class="why-grid">
<view class="why-card" v-for="(item, index) in reasons" :key="index">
<view class="why-icon">
<text class="why-emoji">{{ item.emoji }}</text>
</view>
<text class="why-title">{{ item.title }}</text>
<text class="why-desc">{{ item.desc }}</text>
</view>
</view>
</view>
<!-- 公司简介 -->
<view class="company-section">
<text class="section-title">公司简介</text>
<view class="company-card">
<view class="company-headline">
<text>用科技重新定义服装供应链</text>
<text>让每一个创意，都能高效抵达全球</text>
</view>
<view class="company-content">
<view class="company-block">
<text class="company-block-title">服务对象与场景</text>
<text class="company-block-text">
服务于数千家跨境独立站、TikTok、TEMU、SHEIN等平台商家，提供从海外生产到末端物流的一站式供应链服务，让电商创业者专注增长，无惧后端履约。
</text>
</view>
<view class="company-block">
<text class="company-block-title">愿景</text>
<text class="company-block-text">
我们坚信，每一个创意都值得被完美呈现。INKREACH将持续深耕智能供应链生态，用科技消除制造壁垒，让全球创业者专注发挥创造力。
</text>
</view>
</view>
<view class="company-stats">
<view class="company-stat" v-for="(item, index) in companyStats" :key="index">
<text class="company-stat-number">{{ item.value }}</text>
<text class="company-stat-label">{{ item.label }}</text>
</view>
</view>
</view>
</view>
<!-- 用户案例 -->
<view class="cases-section">
<text class="section-title">用户案例</text>
<scroll-view class="cases-scroll" :scroll-x="true" :enhanced="true" :show-scrollbar="false">
<view class="case-card" v-for="(item, index) in cases" :key="index">
<view class="case-image" :style="'background: ' + item.bgColor + ';'">
<text class="case-emoji">{{ item.emoji }}</text>
</view>
<view class="case-info">
<text class="case-title">{{ item.title }}</text>
<view class="case-tags">
<view class="case-tag" v-for="(tag, index1) in item.tags" :key="index1">{{ tag }}</view>
</view>
<view class="case-metrics">
<view class="case-metric">
<text class="case-metric-value">{{ item.roi }}</text>
<text class="case-metric-label">ROI</text>
</view>
<view class="case-metric">
<text class="case-metric-value">{{ item.revenue }}</text>
<text class="case-metric-label">月收入</text>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
<!-- 最终CTA -->
<view class="cta-section">
<view class="cta-bg"></view>
<view class="cta-content">
<view class="cta-title">
<text>开始你的POD生意</text>
<text>现在就行动</text>
</view>
<text class="cta-desc">加入成千上万的成功卖家，开始你的定制商品生意</text>
<view class="cta-input-wrap">
<input class="cta-input" placeholder="输入邮箱开始免费试用" placeholder-class="cta-placeholder" />
<view class="cta-btn" @tap="goProducts">立即注册</view>
</view>
</view>
</view>
<!-- 底部 -->
<view class="footer">
<view class="footer-top">
<view class="footer-logo">
<text class="footer-logo-en">inkreach</text>
<text class="footer-logo-cn">印美达</text>
</view>
<text class="footer-slogan">全球POD定制平台，服务中国卖家出海</text>
</view>
<view class="footer-links">
<view class="footer-col">
<text class="footer-col-title">产品</text>
<text class="footer-link">定制卫衣</text>
<text class="footer-link">定制T恤</text>
<text class="footer-link">定制包包</text>
</view>
<view class="footer-col">
<text class="footer-col-title">支持</text>
<text class="footer-link">物流说明</text>
<text class="footer-link">客服帮助</text>
<text class="footer-link">售后客服</text>
</view>
<view class="footer-col">
<text class="footer-col-title">联系</text>
<text class="footer-link">联系我们</text>
<text class="footer-link">官方公众号</text>
</view>
</view>
<view class="footer-bottom">
<text class="footer-copyright">© 2026 INKREACH 印美达全球 All Rights Reserved</text>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
statusBarHeight: 20,
currentStep: 2,
stepEmoji: '🎨',
stepDesc: '使用在线设计工具创建你的专属图案，支持上传图片、添加文字、智能排版',
activeCategory: 'all',
categories: [
{
id: 'all',
name: '全部'
},
{
id: 'tshirt',
name: 'T恤'
},
{
id: 'hoodie',
name: '卫衣'
},
{
id: 'bag',
name: '包包'
},
{
id: 'kids',
name: '童装'
},
{
id: 'home',
name: '家居'
}
],
previewProducts: [
{
id: 1,
name: '180G牛奶丝T恤 DG120',
price: '28.00',
color: '#F5F5F5',
emoji: '👕'
},
{
id: 2,
name: '纯棉连帽卫衣 HD200',
price: '59.00',
color: '#E8E8E8',
emoji: '🧥'
},
{
id: 3,
name: '帆布托特包 BG150',
price: '15.00',
color: '#F0F0F0',
emoji: '👜'
},
{
id: 4,
name: '儿童纯棉T恤 KD100',
price: '22.00',
color: '#F8F8F8',
emoji: '👶'
}
],
features: [
{
id: 1,
title: '设计工具',
desc: '在线设计器，海量模板自由创作',
emoji: '🎨',
bgColor: '#FFF0E5'
},
{
id: 2,
title: '自动化履约',
desc: '订单自动分配工厂生产发货',
emoji: '⚙️',
bgColor: '#E5F5FF'
},
{
id: 3,
title: '全球配送',
desc: '覆盖200+国家地区快速达',
emoji: '🌍',
bgColor: '#F0FFE5'
},
{
id: 4,
title: '店铺集成',
desc: '对接Shopify等主流平台',
emoji: '🔗',
bgColor: '#FFF5E5'
}
],
reasons: [
{
id: 1,
title: '零库存',
desc: '无需囤货按需生产',
emoji: '📦'
},
{
id: 2,
title: '快速生产',
desc: '48小时极速出货',
emoji: '⚡'
},
{
id: 3,
title: '优质产品',
desc: '严格品质管控',
emoji: '✨'
},
{
id: 4,
title: '全球配送',
desc: '覆盖200+国家',
emoji: '🚀'
}
],
companyStats: [
{
value: '5000+',
label: '合作卖家'
},
{
value: '500+',
label: '合作工厂'
},
{
value: '20+',
label: '覆盖国家'
},
{
value: '1000万+',
label: '订单履约'
}
],
cases: [
{
id: 1,
title: '潮牌T恤定制',
tags: ['T恤', '烫画'],
roi: '260%',
revenue: '$12K',
bgColor: '#F5F5F5',
emoji: '👕'
},
{
id: 2,
title: '连帽卫衣品牌',
tags: ['卫衣', '刺绣'],
roi: '300%',
revenue: '$25K',
bgColor: '#E8E8E8',
emoji: '🧥'
},
{
id: 3,
title: '环保帆布包',
tags: ['包包', '丝印'],
roi: '180%',
revenue: '$8K',
bgColor: '#F0F0F0',
emoji: '👜'
}
],
tag: ''
};
},
onLoad() {
const app = getApp();
this.setData({
statusBarHeight: app.globalData.statusBarHeight || 20
});
},
methods: {
selectStep(e) {
const step = e.currentTarget.dataset.step;
const stepData = {
1: {
emoji: '📦',
desc: '从全球POD货盘中选择热销产品，涵盖服装、配饰、家居等多品类'
},
2: {
emoji: '🎨',
desc: '使用在线设计工具创建你的专属图案，支持上传图片、添加文字、智能排版'
},
3: {
emoji: '🛒',
desc: '一键发布到Shopify、TikTok Shop等主流电商平台，自动同步商品信息'
},
4: {
emoji: '🚚',
desc: '订单自动分配至最近工厂生产，全球物流配送直达消费者手中'
}
};
this.setData({
currentStep: step,
stepEmoji: stepData[step].emoji,
stepDesc: stepData[step].desc
});
},
selectCategory(e) {
this.setData({
activeCategory: e.currentTarget.dataset.id
});
},
goProducts() {
uni.switchTab({
url: '/pages/products/products'
});
},
goHome() {
uni.pageScrollTo({
scrollTop: 0,
duration: 300
});
},
goProductDetail(e) {
const id = e.currentTarget.dataset.id;
uni.navigateTo({
url: `/pages/product-detail/product-detail?id=${id}`
});
}
}
};
</script>
<style>
@import './index.css';
</style>
pages/product-detail/product-detail.css
+327
View File
@@ -0,0 +1,327 @@
/* 产品详情页样式 */
.detail-page {
min-height: 100vh;
background: #f5f5f5;
padding-bottom: 140rpx;
}
/* 图片区 */
.detail-images {
position: relative;
background: #ffffff;
}
.detail-swiper {
width: 100%;
height: 750rpx;
}
.swiper-img {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.swiper-emoji {
font-size: 160rpx;
}
.detail-badges {
position: absolute;
top: 24rpx;
left: 24rpx;
display: flex;
flex-direction: column;
gap: 8rpx;
}
.detail-badge {
font-size: 20rpx;
padding: 4rpx 12rpx;
border-radius: 6rpx;
}
/* 产品信息 */
.detail-info-section {
background: #ffffff;
padding: 32rpx 24rpx;
margin-bottom: 16rpx;
}
.detail-header {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.detail-name {
font-size: 36rpx;
font-weight: 600;
color: #1a1a1a;
line-height: 1.4;
}
.detail-code {
font-size: 24rpx;
color: #999;
}
.detail-price-row {
display: flex;
align-items: baseline;
gap: 8rpx;
margin-top: 20rpx;
}
.detail-price {
font-size: 48rpx;
font-weight: 700;
color: #ff6800;
}
.detail-price-unit {
font-size: 24rpx;
color: #ff6800;
}
.detail-price-original {
font-size: 24rpx;
color: #ccc;
text-decoration: line-through;
margin-left: 12rpx;
}
.detail-meta {
display: flex;
justify-content: space-between;
margin-top: 32rpx;
padding-top: 24rpx;
border-top: 1rpx solid #f0f0f0;
}
.meta-item {
text-align: center;
}
.meta-label {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 8rpx;
}
.meta-value {
font-size: 26rpx;
color: #333;
font-weight: 500;
}
/* 通用section */
.detail-section {
background: #ffffff;
padding: 32rpx 24rpx;
margin-bottom: 16rpx;
}
.section-label {
font-size: 30rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 24rpx;
}
/* 颜色选择 */
.color-options {
display: flex;
flex-wrap: wrap;
gap: 20rpx;
}
.color-option {
display: flex;
align-items: center;
gap: 8rpx;
padding: 12rpx 20rpx;
border-radius: 32rpx;
border: 2rpx solid #eee;
background: #fafafa;
}
.color-option.selected {
border-color: #ff6800;
background: #fff0e5;
}
.color-dot {
width: 32rpx;
height: 32rpx;
border-radius: 50%;
border: 2rpx solid #fff;
box-shadow: 0 0 0 1rpx rgba(0, 0, 0, 0.1);
}
.color-name {
font-size: 24rpx;
color: #666;
}
.color-option.selected .color-name {
color: #ff6800;
}
/* 尺码选择 */
.size-options {
display: flex;
flex-wrap: wrap;
gap: 16rpx;
}
.size-option {
min-width: 72rpx;
text-align: center;
padding: 16rpx 24rpx;
font-size: 26rpx;
color: #666;
background: #f5f5f5;
border-radius: 8rpx;
border: 2rpx solid transparent;
}
.size-option.selected {
background: #fff0e5;
color: #ff6800;
border-color: #ff6800;
}
/* 参数表 */
.params-table {
display: flex;
flex-direction: column;
}
.param-row {
display: flex;
padding: 16rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
.param-label {
width: 200rpx;
font-size: 26rpx;
color: #999;
flex-shrink: 0;
}
.param-value {
flex: 1;
font-size: 26rpx;
color: #333;
}
/* 工艺说明 */
.craft-info {
display: flex;
flex-direction: column;
gap: 20rpx;
}
.craft-card {
display: flex;
align-items: center;
gap: 16rpx;
padding: 20rpx;
background: #fafafa;
border-radius: 12rpx;
}
.craft-icon {
width: 64rpx;
height: 64rpx;
border-radius: 12rpx;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.craft-emoji {
font-size: 32rpx;
}
.craft-name {
font-size: 26rpx;
font-weight: 600;
color: #333;
flex-shrink: 0;
width: 120rpx;
}
.craft-desc {
flex: 1;
font-size: 22rpx;
color: #999;
line-height: 1.5;
}
/* 底部操作栏 */
.detail-bottom-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 120rpx;
background: #ffffff;
display: flex;
align-items: center;
padding: 0 24rpx;
gap: 16rpx;
box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.06);
z-index: 100;
}
.bottom-btn-icon {
display: flex;
flex-direction: column;
align-items: center;
gap: 4rpx;
width: 80rpx;
flex-shrink: 0;
}
.bottom-icon {
font-size: 36rpx;
}
.bottom-icon-text {
font-size: 18rpx;
color: #999;
}
.bottom-btn-cart {
flex: 1;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
background: #fff0e5;
color: #ff6800;
font-size: 28rpx;
font-weight: 600;
border-radius: 40rpx;
}
.bottom-btn-design {
flex: 1;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
background: #ff6800;
color: #ffffff;
font-size: 28rpx;
font-weight: 600;
border-radius: 40rpx;
}
pages/product-detail/product-detail.vue
+303
View File
@@ -0,0 +1,303 @@
<template>
<!-- 产品详情页 -->
<view class="detail-page">
<!-- 产品图片区 -->
<view class="detail-images">
<swiper class="detail-swiper" :indicator-dots="true" indicator-color="rgba(255,255,255,0.4)" indicator-active-color="#FF6800" :circular="true">
<swiper-item v-for="(item, index) in productImages" :key="index">
<view class="swiper-img" :style="'background: ' + item.bg + ';'">
<text class="swiper-emoji">{{ item.emoji }}</text>
</view>
</swiper-item>
</swiper>
<view class="detail-badges">
<view class="detail-badge" :style="'background: ' + item.bg + '; color: ' + item.color + ';'" v-for="(item, index) in productTags" :key="index">
{{ item.text }}
</view>
</view>
</view>
<!-- 产品信息 -->
<view class="detail-info-section">
<view class="detail-header">
<text class="detail-name">{{ product.name }}</text>
<text class="detail-code">SKU: {{ product.code }}</text>
</view>
<view class="detail-price-row">
<text class="detail-price">¥{{ product.price }}</text>
<text class="detail-price-unit">起</text>
<text class="detail-price-original" v-if="product.originalPrice">¥{{ product.originalPrice }}</text>
</view>
<view class="detail-meta">
<view class="meta-item">
<text class="meta-label">起订量</text>
<text class="meta-value">{{ product.moq }}件</text>
</view>
<view class="meta-item">
<text class="meta-label">生产周期</text>
<text class="meta-value">{{ product.leadTime }}</text>
</view>
<view class="meta-item">
<text class="meta-label">工艺</text>
<text class="meta-value">{{ product.craft }}</text>
</view>
</view>
</view>
<!-- 颜色选择 -->
<view class="detail-section">
<text class="section-label">颜色选择</text>
<view class="color-options">
<view :class="'color-option ' + (selectedColor === index ? 'selected' : '')" @tap="selectColor" :data-index="index" v-for="(item, index) in colors" :key="index">
<view class="color-dot" :style="'background: ' + item.value + ';'"></view>
<text class="color-name">{{ item.name }}</text>
</view>
</view>
</view>
<!-- 尺码选择 -->
<view class="detail-section">
<text class="section-label">尺码选择</text>
<view class="size-options">
<view :class="'size-option ' + (selectedSize === item ? 'selected' : '')" @tap="selectSize" :data-size="item" v-for="(item, index) in sizes" :key="index">
{{ item }}
</view>
</view>
</view>
<!-- 产品详情 -->
<view class="detail-section">
<text class="section-label">产品参数</text>
<view class="params-table">
<view class="param-row" v-for="(item, index) in productParams" :key="index">
<text class="param-label">{{ item.label }}</text>
<text class="param-value">{{ item.value }}</text>
</view>
</view>
</view>
<!-- 工艺说明 -->
<view class="detail-section">
<text class="section-label">工艺说明</text>
<view class="craft-info">
<view class="craft-card" v-for="(item, index) in crafts" :key="index">
<view class="craft-icon" :style="'background: ' + item.bg + ';'">
<text class="craft-emoji">{{ item.emoji }}</text>
</view>
<text class="craft-name">{{ item.name }}</text>
<text class="craft-desc">{{ item.desc }}</text>
</view>
</view>
</view>
<!-- 底部操作栏 -->
<view class="detail-bottom-bar safe-bottom">
<view class="bottom-btn-icon" @tap="toggleFav">
<text class="bottom-icon">{{ isFav ? '❤️' : '🤍' }}</text>
<text class="bottom-icon-text">收藏</text>
</view>
<view class="bottom-btn-icon" @tap="contactService">
<text class="bottom-icon">💬</text>
<text class="bottom-icon-text">客服</text>
</view>
<view class="bottom-btn-cart" @tap="addToCart">
<text>加入清单</text>
</view>
<view class="bottom-btn-design" @tap="startDesign">
<text>立即定制</text>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
productId: null,
product: {
name: '180G牛奶丝T恤 DG120',
code: 'DG120',
price: '28.00',
originalPrice: '35.00',
moq: 1,
leadTime: '48小时',
craft: '烫画/数码直喷'
},
productImages: [
{
bg: '#F5F5F5',
emoji: '👕'
},
{
bg: '#E8E8E8',
emoji: '👕'
},
{
bg: '#F0F0F0',
emoji: '👕'
}
],
productTags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
},
{
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
},
{
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}
],
colors: [
{
name: '白色',
value: '#FFFFFF'
},
{
name: '黑色',
value: '#1a1a1a'
},
{
name: '灰色',
value: '#999999'
},
{
name: '橙色',
value: '#FF6800'
},
{
name: '藏青',
value: '#1B365D'
},
{
name: '军绿',
value: '#4A5D23'
}
],
selectedColor: 0,
sizes: ['XS', 'S', 'M', 'L', 'XL', '2XL', '3XL'],
selectedSize: 'M',
productParams: [
{
label: '克重',
value: '180g'
},
{
label: '材质',
value: '牛奶丝（改性聚酯纤维）'
},
{
label: '版型',
value: '常规版'
},
{
label: '领型',
value: '圆领'
},
{
label: '袖型',
value: '短袖'
},
{
label: '适用工艺',
value: '烫画、数码直喷、刺绣'
},
{
label: '可售区域',
value: '全球'
},
{
label: '洗涤说明',
value: '冷水机洗，不可漂白'
}
],
crafts: [
{
name: '烫画',
desc: '色彩鲜艳，适合复杂图案，成本低',
emoji: '🎨',
bg: '#FFF0E5'
},
{
name: '数码直喷',
desc: '触感柔软，透气性好，适合大面积印花',
emoji: '🖨️',
bg: '#E5F5FF'
},
{
name: '刺绣',
desc: '质感高级，经久耐用，适合logo',
emoji: '🪡',
bg: '#F0FFE5'
}
],
isFav: false
};
},
onLoad(options) {
if (options.id) {
this.setData({
productId: options.id
});
}
},
methods: {
selectColor(e) {
this.setData({
selectedColor: e.currentTarget.dataset.index
});
},
selectSize(e) {
this.setData({
selectedSize: e.currentTarget.dataset.size
});
},
toggleFav() {
this.setData({
isFav: !this.isFav
});
uni.showToast({
title: this.isFav ? '已收藏' : '已取消',
icon: 'none'
});
},
contactService() {
uni.showToast({
title: '客服功能开发中',
icon: 'none'
});
},
addToCart() {
uni.showToast({
title: '已加入清单',
icon: 'success'
});
},
startDesign() {
uni.showToast({
title: '定制功能开发中',
icon: 'none'
});
}
}
};
</script>
<style>
@import './product-detail.css';
</style>
pages/products/products.css
+500
View File
@@ -0,0 +1,500 @@
/* 产品列表页样式 */
.products-page {
min-height: 100vh;
background: #f5f5f5;
display: flex;
flex-direction: column;
}
/* 搜索栏 */
.search-bar {
display: flex;
align-items: center;
gap: 16rpx;
padding: 16rpx 24rpx;
background: #ffffff;
}
.search-input-wrap {
flex: 1;
display: flex;
align-items: center;
background: #f5f5f5;
border-radius: 32rpx;
padding: 0 24rpx;
height: 64rpx;
}
.search-icon {
font-size: 28rpx;
margin-right: 12rpx;
}
.search-input {
flex: 1;
font-size: 26rpx;
color: #333;
}
.search-placeholder {
color: #ccc;
}
.filter-btn {
display: flex;
align-items: center;
gap: 4rpx;
padding: 0 16rpx;
}
.filter-icon {
font-size: 28rpx;
color: #666;
}
.filter-text {
font-size: 24rpx;
color: #666;
}
/* 国家选择条 */
.country-bar {
white-space: nowrap;
background: #ffffff;
padding: 16rpx 24rpx;
border-bottom: 1rpx solid #eee;
}
.country-item {
display: inline-flex;
align-items: center;
gap: 6rpx;
padding: 8rpx 20rpx;
margin-right: 12rpx;
border-radius: 24rpx;
background: #f5f5f5;
}
.country-item.active {
background: #fff0e5;
}
.country-flag {
font-size: 28rpx;
}
.country-name {
font-size: 22rpx;
color: #666;
}
.country-item.active .country-name {
color: #ff6800;
font-weight: 500;
}
/* 已选筛选标签 */
.active-filters {
display: flex;
align-items: center;
gap: 12rpx;
padding: 12rpx 24rpx;
background: #ffffff;
overflow-x: auto;
white-space: nowrap;
}
.active-filter-tag {
display: inline-flex;
align-items: center;
gap: 8rpx;
background: #f2f2f2;
border-radius: 8rpx;
padding: 6rpx 16rpx;
font-size: 22rpx;
color: #666;
flex-shrink: 0;
}
.filter-remove {
font-size: 20rpx;
color: #ccc;
}
.clear-all {
font-size: 22rpx;
color: #ff6800;
flex-shrink: 0;
}
/* 主体内容 */
.content-body {
flex: 1;
display: flex;
overflow: hidden;
}
/* 左侧分类侧边栏 */
.sidebar {
width: 180rpx;
background: #ffffff;
border-right: 1rpx solid #eee;
height: 100%;
flex-shrink: 0;
}
.sidebar-item {
position: relative;
padding: 28rpx 20rpx;
font-size: 24rpx;
color: #666;
text-align: center;
}
.sidebar-item.active {
background: #f5f5f5;
color: #ff6800;
font-weight: 600;
}
.sidebar-indicator {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 6rpx;
height: 32rpx;
background: #ff6800;
border-radius: 0 4rpx 4rpx 0;
}
.sidebar-promo {
margin: 24rpx 16rpx;
padding: 20rpx 12rpx;
background: linear-gradient(135deg, #ff6800 0%, #ff8c40 100%);
border-radius: 12rpx;
text-align: center;
}
.promo-title {
font-size: 24rpx;
font-weight: 700;
color: #fff;
display: block;
}
.promo-desc {
font-size: 20rpx;
color: rgba(255, 255, 255, 0.9);
display: block;
margin-top: 4rpx;
}
/* 右侧产品列表区 */
.product-list-area {
flex: 1;
height: 100%;
}
/* 子分类 */
.sub-categories {
display: flex;
flex-wrap: wrap;
gap: 12rpx;
padding: 16rpx 20rpx;
background: #ffffff;
}
.sub-cat-item {
font-size: 22rpx;
padding: 8rpx 20rpx;
border-radius: 24rpx;
background: #f5f5f5;
color: #666;
}
.sub-cat-item.active {
background: #ff6800;
color: #fff;
}
/* 产品网格 */
.product-grid {
display: flex;
flex-wrap: wrap;
gap: 16rpx;
padding: 16rpx 20rpx;
}
.product-card {
width: calc(50% - 8rpx);
background: #ffffff;
border-radius: 12rpx;
overflow: hidden;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
}
.product-img {
width: 100%;
height: 300rpx;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.product-emoji {
font-size: 80rpx;
}
.product-badges {
position: absolute;
top: 12rpx;
left: 12rpx;
display: flex;
flex-direction: column;
gap: 4rpx;
}
.product-badge {
font-size: 18rpx;
padding: 2rpx 8rpx;
border-radius: 4rpx;
}
.product-info {
padding: 16rpx;
}
.product-name {
font-size: 24rpx;
color: #333;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.product-bottom {
margin-top: 8rpx;
display: flex;
align-items: center;
justify-content: space-between;
}
.product-price {
font-size: 30rpx;
font-weight: 700;
color: #ff6800;
}
.product-price-unit {
font-size: 20rpx;
font-weight: 400;
margin-left: 2rpx;
}
/* 分页 */
.pagination {
padding: 24rpx 20rpx;
text-align: center;
}
.page-info {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 16rpx;
}
.page-controls {
display: flex;
align-items: center;
justify-content: center;
gap: 8rpx;
}
.page-btn {
padding: 8rpx 20rpx;
font-size: 22rpx;
color: #666;
background: #fff;
border-radius: 8rpx;
border: 1rpx solid #eee;
}
.page-btn.disabled {
color: #ccc;
}
.page-num {
min-width: 48rpx;
height: 48rpx;
line-height: 48rpx;
text-align: center;
font-size: 24rpx;
color: #666;
background: #fff;
border-radius: 8rpx;
border: 1rpx solid #eee;
}
.page-num.active {
background: #ff6800;
color: #fff;
border-color: #ff6800;
}
.page-size {
margin-top: 12rpx;
font-size: 22rpx;
color: #999;
}
.loading-more {
padding: 24rpx;
text-align: center;
font-size: 24rpx;
color: #999;
}
/* 筛选弹窗 */
.filter-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 1000;
opacity: 0;
visibility: hidden;
transition: all 0.3s;
}
.filter-overlay.show {
opacity: 1;
visibility: visible;
}
.filter-drawer {
position: fixed;
top: 0;
right: 0;
width: 80%;
height: 100%;
background: #ffffff;
z-index: 1001;
transform: translateX(100%);
transition: transform 0.3s;
display: flex;
flex-direction: column;
}
.filter-drawer.show {
transform: translateX(0);
}
.filter-drawer-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 32rpx 24rpx;
border-bottom: 1rpx solid #eee;
}
.filter-drawer-title {
font-size: 32rpx;
font-weight: 600;
color: #333;
}
.filter-drawer-close {
font-size: 32rpx;
color: #999;
}
.filter-drawer-body {
flex: 1;
padding: 24rpx;
}
.filter-group {
margin-bottom: 32rpx;
}
.filter-group-title {
font-size: 28rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 16rpx;
}
.filter-options {
display: flex;
flex-wrap: wrap;
gap: 12rpx;
}
.filter-option {
padding: 12rpx 24rpx;
font-size: 24rpx;
color: #666;
background: #f5f5f5;
border-radius: 8rpx;
border: 2rpx solid transparent;
}
.filter-option.selected {
background: #fff0e5;
color: #ff6800;
border-color: #ff6800;
}
.filter-price-range {
display: flex;
align-items: center;
gap: 16rpx;
}
.price-input {
flex: 1;
height: 64rpx;
background: #f5f5f5;
border-radius: 8rpx;
padding: 0 20rpx;
font-size: 24rpx;
}
.price-divider {
color: #ccc;
}
.filter-drawer-footer {
display: flex;
gap: 16rpx;
padding: 24rpx;
border-top: 1rpx solid #eee;
}
.filter-reset {
flex: 1;
text-align: center;
padding: 24rpx;
font-size: 28rpx;
color: #666;
background: #f5f5f5;
border-radius: 12rpx;
}
.filter-confirm {
flex: 1;
text-align: center;
padding: 24rpx;
font-size: 28rpx;
color: #fff;
background: #ff6800;
border-radius: 12rpx;
}
pages/products/products.vue
+760
View File
@@ -0,0 +1,760 @@
<template>
<!-- 产品列表页 - 印美达 Inkreach -->
<view class="products-page">
<!-- 搜索栏 -->
<view class="search-bar">
<view class="search-input-wrap">
<text class="search-icon">🔍</text>
<input class="search-input" placeholder="搜索商品" placeholder-class="search-placeholder" @input="onSearchInput" :value="searchKeyword" />
</view>
<view class="filter-btn" @tap="toggleFilter">
<text class="filter-icon">⚙</text>
<text class="filter-text">筛选</text>
</view>
</view>
<!-- 国家选择条 -->
<scroll-view class="country-bar" :scroll-x="true" :enhanced="true" :show-scrollbar="false">
<view :class="'country-item ' + (selectedCountry === item.id ? 'active' : '')" @tap="selectCountry" :data-id="item.id" v-for="(item, index) in countries" :key="index">
<text class="country-flag">{{ item.flag }}</text>
<text class="country-name">{{ item.name }}</text>
</view>
</scroll-view>
<!-- 已选筛选标签 -->
<view class="active-filters" v-if="activeFilters.length > 0">
<view class="active-filter-tag" v-for="(item, index) in activeFilters" :key="index">
<text>{{ item.label }}</text>
<text class="filter-remove" @tap="removeFilter" :data-key="item.key">✕</text>
</view>
<view class="clear-all" @tap="clearAllFilters">清除全部</view>
</view>
<!-- 主体内容：侧边栏 + 产品列表 -->
<view class="content-body">
<!-- 左侧分类侧边栏 -->
<scroll-view class="sidebar" :scroll-y="true">
<view
:class="'sidebar-item ' + (activeCategory === item.id ? 'active' : '')"
@tap="selectCategory"
:data-id="item.id"
v-for="(item, index) in categories"
:key="index"
>
<view class="sidebar-indicator" v-if="activeCategory === item.id"></view>
<text>{{ item.name }}</text>
</view>
<!-- 促销Banner -->
<view class="sidebar-promo">
<text class="promo-title">0元拿样</text>
<text class="promo-desc">全国包邮</text>
</view>
</scroll-view>
<!-- 右侧产品列表 -->
<scroll-view class="product-list-area" :scroll-y="true" @scrolltolower="loadMore">
<!-- 子分类 -->
<view class="sub-categories" v-if="subCategories.length > 0">
<view
:class="'sub-cat-item ' + (activeSubCategory === item.id ? 'active' : '')"
@tap="selectSubCategory"
:data-id="item.id"
v-for="(item, index) in subCategories"
:key="index"
>
{{ item.name }}
</view>
</view>
<!-- 产品网格 -->
<view class="product-grid">
<view class="product-card" @tap="goDetail" :data-id="item.id" v-for="(item, index) in products" :key="index">
<view class="product-img" :style="'background: ' + item.bgColor + ';'">
<text class="product-emoji">{{ item.emoji }}</text>
<view class="product-badges">
<view class="product-badge" :style="'background: ' + tag.bg + '; color: ' + tag.color + ';'" v-for="(tag, index1) in item.tags" :key="index1">
{{ tag.text }}
</view>
</view>
</view>
<view class="product-info">
<text class="product-name">{{ item.name }}</text>
<view class="product-bottom">
<text class="product-price">
¥{{ item.price }}
<text class="product-price-unit">起</text>
</text>
</view>
</view>
</view>
</view>
<!-- 分页 -->
<view class="pagination">
<text class="page-info">显示 {{ pagination.start }}-{{ pagination.end }} 共 {{ pagination.total }} 个产品</text>
<view class="page-controls">
<view :class="'page-btn ' + (pagination.current === 1 ? 'disabled' : '')" @tap="changePage" data-action="prev">上一页</view>
<view
:class="'page-num ' + (pagination.current === item ? 'active' : '')"
@tap="goToPage"
:data-page="item"
v-for="(item, index) in pageNumbers"
:key="index"
>
{{ item }}
</view>
<view :class="'page-btn ' + (pagination.current === pagination.totalPages ? 'disabled' : '')" @tap="changePage" data-action="next">下一页</view>
</view>
<view class="page-size">
<text>{{ pagination.pageSize }}/页</text>
</view>
</view>
<!-- 加载更多提示 -->
<view class="loading-more" v-if="loadingMore">
<text>加载中...</text>
</view>
</scroll-view>
</view>
<!-- 筛选弹窗 -->
<view :class="'filter-overlay ' + (showFilter ? 'show' : '')" @tap="closeFilter"></view>
<view :class="'filter-drawer ' + (showFilter ? 'show' : '')">
<view class="filter-drawer-header">
<text class="filter-drawer-title">筛选条件</text>
<text class="filter-drawer-close" @tap="closeFilter">✕</text>
</view>
<scroll-view class="filter-drawer-body" :scroll-y="true">
<!-- 工艺 -->
<view class="filter-group">
<text class="filter-group-title">工艺</text>
<view class="filter-options">
<view
:class="'filter-option ' + (selectedCrafts.indexOf(item) > -1 ? 'selected' : '')"
@tap="toggleCraft"
:data-value="item"
v-for="(item, index) in craftOptions"
:key="index"
>
{{ item }}
</view>
</view>
</view>
<!-- 材质 -->
<view class="filter-group">
<text class="filter-group-title">材质</text>
<view class="filter-options">
<view
:class="'filter-option ' + (selectedMaterials.indexOf(item) > -1 ? 'selected' : '')"
@tap="toggleMaterial"
:data-value="item"
v-for="(item, index) in materialOptions"
:key="index"
>
{{ item }}
</view>
</view>
</view>
<!-- 价格区间 -->
<view class="filter-group">
<text class="filter-group-title">价格区间</text>
<view class="filter-price-range">
<input class="price-input" placeholder="最低价" type="number" />
<text class="price-divider">-</text>
<input class="price-input" placeholder="最高价" type="number" />
</view>
</view>
</scroll-view>
<view class="filter-drawer-footer">
<view class="filter-reset" @tap="resetFilters">重置</view>
<view class="filter-confirm" @tap="confirmFilters">确定</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
searchKeyword: '',
selectedCountry: 'us',
countries: [
{
id: 'us',
name: '美国',
flag: '🇺🇸'
},
{
id: 'uk',
name: '英国',
flag: '🇬🇧'
},
{
id: 'jp',
name: '日本',
flag: '🇯🇵'
},
{
id: 'mx',
name: '墨西哥',
flag: '🇲🇽'
},
{
id: 'br',
name: '巴西',
flag: '🇧🇷'
},
{
id: 'ae',
name: '中东',
flag: '🇦🇪'
},
{
id: 'pl',
name: '波兰',
flag: '🇵🇱'
},
{
id: 'es',
name: '西班牙',
flag: '🇪🇸'
},
{
id: 'de',
name: '德国',
flag: '🇩🇪'
},
{
id: 'it',
name: '意大利',
flag: '🇮🇹'
},
{
id: 'fr',
name: '法国',
flag: '🇫🇷'
},
{
id: 'ca',
name: '加拿大',
flag: '🇨🇦'
},
{
id: 'au',
name: '澳大利亚',
flag: '🇦🇺'
},
{
id: 'kr',
name: '韩国',
flag: '🇰🇷'
}
],
activeCategory: 'all',
categories: [
{
id: 'all',
name: '全部商品'
},
{
id: 'men',
name: '男士服装'
},
{
id: 'women',
name: '女士服装'
},
{
id: 'kids',
name: '儿童服装'
},
{
id: 'home',
name: '家居配饰'
},
{
id: 'bag',
name: '包包配饰'
}
],
subCategories: [],
activeSubCategory: '',
activeFilters: [
{
key: 'country',
label: '美国'
},
{
key: 'craft',
label: '烫画'
},
{
key: 'material',
label: '棉麻'
}
],
showFilter: false,
selectedCrafts: ['烫画'],
selectedMaterials: ['棉麻'],
craftOptions: ['烫画', '刺绣', '丝印', '数码直喷', '热转印'],
materialOptions: ['棉麻', '纯棉', '涤纶', '混纺', '牛奶丝'],
pagination: {
start: 1,
end: 10,
total: 96,
current: 1,
pageSize: 10,
totalPages: 10
},
pageNumbers: [1, 2, 3, 4, 5],
loadingMore: false,
products: [
{
id: 1,
name: '180G牛奶丝T恤 DG120',
price: '28.00',
bgColor: '#F5F5F5',
emoji: '👕',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
},
{
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}
]
},
{
id: 2,
name: '纯棉连帽卫衣 HD200',
price: '59.00',
bgColor: '#E8E8E8',
emoji: '🧥',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
},
{
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}
]
},
{
id: 3,
name: '260G重装T恤 TS260',
price: '35.00',
bgColor: '#F0F0F0',
emoji: '👕',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}
]
},
{
id: 4,
name: '精梳棉Polo衫 PL100',
price: '45.00',
bgColor: '#F8F8F8',
emoji: '👔',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
},
{
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}
]
},
{
id: 5,
name: '抓绒卫裤 PT150',
price: '42.00',
bgColor: '#F5F5F5',
emoji: '👖',
tags: [
{
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}
]
},
{
id: 6,
name: '运动速干T恤 ST200',
price: '32.00',
bgColor: '#E8E8E8',
emoji: '👕',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}
]
},
{
id: 7,
name: '纯棉背包 BP300',
price: '25.00',
bgColor: '#F0F0F0',
emoji: '🎒',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
},
{
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}
]
},
{
id: 8,
name: '儿童纯棉T恤 KD100',
price: '22.00',
bgColor: '#F8F8F8',
emoji: '👶',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}
]
},
{
id: 9,
name: '帆布托特包 BG150',
price: '15.00',
bgColor: '#F5F5F5',
emoji: '👜',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
},
{
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}
]
},
{
id: 10,
name: '针织开衫 CR180',
price: '55.00',
bgColor: '#E8E8E8',
emoji: '🧶',
tags: [
{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}
]
}
],
tag: {
bg: '',
color: '',
text: ''
}
};
},
onLoad() {
this.loadSubCategories('all');
},
methods: {
loadSubCategories(catId) {
const subCatMap = {
all: [],
men: [
{
id: 'tops',
name: '上装'
},
{
id: 'hoodie',
name: '卫衣'
},
{
id: 'tshirt',
name: 'T恤'
},
{
id: 'shirt',
name: '衬衫'
},
{
id: 'pants',
name: '裤装'
},
{
id: 'underwear',
name: '内衣'
}
],
women: [
{
id: 'dress',
name: '连衣裙'
},
{
id: 'tops',
name: '上装'
},
{
id: 'bottoms',
name: '下装'
}
],
kids: [
{
id: 'baby',
name: '婴儿装'
},
{
id: 'kids',
name: '儿童装'
}
],
home: [
{
id: 'blanket',
name: '毛毯'
},
{
id: 'pillow',
name: '抱枕'
}
],
bag: [
{
id: 'tote',
name: '托特包'
},
{
id: 'backpack',
name: '背包'
}
]
};
this.setData({
subCategories: subCatMap[catId] || [],
activeSubCategory: subCatMap[catId]?.[0]?.id || ''
});
},
onSearchInput(e) {
this.setData({
searchKeyword: e.detail.value
});
},
selectCountry(e) {
const id = e.currentTarget.dataset.id;
const country = this.countries.find((c) => c.id === id);
const filters = this.activeFilters.filter((f) => f.key !== 'country');
filters.push({
key: 'country',
label: country.name
});
this.setData({
selectedCountry: id,
activeFilters: filters
});
},
selectCategory(e) {
const id = e.currentTarget.dataset.id;
this.setData({
activeCategory: id
});
this.loadSubCategories(id);
},
selectSubCategory(e) {
this.setData({
activeSubCategory: e.currentTarget.dataset.id
});
},
toggleFilter() {
this.setData({
showFilter: !this.showFilter
});
},
closeFilter() {
this.setData({
showFilter: false
});
},
toggleCraft(e) {
const value = e.currentTarget.dataset.value;
let crafts = [...this.selectedCrafts];
const idx = crafts.indexOf(value);
if (idx > -1) {
crafts.splice(idx, 1);
} else {
crafts.push(value);
}
this.setData({
selectedCrafts: crafts
});
},
toggleMaterial(e) {
const value = e.currentTarget.dataset.value;
let materials = [...this.selectedMaterials];
const idx = materials.indexOf(value);
if (idx > -1) {
materials.splice(idx, 1);
} else {
materials.push(value);
}
this.setData({
selectedMaterials: materials
});
},
removeFilter(e) {
const key = e.currentTarget.dataset.key;
const filters = this.activeFilters.filter((f) => f.key !== key);
this.setData({
activeFilters: filters
});
},
clearAllFilters() {
this.setData({
activeFilters: []
});
},
resetFilters() {
this.setData({
selectedCrafts: [],
selectedMaterials: []
});
},
confirmFilters() {
const filters = [];
if (this.selectedCrafts.length > 0) {
filters.push({
key: 'craft',
label: this.selectedCrafts.join(',')
});
}
if (this.selectedMaterials.length > 0) {
filters.push({
key: 'material',
label: this.selectedMaterials.join(',')
});
}
this.setData({
activeFilters: filters,
showFilter: false
});
},
goDetail(e) {
const id = e.currentTarget.dataset.id;
uni.navigateTo({
url: `/pages/product-detail/product-detail?id=${id}`
});
},
changePage(e) {
const action = e.currentTarget.dataset.action;
let current = this.pagination.current;
if (action === 'prev' && current > 1) {
current--;
}
if (action === 'next' && current < this.pagination.totalPages) {
current++;
}
this.updatePagination(current);
},
goToPage(e) {
this.updatePagination(e.currentTarget.dataset.page);
},
updatePagination(current) {
const total = this.pagination.total;
const pageSize = this.pagination.pageSize;
const totalPages = Math.ceil(total / pageSize);
let pageNumbers = [];
for (let i = Math.max(1, current - 2); i <= Math.min(totalPages, current + 2); i++) {
pageNumbers.push(i);
}
this.setData({
pagination: {
...this.pagination,
current,
start: (current - 1) * pageSize + 1,
end: Math.min(current * pageSize, total),
totalPages
},
pageNumbers
});
},
loadMore() {
if (this.loadingMore) {
return;
}
this.setData({
loadingMore: true
});
setTimeout(() => {
this.setData({
loadingMore: false
});
}, 1000);
}
}
};
</script>
<style>
@import './products.css';
</style>
sitemap.json
+9
View File
@@ -0,0 +1,9 @@
{
"desc": "印美达 Inkreach 小程序",
"rules": [
{
"action": "allow",
"page": "*"
}
]
}
transform.log
+40
View File
@@ -0,0 +1,40 @@
开始转换……
小程序路径: C:\gs\project\官网小程序demo\官网小程序demo
搜索到25个文件(含目录)，耗时：3ms
开始分析文件
分析文件信息完成，共5组数据
开始转换文件组为vue文件
开始二次遍历及生成vue文件
write pages.json success!
write manifest.json success!
write main.js success!
write package.json success!
统计信息：
Component数量: 0
Page数量: 3
支付api数量: 0
登录api数量: 0
chooseMedia数量: 0
getLocation数量: 0
getRelationNodes数量: 0
<ad/>数量: 0
<map/>数量: 0
<video/>数量: 0
Vant组件: ， 数量：0
项目转换完成！
用时: 1.753s
工具版本：v2.2.6
在该小程序项目的同级目录可以看到_uni结尾的项目，即是转换好的uniapp项目，相关日志在该目录里。
使用说明：
1.因各种原因，本工具并非100%完美转换！部分语法仍需人工处理！
2.工具转换原理及说明文档参考：https://l4rz4zwpx7.k.topthink.com/@kmrvzg72lx/
3.如遇运行报错，请添加QQ群(五群：536178289)带图反馈或https://github.com/zhangdaren/miniprogram-to-uniapp提交Issue！
4.转换后请查阅_uni目录或_uni-cli目录里的 README.md 和 transform.log
uni.scss
+76
View File
@@ -0,0 +1,76 @@
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;
/* 文字基本颜色 */
$uni-text-color:#333;//基本色
$uni-text-color-inverse:#fff;//反色
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable:#c0c0c0;
/* 背景颜色 */
$uni-bg-color:#ffffff;
$uni-bg-color-grey:#f8f8f8;
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
/* 边框颜色 */
$uni-border-color:#c8c7cc;
/* 尺寸变量 */
/* 文字尺寸 */
$uni-font-size-sm:12px;
$uni-font-size-base:14px;
$uni-font-size-lg:16;
/* 图片尺寸 */
$uni-img-size-sm:20px;
$uni-img-size-base:26px;
$uni-img-size-lg:40px;
/* Border Radius */
$uni-border-radius-sm: 2px;
$uni-border-radius-base: 3px;
$uni-border-radius-lg: 6px;
$uni-border-radius-circle: 50%;
/* 水平间距 */
$uni-spacing-row-sm: 5px;
$uni-spacing-row-base: 10px;
$uni-spacing-row-lg: 15px;
/* 垂直间距 */
$uni-spacing-col-sm: 4px;
$uni-spacing-col-base: 8px;
$uni-spacing-col-lg: 12px;
/* 透明度 */
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
/* 文章场景相关 */
$uni-color-title: #2C405A; // 文章标题颜色
$uni-font-size-title:20px;
$uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:26px;
$uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:15px;
uni_modules/mp-html/README.md
+193
View File
@@ -0,0 +1,193 @@
## 为减小组件包的大小，默认组件包中不包含编辑、latex 公式等扩展功能，需要使用扩展功能的请参考下方的 插件扩展 栏的说明
## 功能介绍
- 全端支持（含 `v3、NVUE`）
- 支持丰富的标签（包括 `table`、`video`、`svg` 等）
- 支持丰富的事件效果（自动预览图片、链接处理等）
- 支持设置占位图（加载中、出错时、预览时）
- 支持锚点跳转、长按复制等丰富功能
- 支持大部分 *html* 实体
- 丰富的插件（关键词搜索、内容编辑、`latex` 公式等）
- 效率高、容错性强且轻量化
查看 [功能介绍](https://jin-yufeng.gitee.io/mp-html/#/overview/feature) 了解更多
## 使用方法
- `uni_modules` 方式
1. 点击右上角的 `使用 HBuilder X 导入插件` 按钮直接导入项目或点击 `下载插件 ZIP` 按钮下载插件包并解压到项目的 `uni_modules/mp-html` 目录下
2. 在需要使用页面的 `(n)vue` 文件中添加
```html
<!-- 不需要引入，可直接使用 -->
<mp-html :content="html" />
```
```javascript
export default {
data() {
return {
html: '<div>Hello World!</div>'
}
}
}
```
3. 需要更新版本时在 `HBuilder X` 中右键 `uni_modules/mp-html` 目录选择 `从插件市场更新` 即可
- 源码方式
1. 从 [github](https://github.com/jin-yufeng/mp-html/tree/master/dist/uni-app) 或 [gitee](https://gitee.com/jin-yufeng/mp-html/tree/master/dist/uni-app) 下载源码
插件市场的 **非 uni_modules 版本** 无法更新，不建议从插件市场获取
2. 在需要使用页面的 `(n)vue` 文件中添加
```html
<mp-html :content="html" />
```
```javascript
import mpHtml from '@/components/mp-html/mp-html'
export default {
// HBuilderX 2.5.5+ 可以通过 easycom 自动引入
components: {
mpHtml
},
data() {
return {
html: '<div>Hello World!</div>'
}
}
}
```
- npm 方式
1. 在项目根目录下执行
```bash
npm install mp-html
```
2. 在需要使用页面的 `(n)vue` 文件中添加
```html
<mp-html :content="html" />
```
```javascript
import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
export default {
// 不可省略
components: {
mpHtml
},
data() {
return {
html: '<div>Hello World!</div>'
}
}
}
```
3. 需要更新版本时执行以下命令即可
```bash
npm update mp-html
```
使用 *cli* 方式运行的项目，通过 *npm* 方式引入时，需要在 *vue.config.js* 中配置 *transpileDependencies*，详情可见 [#330](https://github.com/jin-yufeng/mp-html/issues/330#issuecomment-913617687)
如果在 **nvue** 中使用还要将 `dist/uni-app/static` 目录下的内容拷贝到项目的 `static` 目录下，否则无法运行
查看 [快速开始](https://jin-yufeng.gitee.io/mp-html/#/overview/quickstart) 了解更多
## 组件属性
| 属性 | 类型 | 默认值 | 说明 |
|:---:|:---:|:---:|---|
| container-style | String | | 容器的样式（[2.1.0+](https://jin-yufeng.gitee.io/mp-html/#/changelog/changelog#v210)） |
| content | String | | 用于渲染的 html 字符串 |
| copy-link | Boolean | true | 是否允许外部链接被点击时自动复制 |
| domain | String | | 主域名（用于链接拼接） |
| error-img | String | | 图片出错时的占位图链接 |
| lazy-load | Boolean | false | 是否开启图片懒加载 |
| loading-img | String | | 图片加载过程中的占位图链接 |
| pause-video | Boolean | true | 是否在播放一个视频时自动暂停其他视频 |
| preview-img | Boolean | true | 是否允许图片被点击时自动预览 |
| scroll-table | Boolean | false | 是否给每个表格添加一个滚动层使其能单独横向滚动 |
| selectable | Boolean | false | 是否开启文本长按复制 |
| set-title | Boolean | true | 是否将 title 标签的内容设置到页面标题 |
| show-img-menu | Boolean | true | 是否允许图片被长按时显示菜单 |
| tag-style | Object | | 设置标签的默认样式 |
| use-anchor | Boolean | false | 是否使用锚点链接 |
查看 [属性](https://jin-yufeng.gitee.io/mp-html/#/basic/prop) 了解更多
## 组件事件
| 名称 | 触发时机 |
|:---:|---|
| load | dom 树加载完毕时 |
| ready | 图片加载完毕时 |
| error | 发生渲染错误时 |
| imgtap | 图片被点击时 |
| linktap | 链接被点击时 |
| play | 音视频播放时 |
查看 [事件](https://jin-yufeng.gitee.io/mp-html/#/basic/event) 了解更多
## api
组件实例上提供了一些 `api` 方法可供调用
| 名称 | 作用 |
|:---:|---|
| in | 将锚点跳转的范围限定在一个 scroll-view 内 |
| navigateTo | 锚点跳转 |
| getText | 获取文本内容 |
| getRect | 获取富文本内容的位置和大小 |
| setContent | 设置富文本内容 |
| imgList | 获取所有图片的数组 |
| pauseMedia | 暂停播放音视频（[2.2.2+](https://jin-yufeng.gitee.io/mp-html/#/changelog/changelog#v222)） |
| setPlaybackRate | 设置音视频播放速率（[2.4.0+](https://jin-yufeng.gitee.io/mp-html/#/changelog/changelog#v240)） |
查看 [api](https://jin-yufeng.gitee.io/mp-html/#/advanced/api) 了解更多
## 插件扩展
除基本功能外，本组件还提供了丰富的扩展，可按照需要选用
| 名称 | 作用 |
|:---:|---|
| audio | 音乐播放器 |
| editable | 富文本 **编辑**（[示例项目](https://mp-html.oss-cn-hangzhou.aliyuncs.com/editable.zip)） |
| emoji | 解析 emoji |
| highlight | 代码块高亮显示 |
| markdown | 渲染 markdown |
| search | 关键词搜索 |
| style | 匹配 style 标签中的样式 |
| txv-video | 使用腾讯视频 |
| img-cache | 图片缓存 by [@PentaTea](https://github.com/PentaTea) |
| latex | 渲染 latex 公式 by [@Zeng-J](https://github.com/Zeng-J) |
从插件市场导入的包中 **不含有** 扩展插件，使用插件需通过微信小程序 `富文本插件` 获取或参考以下方法进行打包：
1. 获取完整组件包
```bash
npm install mp-html
```
2. 编辑 `tools/config.js` 中的 `plugins` 项，选择需要的插件
3. 生成新的组件包
在 `node_modules/mp-html` 目录下执行
```bash
npm install
npm run build:uni-app
```
4. 拷贝 `dist/uni-app` 中的内容到项目根目录
查看 [插件](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin) 了解更多
## 关于 nvue
`nvue` 使用原生渲染，不支持部分 `css` 样式，为实现和 `html` 相同的效果，组件内部通过 `web-view` 进行渲染，性能上差于原生，根据 `weex` 官方建议，`web` 标签仅应用在非常规的降级场景。因此，如果通过原生的方式（如 `richtext`）能够满足需要，则不建议使用本组件，如果有较多的富文本内容，则可以直接使用 `vue` 页面
由于渲染方式与其他端不同，有以下限制：
1. 不支持 `lazy-load` 属性
2. 视频不支持全屏播放
3. 如果在 `flex-direction: row` 的容器中使用，需要给组件设置宽度或设置 `flex: 1` 占满剩余宽度
纯 `nvue` 模式下，[此问题](https://ask.dcloud.net.cn/question/119678) 修复前，不支持通过 `uni_modules` 引入，需要本地引入（将 [dist/uni-app](https://github.com/jin-yufeng/mp-html/tree/master/dist/uni-app) 中的内容拷贝到项目根目录下）
## 立即体验
![富文本插件](https://mp-html.oss-cn-hangzhou.aliyuncs.com/qrcode.jpg)
## 问题反馈
遇到问题时，请先查阅 [常见问题](https://jin-yufeng.gitee.io/mp-html/#/question/faq) 和 [issue](https://github.com/jin-yufeng/mp-html/issues) 中是否已有相同的问题
可通过 [issue](https://github.com/jin-yufeng/mp-html/issues/new/choose) 、插件问答或发送邮件到 [mp_html@126.com](mailto:mp_html@126.com) 提问，不建议在评论区提问（不方便回复）
提问请严格按照 [issue 模板](https://github.com/jin-yufeng/mp-html/issues/new/choose) ，描述清楚使用环境、`html` 内容或可复现的 `demo` 项目以及复现方式，对于 **描述不清**、**无法复现** 或重复的问题将不予回复
欢迎加入 `QQ` 交流群：
群1（已满）：`699734691`
群2：`778239129`
查看 [问题反馈](https://jin-yufeng.gitee.io/mp-html/#/question/feedback) 了解更多
uni_modules/mp-html/changelog.md
+129
View File
@@ -0,0 +1,129 @@
## v2.4.2（2023-05-14）
1. `A` `editable` 插件支持修改文字颜色 [详细](https://github.com/jin-yufeng/mp-html/issues/254)
2. `F` 修复了 `svg` 中有 `style` 不生效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/505)
3. `F` 修复了使用旧版编译器可能报错 `Bad attr nodes` 的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/472)
4. `F` 修复了 `app` 端可能出现无法读取 `lazyLoad` 的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/513)
5. `F` 修复了 `editable` 插件在点击换图时未拼接 `domain` 的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/497) by [@TwoKe945](https://github.com/TwoKe945)
6. `F` 修复了 `latex` 插件部分情况下不显示的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/515)
7. `F` 修复了 `editable` 插件点击音视频时其他标签框不消失的问题
## v2.4.1（2022-12-25）
1. `F` 修复了没有图片时 `ready` 事件可能不触发的问题
2. `F` 修复了加载过程中可能出现 `Root label not found` 错误的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/470)
3. `F` 修复了 `audio` 插件退出页面可能会报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/457)
4. `F` 修复了 `vue3` 运行到 `app` 在 `HBuilder X 3.6.10` 以上报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/480)
5. `F` 修复了 `nvue` 端链接中包含 `%22` 时可能无法显示的问题
6. `F` 修复了 `vue3` 使用 `highlight` 插件可能报错的问题
## v2.4.0（2022-08-27）
1. `A` 增加了 [setPlaybackRate](https://jin-yufeng.gitee.io/mp-html/#/advanced/api#setPlaybackRate) 的 `api`，可以设置音视频的播放速率 [详细](https://github.com/jin-yufeng/mp-html/issues/452)
2. `A` 示例小程序代码开源 [详细](https://github.com/jin-yufeng/mp-html-demo)
3. `U` 优化 `ready` 事件触发时机，未设置懒加载的情况下基本可以准确触发 [详细](https://github.com/jin-yufeng/mp-html/issues/195)
4. `U` `highlight` 插件在编辑状态下不进行高亮处理，便于编辑
5. `F` 修复了 `flex` 布局下图片大小可能不正确的问题
6. `F` 修复了 `selectable` 属性没有设置 `force` 也可能出现渲染异常的问题
7. `F` 修复了表格中的图片大小可能不正确的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/448)
8. `F` 修复了含有合并单元格的表格可能无法设置竖直对齐的问题
9. `F` 修复了 `editable` 插件在 `scroll-view` 中使用时工具条位置可能不正确的问题
10. `F` 修复了 `vue3` 使用 [search](advanced/plugin#search) 插件可能导致错误换行的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/449)
## v2.3.2（2022-08-13）
1. `A` 增加 [latex](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#latex) 插件，可以渲染数学公式 [详细](https://github.com/jin-yufeng/mp-html/pull/447) by [@Zeng-J](https://github.com/Zeng-J)
2. `U` 优化根节点下有很多标签的长内容渲染速度
3. `U` `highlight` 插件适配 `lang-xxx` 格式
4. `F` 修复了 `table` 标签设置 `border` 属性后可能无法修改边框样式的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/439) by [@zouxingjie](https://github.com/zouxingjie)
5. `F` 修复了 `editable` 插件输入连续空格无效的问题
6. `F` 修复了 `vue3` 图片设置 `inline` 会报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/438)
7. `F` 修复了 `vue3` 使用 `table` 可能报错的问题
## v2.3.1（2022-05-20）
1. `U` `app` 端支持使用本地图片
2. `U` 优化了微信小程序 `selectable` 属性在 `ios` 端的处理 [详细](https://jin-yufeng.gitee.io/mp-html/#/basic/prop#selectable)
3. `F` 修复了 `editable` 插件不在顶部时 `tooltip` 位置可能错误的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/430)
4. `F` 修复了 `vue3` 运行到微信小程序可能报错丢失内容的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/414)
5. `F` 修复了 `vue3` 部分标签可能被错误换行的问题
6. `F` 修复了 `editable` 插件 `app` 端插入视频无法预览的问题
## v2.3.0（2022-04-01）
1. `A` 增加了 `play` 事件，音视频播放时触发，可用于与页面其他音视频进行互斥播放 [详细](basic/event#play)
2. `U` `show-img-menu` 属性支持控制预览时是否长按弹出菜单
3. `U` 优化 `wxs` 处理，提高渲染性能 [详细](https://developers.weixin.qq.com/community/develop/article/doc/0006cc2b204740f601bd43fa25a413)
4. `U` `video` 标签支持 `object-fit` 属性
5. `U` 增加支持一些常用实体编码 [详细](https://github.com/jin-yufeng/mp-html/issues/418)
6. `F` 修复了图片仅设置高度可能不显示的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/410)
7. `F` 修复了 `video` 标签高度设置为 `auto` 不显示的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/411)
8. `F` 修复了使用 `grid` 布局时可能样式错误的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/413)
9. `F` 修复了含有合并单元格的表格部分情况下显示异常的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/417)
10. `F` 修复了 `editable` 插件连续插入内容时顺序不正确的问题
11. `F` 修复了 `uni-app` 包 `vue3` 使用 `audio` 插件报错的问题
12. `F` 修复了 `uni-app` 包 `highlight` 插件使用自定义的 `prism.min.js` 报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/416)
## v2.2.2（2022-02-26）
1. `A` 增加了 [pauseMedia](https://jin-yufeng.gitee.io/mp-html/#/advanced/api#pauseMedia) 的 `api`，可用于暂停播放音视频 [详细](https://github.com/jin-yufeng/mp-html/issues/317)
2. `U` 优化了长内容的加载速度
3. `U` 适配 `vue3` [#389](https://github.com/jin-yufeng/mp-html/issues/389)、[#398](https://github.com/jin-yufeng/mp-html/pull/398) by [@zhouhuafei](https://github.com/zhouhuafei)、[#400](https://github.com/jin-yufeng/mp-html/issues/400)
4. `F` 修复了小程序端图片高度设置为百分比时可能不显示的问题
5. `F` 修复了 `highlight` 插件部分情况下可能显示不完整的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/403)
## v2.2.1（2021-12-24）
1. `A` `editable` 插件增加上下移动标签功能
2. `U` `editable` 插件支持在文本中间光标处插入内容
3. `F` 修复了 `nvue` 端设置 `margin` 后可能导致高度不正确的问题
4. `F` 修复了 `highlight` 插件使用压缩版的 `prism.css` 可能导致背景失效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/367)
5. `F` 修复了编辑状态下使用 `emoji` 插件内容为空时可能报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/371)
6. `F` 修复了使用 `editable` 插件后将 `selectable` 属性设置为 `force` 不生效的问题
## v2.2.0（2021-10-12）
1. `A` 增加 `customElements` 配置项，便于添加自定义功能性标签 [详细](https://github.com/jin-yufeng/mp-html/issues/350)
2. `A` `editable` 插件增加切换音视频自动播放状态的功能 [详细](https://github.com/jin-yufeng/mp-html/pull/341) by [@leeseett](https://github.com/leeseett)
3. `A` `editable` 插件删除媒体标签时触发 `remove` 事件，便于删除已上传的文件
4. `U` `editable` 插件 `insertImg` 方法支持同时插入多张图片 [详细](https://github.com/jin-yufeng/mp-html/issues/342)
5. `U` `editable` 插入图片和音视频时支持拼接 `domian` 主域名
6. `F` 修复了内部链接参数中包含 `://` 时被认为是外部链接的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/356)
7. `F` 修复了部分 `svg` 标签名或属性名大小写不正确时不生效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/351)
8. `F` 修复了 `nvue` 页面运行到非 `app` 平台时可能样式错误的问题
## v2.1.5（2021-08-13）
1. `A` 增加支持标签的 `dir` 属性
2. `F` 修复了 `ruby` 标签文字与拼音没有居中对齐的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/325)
3. `F` 修复了音视频标签内有 `a` 标签时可能无法播放的问题
4. `F` 修复了 `externStyle` 中的 `class` 名包含下划线或数字时可能失效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/326)
5. `F` 修复了 `h5` 端引入 `externStyle` 可能不生效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/326)
## v2.1.4（2021-07-14）
1. `F` 修复了 `rt` 标签无法设置样式的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/318)
2. `F` 修复了表格中有单元格同时合并行和列时可能显示不正确的问题
3. `F` 修复了 `app` 端无法关闭图片长按菜单的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/322)
4. `F` 修复了 `editable` 插件只能添加图片链接不能修改的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/312) by [@leeseett](https://github.com/leeseett)
## v2.1.3（2021-06-12）
1. `A` `editable` 插件增加 `insertTable` 方法
2. `U` `editable` 插件支持编辑表格中的空白单元格 [详细](https://github.com/jin-yufeng/mp-html/issues/310)
3. `F` 修复了 `externStyle` 中使用伪类可能失效的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/298)
4. `F` 修复了多个组件同时使用时 `tag-style` 属性时可能互相影响的问题 [详细](https://github.com/jin-yufeng/mp-html/pull/305) by [@woodguoyu](https://github.com/woodguoyu)
5. `F` 修复了包含 `linearGradient` 的 `svg` 可能无法显示的问题
6. `F` 修复了编译到头条小程序时可能报错的问题
7. `F` 修复了 `nvue` 端不触发 `click` 事件的问题
8. `F` 修复了 `editable` 插件尾部插入时无法撤销的问题
9. `F` 修复了 `editable` 插件的 `insertHtml` 方法只能在末尾插入的问题
10. `F` 修复了 `editable` 插件插入音频不显示的问题
## v2.1.2（2021-04-24）
1. `A` 增加了 [img-cache](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#img-cache) 插件，可以在 `app` 端缓存图片 [详细](https://github.com/jin-yufeng/mp-html/issues/292) by [@PentaTea](https://github.com/PentaTea)
2. `U` 支持通过 `container-style` 属性设置 `white-space` 来保留连续空格和换行符 [详细](https://jin-yufeng.gitee.io/mp-html/#/question/faq#space)
3. `U` 代码风格符合 [standard](https://standardjs.com) 标准
4. `U` `editable` 插件编辑状态下支持预览视频 [详细](https://github.com/jin-yufeng/mp-html/issues/286)
5. `F` 修复了 `svg` 标签内嵌 `svg` 时无法显示的问题
6. `F` 修复了编译到支付宝和头条小程序时部分区域不可复制的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/291)
## v2.1.1（2021-04-09）
1. 修复了对 `p` 标签设置 `tag-style` 可能不生效的问题
2. 修复了 `svg` 标签中的文本无法显示的问题
3. 修复了使用 `editable` 插件编辑表格时可能报错的问题
4. 修复了使用 `highlight` 插件运行到头条小程序时可能没有样式的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/280)
5. 修复了使用 `editable` 插件 `editable` 属性为 `false` 时会报错的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/284)
6. 修复了 `style` 插件连续子选择器失效的问题
7. 修复了 `editable` 插件无法修改图片和字体大小的问题
## v2.1.0.2（2021-03-21）
修复了 `nvue` 端使用可能报错的问题
## v2.1.0（2021-03-20）
1. `A` 增加了 [container-style](https://jin-yufeng.gitee.io/mp-html/#/basic/prop#container-style) 属性 [详细](https://gitee.com/jin-yufeng/mp-html/pulls/1)
2. `A` 增加支持 `strike` 标签
3. `A` `editable` 插件增加 `placeholder` 属性 [详细](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#editable)
4. `A` `editable` 插件增加 `insertHtml` 方法 [详细](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#editable)
5. `U` 外部样式支持标签名选择器 [详细](https://jin-yufeng.gitee.io/mp-html/#/overview/quickstart#setting)
6. `F` 修复了 `nvue` 端部分情况下可能不显示的问题
## v2.0.5（2021-03-12）
1. `U` [linktap](https://jin-yufeng.gitee.io/mp-html/#/basic/event#linktap) 事件增加返回内部文本内容 `innerText` [详细](https://github.com/jin-yufeng/mp-html/issues/271)
2. `U` [selectable](https://jin-yufeng.gitee.io/mp-html/#/basic/prop#selectable) 属性设置为 `force` 时能够在微信 `iOS` 端生效（文本块会变成 `inline-block`） [详细](https://github.com/jin-yufeng/mp-html/issues/267)
3. `F` 修复了部分情况下竖向无法滚动的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/182)
4. `F` 修复了多次修改富文本数据时部分内容可能不显示的问题
5. `F` 修复了 [腾讯视频](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#txv-video) 插件可能无法播放的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/265)
6. `F` 修复了 [highlight](https://jin-yufeng.gitee.io/mp-html/#/advanced/plugin#highlight) 插件没有设置高亮语言时没有应用默认样式的问题 [详细](https://github.com/jin-yufeng/mp-html/issues/276) by [@fuzui](https://github.com/fuzui)
uni_modules/mp-html/components/mp-html/mp-html.vue
+498
View File
@@ -0,0 +1,498 @@
<template>
<view id="_root" :class="(selectable?'_select ':'')+'_root'" :style="containerStyle">
<slot v-if="!nodes[0]" />
<!-- #ifndef APP-PLUS-NVUE -->
<node v-else :childs="nodes" :opts="[lazyLoad,loadingImg,errorImg,showImgMenu,selectable]" name="span" />
<!-- #endif -->
<!-- #ifdef APP-PLUS-NVUE -->
<web-view ref="web" src="/uni_modules/mp-html/static/app-plus/mp-html/local.html" :style="'margin-top:-2px;height:' + height + 'px'" @onPostMessage="_onMessage" />
<!-- #endif -->
</view>
</template>
<script>
/**
* mp-html v2.4.2
* @description 富文本组件
* @tutorial https://github.com/jin-yufeng/mp-html
* @property {String} container-style 容器的样式
* @property {String} content 用于渲染的 html 字符串
* @property {Boolean} copy-link 是否允许外部链接被点击时自动复制
* @property {String} domain 主域名，用于拼接链接
* @property {String} error-img 图片出错时的占位图链接
* @property {Boolean} lazy-load 是否开启图片懒加载
* @property {string} loading-img 图片加载过程中的占位图链接
* @property {Boolean} pause-video 是否在播放一个视频时自动暂停其他视频
* @property {Boolean} preview-img 是否允许图片被点击时自动预览
* @property {Boolean} scroll-table 是否给每个表格添加一个滚动层使其能单独横向滚动
* @property {Boolean | String} selectable 是否开启长按复制
* @property {Boolean} set-title 是否将 title 标签的内容设置到页面标题
* @property {Boolean} show-img-menu 是否允许图片被长按时显示菜单
* @property {Object} tag-style 标签的默认样式
* @property {Boolean | Number} use-anchor 是否使用锚点链接
* @event {Function} load dom 结构加载完毕时触发
* @event {Function} ready 所有图片加载完毕时触发
* @event {Function} imgtap 图片被点击时触发
* @event {Function} linktap 链接被点击时触发
* @event {Function} play 音视频播放时触发
* @event {Function} error 媒体加载出错时触发
*/
// #ifndef APP-PLUS-NVUE
import node from './node/node'
// #endif
import Parser from './parser'
const plugins=[]
// #ifdef APP-PLUS-NVUE
const dom = weex.requireModule('dom')
// #endif
export default {
name: 'mp-html',
data () {
return {
nodes: [],
// #ifdef APP-PLUS-NVUE
height: 3
// #endif
}
},
props: {
containerStyle: {
type: String,
default: ''
},
content: {
type: String,
default: ''
},
copyLink: {
type: [Boolean, String],
default: true
},
domain: String,
errorImg: {
type: String,
default: ''
},
lazyLoad: {
type: [Boolean, String],
default: false
},
loadingImg: {
type: String,
default: ''
},
pauseVideo: {
type: [Boolean, String],
default: true
},
previewImg: {
type: [Boolean, String],
default: true
},
scrollTable: [Boolean, String],
selectable: [Boolean, String],
setTitle: {
type: [Boolean, String],
default: true
},
showImgMenu: {
type: [Boolean, String],
default: true
},
tagStyle: Object,
useAnchor: [Boolean, Number]
},
// #ifdef VUE3
emits: ['load', 'ready', 'imgtap', 'linktap', 'play', 'error'],
// #endif
// #ifndef APP-PLUS-NVUE
components: {
node
},
// #endif
watch: {
content (content) {
this.setContent(content)
}
},
created () {
this.plugins = []
for (let i = plugins.length; i--;) {
this.plugins.push(new plugins[i](this))
}
},
mounted () {
if (this.content && !this.nodes.length) {
this.setContent(this.content)
}
},
beforeDestroy () {
this._hook('onDetached')
},
methods: {
/**
* @description 将锚点跳转的范围限定在一个 scroll-view 内
* @param {Object} page scroll-view 所在页面的示例
* @param {String} selector scroll-view 的选择器
* @param {String} scrollTop scroll-view scroll-top 属性绑定的变量名
*/
in (page, selector, scrollTop) {
// #ifndef APP-PLUS-NVUE
if (page && selector && scrollTop) {
this._in = {
page,
selector,
scrollTop
}
}
// #endif
},
/**
* @description 锚点跳转
* @param {String} id 要跳转的锚点 id
* @param {Number} offset 跳转位置的偏移量
* @returns {Promise}
*/
navigateTo (id, offset) {
return new Promise((resolve, reject) => {
if (!this.useAnchor) {
reject(Error('Anchor is disabled'))
return
}
offset = offset || parseInt(this.useAnchor) || 0
// #ifdef APP-PLUS-NVUE
if (!id) {
dom.scrollToElement(this.$refs.web, {
offset
})
resolve()
} else {
this._navigateTo = {
resolve,
reject,
offset
}
this.$refs.web.evalJs('uni.postMessage({data:{action:"getOffset",offset:(document.getElementById(' + id + ')||{}).offsetTop}})')
}
// #endif
// #ifndef APP-PLUS-NVUE
let deep = ' '
// #ifdef MP-WEIXIN || MP-QQ || MP-TOUTIAO
deep = '>>>'
// #endif
const selector = uni.createSelectorQuery()
// #ifndef MP-ALIPAY
.in(this._in ? this._in.page : this)
// #endif
.select((this._in ? this._in.selector : '._root') + (id ? `${deep}#${id}` : '')).boundingClientRect()
if (this._in) {
selector.select(this._in.selector).scrollOffset()
.select(this._in.selector).boundingClientRect()
} else {
// 获取 scroll-view 的位置和滚动距离
selector.selectViewport().scrollOffset() // 获取窗口的滚动距离
}
selector.exec(res => {
if (!res[0]) {
reject(Error('Label not found'))
return
}
const scrollTop = res[1].scrollTop + res[0].top - (res[2] ? res[2].top : 0) + offset
if (this._in) {
// scroll-view 跳转
this._in.page[this._in.scrollTop] = scrollTop
} else {
// 页面跳转
uni.pageScrollTo({
scrollTop,
duration: 300
})
}
resolve()
})
// #endif
})
},
/**
* @description 获取文本内容
* @return {String}
*/
getText (nodes) {
let text = '';
(function traversal (nodes) {
for (let i = 0; i < nodes.length; i++) {
const node = nodes[i]
if (node.type === 'text') {
text += node.text.replace(/&amp;/g, '&')
} else if (node.name === 'br') {
text += '\n'
} else {
// 块级标签前后加换行
const isBlock = node.name === 'p' || node.name === 'div' || node.name === 'tr' || node.name === 'li' || (node.name[0] === 'h' && node.name[1] > '0' && node.name[1] < '7')
if (isBlock && text && text[text.length - 1] !== '\n') {
text += '\n'
}
// 递归获取子节点的文本
if (node.children) {
traversal(node.children)
}
if (isBlock && text[text.length - 1] !== '\n') {
text += '\n'
} else if (node.name === 'td' || node.name === 'th') {
text += '\t'
}
}
}
})(nodes || this.nodes)
return text
},
/**
* @description 获取内容大小和位置
* @return {Promise}
*/
getRect () {
return new Promise((resolve, reject) => {
uni.createSelectorQuery()
// #ifndef MP-ALIPAY
.in(this)
// #endif
.select('#_root').boundingClientRect().exec(res => res[0] ? resolve(res[0]) : reject(Error('Root label not found')))
})
},
/**
* @description 暂停播放媒体
*/
pauseMedia () {
for (let i = (this._videos || []).length; i--;) {
this._videos[i].pause()
}
// #ifdef APP-PLUS
const command = 'for(var e=document.getElementsByTagName("video"),i=e.length;i--;)e[i].pause()'
// #ifndef APP-PLUS-NVUE
let page = this.$parent
while (!page.$scope) page = page.$parent
page.$scope.$getAppWebview().evalJS(command)
// #endif
// #ifdef APP-PLUS-NVUE
this.$refs.web.evalJs(command)
// #endif
// #endif
},
/**
* @description 设置媒体播放速率
* @param {Number} rate 播放速率
*/
setPlaybackRate (rate) {
this.playbackRate = rate
for (let i = (this._videos || []).length; i--;) {
this._videos[i].playbackRate(rate)
}
// #ifdef APP-PLUS
const command = 'for(var e=document.getElementsByTagName("video"),i=e.length;i--;)e[i].playbackRate=' + rate
// #ifndef APP-PLUS-NVUE
let page = this.$parent
while (!page.$scope) page = page.$parent
page.$scope.$getAppWebview().evalJS(command)
// #endif
// #ifdef APP-PLUS-NVUE
this.$refs.web.evalJs(command)
// #endif
// #endif
},
/**
* @description 设置内容
* @param {String} content html 内容
* @param {Boolean} append 是否在尾部追加
*/
setContent (content, append) {
if (!append || !this.imgList) {
this.imgList = []
}
const nodes = new Parser(this).parse(content)
// #ifdef APP-PLUS-NVUE
if (this._ready) {
this._set(nodes, append)
}
// #endif
this.$set(this, 'nodes', append ? (this.nodes || []).concat(nodes) : nodes)
// #ifndef APP-PLUS-NVUE
this._videos = []
this.$nextTick(() => {
this._hook('onLoad')
this.$emit('load')
})
if (this.lazyLoad || this.imgList._unloadimgs < this.imgList.length / 2) {
// 设置懒加载，每 350ms 获取高度，不变则认为加载完毕
let height = 0
const callback = rect => {
if (!rect || !rect.height) rect = {}
// 350ms 总高度无变化就触发 ready 事件
if (rect.height === height) {
this.$emit('ready', rect)
} else {
height = rect.height
setTimeout(() => {
this.getRect().then(callback).catch(callback)
}, 350)
}
}
this.getRect().then(callback).catch(callback)
} else {
// 未设置懒加载，等待所有图片加载完毕
if (!this.imgList._unloadimgs) {
this.getRect().then(rect => {
this.$emit('ready', rect)
}).catch(() => {
this.$emit('ready', {})
})
}
}
// #endif
},
/**
* @description 调用插件钩子函数
*/
_hook (name) {
for (let i = plugins.length; i--;) {
if (this.plugins[i][name]) {
this.plugins[i][name]()
}
}
},
// #ifdef APP-PLUS-NVUE
/**
* @description 设置内容
*/
_set (nodes, append) {
this.$refs.web.evalJs('setContent(' + JSON.stringify(nodes).replace(/%22/g, '') + ',' + JSON.stringify([this.containerStyle.replace(/(?:margin|padding)[^;]+/g, ''), this.errorImg, this.loadingImg, this.pauseVideo, this.scrollTable, this.selectable]) + ',' + append + ')')
},
/**
* @description 接收到 web-view 消息
*/
_onMessage (e) {
const message = e.detail.data[0]
switch (message.action) {
// web-view 初始化完毕
case 'onJSBridgeReady':
this._ready = true
if (this.nodes) {
this._set(this.nodes)
}
break
// 内容 dom 加载完毕
case 'onLoad':
this.height = message.height
this._hook('onLoad')
this.$emit('load')
break
// 所有图片加载完毕
case 'onReady':
this.getRect().then(res => {
this.$emit('ready', res)
}).catch(() => {
this.$emit('ready', {})
})
break
// 总高度发生变化
case 'onHeightChange':
this.height = message.height
break
// 图片点击
case 'onImgTap':
this.$emit('imgtap', message.attrs)
if (this.previewImg) {
uni.previewImage({
current: parseInt(message.attrs.i),
urls: this.imgList
})
}
break
// 链接点击
case 'onLinkTap': {
const href = message.attrs.href
this.$emit('linktap', message.attrs)
if (href) {
// 锚点跳转
if (href[0] === '#') {
if (this.useAnchor) {
dom.scrollToElement(this.$refs.web, {
offset: message.offset
})
}
} else if (href.includes('://')) {
// 打开外链
if (this.copyLink) {
plus.runtime.openWeb(href)
}
} else {
uni.navigateTo({
url: href,
fail () {
uni.switchTab({
url: href
})
}
})
}
}
break
}
case 'onPlay':
this.$emit('play')
break
// 获取到锚点的偏移量
case 'getOffset':
if (typeof message.offset === 'number') {
dom.scrollToElement(this.$refs.web, {
offset: message.offset + this._navigateTo.offset
})
this._navigateTo.resolve()
} else {
this._navigateTo.reject(Error('Label not found'))
}
break
// 点击
case 'onClick':
this.$emit('tap')
this.$emit('click')
break
// 出错
case 'onError':
this.$emit('error', {
source: message.source,
attrs: message.attrs
})
}
}
// #endif
}
}
</script>
<style>
/* #ifndef APP-PLUS-NVUE */
/* 根节点样式 */
._root {
padding: 1px 0;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
}
/* 长按复制 */
._select {
user-select: text;
}
/* #endif */
</style>
uni_modules/mp-html/components/mp-html/node/node.vue
+576
View File
@@ -0,0 +1,576 @@
<template>
<view :id="attrs.id" :class="'_block _'+name+' '+attrs.class" :style="attrs.style">
<block v-for="(n, i) in childs" v-bind:key="i">
<!-- 图片 -->
<!-- 占位图 -->
<image v-if="n.name==='img'&&!n.t&&((opts[1]&&!ctrl[i])||ctrl[i]<0)" class="_img" :style="n.attrs.style" :src="ctrl[i]<0?opts[2]:opts[1]" mode="widthFix" />
<!-- 显示图片 -->
<!-- #ifdef H5 || (APP-PLUS && VUE2) -->
<img v-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+n.attrs.style" :src="n.attrs.src||(ctrl.load?n.attrs['data-src']:'')" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
<!-- #endif -->
<!-- #ifndef H5 || (APP-PLUS && VUE2) -->
<!-- 表格中的图片，使用 rich-text 防止大小不正确 -->
<rich-text v-if="n.name==='img'&&n.t" :style="'display:'+n.t" :nodes="[{attrs:{style:n.attrs.style,src:n.attrs.src},name:'img'}]" :data-i="i" @tap.stop="imgTap" />
<!-- #endif -->
<!-- #ifndef H5 || APP-PLUS -->
<image v-else-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+'width:'+(ctrl[i]||1)+'px;height:1px;'+n.attrs.style" :src="n.attrs.src" :mode="!n.h?'widthFix':(!n.w?'heightFix':'')" :lazy-load="opts[0]" :webp="n.webp" :show-menu-by-longpress="opts[3]&&!n.attrs.ignore" :image-menu-prevent="!opts[3]||n.attrs.ignore" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
<!-- #endif -->
<!-- #ifdef APP-PLUS && VUE3 -->
<image v-else-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+'width:'+(ctrl[i]||1)+'px;'+n.attrs.style" :src="n.attrs.src||(ctrl.load?n.attrs['data-src']:'')" :mode="!n.h?'widthFix':(!n.w?'heightFix':'')" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
<!-- #endif -->
<!-- 文本 -->
<!-- #ifdef MP-WEIXIN -->
<text v-else-if="n.text" :user-select="opts[4]=='force'&&isiOS" decode>{{n.text}}</text>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN || MP-BAIDU || MP-ALIPAY || MP-TOUTIAO -->
<text v-else-if="n.text" decode>{{n.text}}</text>
<!-- #endif -->
<text v-else-if="n.name==='br'">\n</text>
<!-- 链接 -->
<view v-else-if="n.name==='a'" :id="n.attrs.id" :class="(n.attrs.href?'_a ':'')+n.attrs.class" hover-class="_hover" :style="'display:inline;'+n.attrs.style" :data-i="i" @tap.stop="linkTap">
<node name="span" :childs="n.children" :opts="opts" style="display:inherit" />
</view>
<!-- 视频 -->
<!-- #ifdef APP-PLUS -->
<view v-else-if="n.html" :id="n.attrs.id" :class="'_video '+n.attrs.class" :style="n.attrs.style" v-html="n.html" @vplay.stop="play" />
<!-- #endif -->
<!-- #ifndef APP-PLUS -->
<video v-else-if="n.name==='video'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :autoplay="n.attrs.autoplay" :controls="n.attrs.controls" :loop="n.attrs.loop" :muted="n.attrs.muted" :object-fit="n.attrs['object-fit']" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" @play="play" @error="mediaError" />
<!-- #endif -->
<!-- #ifdef H5 || APP-PLUS -->
<iframe v-else-if="n.name==='iframe'" :style="n.attrs.style" :allowfullscreen="n.attrs.allowfullscreen" :frameborder="n.attrs.frameborder" :src="n.attrs.src" />
<embed v-else-if="n.name==='embed'" :style="n.attrs.style" :src="n.attrs.src" />
<!-- #endif -->
<!-- #ifndef MP-TOUTIAO || ((H5 || APP-PLUS) && VUE3) -->
<!-- 音频 -->
<audio v-else-if="n.name==='audio'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :author="n.attrs.author" :controls="n.attrs.controls" :loop="n.attrs.loop" :name="n.attrs.name" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" @play="play" @error="mediaError" />
<!-- #endif -->
<view v-else-if="(n.name==='table'&&n.c)||n.name==='li'" :id="n.attrs.id" :class="'_'+n.name+' '+n.attrs.class" :style="n.attrs.style">
<node v-if="n.name==='li'" :childs="n.children" :opts="opts" />
<view v-else v-for="(tbody, x) in n.children" v-bind:key="x" :class="'_'+tbody.name+' '+tbody.attrs.class" :style="tbody.attrs.style">
<node v-if="tbody.name==='td'||tbody.name==='th'" :childs="tbody.children" :opts="opts" />
<block v-else v-for="(tr, y) in tbody.children" v-bind:key="y">
<view v-if="tr.name==='td'||tr.name==='th'" :class="'_'+tr.name+' '+tr.attrs.class" :style="tr.attrs.style">
<node :childs="tr.children" :opts="opts" />
</view>
<view v-else :class="'_'+tr.name+' '+tr.attrs.class" :style="tr.attrs.style">
<view v-for="(td, z) in tr.children" v-bind:key="z" :class="'_'+td.name+' '+td.attrs.class" :style="td.attrs.style">
<node :childs="td.children" :opts="opts" />
</view>
</view>
</block>
</view>
</view>
<!-- 富文本 -->
<!-- #ifdef H5 || ((MP-WEIXIN || MP-QQ || APP-PLUS || MP-360) && VUE2) -->
<rich-text v-else-if="!n.c&&!handler.isInline(n.name, n.attrs.style)" :id="n.attrs.id" :style="n.f" :user-select="opts[4]" :nodes="[n]" />
<!-- #endif -->
<!-- #ifndef H5 || ((MP-WEIXIN || MP-QQ || APP-PLUS || MP-360) && VUE2) -->
<rich-text v-else-if="!n.c" :id="n.attrs.id" :style="'display:inline;'+n.f" :preview="false" :selectable="opts[4]" :user-select="opts[4]" :nodes="[n]" />
<!-- #endif -->
<!-- 继续递归 -->
<view v-else-if="n.c===2" :id="n.attrs.id" :class="'_block _'+n.name+' '+n.attrs.class" :style="n.f+';'+n.attrs.style">
<node v-for="(n2, j) in n.children" v-bind:key="j" :style="n2.f" :name="n2.name" :attrs="n2.attrs" :childs="n2.children" :opts="opts" />
</view>
<node v-else :style="n.f" :name="n.name" :attrs="n.attrs" :childs="n.children" :opts="opts" />
</block>
</view>
</template>
<script module="handler" lang="wxs">
// 行内标签列表
var inlineTags = {
abbr: true,
b: true,
big: true,
code: true,
del: true,
em: true,
i: true,
ins: true,
label: true,
q: true,
small: true,
span: true,
strong: true,
sub: true,
sup: true
}
/**
* @description 判断是否为行内标签
*/
module.exports = {
isInline: function (tagName, style) {
return inlineTags[tagName] || (style || '').indexOf('display:inline') !== -1
}
}
</script>
<script>
import node from './node'
export default {
name: 'node',
options: {
// #ifdef MP-WEIXIN
virtualHost: true,
// #endif
// #ifdef MP-TOUTIAO
addGlobalClass: false
// #endif
},
data () {
return {
ctrl: {},
// #ifdef MP-WEIXIN
isiOS: uni.getSystemInfoSync().system.includes('iOS')
// #endif
}
},
props: {
name: String,
attrs: {
type: Object,
default () {
return {}
}
},
childs: Array,
opts: Array
},
components: {
// #ifndef (H5 || APP-PLUS) && VUE3
node
// #endif
},
mounted () {
this.$nextTick(() => {
for (this.root = this.$parent; this.root.$options.name !== 'mp-html'; this.root = this.root.$parent);
})
// #ifdef H5 || APP-PLUS
if (this.opts[0]) {
let i
for (i = this.childs.length; i--;) {
if (this.childs[i].name === 'img') break
}
if (i !== -1) {
this.observer = uni.createIntersectionObserver(this).relativeToViewport({
top: 500,
bottom: 500
})
this.observer.observe('._img', res => {
if (res.intersectionRatio) {
this.$set(this.ctrl, 'load', 1)
this.observer.disconnect()
}
})
}
}
// #endif
},
beforeDestroy () {
// #ifdef H5 || APP-PLUS
if (this.observer) {
this.observer.disconnect()
}
// #endif
},
methods:{
// #ifdef MP-WEIXIN
toJSON () { return this },
// #endif
/**
* @description 播放视频事件
* @param {Event} e
*/
play (e) {
this.root.$emit('play')
// #ifndef APP-PLUS
if (this.root.pauseVideo) {
let flag = false
const id = e.target.id
for (let i = this.root._videos.length; i--;) {
if (this.root._videos[i].id === id) {
flag = true
} else {
this.root._videos[i].pause() // 自动暂停其他视频
}
}
// 将自己加入列表
if (!flag) {
const ctx = uni.createVideoContext(id
// #ifndef MP-BAIDU
, this
// #endif
)
ctx.id = id
if (this.root.playbackRate) {
ctx.playbackRate(this.root.playbackRate)
}
this.root._videos.push(ctx)
}
}
// #endif
},
/**
* @description 图片点击事件
* @param {Event} e
*/
imgTap (e) {
const node = this.childs[e.currentTarget.dataset.i]
if (node.a) {
this.linkTap(node.a)
return
}
if (node.attrs.ignore) return
// #ifdef H5 || APP-PLUS
node.attrs.src = node.attrs.src || node.attrs['data-src']
// #endif
this.root.$emit('imgtap', node.attrs)
// 自动预览图片
if (this.root.previewImg) {
uni.previewImage({
// #ifdef MP-WEIXIN
showmenu: this.root.showImgMenu,
// #endif
// #ifdef MP-ALIPAY
enablesavephoto: this.root.showImgMenu,
enableShowPhotoDownload: this.root.showImgMenu,
// #endif
current: parseInt(node.attrs.i),
urls: this.root.imgList
})
}
},
/**
* @description 图片长按
*/
imgLongTap (e) {
// #ifdef APP-PLUS
const attrs = this.childs[e.currentTarget.dataset.i].attrs
if (this.opts[3] && !attrs.ignore) {
uni.showActionSheet({
itemList: ['保存图片'],
success: () => {
const save = path => {
uni.saveImageToPhotosAlbum({
filePath: path,
success () {
uni.showToast({
title: '保存成功'
})
}
})
}
if (this.root.imgList[attrs.i].startsWith('http')) {
uni.downloadFile({
url: this.root.imgList[attrs.i],
success: res => save(res.tempFilePath)
})
} else {
save(this.root.imgList[attrs.i])
}
}
})
}
// #endif
},
/**
* @description 图片加载完成事件
* @param {Event} e
*/
imgLoad (e) {
const i = e.currentTarget.dataset.i
/* #ifndef H5 || (APP-PLUS && VUE2) */
if (!this.childs[i].w) {
// 设置原宽度
this.$set(this.ctrl, i, e.detail.width)
} else /* #endif */ if ((this.opts[1] && !this.ctrl[i]) || this.ctrl[i] === -1) {
// 加载完毕，取消加载中占位图
this.$set(this.ctrl, i, 1)
}
this.checkReady()
},
/**
* @description 检查是否所有图片加载完毕
*/
checkReady () {
if (this.root && !this.root.lazyLoad) {
this.root._unloadimgs -= 1
if (!this.root._unloadimgs) {
setTimeout(() => {
this.root.getRect().then(rect => {
this.root.$emit('ready', rect)
}).catch(() => {
this.root.$emit('ready', {})
})
}, 350)
}
}
},
/**
* @description 链接点击事件
* @param {Event} e
*/
linkTap (e) {
const node = e.currentTarget ? this.childs[e.currentTarget.dataset.i] : {}
const attrs = node.attrs || e
const href = attrs.href
this.root.$emit('linktap', Object.assign({
innerText: this.root.getText(node.children || []) // 链接内的文本内容
}, attrs))
if (href) {
if (href[0] === '#') {
// 跳转锚点
this.root.navigateTo(href.substring(1)).catch(() => { })
} else if (href.split('?')[0].includes('://')) {
// 复制外部链接
if (this.root.copyLink) {
// #ifdef H5
window.open(href)
// #endif
// #ifdef MP
uni.setClipboardData({
data: href,
success: () =>
uni.showToast({
title: '链接已复制'
})
})
// #endif
// #ifdef APP-PLUS
plus.runtime.openWeb(href)
// #endif
}
} else {
// 跳转页面
uni.navigateTo({
url: href,
fail () {
uni.switchTab({
url: href,
fail () { }
})
}
})
}
}
},
/**
* @description 错误事件
* @param {Event} e
*/
mediaError (e) {
const i = e.currentTarget.dataset.i
const node = this.childs[i]
// 加载其他源
if (node.name === 'video' || node.name === 'audio') {
let index = (this.ctrl[i] || 0) + 1
if (index > node.src.length) {
index = 0
}
if (index < node.src.length) {
this.$set(this.ctrl, i, index)
return
}
} else if (node.name === 'img') {
// #ifdef H5 && VUE3
if (this.opts[0] && !this.ctrl.load) return
// #endif
// 显示错误占位图
if (this.opts[2]) {
this.$set(this.ctrl, i, -1)
}
this.checkReady()
}
if (this.root) {
this.root.$emit('error', {
source: node.name,
attrs: node.attrs,
// #ifndef H5 && VUE3
errMsg: e.detail.errMsg
// #endif
})
}
}
}
}
</script>
<style>
/* a 标签默认效果 */
._a {
padding: 1.5px 0 1.5px 0;
color: #366092;
word-break: break-all;
}
/* a 标签点击态效果 */
._hover {
text-decoration: underline;
opacity: 0.7;
}
/* 图片默认效果 */
._img {
max-width: 100%;
-webkit-touch-callout: none;
}
/* 内部样式 */
._block {
display: block;
}
._b,
._strong {
font-weight: bold;
}
._code {
font-family: monospace;
}
._del {
text-decoration: line-through;
}
._em,
._i {
font-style: italic;
}
._h1 {
font-size: 2em;
}
._h2 {
font-size: 1.5em;
}
._h3 {
font-size: 1.17em;
}
._h5 {
font-size: 0.83em;
}
._h6 {
font-size: 0.67em;
}
._h1,
._h2,
._h3,
._h4,
._h5,
._h6 {
display: block;
font-weight: bold;
}
._image {
height: 1px;
}
._ins {
text-decoration: underline;
}
._li {
display: list-item;
}
._ol {
list-style-type: decimal;
}
._ol,
._ul {
display: block;
padding-left: 40px;
margin: 1em 0;
}
._q::before {
content: '"';
}
._q::after {
content: '"';
}
._sub {
font-size: smaller;
vertical-align: sub;
}
._sup {
font-size: smaller;
vertical-align: super;
}
._thead,
._tbody,
._tfoot {
display: table-row-group;
}
._tr {
display: table-row;
}
._td,
._th {
display: table-cell;
vertical-align: middle;
}
._th {
font-weight: bold;
text-align: center;
}
._ul {
list-style-type: disc;
}
._ul ._ul {
margin: 0;
list-style-type: circle;
}
._ul ._ul ._ul {
list-style-type: square;
}
._abbr,
._b,
._code,
._del,
._em,
._i,
._ins,
._label,
._q,
._span,
._strong,
._sub,
._sup {
display: inline;
}
/* #ifdef APP-PLUS */
._video {
width: 300px;
height: 225px;
}
/* #endif */
</style>
uni_modules/mp-html/components/mp-html/parser.js
+1335
View File
File diff suppressed because it is too large Load Diff
uni_modules/mp-html/package.json
+76
View File
@@ -0,0 +1,76 @@
{
"id": "mp-html",
"displayName": "mp-html 富文本组件【全端支持，支持编辑、latex等扩展】",
"version": "v2.4.2",
"description": "一个强大的富文本组件，高效轻量，功能丰富",
"keywords": [
"富文本",
"编辑器",
"html",
"rich-text",
"editor"
],
"repository": "https://github.com/jin-yufeng/mp-html",
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/mp-html",
"type": "component-vue"
},
"uni_modules": {
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "u",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
uni_modules/mp-html/static/app-plus/mp-html/js/handler.js
+1
View File
@@ -0,0 +1 @@
"use strict";function t(t){for(var e=Object.create(null),n=t.attributes.length;n--;)e[t.attributes[n].name]=t.attributes[n].value;return e}function e(){a[1]&&(this.src=a[1],this.onerror=null),this.onclick=null,this.ontouchstart=null,uni.postMessage({data:{action:"onError",source:"img",attrs:t(this)}})}function n(){window.unloadimgs-=1,0===window.unloadimgs&&uni.postMessage({data:{action:"onReady"}})}function o(r,s,c){for(var d=0;d<r.length;d++)!function(d){var u=r[d],l=void 0;if(u.type&&"node"!==u.type)l=document.createTextNode(u.text.replace(/&amp;/g,"&"));else{var g=u.name;"svg"===g&&(c="http://www.w3.org/2000/svg"),"html"!==g&&"body"!==g||(g="div"),l=c?document.createElementNS(c,g):document.createElement(g);for(var p in u.attrs)l.setAttribute(p,u.attrs[p]);if(u.children&&o(u.children,l,c),"img"===g){if(window.unloadimgs+=1,l.onload=n,l.onerror=n,!l.src&&l.getAttribute("data-src")&&(l.src=l.getAttribute("data-src")),u.attrs.ignore||(l.onclick=function(e){e.stopPropagation(),uni.postMessage({data:{action:"onImgTap",attrs:t(this)}})}),a[2]){var h=new Image;h.src=l.src,l.src=a[2],h.onload=function(){l.src=this.src},h.onerror=function(){l.onerror()}}l.onerror=e}else if("a"===g)l.addEventListener("click",function(e){e.stopPropagation(),e.preventDefault();var n,o=this.getAttribute("href");o&&"#"===o[0]&&(n=(document.getElementById(o.substr(1))||{}).offsetTop),uni.postMessage({data:{action:"onLinkTap",attrs:t(this),offset:n}})},!0);else if("video"===g||"audio"===g)i.push(l),u.attrs.autoplay||u.attrs.controls||l.setAttribute("controls","true"),l.onplay=function(){if(uni.postMessage({data:{action:"onPlay"}}),a[3])for(var t=0;t<i.length;t++)i[t]!==this&&i[t].pause()},l.onerror=function(){uni.postMessage({data:{action:"onError",source:g,attrs:t(this)}})};else if("table"===g&&a[4]&&!l.style.cssText.includes("inline")){var f=document.createElement("div");f.style.overflow="auto",f.appendChild(l),l=f}else"svg"===g&&(c=void 0)}s.appendChild(l)}(d)}document.addEventListener("UniAppJSBridgeReady",function(){document.body.onclick=function(){return uni.postMessage({data:{action:"onClick"}})},uni.postMessage({data:{action:"onJSBridgeReady"}})});var a,i=[];window.setContent=function(t,e,n){var r=document.getElementById("content");e[0]&&(document.body.style.cssText=e[0]),e[5]||(r.style.userSelect="none"),n||(r.innerHTML="",i=[]),a=e,window.unloadimgs=0;var s=document.createDocumentFragment();o(t,s),r.appendChild(s);var c=r.scrollHeight;uni.postMessage({data:{action:"onLoad",height:c}}),window.unloadimgs||uni.postMessage({data:{action:"onReady",height:c}}),clearInterval(window.timer),window.timer=setInterval(function(){r.scrollHeight!==c&&(c=r.scrollHeight,uni.postMessage({data:{action:"onHeightChange",height:c}}))},350)},window.onunload=function(){clearInterval(window.timer)};
uni_modules/mp-html/static/app-plus/mp-html/js/uni.webview.min.js
Vendored
+1
View File
@@ -0,0 +1 @@
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(e=e||self).uni=n()}(this,(function(){"use strict";try{var e={};Object.defineProperty(e,"passive",{get:function(){!0}}),window.addEventListener("test-passive",null,e)}catch(e){}var n=Object.prototype.hasOwnProperty;function t(e,t){return n.call(e,t)}var i=[],a=function(e,n){var t={options:{timestamp:+new Date},name:e,arg:n};if(window.__dcloud_weex_postMessage||window.__dcloud_weex_){if("postMessage"===e){var a={data:[n]};return window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessage(a):window.__dcloud_weex_.postMessage(JSON.stringify(a))}var o={type:"WEB_INVOKE_APPSERVICE",args:{data:t,webviewIds:i}};window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessageToService(o):window.__dcloud_weex_.postMessageToService(JSON.stringify(o))}if(!window.plus)return window.parent.postMessage({type:"WEB_INVOKE_APPSERVICE",data:t,pageId:""},"*");if(0===i.length){var r=plus.webview.currentWebview();if(!r)throw new Error("plus.webview.currentWebview() is undefined");var d=r.parent(),s="";s=d?d.id:r.id,i.push(s)}if(plus.webview.getWebviewById("__uniapp__service"))plus.webview.postMessageToUniNView({type:"WEB_INVOKE_APPSERVICE",args:{data:t,webviewIds:i}},"__uniapp__service");else{var w=JSON.stringify(t);plus.webview.getLaunchWebview().evalJS('UniPlusBridge.subscribeHandler("'.concat("WEB_INVOKE_APPSERVICE",'",').concat(w,",").concat(JSON.stringify(i),");"))}},o={navigateTo:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;a("navigateTo",{url:encodeURI(n)})},navigateBack:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.delta;a("navigateBack",{delta:parseInt(n)||1})},switchTab:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;a("switchTab",{url:encodeURI(n)})},reLaunch:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;a("reLaunch",{url:encodeURI(n)})},redirectTo:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;a("redirectTo",{url:encodeURI(n)})},getEnv:function(e){window.plus?e({plus:!0}):e({h5:!0})},postMessage:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};a("postMessage",e.data||{})}},r=/uni-app/i.test(navigator.userAgent),d=/Html5Plus/i.test(navigator.userAgent),s=/complete|loaded|interactive/;var w=window.my&&navigator.userAgent.indexOf("AlipayClient")>-1;var u=window.swan&&window.swan.webView&&/swan/i.test(navigator.userAgent);var c=window.qq&&window.qq.miniProgram&&/QQ/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);var g=window.tt&&window.tt.miniProgram&&/toutiaomicroapp/i.test(navigator.userAgent);var v=window.wx&&window.wx.miniProgram&&/micromessenger/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);var p=window.qa&&/quickapp/i.test(navigator.userAgent);for(var l,_=function(){window.UniAppJSBridge=!0,document.dispatchEvent(new CustomEvent("UniAppJSBridgeReady",{bubbles:!0,cancelable:!0}))},f=[function(e){if(r||d)return window.__dcloud_weex_postMessage||window.__dcloud_weex_?document.addEventListener("DOMContentLoaded",e):window.plus&&s.test(document.readyState)?setTimeout(e,0):document.addEventListener("plusready",e),o},function(e){if(v)return window.WeixinJSBridge&&window.WeixinJSBridge.invoke?setTimeout(e,0):document.addEventListener("WeixinJSBridgeReady",e),window.wx.miniProgram},function(e){if(c)return window.QQJSBridge&&window.QQJSBridge.invoke?setTimeout(e,0):document.addEventListener("QQJSBridgeReady",e),window.qq.miniProgram},function(e){if(w){document.addEventListener("DOMContentLoaded",e);var n=window.my;return{navigateTo:n.navigateTo,navigateBack:n.navigateBack,switchTab:n.switchTab,reLaunch:n.reLaunch,redirectTo:n.redirectTo,postMessage:n.postMessage,getEnv:n.getEnv}}},function(e){if(u)return document.addEventListener("DOMContentLoaded",e),window.swan.webView},function(e){if(g)return document.addEventListener("DOMContentLoaded",e),window.tt.miniProgram},function(e){if(p){window.QaJSBridge&&window.QaJSBridge.invoke?setTimeout(e,0):document.addEventListener("QaJSBridgeReady",e);var n=window.qa;return{navigateTo:n.navigateTo,navigateBack:n.navigateBack,switchTab:n.switchTab,reLaunch:n.reLaunch,redirectTo:n.redirectTo,postMessage:n.postMessage,getEnv:n.getEnv}}},function(e){return document.addEventListener("DOMContentLoaded",e),o}],m=0;m<f.length&&!(l=f[m](_));m++);l||(l={});var E="undefined"!=typeof uni?uni:{};if(!E.navigateTo)for(var b in l)t(l,b)&&(E[b]=l[b]);return E.webView=l,E}));
uni_modules/mp-html/static/app-plus/mp-html/local.html
+1
View File
@@ -0,0 +1 @@
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><style>body,html{width:100%;height:100%;overflow-x:scroll;overflow-y:hidden}body{margin:0}video{width:300px;height:225px}img{max-width:100%;-webkit-touch-callout:none}</style></head><body><div id="content" style="overflow:hidden"></div><script type="text/javascript" src="./js/uni.webview.min.js"></script><script type="text/javascript" src="./js/handler.js"></script></body>
uni_modules/p-f-unicom/1.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 79 KiB

uni_modules/p-f-unicom/README.md
+188
View File
@@ -0,0 +1,188 @@
## p-f-unicom 跨层级通信插件，解决非父子通信的痛点
> 前言：我们在使用`Vue`进行开发时如何能够解决非父子组件之间的一个通信问题，那如果碰到这样一个问题其实按照一般的开发步骤解决起来是非常繁琐的可能各种的`parent`、`children`或者有人可能会直接定义在全局环境上那这样的操作会使得你的项目在越来越复杂的业务开发中变得非常的脆弱。
##### `p-f-unicom` 自定义插件：
1. 它是`Vue.js`的一个自定义插件，解决了`Vue`中非父子组件通讯的痛点。
2. 利用订阅者和发布者模式来管理消息。
##### 功能：
1. 任意一个`Vue`组件向其他所有组件发送指令。
2. 任意一个`Vue`组件向某组`Vue`组件发送指令。
3. 任意一个`Vue`组件向特定`unicom-id`组件发送消息。
4. 在任意一个`Vue`组件内获取某组组件列表。
5. 在任意一个`Vue`组件内获取特定`unciom-id`组件。
6. 发送指令到还没初始化的`unicom-id`组件。
7. 发送指令到还没初始化的`unicom-group`分组组件。
8. 组件销毁时自动销毁绑定的订阅事件。
##### 使用：
`main.js` 注册`Unicom`插件
`unicom`是插件内置的名称，如果需要修改可以在`Vue.use`时自定义。
```javascript
// 导入
import unicom from './plugin/p-f-unicom.js'
// 使用
Vue.use(unicom, {
name: 'unicom',
idName: 'unicomId',
groupName: 'unicomGroup'
})
```
##### Vue组件内部使用
child.vue （订阅）
```javascript
<template>
<div>
// ......
</div>
</template>
<script>
export default {
// 将这个组件归到 group 分组，必须是数组
unicomGroup: ['group'],
unicom: {
// message 通讯指令名称和 this.$unicom 时对应
/**
* @desc 注册接收指令
* sender： 发送指令者（建议只能读区不能修改）
* args：指令发出者附带参数
*/
message (sender, ...args){
// 订阅消息 （名称为 `message`）
}
}
}
</script>
```
index.vue （发布）
```javascript
<template>
<div>
// unicom-id 不能和其它组件所定的 unicom-id 相同
// unicom-group 定义组的名称数组，会和组件内的 `unicomGroup` 合并并去重 ，不定义默认使用 child 组件内的 `unicomGroup`
<child unicom-id="child-id" :unicom-group="aUnicomGroupList"></child>
</div>
</template>
<script>
import Child from './child.vue'
export default {
components: {
Child
},
data(){
return {
// 名字不能叫 unicomGroup,因为已经被 unicom 插件占用自动放到了组件的props对象中所以名字会重名冲突
aUnicomGroupList: ['group', 'group1']
}
},
methods: {
doExec () {
// 发布订阅消息，会自动调用 child 组件内订阅的 `message` 指令
this.$unicom("message", arg1, arg2, ...)
// 获取被命名为 child-id 的组件引用
const child = this.$unicom("#child-id")
// 获取分组为 group 的所有 vue 组件
const childs = this.$unicom("@group")
}
}
}
</script>
```
#### 发布的使用模式：
##### 组件已经存在
instruct1 是指令也就是你在 vue 组件中定义的接收消息的事件名称:
```javascript
unicom: {
instruct1(sender, oQueryParams, aYearList) {
// 查询栏消息
console.log('订阅消息', JSON.stringify(oQueryParams), aYearList);
}
}
```
1. instruct1@group （发送到指定分组）
2. instruct1#id1 （发送到指定组件）
3. @group （获取指定分组组件）
4. #id1 （获取指定组件）
##### 组件还未创建，延迟发送指令（一次性指令）
指令使用 ~ 打头
1. ~instruct1 （指令延迟发送，直到包含有 `instruct1` 指令的组件出现）
2. ~instruct1@group （指令延迟发送，直到出现分组命名`group`的组件）
3. ~instruct1#id1 （指令延迟发送，直到出现命名`id1`的组件）
如果你的组件是通过点击按钮这样通过判断来渲染出来的,那么事件的执行可以按下面的示例:
```javascript
this.$unicom('~onQuery111@industrialAnalyseFilterGroup', 'hello'); // 这个是发送组件未创建时的指令,指令将被缓存等待组件创建后触发onQuery111指令方法
this.$unicom('onQuery111@industrialAnalyseFilterGroup', 'hello111'); // 第二次向已经创建完成的组件发送指令onQuery111需要使用不带~号的形式
```
对应的组件
```javascript
<template>
<div>我不是初始化时就渲染</div>
</template>
<script>
export default {
unicomGroup: ['industrialAnalyseFilterGroup'],
// unicomId: 'aaaa',
unicom: {
// onQuery(sender, args) {
// console.log(sender, args, 11111111111);
// },
onQuery111(sender, p) {
console.log('hello: ', p);
}
},
data(){
return {
}
},
created(){}
}
</script>
```
##### 组件监听
组件监听使用，指令使用 ~ 打头， 第二个参数为 `callback` 回调
```
methods: {
doExec () {
this.$unicom('~#child-id', function(child){
// `child`组件创建完成，从 `child` 组件的`created`函数触发出来，所以请不要操作 `child`组件的 dom 元素，组件挂载请监听 this.$nextTick
})
}
}
```
1. ~@group （监听分组命名group的组件出现）
2. ~#id1 （监听命名id1的组件出现）
具体的使用 demo 请参考 v-demo 目录。
*****
注:
1.此插件原始地址：[vue-plugins](https://gitee.com/zhangh-design/vue-plugins)。
2.版权归原作者所有，仅为了方便，挂上插件市场。
3.对原作者表示感谢！
uni_modules/p-f-unicom/changelog.md
+2
View File
@@ -0,0 +1,2 @@
## 1.0.0（2023-02-02）
init
uni_modules/p-f-unicom/index.js
+369
View File
@@ -0,0 +1,369 @@
import _get from 'lodash/get'
import _set from 'lodash/set'
import _isEmpty from 'lodash/isEmpty'
import _isEqual from 'lodash/isEqual'
import _forEach from 'lodash/forEach'
import _isUndefined from 'lodash/isUndefined'
import _flattenDeep from 'lodash/flattenDeep'
import _toString from 'lodash/toString'
import _has from 'lodash/has'
import _includes from 'lodash/includes'
import _keys from 'lodash/keys'
import _isFunction from 'lodash/isFunction'
import _uniq from 'lodash/uniq'
import _flatMap from 'lodash/flatMap'
import _union from 'lodash/union'
/**
* @desc
* Vue 跨组件通信插件
*/
let unicomIdName = ''
let unicomGroupName = ''
// vm容器、分组、事件、命名 唯一、推迟触发的事件
const [vmMap, groupForVm, events, idForVm, sendDefer] = [new Map(), {}, {}, {}, []]
/**
* @desc 触发执行事件
* @param {string} method - 指令的名称
* @param {string} toKey - 目标组件的 unicomId 或者 unicomGroup
* @param {string} aim - 标识 （#）
* @param {Array} args - 参数
*/
const emitEvent = function (method, toKey, aim, args) {
const evs = _get(events, method, [])
let evLen = 0
const len = evs.length
// 循环已经注册的指令
for (evLen; evLen < len; evLen++) {
// 存储的数据
const { fn, scope } = evs[evLen]
if (_isEqual(aim, '#')) {
// id
if (scope[unicomIdName] !== toKey) {
// 目标不存在
continue
}
} else if (_isEqual(aim, '@')) {
// 分组
const group = _get(vmMap.get(scope), 'group', [])
if (_isEmpty(group) || _isEqual(_includes(group, toKey), false)) {
// 目标不存在
continue
}
}
_isEqual(_isUndefined(scope), false) && fn.apply(scope, args)
}
// 返回被触发的指令
return evLen
}
/**
* @desc 发送容器 或者 获得 目标容器
* @param {string} query - 指令名称 （~instruct1#id1）
* @param {...any} args - 可变参数
*/
const unicomQuery = function (query, ...args) {
let [toKey, aim, defer, eventIndex] = ['', '', false, -1]
// query=instruct1#id1
const method = query
.replace(/^([`~])/, function (s0, s1) {
// query=~instruct1#id1
if (_isEqual(s1, '~')) {
defer = true
}
return ''
})
.replace(/([@#])([^@#]*)$/, function (s0, s1, s2) {
// query=instruct1@child-a
// s0=@child-a s1=@ s2=child-a
toKey = s2
aim = s1
return ''
})
// method=instruct1
if (defer) {
sendDefer.push([method, toKey, aim, args, this])
return this
}
if (_isEqual(_isEqual(method, ''), false)) {
args.unshift(this)
eventIndex = emitEvent(method, toKey, aim, args)
}
// 获取目标 vm
switch (aim) {
case '#':
return _get(idForVm, toKey, null)
case '@':
return _get(groupForVm, toKey, [])
}
return eventIndex
}
/**
* @desc 更新分组
* @param {Object} scope - 组件的实例
* @param {string[]} nv - 指令 unicom-group 传入的组数据 （新）
* @param {string[]} [ov] - 指令 unicom-group 传入的组数据 （旧）
*/
const updateName = function (scope, nv, ov) {
// 实例上设置分组
const vmData = vmMap.get(scope) || {}
const group = _get(vmData, 'group', [])
// 删除旧的 vm
if (_isEqual(_isUndefined(ov), false)) {
_uniq(_flattenDeep(_flatMap(ov))).forEach(function (key) {
if (_includes(group, key)) {
const vms = _get(groupForVm, key, [])
_isEqual(_isEmpty(vms), false) && vms.splice(vms.indexOf(scope), 1)
if (_isEmpty(vms)) {
group.splice(group.indexOf(key), 1)
Reflect.deleteProperty(groupForVm, key)
}
}
})
}
// 增加新的
if (_isEqual(_isUndefined(nv), false)) {
_uniq(_flattenDeep(_flatMap(nv))).forEach(function (key) {
const vms = _get(groupForVm, key, [])
if (_isEmpty(vms)) {
_set(groupForVm, key, vms)
}
// 新添加 组件 到组里面
if (_isEqual(_includes(vms, scope), false)) {
vms.push(scope)
}
if (_isEqual(_includes(group, key), false)) {
group.push(key)
}
})
}
}
/**
* @desc 更新 unicomId
* @param {Object} scope - 组件的实例
* @param {string} newValue - 指令 unicom-id 传入的id数据 （新）
* @param {string} [oldValue] - 指令 unicom-id 传入的id数据 （旧）
*/
const updateId = function (scope, newValue, oldValue) {
if (_isEqual(newValue, oldValue)) {
return
}
if (_isEqual(_isUndefined(oldValue), false) && _isEqual(_get(idForVm, oldValue), scope)) {
// watch 监测值修改需要删除，组件销毁时需要删除
Reflect.deleteProperty(idForVm, oldValue)
}
if (_isEqual(_isUndefined(newValue), false) && _isEqual(_has(idForVm, newValue), false)) {
_set(idForVm, newValue, scope)
} else if (_isEqual(_isUndefined(newValue), false) && _has(idForVm, newValue)) {
console.warn(`${unicomIdName}='${newValue}'的组件已经定义并存在。`)
}
}
/**
* @desc 添加事件
* @param {string} method - 指令的名称
* @param {function} fn - 指令名称对应的函数
* @param {Object} scope - 指令名称对应函数所运行的作用域
*/
const appendEvent = function (method, fn, scope) {
if (_isEqual(_has(events, method), false)) {
events[method] = []
}
if (_isFunction(fn)) {
events[method].push({ fn, scope, method })
}
}
/**
* @desc 移除事件
* @param {string} method - 指令的名称
* @param {Object} scope - 指令名称对应函数所运行的作用域
*/
const removeEvent = function (method, scope) {
const evs = _get(events, method, [])
if (_isEqual(_isEmpty(evs), false)) {
for (let i = 0; i < evs.length; i++) {
if (_isEqual(scope, evs[i].scope)) {
evs.splice(i, 1)
}
}
}
}
export default {
install (Vue, { name = 'unicom', idName = `${name}Id`, groupName = `${name}Group` } = {}) {
// 添加原型方法 （unicomQuery 函数放在 install 外部不然无法获取调用函数的 this 对象）
Vue.prototype['$' + name] = unicomQuery
// unicom-id
unicomIdName = idName
// 分组 unicom-group
unicomGroupName = groupName
// 全局混入
Vue.mixin({
props: {
// 命名 unicom-id="id1"
[idName]: {
type: String,
default: ''
},
// 分组（纯字符串类数组不能是真实的数组） unicom-group="['child-a', 'child-b']"
[groupName]: {
type: Array,
default: () => []
}
},
watch: {
[idName] (nv, ov) {
updateId(this, nv, ov)
},
[groupName]: {
deep: true,
handler (nv, ov) {
updateName(this, nv, ov);
}
}
},
// 创建的时候加入事件机制
beforeCreate () {
const opt = this.$options
const vmData = {}
const [us, uni, group] = [
_get(opt, name, {}),
(vmData.uni = {}),
(vmData.group = [])
]
if (_isEqual(_isEmpty(us), false)) {
_forEach(us, opt => {
if (_isEmpty(opt)) {
return true
}
_forEach(opt, (handler, key) => {
if (_isEqual(_isUndefined(handler), false)) {
_isUndefined(_get(uni, key)) && _set(uni, key, [])
uni[key].push(handler)
// 添加事件
appendEvent(key, handler, this)
}
})
})
}
// 命名分组
const groupNameOpt = _get(opt, groupName, [])
if (_isEqual(_isEmpty(groupNameOpt), false)) {
_forEach(_uniq(_flattenDeep(_flatMap(groupNameOpt))), item => {
const key = _toString(item)
_isUndefined(_get(groupForVm, key)) && (groupForVm[key] = [])
group.push(key)
groupForVm[key].push(this)
})
}
if (_isEqual(_isEmpty(group), false) || _isEqual(_isEmpty(uni), false)) {
vmMap.set(this, vmData)
}
},
created () {
// 实例命名 唯一
const uId = this[idName]
const uGroupName = this[groupName]
_isEqual(_isEqual(uId, ''), false) && updateId(this, uId)
_isEqual(_isEmpty(uGroupName), false) && updateName(this, uGroupName)
// 实例上设置分组
const vmData = vmMap.get(this) || {}
for (let i = 0; i < sendDefer.length; i++) {
const [method, toKey, aim, args, scope] = sendDefer[i]
let flag = false
if (_isEqual(aim, '#')) {
if (_isEqual(toKey, uId)) {
flag = true
}
} else if (_isEqual(aim, '@')) {
if (
_isEqual(_isUndefined(_get(vmData, 'group')), false) &&
_includes(_get(vmData, 'group'), toKey)
) {
flag = true
}
} else {
if (
_isEqual(method, '') ||
_includes(_keys(_get(vmData, 'uni', {})), method)
) {
flag = true
}
}
if (flag) {
// 延后，并且方法为空
if (_isEqual(method, '')) {
/**
* @desc 监听组件事件
* @example
* this.$unicom('~#id1', function (childScope) {// unicomId=id1的组件创建完成})
*/
if (_isFunction(args[0])) {
args[0](this)
}
} else {
sendDefer.splice(i--, 1)
args.unshift(scope)
emitEvent(method, toKey, aim, args)
}
}
}
},
// 全局混合，销毁实例的时候销毁事件
destroyed () {
// 移除唯一ID
const uId = this[idName]
if (_isEqual(_isEqual(uId, ''), false)) {
updateId(this, undefined, uId)
}
// 移除 命名分组、实例命名
const uGroupName = _get(this, groupName, [])
const optGroupName = _get(this.$options, groupName, [])
if (_isEqual(_isEmpty(uGroupName), false) || _isEqual(_isEmpty(optGroupName), false)) {
updateName(this, undefined, _union(uGroupName, optGroupName))
}
const vmData = vmMap.get(this)
if (_isUndefined(vmData)) {
return
}
vmMap.delete(this)
const uni = _get(vmData, 'uni', {})
// 移除事件
for (const key in uni) {
removeEvent(key, this)
}
// 分组，一对多， 单个vm可以多个分组名称 组件命名
const group = _get(vmData, 'group', [])
_forEach(group, function (name) {
const gs = groupForVm[name]
if (_isEqual(_isUndefined(gs), false)) {
const index = gs.indexOf(this)
if (index > -1) {
gs.splice(index, 1)
}
if (gs.length === 0) {
delete groupForVm[name]
}
}
})
// 监控销毁 method为空
for (let i = 0; i < sendDefer.length;) {
const pms = sendDefer[i]
if (_isEqual(pms[0], '') && _isEqual(pms[4], this)) {
sendDefer.splice(i, 1)
} else {
i += 1
}
}
}
})
// 自定义属性合并策略
// 混入（mixins）时不是简单的覆盖而是追加
const merge = _get(Vue, 'config.optionMergeStrategies', {})
merge[name] = merge[unicomGroupName] = function (parentVal, childVal) {
const p = parentVal || []
if (_isEqual(_isUndefined(childVal), false)) {
p.push(childVal)
}
return p
}
}
}
uni_modules/p-f-unicom/package.json
+84
View File
@@ -0,0 +1,84 @@
{
"id": "p-f-unicom",
"displayName": "p-f-unicom",
"version": "1.0.0",
"description": "p-f-unicom",
"keywords": [
"p-f-unicom"
],
"repository": "https://gitee.com/zhangh-design/vue-plugins",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"type": "sdk-js",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"Vue": {
"vue2": "u",
"vue3": "u"
},
"App": {
"app-vue": "u",
"app-nvue": "u"
},
"H5-mobile": {
"Safari": "u",
"Android Browser": "u",
"微信浏览器(Android)": "u",
"QQ浏览器(Android)": "u"
},
"H5-pc": {
"Chrome": "u",
"IE": "u",
"Edge": "u",
"Firefox": "u",
"Safari": "u"
},
"小程序": {
"微信": "u",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u",
"钉钉": "u",
"快手": "u",
"飞书": "u",
"京东": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
},
"dependencies": {
"lodash": "^4.17.21"
}
}
uni_modules/zp-mixins/changelog.md
+14
View File
@@ -0,0 +1,14 @@
## 1.0.6（2023-04-12）
为防冲突，给selectComponent两个函数添加前缀zp
## 1.0.5（2023-03-28）
修复ts项目找不到setData的问题
## 1.0.4（2023-03-07）
修复小程序报错
## 1.0.3（2023-02-26）
修复pageLifetimes
## 1.0.2（2023-01-06）
增加使用文档
## 1.0.1（2022-12-07）
更新文档
## 1.0.0（2022-12-07）
init
uni_modules/zp-mixins/index.js
+52
View File
@@ -0,0 +1,52 @@
//lifetimes
import { pageLifetimes } from './lifecycle/pageLifetimes';
//methods
import { clone } from './methods/clone';
import { handleDataset } from './methods/dataset';
import { escape2Html, html2Escape } from './methods/escape';
import { parseEventDynamicCode } from './methods/event';
import { getTabBar } from './methods/getTabBar';
import { getRelationNodes } from './methods/relation';
import { selectComponent as zpSelectComponent,
selectAllComponents as zpSelectAllComponents } from './methods/selectComponent';
import { setData } from './methods/setData';
export default {
// #ifndef VUE3
install(Vue, option) {
Vue.mixin({
...pageLifetimes,
methods: {
clone,
handleDataset,
escape2Html,
html2Escape,
parseEventDynamicCode,
getTabBar,
getRelationNodes,
zpSelectComponent,
zpSelectAllComponents,
setData
}
})
}
// #endif
// #ifdef VUE3
...pageLifetimes,
methods: {
clone,
handleDataset,
escape2Html,
html2Escape,
parseEventDynamicCode,
getTabBar,
getRelationNodes,
zpSelectComponent,
zpSelectAllComponents,
setData
}
// #endif
}
uni_modules/zp-mixins/index.ts
+31
View File
@@ -0,0 +1,31 @@
import Vue from 'vue';
//lifetimes
import { pageLifetimes } from './lifecycle/pageLifetimes';
//methods
import { clone } from './methods/clone';
import { handleDataset } from './methods/dataset';
import { escape2Html, html2Escape } from './methods/escape';
import { parseEventDynamicCode } from './methods/event';
import { getTabBar } from './methods/getTabBar';
import { getRelationNodes } from './methods/relation';
import { selectComponent as zpSelectComponent, selectAllComponents as zpSelectAllComponents } from './methods/selectComponent';
import { setData } from './methods/setData';
// console.log("lifecycle", lifecycle)
export default Vue.extend({
...pageLifetimes,
methods: {
clone,
handleDataset,
escape2Html,
html2Escape,
parseEventDynamicCode,
getTabBar,
getRelationNodes,
zpSelectComponent,
zpSelectAllComponents,
setData
}
});
uni_modules/zp-mixins/lifecycle/index.js
+2
View File
@@ -0,0 +1,2 @@
export * from './pageLifetimes'
uni_modules/zp-mixins/lifecycle/pageLifetimes.js
+39
View File
@@ -0,0 +1,39 @@
/**
* 组件pageLifetimes处理，需在页面生命周期里调用
* @param {Object} node
* @param {Object} lifeName
*/
function handlePageLifetime(node, lifeName) {
node.$children.map(child => {
if (typeof child[lifeName] == 'function') child[lifeName]()
handlePageLifetime(child, lifeName)
})
}
export const pageLifetimes = {
onLoad() {
// uni.onWindowResize(CALLBACK) 监听窗口尺寸变化事件
// 平台差异说明
// App H5 微信小程序 支付宝小程序 百度小程序 抖音小程序 飞书小程序 QQ小程序
// √ √ √ x x x √ √
// #ifdef H5 || MP-LARK || MP-QQ
uni.onWindowResize((res) => {
handlePageLifetime(this, "handlePageResize")
})
// #endif
},
onShow() {
handlePageLifetime(this, "handlePageShow")
},
onHide() {
handlePageLifetime(this, "handlePageHide")
},
onResize() {
//onResize 监听窗口尺寸变化 App、微信小程序、快手小程序
// #ifdef APP || MP-WEIXIN || MP-KUAISHOU
handlePageLifetime(this, "handlePageResize")
// #endif
}
};
uni_modules/zp-mixins/methods/clone.js
+10
View File
@@ -0,0 +1,10 @@
/**
* 用于处理对props进行赋值的情况
* //简单处理一下就行了
*
* @param {*} target
* @returns
*/
export function clone(target) {
return JSON.parse(JSON.stringify(target))
}
uni_modules/zp-mixins/methods/dataset.js
+21
View File
@@ -0,0 +1,21 @@
/**
* 用于处理dataset
* 自定义组件的事件里，是获取不到e.currentTarget.dataset的
* 因此收集data-参数，手动传进去
*
* @param {*} event
* @param {*} dataSet
*/
export function handleDataset(event, dataSet = {}) {
if (event && !event.currentTarget) {
if (dataSet.tagId) {
event.currentTarget = {
id: dataSet.tagId
}
} else {
event.currentTarget = {
dataset: dataSet
}
}
}
}
uni_modules/zp-mixins/methods/escape.js
+36
View File
@@ -0,0 +1,36 @@
/**
* 转义符换成普通字符
* @param {*} str
* @returns
*/
export function escape2Html(str) {
if (!str) return str
var arrEntities = {
'lt': '<',
'gt': '>',
'nbsp': ' ',
'amp': '&',
'quot': '"'
}
return str.replace(/&(lt|gt|nbsp|amp|quot);/ig, function(all, t) {
return arrEntities[t]
})
}
/**
* 普通字符转换成转义符
* @param {*} sHtml
* @returns
*/
export function html2Escape(sHtml) {
if (!sHtml) return sHtml
return sHtml.replace(/[<>&"]/g, function(c) {
return {
'<': '&lt;',
'>': '&gt;',
'&': '&amp;',
'"': '&quot;'
} [c]
})
}
uni_modules/zp-mixins/methods/event.js
+10
View File
@@ -0,0 +1,10 @@
/**
* 解析事件里的动态函数名，这种没有()的函数名，在uniapp不被执行
* 比如：<view bindtap="{{openId==undefined?'denglu':'hy_to'}}">立即</view>
* @param {*} exp
*/
export function parseEventDynamicCode(e, exp) {
if (typeof(this[exp]) === 'function') {
this[exp](e)
}
}
uni_modules/zp-mixins/methods/getTabBar.js
+19
View File
@@ -0,0 +1,19 @@
/**
* 接管getTabBar函数，默认uni-app是没有这个函数的
* 适用于使用custom-tab-bar自定义导航栏的小程序项目
* 需注意：
* 1.custom-tab-bar下面仍是小程序文件
* 2.pages.json里面需使用条件编译区分好小程序和非小程序的tabBar配置
*/
export function getTabBar() {
return {
setData(obj) {
if (typeof this.$mp?.page?.getTabBar === 'function' &&
this.$mp?.page?.getTabBar()) {
this.$mp.page.getTabBar().setData(obj)
} else {
console.log("当前平台不支持getTabBar()，已稍作处理，详细请参见相关文档。")
}
}
}
}
uni_modules/zp-mixins/methods/index.js
+8
View File
@@ -0,0 +1,8 @@
export * from './clone'
export * from './dataset'
export * from './escape'
export * from './event'
export * from './getTabBar'
export * from './relation'
export * from './selectComponent'
export * from './setData'
uni_modules/zp-mixins/methods/relation.js
+10
View File
@@ -0,0 +1,10 @@
/**
* 组件间关系
* 注意：须与p-f-unicom配合使用！！！
* @param {*} name
* @returns
*/
export function getRelationNodes(name) {
if(!this.$unicom) throw "this.getRelationNodes()需与p-f-unicom配合使用！"
return this.$unicom('@' + name)
}
uni_modules/zp-mixins/methods/selectComponent.js
+196
View File
@@ -0,0 +1,196 @@
const createTraverse = () => {
let stop = false;
return function traverse(root, callback) {
if (!stop && typeof callback === 'function') {
let children = root.$children;
for (let index = 0; !stop && index < children.length; index++) {
let element = children[index];
stop = callback(element) === true;
traverse(element, callback);
}
}
};
};
/**
* 安全的JSON.stringify
* @param {Object} node
*/
function safeStringify(node) {
var cache = [];
var str = JSON.stringify(node, function(key, value) {
if (typeof value === 'object' && value !== null) {
if (cache.indexOf(value) !== -1) {
// 移除
return;
}
// 收集所有的值
cache.push(value);
}
return value;
});
cache = null; // 清空变量，便于垃圾回收机制回收
return str
}
const match = (node, selector) => {
var vnode = node._vnode;
//好家伙，在微信小程序里，node里面根本找不到class，因此这种方式没法搞了
//关键之处！
// console.log("attrs", (vnode.context.$vnode.data));
vnode = vnode?.context?.$vnode ?? ""
//console.log(vnode.data) --> [Object] {"staticClass":"bar","attrs":{"_i":0}} at selectComponent.js:72
if (!vnode || !vnode.data) {
return false
}
let attrs = vnode.data.attrs || {};
let staticClass = vnode.data.staticClass || '';
const id = attrs.id || '';
if (selector[0] === '#') {
return selector.substr(1) === id;
} else {
staticClass = staticClass.trim().split(' ');
selector = selector.substr(1).split('.');
return selector.reduce((a, c) => a && staticClass.includes(c), true);
}
};
const selectorBuilder = (selector) => {
selector = selector.replace(/>>>/g, '>');
selector = selector.split('>').map(s => {
return s.trim().split(' ').join(`').descendant('`);
}).join(`').child('`);
// 替换掉new Function方式，因为小程序不支持new Function和eval
//return new Function('Selector', 'node', 'all', `return new Selector(node, all).descendant('` + selector + `')`);
return function(Selector, node, all) {
return new Selector(node, all).descendant(selector)
}
};
class Selector {
constructor(node, all = false) {
this.nodes = [node];
this.all = all;
}
child(selector) {
let matches = [];
if (this.all) {
this.nodes.forEach(node => {
matches.push(...node.$children.filter(node => match(node, selector)));
});
} else {
if (this.nodes.length > 0) {
let node = this.nodes[0].$children.find(node => match(node, selector));
matches = node ? [node] : [];
}
}
this.nodes = matches;
return this;
}
descendant(selector) {
let matches = [];
this.nodes.forEach(root => {
createTraverse()(root, (node) => {
if (match(node, selector)) {
matches.push(node);
return !this.all;
}
});
});
this.nodes = matches;
return this;
}
}
////////////////////////////////////////////selectComponent//////////////////////////////////////////////////
/**
* 其他平台，如APP
* @param {Object} selector
*/
function selectComponentOther(selector) {
const selectors = selector.split(',').map(s => s.trim());
if (!selectors[0]) {
return null;
}
const querySelector = selectorBuilder(selectors[0]);
return querySelector(Selector, this, false, selector).nodes[0];
}
/**
* 还是用这个微信小程序的实现吧
* @param {Object} selector
*/
var selectComponentWeiXin2 = function(selector) {
console.log(".$scope",this.$scope.selectComponent(selector))
return this.$scope.selectComponent(selector)?.data || undefined
}
/**
* selectComponent
* @param {Object} args
*/
export function selectComponent(args) {
// console.log(".$scope",this.$scope)
// #ifdef MP
//H5和小程序能正常使用这个函数
//重写selectComponent函数，因为默认会多一层$vm
return selectComponentWeiXin2.call(this, args)
// #endif
// #ifndef MP
// 因App的结构略有差异,此函数无法正常使用
// function(e){return function e(t,n){if(n(t.$vnode||t._vnode))return t;for(var r=t.$children,i=0;i<r.length;i++){var o=e(r[i],n);if(o)return o}}(this,ov(e))}
// return selectComponentOther(args)
return selectComponentOther.call(this, args)
// #endif
}
////////////////////////////////////////////selectAllComponents//////////////////////////////////////////////////
/**
* 其他平台，如APP
* @param {Object} selector
*/
function selectAllComponentsOther(selector) {
const selectors = selector.split(',').map(s => s.trim());
let selected = [];
selectors.forEach(selector => {
const querySelector = selectorBuilder(selector);
selected = selected.concat(querySelector(Selector, this, true, selector).nodes);
});
return selected;
}
/**
* 还是用这个微信小程序的实现吧
* @param {Object} selector
*/
var selectAllComponentsWeiXin2 = function(selector) {
var list = this.$scope.selectAllComponents(selector) || []
list = list.map(item => item.data)
return list
}
/**
* selectAllComponents
* @param {Object} args
*/
export function selectAllComponents(args) {
// #ifdef MP
//H5和小程序能正常使用这个函数
//重写selectComponent函数，因为默认会多一层$vm
return selectAllComponentsWeiXin2.call(this, args)
// #endif
// #ifndef MP
// 因App的结构略有差异,此函数无法正常使用
return selectAllComponentsOther.call(this, args)
// #endif
}
uni_modules/zp-mixins/methods/setData.js
+90
View File
@@ -0,0 +1,90 @@
import _set from '../utils/_set'
import debounce from '../utils/debounce'
/**
* 老setData polyfill
* 用于转换后的uniapp的项目能直接使用this.setData()函数
* @param {*} obj
* @param {*} callback
*/
function oldSetData (obj, callback) {
let that = this
const handleData = (tepData, tepKey, afterKey) => {
var tepData2 = tepData
tepKey = tepKey.split('.')
tepKey.forEach(item => {
if (tepData[item] === null || tepData[item] === undefined) {
let reg = /^[0-9]+$/
tepData[item] = reg.test(afterKey) ? [] : {}
tepData2 = tepData[item]
} else {
tepData2 = tepData[item]
}
})
return tepData2
}
const isFn = function (value) {
return typeof value == 'function' || false
}
Object.keys(obj).forEach(function (key) {
let val = obj[key]
key = key.replace(/\]/g, '').replace(/\[/g, '.')
let front, after
let index_after = key.lastIndexOf('.')
if (index_after != -1) {
after = key.slice(index_after + 1)
front = handleData(that, key.slice(0, index_after), after)
} else {
after = key
front = that
}
if (front.$data && front.$data[after] === undefined) {
Object.defineProperty(front, after, {
get () {
return front.$data[after]
},
set (newValue) {
front.$data[after] = newValue
that.hasOwnProperty("$forceUpdate") && that.$forceUpdate()
},
enumerable: true,
configurable: true
})
front[after] = val
} else {
that.$set(front, after, val)
}
})
// this.$forceUpdate();
isFn(callback) && this.$nextTick(callback)
}
/**
* 变量名正则
*/
const variableNameReg = /^([^\x00-\xff]|[a-zA-Z_$])([^\x00-\xff]|[a-zA-Z0-9_$])*$/
/**
* 2022-10-31 重写setData
* 2023-05-08 增加微信“简易双向绑定”支持
* 用于转换后的uniapp的项目能直接使用this.setData()函数
* @param {Object} obj
* @param {Object} callback
*/
export function setData (obj, callback = null) {
Object.keys(obj).forEach((key) => {
_set(this, key, obj[key])
//处理微信“简易双向绑定”
if (variableNameReg.test(key) && key.endsWith("Clone")) {
let propName = key.replace(/Clone$/, "")
if (this.$options && this.$options.propsData[propName]) {
this.$emit(`update:${propName}`, obj[key])
}
}
})
this.$forceUpdate();
if (typeof callback == 'function') this.$nextTick(callback)
}
uni_modules/zp-mixins/package.json
+86
View File
@@ -0,0 +1,86 @@
{
"id": "zp-mixins",
"displayName": "zp-mixins",
"version": "1.0.6",
"description": "用于minipropgram-to-uniapp的mixins",
"keywords": [
"mixins",
"小程序",
"代码转换"
],
"repository": "https://github.com/zhangdaren/zp-mixins",
"engines": {
"HBuilderX": "^3.1.0"
},
"dcloudext": {
"type": "sdk-js",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"Vue": {
"vue2": "y",
"vue3": "y"
},
"App": {
"app-vue": "y",
"app-nvue": "n"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y",
"钉钉": "y",
"快手": "y",
"飞书": "y",
"京东": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
}
}
}
},
"dependencies": {
"tern": "^0.24.3"
}
}
uni_modules/zp-mixins/readme.md
+107
View File
@@ -0,0 +1,107 @@
# zp-mixins
本插件，基本无法单独使用。
为方便miniprogram-to-uniapp(小程序转uniapp项目)工具后续升级，特单独摘出做成插件，便于后续更新。
注意：
1.本插件仅限于miniprogram-to-uniapp(小程序转uni-app项目)转换工具使用，
2.如果是新项目或uni-app项目，建议还是使用vue/uni-app它自身支持的方式实现，效率更高些。
3.目前仅支持vue2/vue3的options写法。至于setup，因其天生弱化mixin，也无this，建议直接import导入按需使用吧~
# 安装
点击右侧 “使用 HBuilderX 导入插件” 按钮，并选择对应项目。
# 使用
在main.js文件里面增加引用，即可全局使用这些函数，如下所示：
```
import App from './App'
// 添加zpMixins
import zpMixins from '@/uni_modules/zp-mixins/index.js'
// #ifndef VUE3
import Vue from 'vue'
Vue.use(zpMixins)
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
// #endif
// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
const app = createSSRApp(App)
app.mixin(zpMixins)
return {
app
}
}
// #endif
```
注意：vue3项目仅支持Options API方式(setup API写法有点不同，不支持这种方式使用，建议直接通过import引入使用)。
# 功能介绍
## pageLifetimes(组件所在页面的生命周期)
处理组件里的pageLifetimes
## clone(深拷贝)
深拷贝的简单版本，未处理循环引用。
## handleDataset
用于处理dataset
在自定义组件的事件里，是获取不到e.currentTarget.dataset的
因此收集data-参数，手动传进去
## html2Escape 普通字符转换成转义符
用于替换wxParse为mp-html时使用
## escape2Html 转义符换成普通字符
暂未用上
## parseEventDynamicCode
解析事件里的动态函数名，这种没有()的函数名，在uniapp不被执行
比如：<view bindtap="{{openId==undefined?'denglu':'hy_to'}}">立即</view>
## getTabBar
实现小程序自定义组件的this.getTabBar().setData()函数
## getRelationNodes
获取组件间关系this.getRelationNodes()
注意：
1.须与p-f-unicom配合使用！
2.并不能与小程序的getRelationNodes相提并论，因为底层实现不一样
## selectComponent
## selectAllComponents
抹平各平台差异，实现类似于小程序的selectComponent和selectAllComponents函数。
使用方式与小程序一致。
注：新项目建议还是使用ref这种方式，获取组件实例。
## setData
1.实现setData函数，让uni-app也能支持使用setData函数。
2.实现微信“简易双向绑定”
注意：本函数仅为小程序转换uniapp项目所作的支撑，如uni-app项目里，最好还是使用this.xx这种方式。
uni_modules/zp-mixins/utils/_set.js
+26
View File
@@ -0,0 +1,26 @@
/**
* lodash set
* @param {*} obj
* @param {*} path
* @param {*} value
* @returns
*/
function _set(obj, path, value) {
if (Object(obj) !== obj) return obj // When obj is not an object
// If not yet an array, get the keys from the string-path
if (!Array.isArray(path)) path = path.toString().match(/[^.[\]]+/g) || []
path.slice(0, -1).reduce((a, c, i) => // Iterate all of them except the last one
Object(a[c]) === a[c] // Does the key exist and is its value an object?
// Yes: then follow that path
?
a[c]
// No: create the key. Is the next key a potential array-index?
:
a[c] = Math.abs(path[i + 1]) >> 0 === +path[i + 1] ? [] // Yes: assign a new array object
:
{}, // No: assign a new plain object
obj)[path[path.length - 1]] = value // Finally assign the value to the last key
return obj // Return the top-level object to allow chaining
}
export default _set
uni_modules/zp-mixins/utils/debounce.js
+17
View File
@@ -0,0 +1,17 @@
/**
* 防抖
* @param {Object} scope //引用的this，发现不显式传this，拿不到。
* @param {Object} fn
* @param {Object} delay
*/
let t = null
const debounce = function(scope, fn, delay) {
if (t !== null) {
clearTimeout(t)
}
t = setTimeout(() => {
scope[fn]()
}, delay)
}
export default debounce
unpackage/dist/dev/.automator/mp-weixin/.automator.json
Vendored
View File
unpackage/dist/dev/.sourcemap/mp-weixin/common/main.js.map
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/.sourcemap/mp-weixin/common/runtime.js.map
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/.sourcemap/mp-weixin/common/vendor.js.map
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/.sourcemap/mp-weixin/pages/index/index.js.map
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/.sourcemap/mp-weixin/pages/product-detail/product-detail.js.map
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/.sourcemap/mp-weixin/pages/products/products.js.map
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/mp-weixin/app.js
Vendored
+4
View File
@@ -0,0 +1,4 @@
require('./common/runtime.js')
require('./common/vendor.js')
require('./common/main.js')
unpackage/dist/dev/mp-weixin/app.json
Vendored
+39
View File
@@ -0,0 +1,39 @@
{
"pages": [
"pages/index/index",
"pages/products/products",
"pages/product-detail/product-detail"
],
"subPackages": [],
"window": {
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "印美达 Inkreach",
"backgroundColor": "#f5f5f5",
"backgroundTextStyle": "dark",
"enablePullDownRefresh": false
},
"tabBar": {
"color": "#999999",
"selectedColor": "#FF6800",
"backgroundColor": "#ffffff",
"borderStyle": "white",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页"
},
{
"pagePath": "pages/products/products",
"text": "产品"
}
]
},
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示"
}
},
"plugins": {},
"usingComponents": {}
}
unpackage/dist/dev/mp-weixin/app.wxss
Vendored
+3
View File
@@ -0,0 +1,3 @@
@import './common/main.wxss';
[data-custom-hidden="true"],[bind-data-custom-hidden="true"]{display: none !important;}
unpackage/dist/dev/mp-weixin/common/main.js
Vendored
+152
View File
@@ -0,0 +1,152 @@
(global["webpackJsonp"] = global["webpackJsonp"] || []).push([["common/main"],{
/***/ 0:
/*!*****************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/main.js ***!
\*****************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(wx, createApp) {
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4);
var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ 11));
__webpack_require__(/*! uni-pages */ 30);
var _App = _interopRequireDefault(__webpack_require__(/*! ./App */ 31));
var _index = _interopRequireDefault(__webpack_require__(/*! @/uni_modules/zp-mixins/index.js */ 37));
var _vue = _interopRequireDefault(__webpack_require__(/*! vue */ 25));
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
// @ts-ignore
wx.__webpack_require_UNI_MP_PLUGIN__ = __webpack_require__;
_vue.default.use(_index.default);
_vue.default.config.productionTip = false;
_App.default.mpType = 'app';
var app = new _vue.default(_objectSpread({}, _App.default));
createApp(app).$mount();
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/wx.js */ 1)["default"], __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["createApp"]))
/***/ }),
/***/ 31:
/*!*****************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/App.vue ***!
\*****************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./App.vue?vue&type=script&lang=js& */ 32);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony import */ var _App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./App.vue?vue&type=style&index=0&lang=css& */ 34);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js */ 36);
var render, staticRenderFns, recyclableRender, components
var renderjs
/* normalize component */
var component = Object(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__["default"])(
_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"],
render,
staticRenderFns,
false,
null,
null,
null,
false,
components,
renderjs
)
component.options.__file = "App.vue"
/* harmony default export */ __webpack_exports__["default"] = (component.exports);
/***/ }),
/***/ 32:
/*!******************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/App.vue?vue&type=script&lang=js& ***!
\******************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./App.vue?vue&type=script&lang=js& */ 33);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 33:
/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/App.vue?vue&type=script&lang=js& ***!
\*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(uni) {
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _default = {
data: function data() {
return {};
},
globalData: {
userInfo: null,
baseUrl: 'https://api.inkreach.com'
},
onLaunch: function onLaunch() {
var sysInfo = uni.getWindowInfo();
this.globalData.statusBarHeight = sysInfo.statusBarHeight;
this.globalData.windowWidth = sysInfo.windowWidth;
this.globalData.windowHeight = sysInfo.windowHeight;
}
};
exports.default = _default;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["default"]))
/***/ }),
/***/ 34:
/*!**************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/App.vue?vue&type=style&index=0&lang=css& ***!
\**************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src??ref--6-oneOf-1-3!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./App.vue?vue&type=style&index=0&lang=css& */ 35);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_App_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 35:
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!./node_modules/postcss-loader/src??ref--6-oneOf-1-3!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/App.vue?vue&type=style&index=0&lang=css& ***!
\******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// extracted by mini-css-extract-plugin
if(false) { var cssReload; }
/***/ })
},[[0,"common/runtime","common/vendor"]]]);
//# sourceMappingURL=../../.sourcemap/mp-weixin/common/main.js.map
unpackage/dist/dev/mp-weixin/common/main.wxss
Vendored
+208
View File
@@ -0,0 +1,208 @@
/* 全局样式 - 印美达 Inkreach 微信小程序 */
page {
--color-primary: #ff6800;
--color-primary-light: #fff0e5;
--color-primary-dark: #e55a00;
--color-secondary: #f26522;
--color-dark: #121212;
--color-text-primary: #333333;
--color-text-secondary: #666666;
--color-text-tertiary: #999999;
--color-bg-page: #f5f5f5;
--color-bg-card: #ffffff;
--color-border: #eeeeee;
--color-tag-bg: #f2f2f2;
--color-success: #52c41a;
--color-warning: #faad14;
--radius-sm: 8rpx;
--radius-md: 12rpx;
--radius-lg: 20rpx;
--radius-xl: 32rpx;
--spacing-xs: 8rpx;
--spacing-sm: 16rpx;
--spacing-md: 24rpx;
--spacing-lg: 32rpx;
--spacing-xl: 48rpx;
font-size: 28rpx;
color: var(--color-text-primary);
background-color: var(--color-bg-page);
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Helvetica Neue', sans-serif;
}
/* 通用样式 */
.container {
min-height: 100vh;
background-color: var(--color-bg-page);
}
.flex-row {
display: flex;
flex-direction: row;
align-items: center;
}
.flex-col {
display: flex;
flex-direction: column;
}
.flex-center {
display: flex;
align-items: center;
justify-content: center;
}
.flex-between {
display: flex;
align-items: center;
justify-content: space-between;
}
.flex-1 {
flex: 1;
}
.flex-wrap {
display: flex;
flex-wrap: wrap;
}
/* 文字样式 */
.text-primary {
color: var(--color-primary);
}
.text-secondary {
color: var(--color-text-secondary);
}
.text-tertiary {
color: var(--color-text-tertiary);
}
.text-white {
color: #ffffff;
}
.text-bold {
font-weight: 600;
}
.text-center {
text-align: center;
}
.text-sm {
font-size: 24rpx;
}
.text-md {
font-size: 28rpx;
}
.text-lg {
font-size: 32rpx;
}
.text-xl {
font-size: 40rpx;
}
.text-xxl {
font-size: 56rpx;
}
/* 间距 */
.mt-xs {
margin-top: 8rpx;
}
.mt-sm {
margin-top: 16rpx;
}
.mt-md {
margin-top: 24rpx;
}
.mt-lg {
margin-top: 32rpx;
}
.mt-xl {
margin-top: 48rpx;
}
.mb-xs {
margin-bottom: 8rpx;
}
.mb-sm {
margin-bottom: 16rpx;
}
.mb-md {
margin-bottom: 24rpx;
}
.mb-lg {
margin-bottom: 32rpx;
}
.p-sm {
padding: 16rpx;
}
.p-md {
padding: 24rpx;
}
.p-lg {
padding: 32rpx;
}
.px-md {
padding-left: 24rpx;
padding-right: 24rpx;
}
.px-lg {
padding-left: 32rpx;
padding-right: 32rpx;
}
/* 按钮 */
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
background-color: var(--color-primary);
color: #ffffff;
font-size: 28rpx;
font-weight: 500;
padding: 20rpx 48rpx;
border-radius: var(--radius-lg);
border: none;
line-height: 1.5;
}
.btn-primary::after {
border: none;
}
.btn-outline {
display: inline-flex;
align-items: center;
justify-content: center;
background-color: transparent;
color: var(--color-primary);
font-size: 28rpx;
font-weight: 500;
padding: 20rpx 48rpx;
border-radius: var(--radius-lg);
border: 2rpx solid var(--color-primary);
line-height: 1.5;
}
.btn-outline::after {
border: none;
}
/* 卡片 */
.card {
background-color: var(--color-bg-card);
border-radius: var(--radius-md);
padding: 24rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}
/* 标签 */
.tag {
display: inline-flex;
align-items: center;
padding: 4rpx 16rpx;
border-radius: var(--radius-sm);
font-size: 20rpx;
background-color: var(--color-tag-bg);
color: var(--color-text-secondary);
}
.tag-primary {
background-color: var(--color-primary-light);
color: var(--color-primary);
}
/* 分割线 */
.divider {
width: 100%;
height: 1rpx;
background-color: var(--color-border);
}
/* 安全区底部 */
.safe-bottom {
padding-bottom: env(safe-area-inset-bottom);
}
unpackage/dist/dev/mp-weixin/common/runtime.js
Vendored
+158
View File
@@ -0,0 +1,158 @@
!function(){try{var a=Function("return this")();a&&!a.Math&&(Object.assign(a,{isFinite:isFinite,Array:Array,Date:Date,Error:Error,Function:Function,Math:Math,Object:Object,RegExp:RegExp,String:String,TypeError:TypeError,setTimeout:setTimeout,clearTimeout:clearTimeout,setInterval:setInterval,clearInterval:clearInterval}),"undefined"!=typeof Reflect&&(a.Reflect=Reflect))}catch(a){}}();
/******/ (function(modules) { // webpackBootstrap
/******/ // install a JSONP callback for chunk loading
/******/ function webpackJsonpCallback(data) {
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var executeModules = data[2];
/******/
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0, resolves = [];
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ resolves.push(installedChunks[chunkId][0]);
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ for(moduleId in moreModules) {
/******/ if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {
/******/ modules[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(parentJsonpFunction) parentJsonpFunction(data);
/******/
/******/ while(resolves.length) {
/******/ resolves.shift()();
/******/ }
/******/
/******/ // add entry modules from loaded chunk to deferred list
/******/ deferredModules.push.apply(deferredModules, executeModules || []);
/******/
/******/ // run deferred modules when all chunks ready
/******/ return checkDeferredModules();
/******/ };
/******/ function checkDeferredModules() {
/******/ var result;
/******/ for(var i = 0; i < deferredModules.length; i++) {
/******/ var deferredModule = deferredModules[i];
/******/ var fulfilled = true;
/******/ for(var j = 1; j < deferredModule.length; j++) {
/******/ var depId = deferredModule[j];
/******/ if(installedChunks[depId] !== 0) fulfilled = false;
/******/ }
/******/ if(fulfilled) {
/******/ deferredModules.splice(i--, 1);
/******/ result = __webpack_require__(__webpack_require__.s = deferredModule[0]);
/******/ }
/******/ }
/******/
/******/ return result;
/******/ }
/******/
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "common/runtime": 0
/******/ };
/******/
/******/ var deferredModules = [];
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/";
/******/
/******/ var jsonpArray = global["webpackJsonp"] = global["webpackJsonp"] || [];
/******/ var oldJsonpFunction = jsonpArray.push.bind(jsonpArray);
/******/ jsonpArray.push = webpackJsonpCallback;
/******/ jsonpArray = jsonpArray.slice();
/******/ for(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);
/******/ var parentJsonpFunction = oldJsonpFunction;
/******/
/******/
/******/ // run deferred modules from other chunks
/******/ checkDeferredModules();
/******/ })
/************************************************************************/
/******/ ([]);
//# sourceMappingURL=../../.sourcemap/mp-weixin/common/runtime.js.map
unpackage/dist/dev/mp-weixin/common/vendor.js
Vendored
+12756
View File
File diff suppressed because it is too large Load Diff
unpackage/dist/dev/mp-weixin/pages/index/index.js
Vendored
+664
View File
@@ -0,0 +1,664 @@
(global["webpackJsonp"] = global["webpackJsonp"] || []).push([["pages/index/index"],{
/***/ 49:
/*!**************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/main.js?{"page":"pages%2Findex%2Findex"} ***!
\**************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(wx, createPage) {
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4);
__webpack_require__(/*! uni-pages */ 30);
var _vue = _interopRequireDefault(__webpack_require__(/*! vue */ 25));
var _index = _interopRequireDefault(__webpack_require__(/*! ./pages/index/index.vue */ 50));
// @ts-ignore
wx.__webpack_require_UNI_MP_PLUGIN__ = __webpack_require__;
createPage(_index.default);
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/wx.js */ 1)["default"], __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["createPage"]))
/***/ }),
/***/ 50:
/*!*******************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue ***!
\*******************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index.vue?vue&type=template&id=57280228& */ 51);
/* harmony import */ var _index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./index.vue?vue&type=script&lang=js& */ 53);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony import */ var _index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./index.vue?vue&type=style&index=0&lang=css& */ 55);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js */ 36);
var renderjs
/* normalize component */
var component = Object(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__["default"])(
_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["render"],
_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
false,
null,
null,
null,
false,
_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["components"],
renderjs
)
component.options.__file = "pages/index/index.vue"
/* harmony default export */ __webpack_exports__["default"] = (component.exports);
/***/ }),
/***/ 51:
/*!**************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue?vue&type=template&id=57280228& ***!
\**************************************************************************************************/
/*! exports provided: render, staticRenderFns, recyclableRender, components */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--17-0!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./index.vue?vue&type=template&id=57280228& */ 52);
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["render"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["recyclableRender"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "components", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_template_id_57280228___WEBPACK_IMPORTED_MODULE_0__["components"]; });
/***/ }),
/***/ 52:
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--17-0!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue?vue&type=template&id=57280228& ***!
\**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! exports provided: render, staticRenderFns, recyclableRender, components */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return recyclableRender; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "components", function() { return components; });
var components
var render = function () {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
}
var recyclableRender = false
var staticRenderFns = []
render._withStripped = true
/***/ }),
/***/ 53:
/*!********************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue?vue&type=script&lang=js& ***!
\********************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./index.vue?vue&type=script&lang=js& */ 54);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 54:
/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue?vue&type=script&lang=js& ***!
\***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(uni) {
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var _default = {
data: function data() {
return {
statusBarHeight: 20,
currentStep: 2,
stepEmoji: '🎨',
stepDesc: '使用在线设计工具创建你的专属图案，支持上传图片、添加文字、智能排版',
activeCategory: 'all',
categories: [{
id: 'all',
name: '全部'
}, {
id: 'tshirt',
name: 'T恤'
}, {
id: 'hoodie',
name: '卫衣'
}, {
id: 'bag',
name: '包包'
}, {
id: 'kids',
name: '童装'
}, {
id: 'home',
name: '家居'
}],
previewProducts: [{
id: 1,
name: '180G牛奶丝T恤 DG120',
price: '28.00',
color: '#F5F5F5',
emoji: '👕'
}, {
id: 2,
name: '纯棉连帽卫衣 HD200',
price: '59.00',
color: '#E8E8E8',
emoji: '🧥'
}, {
id: 3,
name: '帆布托特包 BG150',
price: '15.00',
color: '#F0F0F0',
emoji: '👜'
}, {
id: 4,
name: '儿童纯棉T恤 KD100',
price: '22.00',
color: '#F8F8F8',
emoji: '👶'
}],
features: [{
id: 1,
title: '设计工具',
desc: '在线设计器，海量模板自由创作',
emoji: '🎨',
bgColor: '#FFF0E5'
}, {
id: 2,
title: '自动化履约',
desc: '订单自动分配工厂生产发货',
emoji: '⚙️',
bgColor: '#E5F5FF'
}, {
id: 3,
title: '全球配送',
desc: '覆盖200+国家地区快速达',
emoji: '🌍',
bgColor: '#F0FFE5'
}, {
id: 4,
title: '店铺集成',
desc: '对接Shopify等主流平台',
emoji: '🔗',
bgColor: '#FFF5E5'
}],
reasons: [{
id: 1,
title: '零库存',
desc: '无需囤货按需生产',
emoji: '📦'
}, {
id: 2,
title: '快速生产',
desc: '48小时极速出货',
emoji: '⚡'
}, {
id: 3,
title: '优质产品',
desc: '严格品质管控',
emoji: '✨'
}, {
id: 4,
title: '全球配送',
desc: '覆盖200+国家',
emoji: '🚀'
}],
companyStats: [{
value: '5000+',
label: '合作卖家'
}, {
value: '500+',
label: '合作工厂'
}, {
value: '20+',
label: '覆盖国家'
}, {
value: '1000万+',
label: '订单履约'
}],
cases: [{
id: 1,
title: '潮牌T恤定制',
tags: ['T恤', '烫画'],
roi: '260%',
revenue: '$12K',
bgColor: '#F5F5F5',
emoji: '👕'
}, {
id: 2,
title: '连帽卫衣品牌',
tags: ['卫衣', '刺绣'],
roi: '300%',
revenue: '$25K',
bgColor: '#E8E8E8',
emoji: '🧥'
}, {
id: 3,
title: '环保帆布包',
tags: ['包包', '丝印'],
roi: '180%',
revenue: '$8K',
bgColor: '#F0F0F0',
emoji: '👜'
}],
tag: ''
};
},
onLoad: function onLoad() {
var app = getApp();
this.setData({
statusBarHeight: app.globalData.statusBarHeight || 20
});
},
methods: {
selectStep: function selectStep(e) {
var step = e.currentTarget.dataset.step;
var stepData = {
1: {
emoji: '📦',
desc: '从全球POD货盘中选择热销产品，涵盖服装、配饰、家居等多品类'
},
2: {
emoji: '🎨',
desc: '使用在线设计工具创建你的专属图案，支持上传图片、添加文字、智能排版'
},
3: {
emoji: '🛒',
desc: '一键发布到Shopify、TikTok Shop等主流电商平台，自动同步商品信息'
},
4: {
emoji: '🚚',
desc: '订单自动分配至最近工厂生产，全球物流配送直达消费者手中'
}
};
this.setData({
currentStep: step,
stepEmoji: stepData[step].emoji,
stepDesc: stepData[step].desc
});
},
selectCategory: function selectCategory(e) {
this.setData({
activeCategory: e.currentTarget.dataset.id
});
},
goProducts: function goProducts() {
uni.switchTab({
url: '/pages/products/products'
});
},
goHome: function goHome() {
uni.pageScrollTo({
scrollTop: 0,
duration: 300
});
},
goProductDetail: function goProductDetail(e) {
var id = e.currentTarget.dataset.id;
uni.navigateTo({
url: "/pages/product-detail/product-detail?id=".concat(id)
});
}
}
};
exports.default = _default;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["default"]))
/***/ }),
/***/ 55:
/*!****************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue?vue&type=style&index=0&lang=css& ***!
\****************************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src??ref--6-oneOf-1-3!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./index.vue?vue&type=style&index=0&lang=css& */ 56);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 56:
/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!./node_modules/postcss-loader/src??ref--6-oneOf-1-3!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/index/index.vue?vue&type=style&index=0&lang=css& ***!
\********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// extracted by mini-css-extract-plugin
if(false) { var cssReload; }
/***/ })
},[[49,"common/runtime","common/vendor"]]]);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/index/index.js.map
unpackage/dist/dev/mp-weixin/pages/index/index.json
Vendored
+5
View File
@@ -0,0 +1,5 @@
{
"navigationBarTitleText": "印美达 Inkreach",
"navigationStyle": "custom",
"usingComponents": {}
}
unpackage/dist/dev/mp-weixin/pages/index/index.wxml
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/mp-weixin/pages/index/index.wxss
Vendored
+724
View File
@@ -0,0 +1,724 @@
/* 首页样式 - 印美达 Inkreach */
.home {
min-height: 100vh;
background: #ffffff;
overflow-x: hidden;
}
/* 导航栏 */
.nav-bar {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
background: #ffffff;
box-shadow: 0 1rpx 0 rgba(0, 0, 0, 0.05);
}
.nav-content {
height: 88rpx;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 32rpx;
}
.nav-logo {
display: flex;
align-items: baseline;
gap: 8rpx;
}
.logo-text {
font-size: 32rpx;
font-weight: 700;
color: #ff6800;
font-style: italic;
}
.logo-cn {
font-size: 24rpx;
color: #333;
font-weight: 500;
}
.nav-actions {
display: flex;
align-items: center;
gap: 24rpx;
}
.nav-btn {
font-size: 26rpx;
color: #333;
}
.nav-login {
font-size: 24rpx;
color: #ff6800;
border: 2rpx solid #ff6800;
padding: 8rpx 24rpx;
border-radius: 32rpx;
}
/* Hero 首屏 */
.hero {
position: relative;
padding: 60rpx 32rpx 80rpx;
overflow: hidden;
background: linear-gradient(180deg, #fff5ee 0%, #ffffff 100%);
}
.hero-bg {
position: absolute;
top: -100rpx;
right: -200rpx;
width: 600rpx;
height: 600rpx;
background: radial-gradient(circle, rgba(255, 104, 0, 0.06) 0%, transparent 70%);
border-radius: 50%;
}
.hero-content {
position: relative;
z-index: 2;
}
.hero-title {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.hero-title-main {
font-size: 72rpx;
font-weight: 800;
color: #1a1a1a;
line-height: 1.2;
letter-spacing: 2rpx;
}
.hero-subtitle {
font-size: 30rpx;
color: #666;
margin-top: 24rpx;
}
.hero-tags {
display: flex;
gap: 16rpx;
margin-top: 32rpx;
}
.hero-tag {
font-size: 22rpx;
color: #ff6800;
background: rgba(255, 104, 0, 0.08);
padding: 8rpx 20rpx;
border-radius: 24rpx;
font-weight: 500;
}
.hero-cta {
display: inline-flex;
align-items: center;
justify-content: center;
background: #ff6800;
color: #ffffff;
font-size: 30rpx;
font-weight: 600;
padding: 24rpx 64rpx;
border-radius: 48rpx;
margin-top: 48rpx;
box-shadow: 0 8rpx 24rpx rgba(255, 104, 0, 0.3);
}
/* 3D插画区 */
.hero-illustration {
position: relative;
height: 400rpx;
margin-top: 40rpx;
}
.hero-illust-item {
position: absolute;
}
.hero-illist-tshirt {
top: 20rpx;
left: 20rpx;
-webkit-transform: rotate(-8deg);
transform: rotate(-8deg);
}
.hero-illist-bag {
top: 60rpx;
right: 40rpx;
-webkit-transform: rotate(12deg);
transform: rotate(12deg);
}
.hero-illist-box {
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%) rotate(-3deg);
transform: translateX(-50%) rotate(-3deg);
}
.illust-placeholder {
border-radius: 24rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 80rpx;
}
.illust-placeholder.tshirt {
width: 200rpx;
height: 220rpx;
background: linear-gradient(135deg, #ff6800 0%, #ff8c40 100%);
}
.illust-placeholder.bag {
width: 180rpx;
height: 200rpx;
background: linear-gradient(135deg, #f26522 0%, #ff8855 100%);
}
.illust-placeholder.box {
width: 240rpx;
height: 180rpx;
background: linear-gradient(135deg, #ff6800 0%, #ffa040 100%);
}
/* 通用 section */
.section-title {
font-size: 40rpx;
font-weight: 700;
color: #1a1a1a;
text-align: center;
display: block;
}
.section-subtitle {
font-size: 26rpx;
color: #999;
text-align: center;
margin-top: 12rpx;
display: block;
}
.section-title-small {
font-size: 28rpx;
color: #666;
text-align: center;
display: block;
margin-bottom: 32rpx;
}
/* 信任指标 */
.trust-section {
padding: 64rpx 32rpx;
background: #ffffff;
}
.trust-grid {
display: flex;
flex-wrap: wrap;
gap: 24rpx;
}
.trust-card {
flex: 1;
min-width: 160rpx;
background: #fff8f3;
border-radius: 16rpx;
padding: 28rpx 16rpx;
text-align: center;
}
.trust-number {
font-size: 40rpx;
font-weight: 700;
color: #ff6800;
display: block;
}
.trust-label {
font-size: 24rpx;
color: #666;
margin-top: 8rpx;
display: block;
}
/* 4步流程 */
.steps-section {
padding: 64rpx 32rpx;
background: #fafafa;
}
.steps-list {
margin-top: 40rpx;
}
.step-item {
display: flex;
align-items: center;
padding: 24rpx;
background: #ffffff;
border-radius: 16rpx;
margin-bottom: 16rpx;
transition: all 0.3s;
border: 2rpx solid transparent;
}
.step-item.active {
border-color: #ff6800;
box-shadow: 0 4rpx 16rpx rgba(255, 104, 0, 0.1);
}
.step-number {
font-size: 36rpx;
font-weight: 800;
color: #ddd;
width: 80rpx;
flex-shrink: 0;
}
.step-item.active .step-number {
color: #ff6800;
}
.step-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 6rpx;
}
.step-title {
font-size: 30rpx;
font-weight: 600;
color: #333;
}
.step-desc {
font-size: 24rpx;
color: #999;
}
.step-visual {
margin-top: 32rpx;
}
.step-visual-card {
background: #ffffff;
border-radius: 20rpx;
padding: 48rpx 32rpx;
text-align: center;
border: 2rpx solid #ff6800;
}
.step-visual-icon {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
background: #fff0e5;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 24rpx;
}
.step-visual-emoji {
font-size: 56rpx;
}
.step-visual-text {
font-size: 28rpx;
color: #666;
line-height: 1.6;
}
/* 全球POD货盘 */
.catalog-section {
padding: 64rpx 0;
background: #ffffff;
}
.catalog-section .section-title {
padding: 0 32rpx;
}
.category-tabs {
white-space: nowrap;
padding: 24rpx 32rpx;
}
.cat-tab {
display: inline-block;
padding: 12rpx 32rpx;
margin-right: 16rpx;
font-size: 26rpx;
color: #666;
background: #f5f5f5;
border-radius: 32rpx;
transition: all 0.3s;
}
.cat-tab.active {
background: #ff6800;
color: #ffffff;
}
.product-preview-grid {
display: flex;
flex-wrap: wrap;
padding: 0 32rpx;
gap: 24rpx;
}
.product-preview-card {
width: calc(50% - 12rpx);
background: #ffffff;
border-radius: 16rpx;
overflow: hidden;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
}
.product-preview-img {
width: 100%;
height: 280rpx;
display: flex;
align-items: center;
justify-content: center;
}
.product-preview-emoji {
font-size: 80rpx;
}
.product-preview-info {
padding: 16rpx;
}
.product-preview-name {
font-size: 26rpx;
color: #333;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.product-preview-price {
font-size: 28rpx;
color: #ff6800;
font-weight: 600;
margin-top: 8rpx;
display: block;
}
.see-more {
display: flex;
align-items: center;
justify-content: center;
gap: 8rpx;
padding: 24rpx;
font-size: 28rpx;
color: #ff6800;
}
.see-more .arrow {
font-size: 24rpx;
}
/* 平台功能 */
.features-section {
padding: 64rpx 32rpx;
background: #fafafa;
}
.features-grid {
display: flex;
flex-wrap: wrap;
gap: 24rpx;
margin-top: 40rpx;
}
.feature-card {
width: calc(50% - 12rpx);
background: #ffffff;
border-radius: 16rpx;
padding: 32rpx 24rpx;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 12rpx;
}
.feature-icon {
width: 80rpx;
height: 80rpx;
border-radius: 20rpx;
display: flex;
align-items: center;
justify-content: center;
}
.feature-emoji {
font-size: 40rpx;
}
.feature-title {
font-size: 30rpx;
font-weight: 600;
color: #333;
}
.feature-desc {
font-size: 24rpx;
color: #999;
line-height: 1.5;
}
/* 为什么选择 */
.why-section {
padding: 64rpx 32rpx;
background: #ffffff;
}
.why-grid {
display: flex;
flex-wrap: wrap;
gap: 24rpx;
margin-top: 40rpx;
}
.why-card {
width: calc(50% - 12rpx);
text-align: center;
padding: 32rpx 16rpx;
background: #fff8f3;
border-radius: 16rpx;
}
.why-icon {
width: 72rpx;
height: 72rpx;
margin: 0 auto 16rpx;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
border-radius: 50%;
}
.why-emoji {
font-size: 36rpx;
}
.why-title {
font-size: 28rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 8rpx;
}
.why-desc {
font-size: 22rpx;
color: #999;
display: block;
}
/* 公司简介 */
.company-section {
padding: 64rpx 32rpx;
background: #fafafa;
}
.company-card {
background: #ffffff;
border-radius: 20rpx;
padding: 40rpx 32rpx;
margin-top: 32rpx;
}
.company-headline {
display: flex;
flex-direction: column;
font-size: 32rpx;
font-weight: 600;
color: #1a1a1a;
line-height: 1.6;
margin-bottom: 32rpx;
}
.company-content {
display: flex;
flex-direction: column;
gap: 24rpx;
}
.company-block-title {
font-size: 26rpx;
font-weight: 600;
color: #ff6800;
display: block;
margin-bottom: 8rpx;
}
.company-block-text {
font-size: 24rpx;
color: #666;
line-height: 1.7;
}
.company-stats {
display: flex;
justify-content: space-around;
margin-top: 32rpx;
padding-top: 32rpx;
border-top: 1rpx solid #eee;
}
.company-stat {
text-align: center;
}
.company-stat-number {
font-size: 36rpx;
font-weight: 700;
color: #ff6800;
display: block;
}
.company-stat-label {
font-size: 22rpx;
color: #999;
margin-top: 4rpx;
display: block;
}
/* 用户案例 */
.cases-section {
padding: 64rpx 0;
background: #ffffff;
}
.cases-section .section-title {
padding: 0 32rpx;
}
.cases-scroll {
white-space: nowrap;
padding: 32rpx;
}
.case-card {
display: inline-block;
width: 480rpx;
background: #ffffff;
border-radius: 20rpx;
overflow: hidden;
margin-right: 24rpx;
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
vertical-align: top;
}
.case-image {
width: 100%;
height: 320rpx;
display: flex;
align-items: center;
justify-content: center;
}
.case-emoji {
font-size: 80rpx;
}
.case-info {
padding: 24rpx;
}
.case-title {
font-size: 28rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 12rpx;
}
.case-tags {
display: flex;
gap: 8rpx;
margin-bottom: 16rpx;
}
.case-tag {
font-size: 20rpx;
padding: 4rpx 12rpx;
background: #fff0e5;
color: #ff6800;
border-radius: 8rpx;
}
.case-metrics {
display: flex;
gap: 24rpx;
padding-top: 16rpx;
border-top: 1rpx solid #eee;
}
.case-metric-value {
font-size: 32rpx;
font-weight: 700;
color: #ff6800;
display: block;
}
.case-metric-label {
font-size: 22rpx;
color: #999;
display: block;
}
/* 最终CTA */
.cta-section {
position: relative;
padding: 80rpx 32rpx;
overflow: hidden;
}
.cta-bg {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(135deg, #ff6800 0%, #ff8c40 100%);
}
.cta-content {
position: relative;
z-index: 2;
text-align: center;
}
.cta-title {
display: flex;
flex-direction: column;
font-size: 48rpx;
font-weight: 700;
color: #ffffff;
line-height: 1.4;
}
.cta-desc {
font-size: 26rpx;
color: rgba(255, 255, 255, 0.85);
margin-top: 16rpx;
display: block;
}
.cta-input-wrap {
display: flex;
gap: 16rpx;
margin-top: 40rpx;
padding: 0 16rpx;
}
.cta-input {
flex: 1;
height: 80rpx;
background: rgba(255, 255, 255, 0.95);
border-radius: 40rpx;
padding: 0 32rpx;
font-size: 26rpx;
color: #333;
}
.cta-placeholder {
color: #ccc;
}
.cta-btn {
display: flex;
align-items: center;
justify-content: center;
background: #1a1a1a;
color: #ffffff;
font-size: 28rpx;
font-weight: 600;
padding: 0 40rpx;
border-radius: 40rpx;
}
/* 底部 */
.footer {
background: #121212;
padding: 48rpx 32rpx;
padding-bottom: calc(48rpx + env(safe-area-inset-bottom));
}
.footer-top {
text-align: center;
margin-bottom: 40rpx;
}
.footer-logo {
display: flex;
align-items: baseline;
justify-content: center;
gap: 8rpx;
margin-bottom: 16rpx;
}
.footer-logo-en {
font-size: 36rpx;
font-weight: 700;
color: #ff6800;
font-style: italic;
}
.footer-logo-cn {
font-size: 28rpx;
color: #fff;
}
.footer-slogan {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.5);
}
.footer-links {
display: flex;
justify-content: space-around;
margin-bottom: 40rpx;
}
.footer-col {
display: flex;
flex-direction: column;
gap: 12rpx;
}
.footer-col-title {
font-size: 26rpx;
font-weight: 600;
color: #fff;
margin-bottom: 8rpx;
}
.footer-link {
font-size: 22rpx;
color: rgba(255, 255, 255, 0.5);
}
.footer-bottom {
text-align: center;
padding-top: 32rpx;
border-top: 1rpx solid rgba(255, 255, 255, 0.1);
}
.footer-copyright {
font-size: 20rpx;
color: rgba(255, 255, 255, 0.3);
}
unpackage/dist/dev/mp-weixin/pages/product-detail/product-detail.js
Vendored
+444
View File
@@ -0,0 +1,444 @@
(global["webpackJsonp"] = global["webpackJsonp"] || []).push([["pages/product-detail/product-detail"],{
/***/ 65:
/*!********************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/main.js?{"page":"pages%2Fproduct-detail%2Fproduct-detail"} ***!
\********************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(wx, createPage) {
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4);
__webpack_require__(/*! uni-pages */ 30);
var _vue = _interopRequireDefault(__webpack_require__(/*! vue */ 25));
var _productDetail = _interopRequireDefault(__webpack_require__(/*! ./pages/product-detail/product-detail.vue */ 66));
// @ts-ignore
wx.__webpack_require_UNI_MP_PLUGIN__ = __webpack_require__;
createPage(_productDetail.default);
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/wx.js */ 1)["default"], __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["createPage"]))
/***/ }),
/***/ 66:
/*!*************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./product-detail.vue?vue&type=template&id=685304e6& */ 67);
/* harmony import */ var _product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./product-detail.vue?vue&type=script&lang=js& */ 69);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony import */ var _product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./product-detail.vue?vue&type=style&index=0&lang=css& */ 71);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js */ 36);
var renderjs
/* normalize component */
var component = Object(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__["default"])(
_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["render"],
_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
false,
null,
null,
null,
false,
_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["components"],
renderjs
)
component.options.__file = "pages/product-detail/product-detail.vue"
/* harmony default export */ __webpack_exports__["default"] = (component.exports);
/***/ }),
/***/ 67:
/*!********************************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue?vue&type=template&id=685304e6& ***!
\********************************************************************************************************************/
/*! exports provided: render, staticRenderFns, recyclableRender, components */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--17-0!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./product-detail.vue?vue&type=template&id=685304e6& */ 68);
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["render"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["recyclableRender"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "components", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_template_id_685304e6___WEBPACK_IMPORTED_MODULE_0__["components"]; });
/***/ }),
/***/ 68:
/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--17-0!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue?vue&type=template&id=685304e6& ***!
\********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! exports provided: render, staticRenderFns, recyclableRender, components */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return recyclableRender; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "components", function() { return components; });
var components
var render = function () {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
}
var recyclableRender = false
var staticRenderFns = []
render._withStripped = true
/***/ }),
/***/ 69:
/*!**************************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue?vue&type=script&lang=js& ***!
\**************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./product-detail.vue?vue&type=script&lang=js& */ 70);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 70:
/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue?vue&type=script&lang=js& ***!
\*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(uni) {
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var _default = {
data: function data() {
return {
productId: null,
product: {
name: '180G牛奶丝T恤 DG120',
code: 'DG120',
price: '28.00',
originalPrice: '35.00',
moq: 1,
leadTime: '48小时',
craft: '烫画/数码直喷'
},
productImages: [{
bg: '#F5F5F5',
emoji: '👕'
}, {
bg: '#E8E8E8',
emoji: '👕'
}, {
bg: '#F0F0F0',
emoji: '👕'
}],
productTags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}, {
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}, {
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}],
colors: [{
name: '白色',
value: '#FFFFFF'
}, {
name: '黑色',
value: '#1a1a1a'
}, {
name: '灰色',
value: '#999999'
}, {
name: '橙色',
value: '#FF6800'
}, {
name: '藏青',
value: '#1B365D'
}, {
name: '军绿',
value: '#4A5D23'
}],
selectedColor: 0,
sizes: ['XS', 'S', 'M', 'L', 'XL', '2XL', '3XL'],
selectedSize: 'M',
productParams: [{
label: '克重',
value: '180g'
}, {
label: '材质',
value: '牛奶丝（改性聚酯纤维）'
}, {
label: '版型',
value: '常规版'
}, {
label: '领型',
value: '圆领'
}, {
label: '袖型',
value: '短袖'
}, {
label: '适用工艺',
value: '烫画、数码直喷、刺绣'
}, {
label: '可售区域',
value: '全球'
}, {
label: '洗涤说明',
value: '冷水机洗，不可漂白'
}],
crafts: [{
name: '烫画',
desc: '色彩鲜艳，适合复杂图案，成本低',
emoji: '🎨',
bg: '#FFF0E5'
}, {
name: '数码直喷',
desc: '触感柔软，透气性好，适合大面积印花',
emoji: '🖨️',
bg: '#E5F5FF'
}, {
name: '刺绣',
desc: '质感高级，经久耐用，适合logo',
emoji: '🪡',
bg: '#F0FFE5'
}],
isFav: false
};
},
onLoad: function onLoad(options) {
if (options.id) {
this.setData({
productId: options.id
});
}
},
methods: {
selectColor: function selectColor(e) {
this.setData({
selectedColor: e.currentTarget.dataset.index
});
},
selectSize: function selectSize(e) {
this.setData({
selectedSize: e.currentTarget.dataset.size
});
},
toggleFav: function toggleFav() {
this.setData({
isFav: !this.isFav
});
uni.showToast({
title: this.isFav ? '已收藏' : '已取消',
icon: 'none'
});
},
contactService: function contactService() {
uni.showToast({
title: '客服功能开发中',
icon: 'none'
});
},
addToCart: function addToCart() {
uni.showToast({
title: '已加入清单',
icon: 'success'
});
},
startDesign: function startDesign() {
uni.showToast({
title: '定制功能开发中',
icon: 'none'
});
}
}
};
exports.default = _default;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["default"]))
/***/ }),
/***/ 71:
/*!**********************************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue?vue&type=style&index=0&lang=css& ***!
\**********************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src??ref--6-oneOf-1-3!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./product-detail.vue?vue&type=style&index=0&lang=css& */ 72);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_product_detail_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 72:
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!./node_modules/postcss-loader/src??ref--6-oneOf-1-3!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/product-detail/product-detail.vue?vue&type=style&index=0&lang=css& ***!
\**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// extracted by mini-css-extract-plugin
if(false) { var cssReload; }
/***/ })
},[[65,"common/runtime","common/vendor"]]]);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/product-detail/product-detail.js.map
unpackage/dist/dev/mp-weixin/pages/product-detail/product-detail.json
Vendored
+4
View File
@@ -0,0 +1,4 @@
{
"navigationBarTitleText": "产品详情",
"usingComponents": {}
}
unpackage/dist/dev/mp-weixin/pages/product-detail/product-detail.wxml
Vendored
+1
View File
@@ -0,0 +1 @@
<view class="detail-page"><view class="detail-images"><swiper class="detail-swiper" indicator-dots="{{true}}" indicator-color="rgba(255,255,255,0.4)" indicator-active-color="#FF6800" circular="{{true}}"><block wx:for="{{productImages}}" wx:for-item="item" wx:for-index="index" wx:key="index"><swiper-item><view class="swiper-img" style="{{('background: '+item.bg+';')}}"><text class="swiper-emoji">{{item.emoji}}</text></view></swiper-item></block></swiper><view class="detail-badges"><block wx:for="{{productTags}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="detail-badge" style="{{('background: '+item.bg+'; color: '+item.color+';')}}">{{''+item.text+''}}</view></block></view></view><view class="detail-info-section"><view class="detail-header"><text class="detail-name">{{product.name}}</text><text class="detail-code">{{"SKU: "+product.code}}</text></view><view class="detail-price-row"><text class="detail-price">{{"¥"+product.price}}</text><text class="detail-price-unit">起</text><block wx:if="{{product.originalPrice}}"><text class="detail-price-original">{{"¥"+product.originalPrice}}</text></block></view><view class="detail-meta"><view class="meta-item"><text class="meta-label">起订量</text><text class="meta-value">{{product.moq+"件"}}</text></view><view class="meta-item"><text class="meta-label">生产周期</text><text class="meta-value">{{product.leadTime}}</text></view><view class="meta-item"><text class="meta-label">工艺</text><text class="meta-value">{{product.craft}}</text></view></view></view><view class="detail-section"><text class="section-label">颜色选择</text><view class="color-options"><block wx:for="{{colors}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="{{['color-option '+(selectedColor===index?'selected':'')]}}" data-index="{{index}}" data-event-opts="{{[['tap',[['selectColor',['$event']]]]]}}" bindtap="__e"><view class="color-dot" style="{{('background: '+item.value+';')}}"></view><text class="color-name">{{item.name}}</text></view></block></view></view><view class="detail-section"><text class="section-label">尺码选择</text><view class="size-options"><block wx:for="{{sizes}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="{{['size-option '+(selectedSize===item?'selected':'')]}}" data-size="{{item}}" data-event-opts="{{[['tap',[['selectSize',['$event']]]]]}}" bindtap="__e">{{''+item+''}}</view></block></view></view><view class="detail-section"><text class="section-label">产品参数</text><view class="params-table"><block wx:for="{{productParams}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="param-row"><text class="param-label">{{item.label}}</text><text class="param-value">{{item.value}}</text></view></block></view></view><view class="detail-section"><text class="section-label">工艺说明</text><view class="craft-info"><block wx:for="{{crafts}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="craft-card"><view class="craft-icon" style="{{('background: '+item.bg+';')}}"><text class="craft-emoji">{{item.emoji}}</text></view><text class="craft-name">{{item.name}}</text><text class="craft-desc">{{item.desc}}</text></view></block></view></view><view class="detail-bottom-bar safe-bottom"><view data-event-opts="{{[['tap',[['toggleFav',['$event']]]]]}}" class="bottom-btn-icon" bindtap="__e"><text class="bottom-icon">{{isFav?'❤️':'🤍'}}</text><text class="bottom-icon-text">收藏</text></view><view data-event-opts="{{[['tap',[['contactService',['$event']]]]]}}" class="bottom-btn-icon" bindtap="__e"><text class="bottom-icon">💬</text><text class="bottom-icon-text">客服</text></view><view data-event-opts="{{[['tap',[['addToCart',['$event']]]]]}}" class="bottom-btn-cart" bindtap="__e"><text>加入清单</text></view><view data-event-opts="{{[['tap',[['startDesign',['$event']]]]]}}" class="bottom-btn-design" bindtap="__e"><text>立即定制</text></view></view></view>
unpackage/dist/dev/mp-weixin/pages/product-detail/product-detail.wxss
Vendored
+283
View File
@@ -0,0 +1,283 @@
/* 产品详情页样式 */
.detail-page {
min-height: 100vh;
background: #f5f5f5;
padding-bottom: 140rpx;
}
/* 图片区 */
.detail-images {
position: relative;
background: #ffffff;
}
.detail-swiper {
width: 100%;
height: 750rpx;
}
.swiper-img {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.swiper-emoji {
font-size: 160rpx;
}
.detail-badges {
position: absolute;
top: 24rpx;
left: 24rpx;
display: flex;
flex-direction: column;
gap: 8rpx;
}
.detail-badge {
font-size: 20rpx;
padding: 4rpx 12rpx;
border-radius: 6rpx;
}
/* 产品信息 */
.detail-info-section {
background: #ffffff;
padding: 32rpx 24rpx;
margin-bottom: 16rpx;
}
.detail-header {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.detail-name {
font-size: 36rpx;
font-weight: 600;
color: #1a1a1a;
line-height: 1.4;
}
.detail-code {
font-size: 24rpx;
color: #999;
}
.detail-price-row {
display: flex;
align-items: baseline;
gap: 8rpx;
margin-top: 20rpx;
}
.detail-price {
font-size: 48rpx;
font-weight: 700;
color: #ff6800;
}
.detail-price-unit {
font-size: 24rpx;
color: #ff6800;
}
.detail-price-original {
font-size: 24rpx;
color: #ccc;
text-decoration: line-through;
margin-left: 12rpx;
}
.detail-meta {
display: flex;
justify-content: space-between;
margin-top: 32rpx;
padding-top: 24rpx;
border-top: 1rpx solid #f0f0f0;
}
.meta-item {
text-align: center;
}
.meta-label {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 8rpx;
}
.meta-value {
font-size: 26rpx;
color: #333;
font-weight: 500;
}
/* 通用section */
.detail-section {
background: #ffffff;
padding: 32rpx 24rpx;
margin-bottom: 16rpx;
}
.section-label {
font-size: 30rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 24rpx;
}
/* 颜色选择 */
.color-options {
display: flex;
flex-wrap: wrap;
gap: 20rpx;
}
.color-option {
display: flex;
align-items: center;
gap: 8rpx;
padding: 12rpx 20rpx;
border-radius: 32rpx;
border: 2rpx solid #eee;
background: #fafafa;
}
.color-option.selected {
border-color: #ff6800;
background: #fff0e5;
}
.color-dot {
width: 32rpx;
height: 32rpx;
border-radius: 50%;
border: 2rpx solid #fff;
box-shadow: 0 0 0 1rpx rgba(0, 0, 0, 0.1);
}
.color-name {
font-size: 24rpx;
color: #666;
}
.color-option.selected .color-name {
color: #ff6800;
}
/* 尺码选择 */
.size-options {
display: flex;
flex-wrap: wrap;
gap: 16rpx;
}
.size-option {
min-width: 72rpx;
text-align: center;
padding: 16rpx 24rpx;
font-size: 26rpx;
color: #666;
background: #f5f5f5;
border-radius: 8rpx;
border: 2rpx solid transparent;
}
.size-option.selected {
background: #fff0e5;
color: #ff6800;
border-color: #ff6800;
}
/* 参数表 */
.params-table {
display: flex;
flex-direction: column;
}
.param-row {
display: flex;
padding: 16rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
.param-label {
width: 200rpx;
font-size: 26rpx;
color: #999;
flex-shrink: 0;
}
.param-value {
flex: 1;
font-size: 26rpx;
color: #333;
}
/* 工艺说明 */
.craft-info {
display: flex;
flex-direction: column;
gap: 20rpx;
}
.craft-card {
display: flex;
align-items: center;
gap: 16rpx;
padding: 20rpx;
background: #fafafa;
border-radius: 12rpx;
}
.craft-icon {
width: 64rpx;
height: 64rpx;
border-radius: 12rpx;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.craft-emoji {
font-size: 32rpx;
}
.craft-name {
font-size: 26rpx;
font-weight: 600;
color: #333;
flex-shrink: 0;
width: 120rpx;
}
.craft-desc {
flex: 1;
font-size: 22rpx;
color: #999;
line-height: 1.5;
}
/* 底部操作栏 */
.detail-bottom-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
height: 120rpx;
background: #ffffff;
display: flex;
align-items: center;
padding: 0 24rpx;
gap: 16rpx;
box-shadow: 0 -2rpx 12rpx rgba(0, 0, 0, 0.06);
z-index: 100;
}
.bottom-btn-icon {
display: flex;
flex-direction: column;
align-items: center;
gap: 4rpx;
width: 80rpx;
flex-shrink: 0;
}
.bottom-icon {
font-size: 36rpx;
}
.bottom-icon-text {
font-size: 18rpx;
color: #999;
}
.bottom-btn-cart {
flex: 1;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
background: #fff0e5;
color: #ff6800;
font-size: 28rpx;
font-weight: 600;
border-radius: 40rpx;
}
.bottom-btn-design {
flex: 1;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
background: #ff6800;
color: #ffffff;
font-size: 28rpx;
font-weight: 600;
border-radius: 40rpx;
}
unpackage/dist/dev/mp-weixin/pages/products/products.js
Vendored
+866
View File
@@ -0,0 +1,866 @@
(global["webpackJsonp"] = global["webpackJsonp"] || []).push([["pages/products/products"],{
/***/ 57:
/*!********************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/main.js?{"page":"pages%2Fproducts%2Fproducts"} ***!
\********************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(wx, createPage) {
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4);
__webpack_require__(/*! uni-pages */ 30);
var _vue = _interopRequireDefault(__webpack_require__(/*! vue */ 25));
var _products = _interopRequireDefault(__webpack_require__(/*! ./pages/products/products.vue */ 58));
// @ts-ignore
wx.__webpack_require_UNI_MP_PLUGIN__ = __webpack_require__;
createPage(_products.default);
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/wx.js */ 1)["default"], __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["createPage"]))
/***/ }),
/***/ 58:
/*!*************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue ***!
\*************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./products.vue?vue&type=template&id=6b9ce706& */ 59);
/* harmony import */ var _products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./products.vue?vue&type=script&lang=js& */ 61);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony import */ var _products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./products.vue?vue&type=style&index=0&lang=css& */ 63);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/runtime/componentNormalizer.js */ 36);
var renderjs
/* normalize component */
var component = Object(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_3__["default"])(
_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["render"],
_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
false,
null,
null,
null,
false,
_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["components"],
renderjs
)
component.options.__file = "pages/products/products.vue"
/* harmony default export */ __webpack_exports__["default"] = (component.exports);
/***/ }),
/***/ 59:
/*!********************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue?vue&type=template&id=6b9ce706& ***!
\********************************************************************************************************/
/*! exports provided: render, staticRenderFns, recyclableRender, components */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--17-0!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./products.vue?vue&type=template&id=6b9ce706& */ 60);
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["render"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["recyclableRender"]; });
/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "components", function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_17_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_template_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_uni_app_loader_page_meta_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_template_id_6b9ce706___WEBPACK_IMPORTED_MODULE_0__["components"]; });
/***/ }),
/***/ 60:
/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--17-0!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/template.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-uni-app-loader/page-meta.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue?vue&type=template&id=6b9ce706& ***!
\********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! exports provided: render, staticRenderFns, recyclableRender, components */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "render", function() { return render; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return staticRenderFns; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "recyclableRender", function() { return recyclableRender; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "components", function() { return components; });
var components
var render = function () {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
var g0 = _vm.activeFilters.length
var g1 = _vm.subCategories.length
var l0 = _vm.__map(_vm.craftOptions, function (item, index) {
var $orig = _vm.__get_orig(item)
var g2 = _vm.selectedCrafts.indexOf(item)
return {
$orig: $orig,
g2: g2,
}
})
var l1 = _vm.__map(_vm.materialOptions, function (item, index) {
var $orig = _vm.__get_orig(item)
var g3 = _vm.selectedMaterials.indexOf(item)
return {
$orig: $orig,
g3: g3,
}
})
_vm.$mp.data = Object.assign(
{},
{
$root: {
g0: g0,
g1: g1,
l0: l0,
l1: l1,
},
}
)
}
var recyclableRender = false
var staticRenderFns = []
render._withStripped = true
/***/ }),
/***/ 61:
/*!**************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue?vue&type=script&lang=js& ***!
\**************************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/babel-loader/lib!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./products.vue?vue&type=script&lang=js& */ 62);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_babel_loader_lib_index_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_13_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_script_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 62:
/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/babel-loader/lib!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--13-1!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/script.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue?vue&type=script&lang=js& ***!
\*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(uni) {
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ 4);
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ 11));
var _toConsumableArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ 18));
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var _default = {
data: function data() {
return {
searchKeyword: '',
selectedCountry: 'us',
countries: [{
id: 'us',
name: '美国',
flag: '🇺🇸'
}, {
id: 'uk',
name: '英国',
flag: '🇬🇧'
}, {
id: 'jp',
name: '日本',
flag: '🇯🇵'
}, {
id: 'mx',
name: '墨西哥',
flag: '🇲🇽'
}, {
id: 'br',
name: '巴西',
flag: '🇧🇷'
}, {
id: 'ae',
name: '中东',
flag: '🇦🇪'
}, {
id: 'pl',
name: '波兰',
flag: '🇵🇱'
}, {
id: 'es',
name: '西班牙',
flag: '🇪🇸'
}, {
id: 'de',
name: '德国',
flag: '🇩🇪'
}, {
id: 'it',
name: '意大利',
flag: '🇮🇹'
}, {
id: 'fr',
name: '法国',
flag: '🇫🇷'
}, {
id: 'ca',
name: '加拿大',
flag: '🇨🇦'
}, {
id: 'au',
name: '澳大利亚',
flag: '🇦🇺'
}, {
id: 'kr',
name: '韩国',
flag: '🇰🇷'
}],
activeCategory: 'all',
categories: [{
id: 'all',
name: '全部商品'
}, {
id: 'men',
name: '男士服装'
}, {
id: 'women',
name: '女士服装'
}, {
id: 'kids',
name: '儿童服装'
}, {
id: 'home',
name: '家居配饰'
}, {
id: 'bag',
name: '包包配饰'
}],
subCategories: [],
activeSubCategory: '',
activeFilters: [{
key: 'country',
label: '美国'
}, {
key: 'craft',
label: '烫画'
}, {
key: 'material',
label: '棉麻'
}],
showFilter: false,
selectedCrafts: ['烫画'],
selectedMaterials: ['棉麻'],
craftOptions: ['烫画', '刺绣', '丝印', '数码直喷', '热转印'],
materialOptions: ['棉麻', '纯棉', '涤纶', '混纺', '牛奶丝'],
pagination: {
start: 1,
end: 10,
total: 96,
current: 1,
pageSize: 10,
totalPages: 10
},
pageNumbers: [1, 2, 3, 4, 5],
loadingMore: false,
products: [{
id: 1,
name: '180G牛奶丝T恤 DG120',
price: '28.00',
bgColor: '#F5F5F5',
emoji: '👕',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}, {
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}]
}, {
id: 2,
name: '纯棉连帽卫衣 HD200',
price: '59.00',
bgColor: '#E8E8E8',
emoji: '🧥',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}, {
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}]
}, {
id: 3,
name: '260G重装T恤 TS260',
price: '35.00',
bgColor: '#F0F0F0',
emoji: '👕',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}]
}, {
id: 4,
name: '精梳棉Polo衫 PL100',
price: '45.00',
bgColor: '#F8F8F8',
emoji: '👔',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}, {
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}]
}, {
id: 5,
name: '抓绒卫裤 PT150',
price: '42.00',
bgColor: '#F5F5F5',
emoji: '👖',
tags: [{
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}]
}, {
id: 6,
name: '运动速干T恤 ST200',
price: '32.00',
bgColor: '#E8E8E8',
emoji: '👕',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}]
}, {
id: 7,
name: '纯棉背包 BP300',
price: '25.00',
bgColor: '#F0F0F0',
emoji: '🎒',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}, {
text: '现货',
bg: '#E5F5FF',
color: '#1890FF'
}]
}, {
id: 8,
name: '儿童纯棉T恤 KD100',
price: '22.00',
bgColor: '#F8F8F8',
emoji: '👶',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}]
}, {
id: 9,
name: '帆布托特包 BG150',
price: '15.00',
bgColor: '#F5F5F5',
emoji: '👜',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}, {
text: '快返',
bg: '#F0FFE5',
color: '#52C41A'
}]
}, {
id: 10,
name: '针织开衫 CR180',
price: '55.00',
bgColor: '#E8E8E8',
emoji: '🧶',
tags: [{
text: '可定制',
bg: '#FFF0E5',
color: '#FF6800'
}]
}],
tag: {
bg: '',
color: '',
text: ''
}
};
},
onLoad: function onLoad() {
this.loadSubCategories('all');
},
methods: {
loadSubCategories: function loadSubCategories(catId) {
var _subCatMap$catId, _subCatMap$catId$;
var subCatMap = {
all: [],
men: [{
id: 'tops',
name: '上装'
}, {
id: 'hoodie',
name: '卫衣'
}, {
id: 'tshirt',
name: 'T恤'
}, {
id: 'shirt',
name: '衬衫'
}, {
id: 'pants',
name: '裤装'
}, {
id: 'underwear',
name: '内衣'
}],
women: [{
id: 'dress',
name: '连衣裙'
}, {
id: 'tops',
name: '上装'
}, {
id: 'bottoms',
name: '下装'
}],
kids: [{
id: 'baby',
name: '婴儿装'
}, {
id: 'kids',
name: '儿童装'
}],
home: [{
id: 'blanket',
name: '毛毯'
}, {
id: 'pillow',
name: '抱枕'
}],
bag: [{
id: 'tote',
name: '托特包'
}, {
id: 'backpack',
name: '背包'
}]
};
this.setData({
subCategories: subCatMap[catId] || [],
activeSubCategory: ((_subCatMap$catId = subCatMap[catId]) === null || _subCatMap$catId === void 0 ? void 0 : (_subCatMap$catId$ = _subCatMap$catId[0]) === null || _subCatMap$catId$ === void 0 ? void 0 : _subCatMap$catId$.id) || ''
});
},
onSearchInput: function onSearchInput(e) {
this.setData({
searchKeyword: e.detail.value
});
},
selectCountry: function selectCountry(e) {
var id = e.currentTarget.dataset.id;
var country = this.countries.find(function (c) {
return c.id === id;
});
var filters = this.activeFilters.filter(function (f) {
return f.key !== 'country';
});
filters.push({
key: 'country',
label: country.name
});
this.setData({
selectedCountry: id,
activeFilters: filters
});
},
selectCategory: function selectCategory(e) {
var id = e.currentTarget.dataset.id;
this.setData({
activeCategory: id
});
this.loadSubCategories(id);
},
selectSubCategory: function selectSubCategory(e) {
this.setData({
activeSubCategory: e.currentTarget.dataset.id
});
},
toggleFilter: function toggleFilter() {
this.setData({
showFilter: !this.showFilter
});
},
closeFilter: function closeFilter() {
this.setData({
showFilter: false
});
},
toggleCraft: function toggleCraft(e) {
var value = e.currentTarget.dataset.value;
var crafts = (0, _toConsumableArray2.default)(this.selectedCrafts);
var idx = crafts.indexOf(value);
if (idx > -1) {
crafts.splice(idx, 1);
} else {
crafts.push(value);
}
this.setData({
selectedCrafts: crafts
});
},
toggleMaterial: function toggleMaterial(e) {
var value = e.currentTarget.dataset.value;
var materials = (0, _toConsumableArray2.default)(this.selectedMaterials);
var idx = materials.indexOf(value);
if (idx > -1) {
materials.splice(idx, 1);
} else {
materials.push(value);
}
this.setData({
selectedMaterials: materials
});
},
removeFilter: function removeFilter(e) {
var key = e.currentTarget.dataset.key;
var filters = this.activeFilters.filter(function (f) {
return f.key !== key;
});
this.setData({
activeFilters: filters
});
},
clearAllFilters: function clearAllFilters() {
this.setData({
activeFilters: []
});
},
resetFilters: function resetFilters() {
this.setData({
selectedCrafts: [],
selectedMaterials: []
});
},
confirmFilters: function confirmFilters() {
var filters = [];
if (this.selectedCrafts.length > 0) {
filters.push({
key: 'craft',
label: this.selectedCrafts.join(',')
});
}
if (this.selectedMaterials.length > 0) {
filters.push({
key: 'material',
label: this.selectedMaterials.join(',')
});
}
this.setData({
activeFilters: filters,
showFilter: false
});
},
goDetail: function goDetail(e) {
var id = e.currentTarget.dataset.id;
uni.navigateTo({
url: "/pages/product-detail/product-detail?id=".concat(id)
});
},
changePage: function changePage(e) {
var action = e.currentTarget.dataset.action;
var current = this.pagination.current;
if (action === 'prev' && current > 1) {
current--;
}
if (action === 'next' && current < this.pagination.totalPages) {
current++;
}
this.updatePagination(current);
},
goToPage: function goToPage(e) {
this.updatePagination(e.currentTarget.dataset.page);
},
updatePagination: function updatePagination(current) {
var total = this.pagination.total;
var pageSize = this.pagination.pageSize;
var totalPages = Math.ceil(total / pageSize);
var pageNumbers = [];
for (var i = Math.max(1, current - 2); i <= Math.min(totalPages, current + 2); i++) {
pageNumbers.push(i);
}
this.setData({
pagination: _objectSpread(_objectSpread({}, this.pagination), {}, {
current: current,
start: (current - 1) * pageSize + 1,
end: Math.min(current * pageSize, total),
totalPages: totalPages
}),
pageNumbers: pageNumbers
});
},
loadMore: function loadMore() {
var _this = this;
if (this.loadingMore) {
return;
}
this.setData({
loadingMore: true
});
setTimeout(function () {
_this.setData({
loadingMore: false
});
}, 1000);
}
}
};
exports.default = _default;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 2)["default"]))
/***/ }),
/***/ 63:
/*!**********************************************************************************************************!*\
!*** C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue?vue&type=style&index=0&lang=css& ***!
\**********************************************************************************************************/
/*! no static exports found */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/postcss-loader/src??ref--6-oneOf-1-3!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!../../../../../app/HB/HBuilderX.5.24.2026081301/HBuilderX/plugins/uniapp-cli/node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!./products.vue?vue&type=style&index=0&lang=css& */ 64);
/* harmony import */ var _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
/* harmony default export */ __webpack_exports__["default"] = (_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_loaders_stylePostLoader_js_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_webpack_preprocess_loader_index_js_ref_6_oneOf_1_2_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_3_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_vue_cli_plugin_uni_packages_vue_loader_lib_index_js_vue_loader_options_app_HB_HBuilderX_5_24_2026081301_HBuilderX_plugins_uniapp_cli_node_modules_dcloudio_webpack_uni_mp_loader_lib_style_js_products_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ 64:
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
!*** ./node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/webpack-preprocess-loader??ref--6-oneOf-1-2!./node_modules/postcss-loader/src??ref--6-oneOf-1-3!./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib??vue-loader-options!./node_modules/@dcloudio/webpack-uni-mp-loader/lib/style.js!C:/gs/project/官网小程序demo/官网小程序demo_uni/pages/products/products.vue?vue&type=style&index=0&lang=css& ***!
\**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// extracted by mini-css-extract-plugin
if(false) { var cssReload; }
/***/ })
},[[57,"common/runtime","common/vendor"]]]);
//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/products/products.js.map
unpackage/dist/dev/mp-weixin/pages/products/products.json
Vendored
+4
View File
@@ -0,0 +1,4 @@
{
"navigationBarTitleText": "产品中心",
"usingComponents": {}
}
unpackage/dist/dev/mp-weixin/pages/products/products.wxml
Vendored
+1
View File
File diff suppressed because one or more lines are too long
unpackage/dist/dev/mp-weixin/pages/products/products.wxss
Vendored
+446
View File
@@ -0,0 +1,446 @@
/* 产品列表页样式 */
.products-page {
min-height: 100vh;
background: #f5f5f5;
display: flex;
flex-direction: column;
}
/* 搜索栏 */
.search-bar {
display: flex;
align-items: center;
gap: 16rpx;
padding: 16rpx 24rpx;
background: #ffffff;
}
.search-input-wrap {
flex: 1;
display: flex;
align-items: center;
background: #f5f5f5;
border-radius: 32rpx;
padding: 0 24rpx;
height: 64rpx;
}
.search-icon {
font-size: 28rpx;
margin-right: 12rpx;
}
.search-input {
flex: 1;
font-size: 26rpx;
color: #333;
}
.search-placeholder {
color: #ccc;
}
.filter-btn {
display: flex;
align-items: center;
gap: 4rpx;
padding: 0 16rpx;
}
.filter-icon {
font-size: 28rpx;
color: #666;
}
.filter-text {
font-size: 24rpx;
color: #666;
}
/* 国家选择条 */
.country-bar {
white-space: nowrap;
background: #ffffff;
padding: 16rpx 24rpx;
border-bottom: 1rpx solid #eee;
}
.country-item {
display: inline-flex;
align-items: center;
gap: 6rpx;
padding: 8rpx 20rpx;
margin-right: 12rpx;
border-radius: 24rpx;
background: #f5f5f5;
}
.country-item.active {
background: #fff0e5;
}
.country-flag {
font-size: 28rpx;
}
.country-name {
font-size: 22rpx;
color: #666;
}
.country-item.active .country-name {
color: #ff6800;
font-weight: 500;
}
/* 已选筛选标签 */
.active-filters {
display: flex;
align-items: center;
gap: 12rpx;
padding: 12rpx 24rpx;
background: #ffffff;
overflow-x: auto;
white-space: nowrap;
}
.active-filter-tag {
display: inline-flex;
align-items: center;
gap: 8rpx;
background: #f2f2f2;
border-radius: 8rpx;
padding: 6rpx 16rpx;
font-size: 22rpx;
color: #666;
flex-shrink: 0;
}
.filter-remove {
font-size: 20rpx;
color: #ccc;
}
.clear-all {
font-size: 22rpx;
color: #ff6800;
flex-shrink: 0;
}
/* 主体内容 */
.content-body {
flex: 1;
display: flex;
overflow: hidden;
}
/* 左侧分类侧边栏 */
.sidebar {
width: 180rpx;
background: #ffffff;
border-right: 1rpx solid #eee;
height: 100%;
flex-shrink: 0;
}
.sidebar-item {
position: relative;
padding: 28rpx 20rpx;
font-size: 24rpx;
color: #666;
text-align: center;
}
.sidebar-item.active {
background: #f5f5f5;
color: #ff6800;
font-weight: 600;
}
.sidebar-indicator {
position: absolute;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 6rpx;
height: 32rpx;
background: #ff6800;
border-radius: 0 4rpx 4rpx 0;
}
.sidebar-promo {
margin: 24rpx 16rpx;
padding: 20rpx 12rpx;
background: linear-gradient(135deg, #ff6800 0%, #ff8c40 100%);
border-radius: 12rpx;
text-align: center;
}
.promo-title {
font-size: 24rpx;
font-weight: 700;
color: #fff;
display: block;
}
.promo-desc {
font-size: 20rpx;
color: rgba(255, 255, 255, 0.9);
display: block;
margin-top: 4rpx;
}
/* 右侧产品列表区 */
.product-list-area {
flex: 1;
height: 100%;
}
/* 子分类 */
.sub-categories {
display: flex;
flex-wrap: wrap;
gap: 12rpx;
padding: 16rpx 20rpx;
background: #ffffff;
}
.sub-cat-item {
font-size: 22rpx;
padding: 8rpx 20rpx;
border-radius: 24rpx;
background: #f5f5f5;
color: #666;
}
.sub-cat-item.active {
background: #ff6800;
color: #fff;
}
/* 产品网格 */
.product-grid {
display: flex;
flex-wrap: wrap;
gap: 16rpx;
padding: 16rpx 20rpx;
}
.product-card {
width: calc(50% - 8rpx);
background: #ffffff;
border-radius: 12rpx;
overflow: hidden;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
}
.product-img {
width: 100%;
height: 300rpx;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.product-emoji {
font-size: 80rpx;
}
.product-badges {
position: absolute;
top: 12rpx;
left: 12rpx;
display: flex;
flex-direction: column;
gap: 4rpx;
}
.product-badge {
font-size: 18rpx;
padding: 2rpx 8rpx;
border-radius: 4rpx;
}
.product-info {
padding: 16rpx;
}
.product-name {
font-size: 24rpx;
color: #333;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.product-bottom {
margin-top: 8rpx;
display: flex;
align-items: center;
justify-content: space-between;
}
.product-price {
font-size: 30rpx;
font-weight: 700;
color: #ff6800;
}
.product-price-unit {
font-size: 20rpx;
font-weight: 400;
margin-left: 2rpx;
}
/* 分页 */
.pagination {
padding: 24rpx 20rpx;
text-align: center;
}
.page-info {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 16rpx;
}
.page-controls {
display: flex;
align-items: center;
justify-content: center;
gap: 8rpx;
}
.page-btn {
padding: 8rpx 20rpx;
font-size: 22rpx;
color: #666;
background: #fff;
border-radius: 8rpx;
border: 1rpx solid #eee;
}
.page-btn.disabled {
color: #ccc;
}
.page-num {
min-width: 48rpx;
height: 48rpx;
line-height: 48rpx;
text-align: center;
font-size: 24rpx;
color: #666;
background: #fff;
border-radius: 8rpx;
border: 1rpx solid #eee;
}
.page-num.active {
background: #ff6800;
color: #fff;
border-color: #ff6800;
}
.page-size {
margin-top: 12rpx;
font-size: 22rpx;
color: #999;
}
.loading-more {
padding: 24rpx;
text-align: center;
font-size: 24rpx;
color: #999;
}
/* 筛选弹窗 */
.filter-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 1000;
opacity: 0;
visibility: hidden;
transition: all 0.3s;
}
.filter-overlay.show {
opacity: 1;
visibility: visible;
}
.filter-drawer {
position: fixed;
top: 0;
right: 0;
width: 80%;
height: 100%;
background: #ffffff;
z-index: 1001;
-webkit-transform: translateX(100%);
transform: translateX(100%);
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
display: flex;
flex-direction: column;
}
.filter-drawer.show {
-webkit-transform: translateX(0);
transform: translateX(0);
}
.filter-drawer-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 32rpx 24rpx;
border-bottom: 1rpx solid #eee;
}
.filter-drawer-title {
font-size: 32rpx;
font-weight: 600;
color: #333;
}
.filter-drawer-close {
font-size: 32rpx;
color: #999;
}
.filter-drawer-body {
flex: 1;
padding: 24rpx;
}
.filter-group {
margin-bottom: 32rpx;
}
.filter-group-title {
font-size: 28rpx;
font-weight: 600;
color: #333;
display: block;
margin-bottom: 16rpx;
}
.filter-options {
display: flex;
flex-wrap: wrap;
gap: 12rpx;
}
.filter-option {
padding: 12rpx 24rpx;
font-size: 24rpx;
color: #666;
background: #f5f5f5;
border-radius: 8rpx;
border: 2rpx solid transparent;
}
.filter-option.selected {
background: #fff0e5;
color: #ff6800;
border-color: #ff6800;
}
.filter-price-range {
display: flex;
align-items: center;
gap: 16rpx;
}
.price-input {
flex: 1;
height: 64rpx;
background: #f5f5f5;
border-radius: 8rpx;
padding: 0 20rpx;
font-size: 24rpx;
}
.price-divider {
color: #ccc;
}
.filter-drawer-footer {
display: flex;
gap: 16rpx;
padding: 24rpx;
border-top: 1rpx solid #eee;
}
.filter-reset {
flex: 1;
text-align: center;
padding: 24rpx;
font-size: 28rpx;
color: #666;
background: #f5f5f5;
border-radius: 12rpx;
}
.filter-confirm {
flex: 1;
text-align: center;
padding: 24rpx;
font-size: 28rpx;
color: #fff;
background: #ff6800;
border-radius: 12rpx;
}
unpackage/dist/dev/mp-weixin/project.config.json
Vendored
+36
View File
@@ -0,0 +1,36 @@
{
"description": "项目配置文件。",
"packOptions": {
"ignore": []
},
"setting": {
"urlCheck": false,
"es6": false,
"postcss": false,
"minified": false,
"newFeature": true,
"bigPackageSizeSupport": true
},
"compileType": "miniprogram",
"libVersion": "",
"appid": "wxd0e6eff3c220337b",
"projectname": "inkreach-miniprogram",
"condition": {
"search": {
"current": -1,
"list": []
},
"conversation": {
"current": -1,
"list": []
},
"game": {
"current": -1,
"list": []
},
"miniprogram": {
"current": -1,
"list": []
}
}
}
unpackage/dist/dev/mp-weixin/sitemap.json
Vendored
+9
View File
@@ -0,0 +1,9 @@
{
"desc": "印美达 Inkreach 小程序",
"rules": [
{
"action": "allow",
"page": "*"
}
]
}