活动按钮状态流转
This commit is contained in:
291
App.vue
Normal file
291
App.vue
Normal file
@@ -0,0 +1,291 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<script>
|
||||
export default {
|
||||
globalData: {
|
||||
// 接口地址
|
||||
adminPath:"https://www.yycea.cn", //"https://yycea.f2b211.com",//https://www.yycea.cn
|
||||
// 入会字段
|
||||
applyField: [],
|
||||
},
|
||||
onLaunch: function() {
|
||||
// #ifdef MP-WEIXIN
|
||||
// 微信版本更新
|
||||
if (wx.canIUse('getUpdateManager')) {
|
||||
const updateManager = wx.getUpdateManager()
|
||||
if (updateManager && updateManager.onCheckForUpdate) {
|
||||
updateManager.onCheckForUpdate(function(res) {
|
||||
// 请求完新版本信息的回调
|
||||
if (res.hasUpdate) {
|
||||
updateManager.onUpdateReady(function() {
|
||||
wx.showModal({
|
||||
title: '更新提示',
|
||||
content: '新版本已经准备好，是否重启应用？',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
updateManager.applyUpdate()
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
updateManager.onUpdateFailed(function() {
|
||||
wx.showModal({
|
||||
title: '已经有新版本了哟~',
|
||||
content: '新版本已经上线啦~，请您删除当前小程序，重新搜索打开哟~'
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
wx.showModal({
|
||||
title: '提示',
|
||||
content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
|
||||
})
|
||||
}
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
// 判断是否为公众号模拟器环境
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.match(/MicroMessenger/i) != "micromessenger") {
|
||||
uni.reLaunch({
|
||||
url: "/pages/error/browser"
|
||||
})
|
||||
return
|
||||
}
|
||||
// #endif
|
||||
// 设置登录信息
|
||||
const token = uni.getStorageSync("token")
|
||||
if (token) {
|
||||
const userInfo = uni.getStorageSync("userInfo")
|
||||
this.$store.commit('user/setToken', token)
|
||||
this.$store.commit('user/setUserInfo', userInfo)
|
||||
}
|
||||
this.getAssociation()
|
||||
this.getTabBar()
|
||||
this.getConfig()
|
||||
},
|
||||
onShow: function() {},
|
||||
onHide: function() {},
|
||||
methods: {
|
||||
// 获取商协信息
|
||||
getAssociation() {
|
||||
this.$util.request("main.association", {}, this.globalData.adminPath).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.$store.commit('app/setAppletInfo', {
|
||||
name: res.data.name,
|
||||
logo: res.data.logo,
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error("获取商协信息", error)
|
||||
})
|
||||
},
|
||||
// 获取底部导航
|
||||
getTabBar() {
|
||||
this.$util.request("main.tabbar", {}, this.globalData.adminPath).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.$store.commit('app/setTabBar', res.data)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error("获取底部导航", error)
|
||||
})
|
||||
},
|
||||
// 获取系统配置
|
||||
getConfig() {
|
||||
this.$util.request("main.config", {}, this.globalData.adminPath).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.$store.commit('app/setConfig', {
|
||||
themeColor: res.data.theme_colors,
|
||||
organize: res.data.organize,
|
||||
subscribeNotifyIds: res.data.subscribe_msg_tpl_ids,
|
||||
statement: res.data.applet_record_number,
|
||||
support: {
|
||||
image: res.data.technical_support_image,
|
||||
type: res.data.jump_type,
|
||||
link: res.data.jump_link,
|
||||
mobile: res.data.call_mobile,
|
||||
},
|
||||
loginImg: res.data.login_img,
|
||||
jielongImg: res.data.jielong_img,
|
||||
questionnaireImg: res.data.questionnaire_img,
|
||||
shareImage: res.data.share_image,
|
||||
shareTitle: res.data.share_title,
|
||||
WeChatAppid: res.data.wananchi_appid,
|
||||
deliveryManagement: res.data.delivery_management,
|
||||
joinConfig: res.data.join_config,
|
||||
})
|
||||
this.$isResolve()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error("获取配置信息", error)
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* #ifndef APP-NVUE */
|
||||
/*每个页面公共css */
|
||||
|
||||
page {
|
||||
background: #F6F7FB;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
image {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
view {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
._root {
|
||||
image {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
view {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
}
|
||||
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
button.clear {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: none;
|
||||
background: transparent;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
button.clear::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.inline-flex {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.flex-item {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.flex-center {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.flex-direction-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.align-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.align-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.align-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.justify-content-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.justify-content-around {
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.justify-content-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.justify-content-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.justify-content-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.wbcentre {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-ellipsis {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.text-ellipsis-more {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 2;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.safe-padding {
|
||||
width: 100%;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
// H5样式
|
||||
/* #ifdef H5 */
|
||||
.uni-app--showtabbar uni-page-wrapper::after {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
</style>
|
||||
118
common/api/activity.js
Normal file
118
common/api/activity.js
Normal file
@@ -0,0 +1,118 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 活动接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 活动列表
|
||||
list: {
|
||||
url: '/api/wdsxh/activity/activity/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 活动详情
|
||||
details: {
|
||||
url: '/api/wdsxh/activity/activity/details',
|
||||
method: 'GET',
|
||||
},
|
||||
//扫码签到接口
|
||||
code:{
|
||||
url: '/api/wdsxh/activity/activity_apply/checked_in',
|
||||
method: 'GET',
|
||||
},
|
||||
// 活动报名字段
|
||||
field: {
|
||||
url: '/api/wdsxh/activity/activity_fieldset/field',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 提交报名
|
||||
submit: {
|
||||
url: '/api/wdsxh/activity/activity_apply/submit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 订单列表
|
||||
orderList: {
|
||||
url: '/api/wdsxh/activity/activity/user_index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 订单详情
|
||||
orderDetails: {
|
||||
url: '/api/wdsxh/activity/activity_apply/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 活动核销列表
|
||||
verifyList: {
|
||||
url: '/api/wdsxh/activity/verifying/activity_list',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 核销会员列表
|
||||
verifyMemberList: {
|
||||
url: '/api/wdsxh/activity/verifying/verifying_member_list',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 核销活动
|
||||
verifying: {
|
||||
url: '/api/wdsxh/activity/verifying/verifying',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 申请退款
|
||||
applyRefund: {
|
||||
url: '/api/wdsxh/activity/activity/apply_refund',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 取消参加
|
||||
applyCancel: {
|
||||
url: '/api/wdsxh/activity/activity_apply/cancel',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 参会凭证
|
||||
attendance: {
|
||||
url: '/api/wdsxh/activity/activity/attendance_voucher',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 扫码签到
|
||||
scanSign: {
|
||||
url: '/api/wdsxh/activity/verifying/self_service_check_in',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 删除未支付订单
|
||||
applyDel: {
|
||||
url: '/api/wdsxh/activity/activity_apply/del',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 签到码参数解析
|
||||
decryptData: {
|
||||
url: '/api/wdsxh/activity/verifying/get_decrypt_data',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 参会证书
|
||||
certificate: {
|
||||
url: '/api/wdsxh/activity/activity_electronic_certificate/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 活动权限
|
||||
limit: {
|
||||
url: '/api/wdsxh/activity/activity/activity_config',
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
34
common/api/album.js
Normal file
34
common/api/album.js
Normal file
@@ -0,0 +1,34 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 商会相册接口列表文件 开发者: 麦沃德科技-暴雨
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 相册列表
|
||||
albumList: {
|
||||
url: '/api/wdsxh/album/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 自定义装修相册列表
|
||||
albumDiyList: {
|
||||
url: '/api/wdsxh/album/diy_list',
|
||||
method: 'GET',
|
||||
},
|
||||
// 相册详情
|
||||
albumDetails: {
|
||||
url: '/api/wdsxh/album/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 相册权限
|
||||
albumLimit: {
|
||||
url: '/api/wdsxh/album/album_config',
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
85
common/api/card.js
Normal file
85
common/api/card.js
Normal file
@@ -0,0 +1,85 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 电子名片接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 名片列表
|
||||
list: {
|
||||
url: '/api/wdsxh/corporate/card/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 名片详情
|
||||
details: {
|
||||
url: '/api/wdsxh/corporate/card/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 名片统计
|
||||
statistics: {
|
||||
url: '/api/wdsxh/corporate/card/center',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 名片样式
|
||||
background: {
|
||||
url: '/api/wdsxh/corporate/card_background/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 添加名片
|
||||
add: {
|
||||
url: '/api/wdsxh/corporate/card/add',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 编辑名片
|
||||
edit: {
|
||||
url: '/api/wdsxh/corporate/card/edit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 编辑详情
|
||||
editDetails: {
|
||||
url: '/api/wdsxh/corporate/card/edit_details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 删除名片
|
||||
delete: {
|
||||
url: '/api/wdsxh/corporate/card/del',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 设置默认名片
|
||||
setDefault: {
|
||||
url: '/api/wdsxh/corporate/card/set_default',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 获取默认名片
|
||||
getDefault: {
|
||||
url: '/api/wdsxh/corporate/card/default_card',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 设置名片靠谱
|
||||
setReliable: {
|
||||
url: '/api/wdsxh/corporate/reliable/reliable',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 取消名片靠谱
|
||||
cancelReliable: {
|
||||
url: '/api/wdsxh/corporate/reliable/cancel',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
};
|
||||
69
common/api/demand.js
Normal file
69
common/api/demand.js
Normal file
@@ -0,0 +1,69 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 供需接口列表文件 开发者: 麦沃德科技-暴雨
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 商圈列表
|
||||
businessIndexList: {
|
||||
url: '/api/wdsxh/business/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 自定义装修商圈列表
|
||||
businessDiyList: {
|
||||
url: '/api/wdsxh/business/diy_list',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商圈分类
|
||||
businessCat: {
|
||||
url: '/api/wdsxh/business/business_cat',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商圈详情
|
||||
businessDetails: {
|
||||
url: '/api/wdsxh/business/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 发布
|
||||
businessAdd: {
|
||||
url: '/api/wdsxh/business/add',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 发布列表
|
||||
businessList: {
|
||||
url: '/api/wdsxh/business/user_index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 发布删除
|
||||
businessDel: {
|
||||
url: '/api/wdsxh/business/del',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 发布详情
|
||||
businessUserDetails: {
|
||||
url: '/api/wdsxh/business/user_details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 修改
|
||||
businessEdit: {
|
||||
url: '/api/wdsxh/business/edit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 商圈限制
|
||||
businessLimit: {
|
||||
url: '/api/wdsxh/business/business_config',
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
53
common/api/index.js
Normal file
53
common/api/index.js
Normal file
@@ -0,0 +1,53 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
import main from "./main.js"
|
||||
import login from "./login.js"
|
||||
import mine from "./mine.js"
|
||||
import member from "./member.js"
|
||||
import mall from "./mall.js"
|
||||
import demand from "./demand.js"
|
||||
import activity from "./activity.js"
|
||||
import album from "./album.js"
|
||||
import sequence from "./sequence.js"
|
||||
import questionnaire from "./questionnaire.js"
|
||||
import card from "./card.js"
|
||||
import institution from "./institution.js"
|
||||
import points from "./points.js"
|
||||
export default {
|
||||
// 公共模块
|
||||
main,
|
||||
// 登录模块
|
||||
login,
|
||||
// 个人中心模块
|
||||
mine,
|
||||
// 会员模块
|
||||
member,
|
||||
// 商城模块
|
||||
mall,
|
||||
// 供需模块
|
||||
demand,
|
||||
// 活动模块
|
||||
activity,
|
||||
// 商会相册模块
|
||||
album,
|
||||
// 活动接龙模块
|
||||
sequence,
|
||||
// 问卷调查模块
|
||||
questionnaire,
|
||||
// 电子名片模块
|
||||
card,
|
||||
// 机构模块
|
||||
institution,
|
||||
// 积分模块
|
||||
points,
|
||||
};
|
||||
51
common/api/institution.js
Normal file
51
common/api/institution.js
Normal file
@@ -0,0 +1,51 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 机构管理接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 机构列表
|
||||
list: {
|
||||
url: '/api/wdsxh/institution/institution/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 机构详情
|
||||
details: {
|
||||
url: '/api/wdsxh/institution/institution/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 成员列表
|
||||
member: {
|
||||
url: '/api/wdsxh/institution/member/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 机构权限
|
||||
limit: {
|
||||
url: '/api/wdsxh/institution/institution/institution_config',
|
||||
method: 'GET',
|
||||
},
|
||||
// 申请加入
|
||||
apply: {
|
||||
url: '/api/wdsxh/institution/institution_member_apply/submit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 机构级别
|
||||
level: {
|
||||
url: '/api/wdsxh/institution/level/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 申请详情
|
||||
applyDetails: {
|
||||
url: '/api/wdsxh/institution/institution_member_apply/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
51
common/api/login.js
Normal file
51
common/api/login.js
Normal file
@@ -0,0 +1,51 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 登录接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 查询用户是否已注册-微信小程序
|
||||
isAuth: {
|
||||
url: '/api/wdsxh/applet_user_wechat/is_register',
|
||||
method: 'GET',
|
||||
},
|
||||
// 绑定手机号-微信小程序
|
||||
bindMobile: {
|
||||
url: '/api/wdsxh/applet_user_wechat/bind_mobile',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 登录-微信小程序
|
||||
login: {
|
||||
url: '/api/wdsxh/applet_user_wechat/login',
|
||||
method: 'POST',
|
||||
},
|
||||
// 注册-微信小程序
|
||||
register: {
|
||||
url: '/api/wdsxh/applet_user_wechat/register',
|
||||
method: 'POST',
|
||||
},
|
||||
// 登录-微信公众号
|
||||
officialLogin: {
|
||||
url: '/api/wdsxh/wananchi_user_wechat/mobile_login',
|
||||
method: 'POST',
|
||||
},
|
||||
// 发送验证码-微信公众号
|
||||
captcha: {
|
||||
url: '/api/sms/send',
|
||||
method: 'POST',
|
||||
},
|
||||
// 获取手机号
|
||||
getMobile: {
|
||||
url: '/api/wdsxh/user_wechat/get_mobile',
|
||||
method: 'GET',
|
||||
auth: true,
|
||||
},
|
||||
};
|
||||
125
common/api/main.js
Normal file
125
common/api/main.js
Normal file
@@ -0,0 +1,125 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 公共接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 系统配置
|
||||
config: {
|
||||
url: '/api/wdsxh/config/config',
|
||||
method: 'GET',
|
||||
},
|
||||
// 底部导航
|
||||
tabbar: {
|
||||
url: '/api/wdsxh/index/tabbar_index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 底部导航详情
|
||||
tabbarDetails: {
|
||||
url: '/api/wdsxh/index/tabbar_details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 自定义装修数据
|
||||
diyData: {
|
||||
url: '/api/wdsxh/diy/getPage',
|
||||
method: 'GET',
|
||||
},
|
||||
// 自定义搜索数据
|
||||
diySearch: {
|
||||
url: '/api/wdsxh/search/search_result',
|
||||
method: 'GET',
|
||||
},
|
||||
// 首页轮播图
|
||||
carousel: {
|
||||
url: '/api/wdsxh/banner/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 轮播图详情
|
||||
carouselDetails: {
|
||||
url: '/api/wdsxh/banner/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 省市区管理
|
||||
address: {
|
||||
// 获取省份
|
||||
province: {
|
||||
url: '/api/wdsxh/goods/address/address_province',
|
||||
method: 'GET',
|
||||
},
|
||||
// 获取城市
|
||||
city: {
|
||||
url: '/api/wdsxh/goods/address/address_city',
|
||||
method: 'GET',
|
||||
},
|
||||
// 获取区县
|
||||
area: {
|
||||
url: '/api/wdsxh/goods/address/address_area',
|
||||
method: 'GET',
|
||||
},
|
||||
},
|
||||
// 需求建议提交
|
||||
addDemand: {
|
||||
url: '/api/wdsxh/demand/add',
|
||||
method: 'POST',
|
||||
},
|
||||
// 商协信息
|
||||
association: {
|
||||
url: '/api/wdsxh/association/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 文章管理
|
||||
article: {
|
||||
// 分类
|
||||
category: {
|
||||
url: '/api/wdsxh/article/article_cat',
|
||||
method: 'GET',
|
||||
},
|
||||
// 列表
|
||||
list: {
|
||||
url: '/api/wdsxh/article/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 详情
|
||||
details: {
|
||||
url: '/api/wdsxh/article/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 增加阅读量
|
||||
updateReadNum: {
|
||||
url: '/api/wdsxh/article/update_read_num',
|
||||
method: 'POST',
|
||||
},
|
||||
},
|
||||
// 协议内容
|
||||
agreement: {
|
||||
url: '/api/wdsxh/config/agreement',
|
||||
method: 'GET',
|
||||
},
|
||||
// 消息订阅
|
||||
message: {
|
||||
// 订阅数量
|
||||
count: {
|
||||
url: '/api/wdsxh/member/member/subscribe_count',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 消息订阅
|
||||
subscribe: {
|
||||
url: '/api/wdsxh/member/member/submit_subscribe',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
},
|
||||
// 系统配置
|
||||
WeChatConfig: {
|
||||
url: '/api/wdsxh/wananchi_user_wechat/get_wechat_config',
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
173
common/api/mall.js
Normal file
173
common/api/mall.js
Normal file
@@ -0,0 +1,173 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 商城接口列表文件 开发者: 麦沃德科技-暴雨
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 地址管理
|
||||
address: {
|
||||
// 列表
|
||||
list: {
|
||||
url: '/api/wdsxh/goods/address/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 添加
|
||||
add: {
|
||||
url: '/api/wdsxh/goods/address/add',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 修改
|
||||
edit: {
|
||||
url: '/api/wdsxh/goods/address/edit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 删除
|
||||
delete: {
|
||||
url: '/api/wdsxh/goods/address/del',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 设置默认
|
||||
setDefault: {
|
||||
url: '/api/wdsxh/goods/address/set_default',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
},
|
||||
// 轮播图
|
||||
carousel: {
|
||||
url: '/api/wdsxh/goods/goods/banner_index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商城轮播图
|
||||
carouselDetails: {
|
||||
url: '/api/wdsxh/goods/goods/banner_details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商品分类
|
||||
categoay: {
|
||||
url: '/api/wdsxh/goods/goods/category_index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商品列表
|
||||
goodsList: {
|
||||
url: '/api/wdsxh/goods/goods/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商品详情
|
||||
goodsDetails: {
|
||||
url: '/api/wdsxh/goods/goods/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 计算邮费
|
||||
getPostage: {
|
||||
url: '/api/wdsxh/goods/order/postage',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 订单预支付
|
||||
preparePay: {
|
||||
url: '/api/wdsxh/goods/order/prepare_pay',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 订单创建
|
||||
createOrder: {
|
||||
url: '/api/wdsxh/goods/order/create',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 订单详情
|
||||
orderDetails: {
|
||||
url: '/api/wdsxh/goods/order/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 订单列表
|
||||
orderList: {
|
||||
url: '/api/wdsxh/goods/order/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 确认收货
|
||||
orderCollect: {
|
||||
url: '/api/wdsxh/goods/order/sing',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 申请退款
|
||||
orderRefund: {
|
||||
url: '/api/wdsxh/goods/order/refund',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 退款列表
|
||||
refundList: {
|
||||
url: '/api/wdsxh/goods/order/refund_index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 提交快递
|
||||
receipt: {
|
||||
url: '/api/wdsxh/goods/order/receipt',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 取消退款
|
||||
cancelRefund: {
|
||||
url: '/api/wdsxh/goods/order/cancel_refund',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 取消订单
|
||||
delOrder: {
|
||||
url: '/api/wdsxh/goods/order/del_order',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 加入购物车
|
||||
addCart: {
|
||||
url: '/api/wdsxh/mall/cart/add',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 购物车数量
|
||||
cartNumber: {
|
||||
url: '/api/wdsxh/mall/cart/cart_goods_number',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 购物车列表
|
||||
cartList: {
|
||||
url: '/api/wdsxh/mall/cart/list',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 更新购物车商品数量
|
||||
updateCartNumber: {
|
||||
url: '/api/wdsxh/mall/cart/update_goods_number',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 删除购物车商品
|
||||
deleteCart: {
|
||||
url: '/api/wdsxh/mall/cart/del',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 商城配置
|
||||
config: {
|
||||
url: '/api/wdsxh/mall/self_pickup/config',
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
238
common/api/member.js
Normal file
238
common/api/member.js
Normal file
@@ -0,0 +1,238 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 会员接口列表文件 开发者: 麦沃德科技-暴雨
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 会员列表
|
||||
list: {
|
||||
url: '/api/wdsxh/member/member/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 自定义装修会员列表
|
||||
diyList: {
|
||||
url: '/api/wdsxh/member/member/diy_list',
|
||||
method: 'GET',
|
||||
},
|
||||
// 自定义装修搜索会员列表
|
||||
diySearchList: {
|
||||
url: '/api/wdsxh/search/search_member_name',
|
||||
method: 'GET',
|
||||
},
|
||||
// 会员地图会员列表
|
||||
memberMapList: {
|
||||
url: '/api/wdsxh/member/member/member_map_list',
|
||||
method: 'GET',
|
||||
},
|
||||
// 会员单位
|
||||
units: {
|
||||
url: '/api/wdsxh/member/member/unit',
|
||||
method: 'GET',
|
||||
},
|
||||
// 会员详情
|
||||
details: {
|
||||
url: '/api/wdsxh/member/member/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 企业详情
|
||||
enterprise: {
|
||||
url: '/api/wdsxh/member/member/company_details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 团体详情
|
||||
organization: {
|
||||
url: '/api/wdsxh/member/member/organize_details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 对外限制
|
||||
limit: {
|
||||
url: '/api/wdsxh/member/member/auth',
|
||||
method: 'GET',
|
||||
},
|
||||
// 会员级别
|
||||
level: {
|
||||
url: '/api/wdsxh/member/member_apply/level_list',
|
||||
method: 'GET',
|
||||
},
|
||||
// 入会类型
|
||||
type: {
|
||||
url: '/api/wdsxh/config/join_config',
|
||||
method: 'GET',
|
||||
},
|
||||
// 会员状态
|
||||
state: {
|
||||
url: '/api/wdsxh/user_wechat/apply_member_state',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 入会字段
|
||||
field: {
|
||||
url: '/api/wdsxh/member/join_config/custom_field',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 入会申请
|
||||
apply: {
|
||||
url: '/api/wdsxh/member/member_apply/submit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 申请详情
|
||||
applyDetails: {
|
||||
url: '/api/wdsxh/member/member_apply/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 入会申请验证
|
||||
applyCheck: {
|
||||
url: '/api/wdsxh/member/member_apply/check_mobile_use',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 会员资料
|
||||
information: {
|
||||
url: '/api/wdsxh/member/member/information_details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 编辑资料
|
||||
editInformation: {
|
||||
url: '/api/wdsxh/member/member/submit_information',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 会费缴纳详情
|
||||
payDetails: {
|
||||
url: '/api/wdsxh/member/member/membershipPayDetail',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 线上缴费
|
||||
accountInfo: {
|
||||
url: '/api/wdsxh/association/public_account_information',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 线上缴费
|
||||
payOnline: {
|
||||
url: '/api/wdsxh/member/member/membershipPay',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 线下缴费
|
||||
payOffline: {
|
||||
url: '/api/wdsxh/member/member/submit_pay_voucher',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 免费入会
|
||||
payFree: {
|
||||
url: '/api/wdsxh/member/member/freeMembershipPay',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 证书查询
|
||||
certificate: {
|
||||
url: '/api/wdsxh/member/cert/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 行业分类
|
||||
industry: {
|
||||
url: '/api/wdsxh/member/member_apply/industry_category_list',
|
||||
method: 'GET',
|
||||
},
|
||||
// 通讯录
|
||||
addressBook: {
|
||||
url: '/api/wdsxh/member/member/address_book',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 通讯录限制
|
||||
addressBookLimit: {
|
||||
url: '/api/wdsxh/member/member/address_book_auth',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 推广会员列表
|
||||
promotionList: {
|
||||
url: '/api/wdsxh/member/promotion/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 审核会员
|
||||
examine: {
|
||||
// 审核会员列表
|
||||
list: {
|
||||
url: '/api/wdsxh/member/member_apply_examine/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 审核会员详情
|
||||
details: {
|
||||
url: '/api/wdsxh/member/member_apply_examine/details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 审核入会申请
|
||||
examineApply: {
|
||||
url: '/api/wdsxh/member/member_apply_examine/examine',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 审核线下支付
|
||||
examineOffline: {
|
||||
url: '/api/wdsxh/member/member_apply_examine/offline_examine',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
},
|
||||
// 产品维护
|
||||
product: {
|
||||
// 产品列表
|
||||
list: {
|
||||
url: '/api/wdsxh/company_goods/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 添加产品
|
||||
add: {
|
||||
url: '/api/wdsxh/company_goods/add',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 删除产品
|
||||
delete: {
|
||||
url: '/api/wdsxh/company_goods/del',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 修改产品
|
||||
edit: {
|
||||
url: '/api/wdsxh/company_goods/edit',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 编辑详情
|
||||
editDetails: {
|
||||
url: '/api/wdsxh/company_goods/detail',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 产品详情
|
||||
details: {
|
||||
url: '/api/wdsxh/member/member/companyGoodsDetail',
|
||||
method: 'GET',
|
||||
},
|
||||
},
|
||||
};
|
||||
63
common/api/mine.js
Normal file
63
common/api/mine.js
Normal file
@@ -0,0 +1,63 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 个人中心接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 用户信息
|
||||
user: {
|
||||
url: '/api/wdsxh/user_wechat/center',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 个人中心自定义数据
|
||||
diyData: {
|
||||
url: '/api/wdsxh/person_center_diy_page/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 电子会牌
|
||||
poster: {
|
||||
url: '/api/wdsxh/willbrand/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 更新用户信息
|
||||
updateUser: {
|
||||
url: '/api/wdsxh/user_wechat/update_nickname_avatar',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 常见问题
|
||||
problem: {
|
||||
// 列表
|
||||
list: {
|
||||
url: '/api/wdsxh/faq/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 详情
|
||||
details: {
|
||||
url: '/api/wdsxh/faq/details',
|
||||
method: 'GET',
|
||||
},
|
||||
},
|
||||
// 消息通知
|
||||
notice: {
|
||||
// 列表
|
||||
list: {
|
||||
url: '/api/wdsxh/message/member_notification/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 详情
|
||||
details: {
|
||||
url: '/api/wdsxh/message/member_notification/detail',
|
||||
method: 'GET',
|
||||
},
|
||||
},
|
||||
};
|
||||
58
common/api/points.js
Normal file
58
common/api/points.js
Normal file
@@ -0,0 +1,58 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 积分商城接口列表文件 开发者: 麦沃德科技-半夏
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 积分信息
|
||||
info: {
|
||||
url: '/api/wdsxh/points/my_points/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商品列表
|
||||
goodsList: {
|
||||
url: '/api/wdsxh/points/goods/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 商品详情
|
||||
goodsDetails: {
|
||||
url: '/api/wdsxh/points/goods/detail',
|
||||
method: 'GET',
|
||||
},
|
||||
// 订单创建
|
||||
createOrder: {
|
||||
url: '/api/wdsxh/points/order/submitSettlement',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 订单列表
|
||||
orderList: {
|
||||
url: '/api/wdsxh/points/order/index',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 订单详情
|
||||
orderDetails: {
|
||||
url: '/api/wdsxh/points/order/detail',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 确认收货
|
||||
orderConfirm: {
|
||||
url: '/api/wdsxh/points/order/confirmReceipt',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 积分明细
|
||||
record: {
|
||||
url: '/api/wdsxh/points/user_wechat_points_log/index',
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
47
common/api/questionnaire.js
Normal file
47
common/api/questionnaire.js
Normal file
@@ -0,0 +1,47 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 问卷调查接口列表文件 开发者: 麦沃德科技-暴雨
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 问卷分类
|
||||
questionCategory: {
|
||||
url: '/api/wdsxh/questionnaire/category/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 问卷列表
|
||||
questionList: {
|
||||
url: '/api/wdsxh/questionnaire/index/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 问卷详情
|
||||
questionDetails: {
|
||||
url: '/api/wdsxh/questionnaire/index/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 问卷提交
|
||||
questionAdd: {
|
||||
url: '/api/wdsxh/questionnaire/index/add_topic',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 问卷反馈详情
|
||||
renderDetails: {
|
||||
url: '/api/wdsxh/questionnaire/index/render_details',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 问卷权限
|
||||
limit: {
|
||||
url: '/api/wdsxh/questionnaire/index/answer_sheet_status',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
54
common/api/sequence.js
Normal file
54
common/api/sequence.js
Normal file
@@ -0,0 +1,54 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
// | 活动接龙接口列表文件 开发者: 麦沃德科技-暴雨
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
export default {
|
||||
// 接龙列表
|
||||
chainsList: {
|
||||
url: '/api/wdsxh/jielong/index',
|
||||
method: 'GET',
|
||||
},
|
||||
// 接龙详情
|
||||
chainsDetails: {
|
||||
url: '/api/wdsxh/jielong/details',
|
||||
method: 'GET',
|
||||
},
|
||||
// 限定接龙资格
|
||||
chainsSeniority: {
|
||||
url: '/api/wdsxh/jielong/jielong_state',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 获取反馈结果
|
||||
feedbackResult: {
|
||||
url: '/api/wdsxh/jielong/feedback_state',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
// 提交反馈
|
||||
addFeedback: {
|
||||
url: '/api/wdsxh/jielong/add',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 反馈详情
|
||||
feedbackDetails: {
|
||||
url: '/api/wdsxh/jielong/feedback_details',
|
||||
auth: true,
|
||||
method: 'POST',
|
||||
},
|
||||
// 接龙权限
|
||||
limit: {
|
||||
url: '/api/wdsxh/jielong/jielong_config',
|
||||
auth: true,
|
||||
method: 'GET',
|
||||
},
|
||||
};
|
||||
208
common/poster.js
Normal file
208
common/poster.js
Normal file
@@ -0,0 +1,208 @@
|
||||
// 获取图片信息，这里主要要获取图片缓存地址
|
||||
export function loadImage(url) {
|
||||
return new Promise(resolve => {
|
||||
uni.getImageInfo({
|
||||
src: url,
|
||||
success: (res) => {
|
||||
resolve(res.path)
|
||||
},
|
||||
fail: () => {
|
||||
resolve("")
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
// 解析海报对象，绘制canvas海报
|
||||
export function createPoster(ctx, posterItemList) {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
// 单行文本超出隐藏
|
||||
const textEllipsis = (text, maxWidth) => {
|
||||
let strWidth = ctx.measureText(text).width;
|
||||
const ellipsis = '…';
|
||||
const ellipsisWidth = ctx.measureText(ellipsis).width;
|
||||
if (strWidth > maxWidth && maxWidth > ellipsisWidth) {
|
||||
var len = text.length;
|
||||
while (strWidth >= (maxWidth - ellipsisWidth) && len-- > 0) {
|
||||
text = text.slice(0, len);
|
||||
strWidth = ctx.measureText(text).width;
|
||||
}
|
||||
text += ellipsis;
|
||||
}
|
||||
return text
|
||||
}
|
||||
// 文本换行
|
||||
const breakTextLines = (text, maxWidth) => {
|
||||
const words = text.split('');
|
||||
let line = '';
|
||||
const lines = [];
|
||||
for (let i = 0; i < words.length; i++) {
|
||||
const word = words[i];
|
||||
const testLine = line + word;
|
||||
const metrics = ctx.measureText(testLine);
|
||||
if (metrics.width > maxWidth && i > 0) {
|
||||
lines.push(line);
|
||||
line = word;
|
||||
} else {
|
||||
line = testLine;
|
||||
}
|
||||
}
|
||||
lines.push(line);
|
||||
return lines;
|
||||
};
|
||||
for (let i = 0; i < posterItemList.length; i++) {
|
||||
const temp = posterItemList[i];
|
||||
if (temp.type === 'image') {
|
||||
ctx.setStrokeStyle("rgba(255, 255, 255, 0)")
|
||||
ctx.save()
|
||||
var x = temp.config.x;
|
||||
var y = temp.config.y;
|
||||
var width = temp.config.w;
|
||||
var height = temp.config.h;
|
||||
var radius = temp.config.r || 0;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x + radius, y);
|
||||
ctx.lineTo(x + width - radius, y);
|
||||
ctx.arc(x + width - radius, y + radius, radius, -Math.PI / 2, 0); // 从右边绘制圆角
|
||||
ctx.lineTo(x + width, y + height - radius);
|
||||
ctx.arc(x + width - radius, y + height - radius, radius, 0, Math.PI / 2); // 从底部绘制圆角
|
||||
ctx.lineTo(x + radius, y + height);
|
||||
ctx.arc(x + radius, y + height - radius, radius, Math.PI / 2, Math.PI); // 从左边绘制圆角
|
||||
ctx.lineTo(x, y + radius)
|
||||
ctx.arc(x + radius, y + radius, radius, -Math.PI, -Math.PI / 2);
|
||||
ctx.closePath();
|
||||
ctx.clip();
|
||||
ctx.drawImage(temp.url, temp.config.x, temp.config.y, temp.config.w, temp.config.h);
|
||||
ctx.restore()
|
||||
} else if (temp.type === 'imageGroup') {
|
||||
let itemX = parseFloat(temp.config.x)
|
||||
for (let j in temp.group) {
|
||||
if (j >= 3) break;
|
||||
ctx.drawImage(temp.group[j], itemX, temp.config.y, temp.config.w, temp.config.h);
|
||||
itemX += parseFloat(temp.config.w) + parseFloat(temp.config.space)
|
||||
}
|
||||
} else if (temp.type === 'avatar') {
|
||||
ctx.save();
|
||||
ctx.beginPath();
|
||||
ctx.arc(temp.config.w / 2 + temp.config.x, temp.config.h / 2 + temp.config.y, temp.config
|
||||
.w / 2, 0, Math.PI * 2);
|
||||
ctx.clip();
|
||||
ctx.drawImage(temp.url, temp.config.x, temp.config.y, temp.config.w, temp.config.h);
|
||||
ctx.restore();
|
||||
ctx.setStrokeStyle('#fff');
|
||||
} else if (temp.type === 'text') {
|
||||
if (temp.config.font) ctx.font = temp.config.font
|
||||
else ctx.font = "10px sans-serif"
|
||||
temp.config.fontSize && ctx.setFontSize(temp.config.fontSize);
|
||||
temp.config.color && ctx.setFillStyle(temp.config.color);
|
||||
temp.config.textAlign && ctx.setTextAlign(temp.config.textAlign);
|
||||
ctx.setTextBaseline("middle")
|
||||
if (temp.config.wrap) {
|
||||
const maxWidth = temp.config.maxWidth;
|
||||
const lineHeight = temp.config.lineHeight;
|
||||
const lines = breakTextLines(temp.text, maxWidth);
|
||||
const lineNumber = temp.config.lineNumber || 2;
|
||||
if (temp.config.isVerticalCenter) {
|
||||
temp.config.y += lineHeight * lineNumber / 2 - lines.length * lineHeight / 2
|
||||
}
|
||||
for (let index = 0; index < lineNumber; index++) {
|
||||
if (index >= lines.length) break;
|
||||
let line = lines[index]
|
||||
if (index == lineNumber - 1 && (index + 1) < lines.length) {
|
||||
line = textEllipsis(line + "...", maxWidth)
|
||||
ctx.fillText(line, temp.config.x, temp.config.y + index * lineHeight);
|
||||
} else {
|
||||
ctx.fillText(line, temp.config.x, temp.config.y + index * lineHeight);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
const lineHeight = temp.config.lineHeight;
|
||||
if (temp.config.isVerticalCenter) {
|
||||
temp.config.y += lineHeight / 2
|
||||
}
|
||||
temp.text = textEllipsis(temp.text, temp.config.maxWidth)
|
||||
ctx.fillText(temp.text, temp.config.x, temp.config.y);
|
||||
}
|
||||
ctx.stroke();
|
||||
} else if (temp.type === 'textGroup') {
|
||||
let itemX = temp.config.x
|
||||
for (var j in temp.group) {
|
||||
const item = temp.group[j]
|
||||
if (temp.font) ctx.font = temp.font
|
||||
else ctx.font = "10px sans-serif"
|
||||
item.fontSize && ctx.setFontSize(item.fontSize);
|
||||
item.color && ctx.setFillStyle(item.color);
|
||||
temp.config.textAlign && ctx.setTextAlign(temp.config.textAlign);
|
||||
ctx.setTextBaseline("middle")
|
||||
if (item.wrap) {
|
||||
const maxWidth = temp.config.maxWidth - itemX + parseFloat(temp.config.x); // 最大宽度
|
||||
const lineHeight = item.lineHeight; // 行高
|
||||
const lines = breakTextLines(item.text, maxWidth);
|
||||
const lineNumber = item.lineNumber || 2;
|
||||
for (let index = 0; index < lineNumber; index++) {
|
||||
if (index >= lines.length) break;
|
||||
let line = lines[index]
|
||||
if (index == lineNumber - 1 && (index + 1) < lines.length) {
|
||||
line = textEllipsis(line + "...", maxWidth)
|
||||
ctx.fillText(line, itemX, temp.config.y + index * lineHeight);
|
||||
} else {
|
||||
ctx.fillText(line, itemX, temp.config.y + index * lineHeight);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
ctx.fillText(item.text, itemX, temp.config.y);
|
||||
}
|
||||
ctx.stroke();
|
||||
itemX += parseFloat(ctx.measureText(item.text).width)
|
||||
}
|
||||
} else if (temp.type === 'line') {
|
||||
ctx.beginPath()
|
||||
ctx.setLineWidth(temp.config.w)
|
||||
ctx.moveTo(temp.config.xo, temp.config.y)
|
||||
ctx.lineTo(temp.config.xt, temp.config.y)
|
||||
ctx.setStrokeStyle(temp.config.color)
|
||||
ctx.stroke()
|
||||
} else if (temp.type === 'function') {
|
||||
temp.function()
|
||||
}
|
||||
}
|
||||
ctx.draw();
|
||||
resolve()
|
||||
} catch (e) {
|
||||
reject(e)
|
||||
}
|
||||
})
|
||||
}
|
||||
// canvas转image图片
|
||||
export function canvasToTempFilePath(canvasId, vm, delay = 50) {
|
||||
return new Promise((resolve, reject) => {
|
||||
// 这里canvas绘制完成之后想要存缓存需要一定时间，这里设置了50毫秒
|
||||
setTimeout(() => {
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId: canvasId,
|
||||
success(res) {
|
||||
if (res.errMsg && res.errMsg.indexOf('ok') != -1) resolve(res.tempFilePath);
|
||||
else reject(res)
|
||||
},
|
||||
fail(err) {
|
||||
reject(err)
|
||||
}
|
||||
}, vm);
|
||||
}, delay)
|
||||
})
|
||||
}
|
||||
// 保存图片到相册
|
||||
export function saveImageToPhotosAlbum(imagePath) {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: imagePath,
|
||||
success(res) {
|
||||
resolve(res)
|
||||
},
|
||||
fail(err) {
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
254
common/svg.js
Normal file
254
common/svg.js
Normal file
@@ -0,0 +1,254 @@
|
||||
const svgData = {
|
||||
more: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<path d="M8 0C6.41772 0 4.87103 0.46875 3.55542 1.34863C2.23987 2.22754 1.21448 3.47656 0.608948 4.93848C0.003479 6.40039 -0.154968 8.00879 0.153748 9.56055C0.462402 11.1123 1.2243 12.5381 2.34314 13.6572C3.46198 14.7754 4.88745 15.5371 6.43927 15.8467C7.99115 16.1553 9.59967 15.9961 11.0615 15.3906C12.5233 14.7852 13.7727 13.7598 14.6517 12.4443C15.5308 11.1289 16 9.58203 16 8C15.9976 5.87891 15.154 3.8457 13.6542 2.3457C12.1544 0.845703 10.121 0.00195312 8 0ZM8 14.4004C6.73419 14.4004 5.49683 14.0244 4.44434 13.3213C3.39191 12.6182 2.57159 11.6182 2.08716 10.4492C1.60278 9.2793 1.47601 7.99316 1.72296 6.75098C1.96991 5.50977 2.57947 4.36914 3.47449 3.47461C4.36957 2.5791 5.50995 1.96973 6.7514 1.72266C7.99292 1.47559 9.27972 1.60254 10.4492 2.08691C11.6186 2.57129 12.6182 3.3916 13.3214 4.44434C14.0247 5.49707 14.4 6.73438 14.4 8C14.3981 9.69727 13.7231 11.3232 12.5233 12.5234C11.3235 13.7227 9.69678 14.3984 8 14.4004Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<path d="M5.76703 4.62012L9.27338 8.00098L5.76703 11.3818L6.92072 12.4932L11.5827 8.00098L6.92072 3.50684L5.76703 4.62012Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</svg>`,
|
||||
time: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<rect width="16.000000" height="16.000000" fill="#FFFFFF" fill-opacity="0"/>
|
||||
<path d="M8 1.33301C4.32666 1.33301 1.33337 4.32617 1.33337 8C1.33337 11.6729 4.32666 14.666 8 14.666C11.6733 14.666 14.6667 11.6729 14.6667 8C14.6667 4.32617 11.6733 1.33301 8 1.33301ZM10.9 10.3799C10.8068 10.54 10.64 10.626 10.4667 10.626C10.38 10.626 10.2933 10.6064 10.2134 10.5527L8.14673 9.31934C7.63342 9.0127 7.25342 8.33984 7.25342 7.74609L7.25342 5.0127C7.25342 4.73926 7.47998 4.5127 7.75342 4.5127C8.02673 4.5127 8.25342 4.73926 8.25342 5.0127L8.25342 7.74609C8.25342 7.98633 8.45337 8.33984 8.66003 8.45996L10.7267 9.69336C10.9667 9.83301 11.0468 10.1396 10.9 10.3799Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<g opacity="0.000000"/>
|
||||
</svg>`,
|
||||
location: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<clipPath id="clip4930_3326">
|
||||
<rect id="location" width="16.000000" height="16.000000" fill="white" fill-opacity="0"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<rect id="location" width="16.000000" height="16.000000" fill="#FFFFFF" fill-opacity="0"/>
|
||||
<g clip-path="url(#clip4930_3326)">
|
||||
<path id="Vector" d="M13.7467 5.63379C13.0468 2.55371 10.3601 1.16699 8.00012 1.16699C8.00012 1.16699 8.00012 1.16699 7.99341 1.16699C5.64001 1.16699 2.94678 2.54688 2.2467 5.62695C1.46667 9.06738 3.57336 11.9805 5.4801 13.8135C6.18677 14.4941 7.09338 14.834 8.00012 14.834C8.90674 14.834 9.81335 14.4941 10.5134 13.8135C12.42 11.9805 14.5267 9.07324 13.7467 5.63379ZM8.00012 8.97363C6.84009 8.97363 5.90002 8.0332 5.90002 6.87402C5.90002 5.71387 6.84009 4.77344 8.00012 4.77344C9.16003 4.77344 10.1001 5.71387 10.1001 6.87402C10.1001 8.0332 9.16003 8.97363 8.00012 8.97363Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<g opacity="0.000000"/>
|
||||
<g opacity="0.000000"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
invite: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<g opacity="0.000000"/>
|
||||
<path d="M10.7933 1.33301L5.20667 1.33301C2.78003 1.33301 1.33337 2.7793 1.33337 5.20605L1.33337 10.7861C1.33337 13.2197 2.78003 14.666 5.20667 14.666L10.7867 14.666C13.2134 14.666 14.66 13.2197 14.66 10.793L14.66 5.20605C14.6667 2.7793 13.2201 1.33301 10.7933 1.33301ZM10.9401 6.55273C10.5333 7.71289 9.44006 8.49316 8.21338 8.49316C8.20667 8.49316 8.20667 8.49316 8.20007 8.49316L6.82666 8.48633C6.82666 8.48633 6.82666 8.48633 6.82007 8.48633C6.31335 8.48633 5.87341 8.82617 5.73999 9.31348C6.33337 9.5 6.76672 10.0527 6.76672 10.7061C6.76672 11.5127 6.10669 12.1729 5.30005 12.1729C4.49341 12.1729 3.83337 11.5127 3.83337 10.7061C3.83337 10.1133 4.19336 9.59961 4.70007 9.37305L4.70007 6.4668C4.19336 6.2666 3.83337 5.77344 3.83337 5.19922C3.83337 4.44629 4.44666 3.83301 5.20007 3.83301C5.95337 3.83301 6.56665 4.44629 6.56665 5.19922C6.56665 5.7793 6.20667 6.2666 5.70007 6.4668L5.70007 7.81348C6.02673 7.60645 6.41333 7.48633 6.82007 7.48633L6.82666 7.48633L8.20007 7.49316C8.98669 7.51953 9.68677 7.0127 9.96667 6.2793C9.64001 6.02637 9.42676 5.63965 9.42676 5.19922C9.42676 4.44629 10.04 3.83301 10.7933 3.83301C11.5468 3.83301 12.16 4.44629 12.16 5.19922C12.1667 5.90625 11.6267 6.47949 10.9401 6.55273Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</svg>`,
|
||||
phone: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<circle id="Ellipse 52" cx="8.000000" cy="7.500000" r="8.000000" fill="#FFFFFF" fill-opacity="0"/>
|
||||
<path id="合并" d="M5.20996 0.833008L10.7966 0.833008C13.2234 0.833008 14.67 2.2793 14.6633 4.70605L14.6633 10.293C14.6633 12.7197 13.2167 14.166 10.79 14.166L5.20996 14.166C2.78333 14.166 1.33667 12.7197 1.33667 10.2861L1.33667 4.70605C1.33667 2.2793 2.78333 0.833008 5.20996 0.833008Z" clip-rule="evenodd" fill="#325DFF" fill-opacity="1.000000" fill-rule="evenodd"/>
|
||||
<path id="Vector" d="M5.6 6.96C6.24 8.21 7.28 9.24 8.53 9.89L9.51 8.91C9.63 8.79 9.81 8.75 9.96 8.8C10.46 8.97 11 9.05 11.55 9.05C11.8 9.05 12 9.25 12 9.5L12 11.05C12 11.29 11.8 11.5 11.55 11.5C7.38 11.5 4 8.11 4 3.94C4 3.7 4.19 3.5 4.44 3.5L6 3.5C6.24 3.5 6.44 3.7 6.44 3.94C6.44 4.5 6.53 5.03 6.69 5.53C6.74 5.68 6.71 5.86 6.58 5.98L5.6 6.96Z" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</svg>`,
|
||||
clock: `<svg width="20.000000" height="20.000000" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<g clip-path="url(#clip4609_5448)">
|
||||
<path id="Vector" d="M10 2.125C5.1875 2.125 1.25 6.0625 1.25 10.875C1.25 15.6875 5.1875 19.625 10 19.625C14.8125 19.625 18.75 15.6875 18.75 10.875C18.75 6.0625 14.8125 2.125 10 2.125ZM10 18.375C5.875 18.375 2.5 15 2.5 10.875C2.5 6.6875 5.875 3.3125 10 3.3125C14.125 3.3125 17.5625 6.6875 17.5625 10.875C17.5625 15 14.1875 18.375 10 18.375ZM17.1875 3.75C17.3125 3.8125 17.375 3.875 17.5 3.875C17.6875 3.875 17.875 3.75 18 3.625L18.125 3.4375C18.1875 3.3125 18.25 3.125 18.25 3C18.25 2.8125 18.125 2.6875 18 2.625L15.9375 1.1875C15.8125 1.125 15.75 1.0625 15.625 1.0625C15.4375 1.0625 15.25 1.1875 15.125 1.3125L15 1.5C14.9375 1.625 14.875 1.8125 14.875 1.9375C14.875 2.0625 15 2.25 15.125 2.3125L17.1875 3.75ZM2 3.875C2.125 4 2.3125 4.125 2.5 4.125C2.625 4.125 2.75 4.0625 2.875 4L4.75 2.375C5 2.125 5.0625 1.75 4.8125 1.5L4.75 1.375C4.625 1.25 4.4375 1.1875 4.25 1.1875C4.125 1.1875 4 1.25 3.875 1.3125L2 2.9375C1.75 3.125 1.6875 3.5 1.9375 3.75L2 3.875Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<path id="Vector" d="M12.875 10.3125L9.8125 10.3125L9.8125 7C9.8125 6.6875 9.5625 6.375 9.1875 6.3125L9.125 6.3125C8.75 6.3125 8.4375 6.625 8.4375 7L8.4375 11.625L12.875 11.625C13.25 11.625 13.5625 11.3125 13.5625 10.9375C13.5625 10.625 13.25 10.3125 12.875 10.3125Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
down: `<svg width="10.000000" height="8.000000" viewBox="0 0 10 8" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<path id="Polygon 2" d="M5.54607 7.71387C5.30338 8.0957 4.69662 8.0957 4.45393 7.71387L0.0854187 0.857422C-0.157272 0.476562 0.146088 0 0.631485 0L9.36852 0C9.85391 0 10.1573 0.476562 9.91458 0.857422L5.54607 7.71387Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</svg>`,
|
||||
release: `<svg width="20.000000" height="20.000000" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<g clip-path="url(#clip4557_5025)">
|
||||
<circle id="Ellipse 67" cx="10.000000" cy="10.000000" r="10.000000" fill="#FFFFFF" fill-opacity="1.000000"/>
|
||||
<path id="Vector" d="M11.917 17.9775C11.775 17.9775 11.6371 17.9092 11.5511 17.791L11.5492 17.7871L8.57495 13.0439C8.573 13.042 8.57092 13.04 8.56897 13.04L2.50659 12.5967L2.50061 12.5967C2.3147 12.5723 2.16077 12.4346 2.11682 12.251C2.07288 12.0703 2.14685 11.8789 2.29871 11.7725L15.5367 3.38379L15.5388 3.38184C15.6587 3.30176 15.8086 3.28027 15.9425 3.32812C16.1644 3.41016 16.2823 3.62988 16.2363 3.84766L12.3586 17.6172C12.3207 17.791 12.1848 17.9287 12.0109 17.9668C11.9789 17.9727 11.9469 17.9775 11.917 17.9775Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
security: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<g clip-path="url(#clip4557_7034)">
|
||||
<path id="Vector" d="M8 0.666992L2 3.33398L2 7.33398C2 11.0332 4.56006 14.4941 8 15.334C11.4399 14.4941 14 11.0332 14 7.33398L14 3.33398L8 0.666992ZM8 7.99414L12.6666 7.99414C12.3134 10.7402 10.48 13.1865 8 13.9541L8 8L3.33337 8L3.33337 4.2002L8 2.12695L8 7.99414Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
sheet: `<svg width="109.000008" height="99.000000" viewBox="0 0 109 99" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<linearGradient id="paint_linear_4474_1306_0" x1="31.000008" y1="20.500000" x2="68.500000" y2="82.499992" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#325DFF"/>
|
||||
<stop offset="1.000000" stop-color="#325DFF" stop-opacity="0.000000"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint_linear_4474_1307_0" x1="31.500008" y1="12.500000" x2="69.000000" y2="74.499992" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#325DFF"/>
|
||||
<stop offset="1.000000" stop-color="#325DFF" stop-opacity="0.000000"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<path d="M0 38C10 33.667 45.2 15.2002 52 8C59 18.5 95.5 63.5 100.5 64.5C95 69.5 46.5 94 42.5 99C38.5 93 17.5 49.5 0 38Z" fill="url(#paint_linear_4474_1306_0)" fill-opacity="1.000000" fill-rule="evenodd"/>
|
||||
<path d="M0.5 30C10.5 25.667 45.7 7.2002 52.5 0C59.5 10.5 96 55.5 101 56.5C95.5 61.5 47 86 43 91C39 85 18 41.5 0.5 30Z" fill="url(#paint_linear_4474_1307_0)" fill-opacity="1.000000" fill-rule="evenodd"/>
|
||||
<rect x="18.000000" y="35.036133" rx="2.000000" width="32.000000" height="4.000000" transform="rotate(-30.0748 18.000000 35.036133)" fill="#FFFFFF" fill-opacity="1.000000"/>
|
||||
<rect x="23.000000" y="43.036133" rx="2.000000" width="32.000000" height="4.000000" transform="rotate(-30.0748 23.000000 43.036133)" fill="#FFFFFF" fill-opacity="1.000000"/>
|
||||
<rect x="28.000000" y="51.036133" rx="2.000000" width="32.000000" height="4.000000" transform="rotate(-30.0748 28.000000 51.036133)" fill="#FFFFFF" fill-opacity="1.000000"/>
|
||||
<path d="M48.8848 74.2119L48.9126 74.2168C49.0707 74.4482 49.0134 74.7539 48.7823 74.9121C48.5512 75.0703 48.2454 75.0127 48.0873 74.7822L48.0925 74.7539L48.8848 74.2119ZM70.3253 58.1465L70.3535 58.1465C70.5515 58.3438 70.5515 58.6553 70.3535 58.8535C70.1556 59.0508 69.8444 59.0508 69.6465 58.8535L69.6465 58.8252L70.3253 58.1465Z" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<path d="M48.5 74.5C46.3333 71.333 43.9 65.1992 51.5 66C61 67 65 70 65 66C65 62 60.5 57 65 57.5C68.6 57.8994 69.8333 58.333 70 58.5" stroke="#FFFFFF" stroke-opacity="1.000000" stroke-width="1.000000" stroke-linecap="round"/>
|
||||
<path d="M71.2453 59C69.7148 52.8887 75.733 49.2129 78.5889 43.0098C89.0602 25.2285 76.821 10.7539 108.915 4C109.459 15.5791 107.283 23.8496 105.515 28.123L97.2197 31.9824C99.1689 31.6611 103.448 30.7969 104.971 29.915C103.475 36.2559 101.027 40.2529 99.2596 41.3555C96.7573 42.1279 93.8652 42.7803 92.732 43.0098L98.5796 43.5615C97.129 45.4453 92.5416 49.792 86.3404 49.9023C83.5117 49.9023 79.1782 48.4775 78.3169 48.248L97.2197 18.749C91.916 25.7793 79.296 43.6719 71.2453 59Z" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="evenodd"/>
|
||||
<path d="M70.2453 59C68.7148 52.8887 74.733 49.2129 77.5889 43.0098C88.0602 25.2285 75.821 10.7539 107.915 4C108.459 15.5791 106.283 23.8496 104.515 28.123L96.2197 31.9824C98.1689 31.6611 102.448 30.7969 103.971 29.915C102.475 36.2559 100.027 40.2529 98.2596 41.3555C95.7573 42.1279 92.8652 42.7803 91.732 43.0098L97.5796 43.5615C96.129 45.4453 91.5416 49.792 85.3404 49.9023C82.5117 49.9023 78.1782 48.4775 77.3169 48.248L96.2197 18.749C90.916 25.7793 78.296 43.6719 70.2453 59Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="evenodd"/>
|
||||
</svg>`,
|
||||
fees: `<svg width="375.262451" height="60.000000" viewBox="0 0 375.262 60" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<linearGradient id="paint_linear_4557_7531_0" x1="8.283279" y1="54.999969" x2="362.449951" y2="54.999969" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#325DFF"/>
|
||||
<stop offset="1.000000" stop-color="#325DFF"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<path id="Vector 18" d="M0.131104 0L187.7 50.4648L375.131 0L375.131 59.9268L187.7 60L0.131104 59.9268L0.131104 0Z" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="evenodd"/>
|
||||
<path id="Vector 19" d="" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<path id="Vector 19" d="M0.131104 4L187.7 55L375.131 4" stroke="url(#paint_linear_4557_7531_0)" stroke-opacity="1.000000" stroke-width="1.000000"/>
|
||||
</svg>`,
|
||||
pay: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<clipPath id="clip5365_4444">
|
||||
<rect width="16.000000" height="16.000000" fill="white" fill-opacity="0"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<rect width="16.000000" height="16.000000" fill="#FFFFFF" fill-opacity="0"/>
|
||||
<g clip-path="url(#clip5365_4444)">
|
||||
<path id="Vector" d="M13.6331 4.13574C13.9661 4.46875 14.137 4.88086 14.146 5.37305L14.146 12.373C14.137 12.8652 13.9661 13.2773 13.6331 13.6104C13.3 13.9434 12.8879 14.1143 12.396 14.123L3.646 14.123C3.15405 14.1143 2.74097 13.9434 2.40894 13.6104C2.07593 13.2773 1.90503 12.8652 1.896 12.373L1.896 5.37305C1.90503 4.88086 2.07593 4.46875 2.40894 4.13574C2.74194 3.80273 3.15405 3.63184 3.646 3.62305L12.396 3.62305C12.8879 3.63281 13.3 3.80273 13.6331 4.13574ZM2.88696 2.63184C2.80908 2.55469 2.771 2.44727 2.771 2.31055C2.771 2.1748 2.81006 2.06738 2.88696 1.99023C2.96411 1.91309 3.07202 1.87402 3.20801 1.87402L12.833 1.87402C12.97 1.87402 13.0769 1.91309 13.1541 1.99023C13.231 2.06836 13.27 2.1748 13.27 2.31055C13.27 2.44727 13.231 2.55469 13.1541 2.63184C13.0759 2.70996 12.969 2.74805 12.833 2.74805L3.20801 2.74805C3.07104 2.74805 2.96411 2.70996 2.88696 2.63184ZM8.45801 9.39258L8.45801 8.87305L9.77002 8.87305C9.90698 8.87305 10.0139 8.83398 10.0911 8.75684C10.168 8.67969 10.207 8.57227 10.207 8.43555C10.207 8.2998 10.168 8.19238 10.0911 8.11523C10.0129 8.03809 9.90601 7.99902 9.77002 7.99902L8.97705 7.99902L9.85205 7.12402C9.94312 7.0332 9.98901 6.92969 9.98901 6.81641C9.98901 6.70215 9.94312 6.60156 9.85205 6.51465C9.76099 6.42773 9.66089 6.38477 9.55103 6.38477C9.44092 6.38477 9.34106 6.42578 9.25 6.50781L8.02002 7.73828L6.79004 6.60449C6.69897 6.5127 6.59888 6.4668 6.48901 6.4668C6.37891 6.4668 6.27905 6.5127 6.18799 6.60449C6.09692 6.69531 6.05103 6.79492 6.05103 6.90527C6.05103 7.01465 6.09692 7.11523 6.18799 7.20605L7.06299 7.99902L6.27002 7.99902C6.13306 7.99902 6.02588 8.03809 5.94897 8.11523C5.87109 8.19336 5.83301 8.2998 5.83301 8.43555C5.83301 8.57227 5.87207 8.67969 5.94897 8.75684C6.02588 8.83496 6.13403 8.87305 6.27002 8.87305L7.58203 8.87305L7.58203 9.39258L6.271 9.39258C6.13403 9.40234 6.0271 9.44629 5.94995 9.52344C5.87207 9.60059 5.83398 9.70508 5.83398 9.83691C5.83398 9.96875 5.87305 10.0742 5.94995 10.1514C6.0271 10.2295 6.13501 10.2666 6.271 10.2666L7.58301 10.2666L7.58301 10.9775C7.58301 11.1064 7.62207 11.208 7.69897 11.2861C7.77588 11.3643 7.88403 11.4023 8.02002 11.4023C8.15601 11.4023 8.26392 11.3633 8.34106 11.2861C8.41797 11.209 8.45703 11.1064 8.45703 10.9775L8.45703 10.2666L9.76904 10.2666C9.90601 10.2666 10.0129 10.2275 10.0901 10.1514C10.167 10.0742 10.2061 9.96875 10.2061 9.83691C10.2061 9.70508 10.167 9.59961 10.0901 9.52344C10.012 9.44629 9.90503 9.40234 9.76904 9.39258L8.45801 9.39258Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
edit: `<svg width="24.000000" height="24.000000" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<clipPath id="clip4609_5918">
|
||||
<rect id="border_color" width="24.000000" height="24.000000" fill="white" fill-opacity="0"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<rect id="border_color" width="24.000000" height="24.000000" fill="#FFFFFF" fill-opacity="0"/>
|
||||
<g clip-path="url(#clip4609_5918)">
|
||||
<path id="Vector" d="M15.8958 8.53125L13.4696 6.10352L7 12.5742L7 15L9.42612 15L15.8958 8.53125ZM17.8108 6.61523C18.0631 6.36328 18.0631 5.95508 17.8108 5.70312L16.2969 4.18945C16.0446 3.9375 15.637 3.9375 15.3846 4.18945L14.1166 5.45703L16.5427 7.88281L17.8108 6.61523Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
<path id="Vector" d="M4 17L20 17L20 20L4 20L4 17Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
navigation: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<clipPath id="clip4934_3111">
|
||||
<rect id="route-square" width="16.000000" height="16.000000" fill="white" fill-opacity="0"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<rect id="route-square" width="16.000000" height="16.000000" fill="#FFFFFF" fill-opacity="0"/>
|
||||
<g clip-path="url(#clip4934_3111)">
|
||||
<g opacity="0.000000"/>
|
||||
<path id="Vector" d="M10.7934 1.33301L5.20668 1.33301C2.78001 1.33301 1.33334 2.7793 1.33334 5.20605L1.33334 10.7861C1.33334 13.2197 2.78001 14.666 5.20668 14.666L10.7867 14.666C13.2133 14.666 14.66 13.2197 14.66 10.793L14.66 5.20605C14.6667 2.7793 13.22 1.33301 10.7934 1.33301ZM11.5667 6.0332L10.0067 11.0596C9.63335 12.2529 7.96001 12.2734 7.56668 11.0859L7.10001 9.70605C6.97334 9.32617 6.67334 9.01953 6.29335 8.89941L4.90668 8.43262C3.73334 8.04004 3.74667 6.35254 4.94002 5.99316L9.96667 4.42676C10.9533 4.12598 11.88 5.05273 11.5667 6.0332Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
network: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs>
|
||||
<clipPath id="clip241_6749">
|
||||
<rect width="16.000000" height="16.000000" fill="white" fill-opacity="0"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g clip-path="url(#clip241_6749)">
|
||||
<circle cx="8.000000" cy="8.500000" r="7.000000" fill="#325DFF" fill-opacity="1.000000"/>
|
||||
<path id="path" d="M8 3.5C5.23859 3.5 3 5.73828 3 8.5C3 11.2617 5.23859 13.5 8 13.5C10.7614 13.5 13 11.2617 13 8.5C13 5.73828 10.7614 3.5 8 3.5ZM7.64288 6.33789C7.16315 6.29785 6.70569 6.18066 6.28406 5.99414C6.62555 5.0957 7.13013 4.48535 7.64288 4.28711L7.64288 6.33789ZM7.64288 7.05273L7.64288 8.14258L5.86707 8.14258C5.88995 7.61328 5.96216 7.12207 6.07233 6.67871C6.56104 6.88477 7.08905 7.0127 7.64288 7.05273ZM7.64288 8.85742L7.64288 9.94727C7.08905 9.9873 6.56104 10.1152 6.07233 10.3213C5.96204 9.87793 5.88995 9.38672 5.86707 8.85742L7.64288 8.85742ZM7.64288 10.6621L7.64288 12.7129C7.13013 12.5146 6.62555 11.9043 6.28406 11.0059C6.70569 10.8193 7.16315 10.7021 7.64288 10.6621ZM8.35712 10.6621C8.83685 10.7021 9.29431 10.8193 9.71594 11.0059C9.37445 11.9043 8.86987 12.5146 8.35712 12.7129L8.35712 10.6621ZM8.35712 9.94727L8.35712 8.85742L10.1329 8.85742C10.11 9.38672 10.038 9.87793 9.92767 10.3213C9.43896 10.1152 8.91095 9.9873 8.35712 9.94727ZM8.35712 8.14258L8.35712 7.05273C8.91095 7.0127 9.43896 6.88477 9.92767 6.67871C10.038 7.12207 10.11 7.61328 10.1329 8.14258L8.35712 8.14258ZM8.35712 6.33789L8.35712 4.28711C8.86987 4.48535 9.37445 5.0957 9.71594 5.99414C9.29431 6.18066 8.83685 6.29785 8.35712 6.33789ZM9.79645 4.61426C10.1715 4.78809 10.5142 5.01172 10.8246 5.28516C10.6744 5.41797 10.5123 5.53613 10.3447 5.64648C10.1902 5.25879 10.0058 4.91113 9.79645 4.61426ZM5.65546 5.64648C5.48785 5.53613 5.32568 5.41797 5.17548 5.28516C5.48584 5.01172 5.82861 4.78809 6.20367 4.61426C5.9942 4.91113 5.80981 5.25879 5.65546 5.64648ZM5.42401 6.34863C5.27356 6.89844 5.17914 7.50391 5.15326 8.14258L3.73248 8.14258C3.80591 7.25879 4.14679 6.44922 4.67688 5.79883C4.90723 6.00488 5.15839 6.1875 5.42401 6.34863ZM5.15314 8.85742C5.17902 9.49609 5.27344 10.1016 5.42389 10.6514C5.15826 10.8125 4.90723 10.9951 4.6767 11.2012C4.14655 10.5508 3.80566 9.74121 3.73224 8.85742L5.15314 8.85742ZM5.65546 11.3535C5.80981 11.7412 5.9942 12.0889 6.20367 12.3857C5.82861 12.2119 5.4859 11.9883 5.17548 11.7148C5.32568 11.582 5.48785 11.4639 5.65546 11.3535ZM10.3445 11.3535C10.5121 11.4639 10.6743 11.582 10.8246 11.7148C10.5142 11.9883 10.1714 12.2119 9.79633 12.3857C10.0058 12.0889 10.1902 11.7412 10.3445 11.3535ZM10.576 10.6514C10.7264 10.1016 10.8209 9.49609 10.8467 8.85742L12.2675 8.85742C12.1941 9.74121 11.8532 10.5508 11.3231 11.2012C11.0928 10.9951 10.8416 10.8125 10.576 10.6514ZM10.8469 8.14258C10.821 7.50391 10.7266 6.89844 10.5761 6.34863C10.8417 6.1875 11.0928 6.00488 11.3233 5.79883C11.8535 6.44922 12.1943 7.25879 12.2678 8.14258L10.8469 8.14258Z" fill="#FFFFFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
share: `<svg width="16.000000" height="16.000000" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<path id="Vector" d="M14.7356 8.4209C14.7356 8.25391 14.8021 8.09277 14.9207 7.97461C15.0391 7.85645 15.1997 7.78906 15.3672 7.78906C15.5347 7.78906 15.6953 7.85645 15.8137 7.97461C15.9321 8.09277 15.9987 8.25391 15.9987 8.4209L15.9987 13.6846C15.9987 14.9629 14.9619 16 13.6831 16L2.31555 16C1.03674 16 0 14.9629 0 13.6846L0 2.94727C0 1.66895 1.03674 0.631836 2.31555 0.631836L7.78882 0.631836C7.9563 0.631836 8.11694 0.698242 8.23535 0.816406C8.35388 0.93457 8.42041 1.0957 8.42041 1.26367C8.42041 1.43066 8.35388 1.5918 8.23535 1.70996C8.11694 1.82812 7.9563 1.89453 7.78882 1.89453L2.31555 1.89453C2.0365 1.89453 1.76868 2.00586 1.57129 2.20312C1.3739 2.40039 1.26306 2.66797 1.26306 2.94727L1.26306 13.6846C1.26306 13.9639 1.3739 14.2314 1.57129 14.4287C1.76868 14.626 2.0365 14.7373 2.31555 14.7373L13.6831 14.7373C13.9623 14.7373 14.23 14.626 14.4274 14.4287C14.6248 14.2314 14.7356 13.9639 14.7356 13.6846L14.7356 8.4209ZM13.9056 2.94727L12.1335 1.06445C12.0187 0.942383 11.9572 0.780273 11.9622 0.612305C11.9673 0.445312 12.0387 0.286133 12.1606 0.171875C12.2827 0.0566406 12.4453 -0.00488281 12.6127 0C12.7802 0.00585938 12.9387 0.0771484 13.0535 0.199219L15.8271 3.14648C16.2064 3.54883 15.9205 4.21094 15.3672 4.21094L12.1971 4.21094C10.5852 4.21094 9.26245 5.61621 9.26245 7.36816L9.26245 11.1582C9.26245 11.3252 9.1958 11.4863 9.07739 11.6045C8.95898 11.7227 8.79834 11.7891 8.63086 11.7891C8.46338 11.7891 8.30273 11.7227 8.18433 11.6045C8.06592 11.4863 7.99939 11.3252 7.99939 11.1582L7.99939 7.36816C7.99939 4.93457 9.86987 2.94727 12.1971 2.94727L13.9056 2.94727Z" fill="#325DFF" fill-opacity="1.000000" fill-rule="nonzero"/>
|
||||
</svg>`,
|
||||
download: `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<path d="M10.7933 1.33301H5.20659C2.77992 1.33301 1.33325 2.77967 1.33325 5.20634V10.7863C1.33325 13.2197 2.77992 14.6663 5.20659 14.6663H10.7866C13.2133 14.6663 14.6599 13.2197 14.6599 10.793V5.20634C14.6666 2.77967 13.2199 1.33301 10.7933 1.33301ZM5.64659 7.31967C5.83992 7.12634 6.15992 7.12634 6.35325 7.31967L7.49992 8.46634V4.33967C7.49992 4.06634 7.72659 3.83967 7.99992 3.83967C8.27325 3.83967 8.49992 4.06634 8.49992 4.33967V8.46634L9.64659 7.31967C9.83992 7.12634 10.1599 7.12634 10.3533 7.31967C10.5466 7.51301 10.5466 7.83301 10.3533 8.02634L8.35325 10.0263C8.30659 10.073 8.25325 10.1063 8.19325 10.133C8.13325 10.1597 8.06659 10.173 7.99992 10.173C7.93325 10.173 7.87325 10.1597 7.80659 10.133C7.74659 10.1063 7.69325 10.073 7.64659 10.0263L5.64659 8.02634C5.45325 7.83301 5.45325 7.51967 5.64659 7.31967ZM12.1599 11.4797C10.8199 11.9263 9.41325 12.153 7.99992 12.153C6.58659 12.153 5.17992 11.9263 3.83992 11.4797C3.57992 11.393 3.43992 11.1063 3.52659 10.8463C3.61325 10.5863 3.89325 10.4397 4.15992 10.533C6.63992 11.3597 9.36659 11.3597 11.8466 10.533C12.1066 10.4463 12.3933 10.5863 12.4799 10.8463C12.5599 11.113 12.4199 11.393 12.1599 11.4797Z" fill="#325DFF"/>
|
||||
</svg>`,
|
||||
upload: `<svg width="36" height="32" viewBox="0 0 36 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<desc>
|
||||
Created with maiwd-zct.
|
||||
</desc>
|
||||
<defs/>
|
||||
<path d="M3.6002 24.3258C3.59361 25.1258 3.91496 25.8955 4.49359 26.4658C5.07221 27.036 5.86072 27.36 6.68568 27.3665H12.4674C12.9136 27.3658 13.3542 27.2705 13.7585 27.0875C14.1628 26.9045 14.521 26.6381 14.8081 26.3069L16.3081 24.5825C16.5952 24.2514 16.9534 23.985 17.3577 23.8019C17.762 23.6189 18.2027 23.5237 18.6488 23.5229H29.8238C30.6487 23.5164 31.4372 23.1924 32.0159 22.6221C32.5945 22.0519 32.9158 21.2822 32.9092 20.4822V3.04073C32.9158 2.24076 32.5945 1.47101 32.0159 0.900776C31.4372 0.330545 30.6487 0.0065318 29.8238 0H6.68568C5.86072 0.0065318 5.07221 0.330545 4.49359 0.900776C3.91496 1.47101 3.59361 2.24076 3.6002 3.04073V24.3258Z" fill="#0059FF" fill-opacity="0.6"/>
|
||||
<path d="M0.000120755 7.68835C-0.00826585 6.62201 0.420494 5.5961 1.19209 4.83629C1.96369 4.07647 3.01493 3.64498 4.11459 3.63672L10.95 3.63672C11.4861 3.6375 12.0167 3.74066 12.5116 3.94032C13.0066 4.13998 13.4561 4.43222 13.8345 4.80036L15.5475 6.45854C15.926 6.82667 16.3755 7.11891 16.8704 7.31857C17.3653 7.51823 17.896 7.62139 18.432 7.62217H31.8854C32.9847 7.63044 34.0356 8.06163 34.8071 8.82097C35.5786 9.58031 36.0077 10.6057 35.9999 11.6716V27.948C36.0041 28.4761 35.9011 28.9998 35.6966 29.4892C35.4921 29.9786 35.1902 30.4242 34.8082 30.8005C34.4261 31.1768 33.9713 31.4765 33.4698 31.6823C32.9684 31.8882 32.43 31.9963 31.8854 32.0004H4.11459C3.01493 31.9921 1.96369 31.5606 1.19209 30.8008C0.420494 30.041 -0.00826585 29.0151 0.000120755 27.9487V7.68835Z" fill="#0059FF"/>
|
||||
<path d="M13.6441 20.2883C13.4483 20.2885 13.2568 20.2329 13.0933 20.1286C12.9297 20.0242 12.8014 19.8756 12.7241 19.7011C12.6468 19.5267 12.624 19.3341 12.6585 19.1472C12.693 18.9604 12.7832 18.7874 12.9181 18.6498L17.4683 13.9996C17.5644 13.9013 17.6801 13.823 17.8084 13.7696C17.9367 13.7161 18.0749 13.6885 18.2146 13.6885C18.3542 13.6885 18.4924 13.7161 18.6207 13.7696C18.749 13.823 18.8647 13.9013 18.9608 13.9996L23.511 18.6491C23.6459 18.7867 23.7362 18.9596 23.7707 19.1465C23.8052 19.3334 23.7824 19.526 23.7051 19.7004C23.6278 19.8748 23.4994 20.0235 23.3359 20.1278C23.1723 20.2322 22.9808 20.2878 22.785 20.2876H20.9701C20.8336 20.2876 20.7027 20.3402 20.6062 20.4337C20.5098 20.5273 20.4556 20.6542 20.4556 20.7865V22.7123C20.4557 22.8433 20.4291 22.9731 20.3775 23.0941C20.3259 23.2152 20.2501 23.3252 20.1547 23.4179C20.0592 23.5105 19.9458 23.584 19.821 23.6342C19.6962 23.6843 19.5624 23.7102 19.4273 23.7102H17.0018C16.7291 23.7102 16.4676 23.6051 16.2748 23.4181C16.0819 23.2311 15.9736 22.9775 15.9736 22.7131V20.7865C15.9736 20.6542 15.9194 20.5273 15.8229 20.4337C15.7264 20.3402 15.5955 20.2876 15.4591 20.2876L13.6441 20.2883Z" fill="white" fill-opacity="0.9"/>
|
||||
</svg>`,
|
||||
address: `<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
|
||||
<path d="M6 11C8.75 11 11 8.75 11 6C11 3.25 8.75 1 6 1C3.25 1 1 3.25 1 6C1 8.75 3.25 11 6 11Z" stroke="#325DFF" stroke-miterlimit="10"/>
|
||||
<path d="M6.75 4.00012C5.235 4.00012 4 5.24012 4 6.75012C4 8.00012 4 8.00012 5.25 8.00012C6.76 8.00012 8 6.76012 8 5.25012C8 3.96225 8 4.00012 6.75 4.00012Z" stroke="#325DFF" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>`,
|
||||
details: `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
|
||||
<path d="M10.6667 1.33398H5.33333C2.66666 1.33398 1.33333 2.66732 1.33333 5.33398V14.0007C1.33333 14.3673 1.63333 14.6673 1.99999 14.6673H10.6667C13.3333 14.6673 14.6667 13.334 14.6667 10.6673V5.33398C14.6667 2.66732 13.3333 1.33398 10.6667 1.33398ZM9.33333 10.1673H4.66666C4.39333 10.1673 4.16666 9.94065 4.16666 9.66732C4.16666 9.39398 4.39333 9.16732 4.66666 9.16732H9.33333C9.60666 9.16732 9.83333 9.39398 9.83333 9.66732C9.83333 9.94065 9.60666 10.1673 9.33333 10.1673ZM11.3333 6.83398H4.66666C4.39333 6.83398 4.16666 6.60732 4.16666 6.33398C4.16666 6.06065 4.39333 5.83398 4.66666 5.83398H11.3333C11.6067 5.83398 11.8333 6.06065 11.8333 6.33398C11.8333 6.60732 11.6067 6.83398 11.3333 6.83398Z" fill="#325DFF"/>
|
||||
</svg>`,
|
||||
auth: `<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none">
|
||||
<path d="M8.90473 2.745V3.115L7.13473 2.09C6.46473 1.705 5.52973 1.705 4.86473 2.09L3.09473 3.12V2.745C3.09473 1.62 3.70973 1 4.83473 1H7.16473C8.28973 1 8.90473 1.62 8.90473 2.745Z" fill="#325DFF"/>
|
||||
<path d="M8.92 3.98512L8.85 3.95012L8.17 3.56012L6.76 2.74512C6.33 2.49512 5.67 2.49512 5.24 2.74512L3.83 3.55512L3.15 3.95512L3.06 4.00012C2.185 4.59012 2.125 4.70012 2.125 5.64512V7.90512C2.125 8.85012 2.185 8.96012 3.08 9.56512L5.24 10.8101C5.455 10.9401 5.725 10.9951 6 10.9951C6.27 10.9951 6.545 10.9351 6.76 10.8101L8.94 9.55012C9.82 8.96012 9.875 8.85512 9.875 7.90512V5.64512C9.875 4.70012 9.815 4.59012 8.92 3.98512ZM7.395 6.75012L7.09 7.12512C7.04 7.18012 7.005 7.28512 7.01 7.36012L7.04 7.84012C7.06 8.13512 6.85 8.28512 6.575 8.18012L6.13 8.00012C6.06 7.97512 5.945 7.97512 5.875 8.00012L5.43 8.17512C5.155 8.28512 4.945 8.13012 4.965 7.83512L4.995 7.35512C5 7.28012 4.965 7.17512 4.915 7.12012L4.605 6.75012C4.415 6.52512 4.5 6.27512 4.785 6.20012L5.25 6.08012C5.325 6.06012 5.41 5.99012 5.45 5.93012L5.71 5.53012C5.87 5.28012 6.125 5.28012 6.29 5.53012L6.55 5.93012C6.59 5.99512 6.68 6.06012 6.75 6.08012L7.215 6.20012C7.5 6.27512 7.585 6.52512 7.395 6.75012Z" fill="#325DFF"/>
|
||||
</svg>`,
|
||||
rectangle: `<svg xmlns="http://www.w3.org/2000/svg" width="58" height="53" viewBox="0 0 58 53" fill="none">
|
||||
<path d="M34 0H58L24 53H0L34 0Z" fill="url(#paint0_linear_95_16249)"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_95_16249" x1="21" y1="0" x2="21" y2="53" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#325DFF" stop-opacity="0.2"/>
|
||||
<stop offset="1" stop-color="#325DFF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>`,
|
||||
search: `<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
|
||||
<g clip-path="url(#clip0_3907_10643)">
|
||||
<path d="M12.9167 11.6667H12.2583L12.025 11.4417C12.8417 10.4917 13.3333 9.25833 13.3333 7.91667C13.3333 4.925 10.9083 2.5 7.91667 2.5C4.925 2.5 2.5 4.925 2.5 7.91667C2.5 10.9083 4.925 13.3333 7.91667 13.3333C9.25833 13.3333 10.4917 12.8417 11.4417 12.025L11.6667 12.2583V12.9167L15.8333 17.075L17.075 15.8333L12.9167 11.6667ZM7.91667 11.6667C5.84167 11.6667 4.16667 9.99167 4.16667 7.91667C4.16667 5.84167 5.84167 4.16667 7.91667 4.16667C9.99167 4.16667 11.6667 5.84167 11.6667 7.91667C11.6667 9.99167 9.99167 11.6667 7.91667 11.6667Z" fill="#325DFF"/>
|
||||
</g>
|
||||
</svg>`,
|
||||
expand: `<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none">
|
||||
<path d="M8.50001 11.6994C8.03335 11.6994 7.56668 11.5194 7.21335 11.1661L2.86668 6.81944C2.67335 6.62611 2.67335 6.30611 2.86668 6.11277C3.06001 5.91944 3.38001 5.91944 3.57335 6.11277L7.92001 10.4594C8.24001 10.7794 8.76001 10.7794 9.08001 10.4594L13.4267 6.11277C13.62 5.91944 13.94 5.91944 14.1333 6.11277C14.3267 6.30611 14.3267 6.62611 14.1333 6.81944L9.78668 11.1661C9.43335 11.5194 8.96668 11.6994 8.50001 11.6994Z" fill="#325DFF" />
|
||||
</svg>`,
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
svgToUrl(key, color) {
|
||||
var url = svgData[key]
|
||||
var encoded = url
|
||||
.replace(/<!--(.*)-->/g, "")
|
||||
.replace(/[\r\n]/g, " ")
|
||||
.replace(/"/g, `'`)
|
||||
.replace(/%/g, "%25")
|
||||
.replace(/&/g, "%26")
|
||||
.replace(/#/g, "%23")
|
||||
.replace(/{/g, "%7B")
|
||||
.replace(/}/g, "%7D")
|
||||
.replace(/</g, "%3C")
|
||||
.replace(/>/g, "%3E")
|
||||
let res = '"' + `data:image/svg+xml,${encoded}` + '"';
|
||||
if (color) {
|
||||
res = res.replaceAll("%23325DFF", color.replace("#", "%23"))
|
||||
}
|
||||
return res
|
||||
},
|
||||
}
|
||||
2224
common/tools.js
Normal file
2224
common/tools.js
Normal file
File diff suppressed because it is too large
Load Diff
38
components/u-alert-tips/theme.scss
Normal file
38
components/u-alert-tips/theme.scss
Normal file
@@ -0,0 +1,38 @@
|
||||
// 此文件为uView的主题变量，这些变量目前只能通过uni.scss引入才有效，另外由于
|
||||
// uni.scss中引入的样式会同时混入到全局样式文件和单独每一个页面的样式中，造成微信程序包太大，
|
||||
// 故uni.scss只建议放scss变量名相关样式，其他的样式可以通过main.js或者App.vue引入
|
||||
|
||||
$u-main-color: #303133;
|
||||
$u-content-color: #606266;
|
||||
$u-tips-color: #909399;
|
||||
$u-light-color: #c0c4cc;
|
||||
$u-border-color: #e4e7ed;
|
||||
$u-bg-color: #f3f4f6;
|
||||
|
||||
$u-type-primary: #2979ff;
|
||||
$u-type-primary-light: #ecf5ff;
|
||||
$u-type-primary-disabled: #a0cfff;
|
||||
$u-type-primary-dark: #2b85e4;
|
||||
|
||||
$u-type-warning: #ff9900;
|
||||
$u-type-warning-disabled: #fcbd71;
|
||||
$u-type-warning-dark: #f29100;
|
||||
$u-type-warning-light: #fdf6ec;
|
||||
|
||||
$u-type-success: #19be6b;
|
||||
$u-type-success-disabled: #71d5a1;
|
||||
$u-type-success-dark: #18b566;
|
||||
$u-type-success-light: #dbf1e1;
|
||||
|
||||
$u-type-error: #fa3534;
|
||||
$u-type-error-disabled: #fab6b6;
|
||||
$u-type-error-dark: #dd6161;
|
||||
$u-type-error-light: #fef0f0;
|
||||
|
||||
$u-type-info: #909399;
|
||||
$u-type-info-disabled: #c8c9cc;
|
||||
$u-type-info-dark: #82848a;
|
||||
$u-type-info-light: #f4f4f5;
|
||||
|
||||
$u-form-item-height: 70rpx;
|
||||
$u-form-item-border-color: #dcdfe6;
|
||||
341
components/u-alert-tips/u-alert-tips.vue
Normal file
341
components/u-alert-tips/u-alert-tips.vue
Normal file
@@ -0,0 +1,341 @@
|
||||
<template>
|
||||
<view class="u-alert-tips" v-if="show" :class="[
|
||||
!show ? 'u-close-alert-tips': '',
|
||||
type ? 'u-alert-tips--bg--' + type + '-light' : '',
|
||||
type ? 'u-alert-tips--border--' + type + '-disabled' : '',
|
||||
]" :style="{
|
||||
backgroundColor: bgColor,
|
||||
borderColor: borderColor
|
||||
}">
|
||||
<view class="u-icon-wrap">
|
||||
<u-icon v-if="showIcon" :name="uIcon + '-fill'" :size="description ? 56 : 40" class="u-icon" :color="uIconType" :custom-style="iconStyle"></u-icon>
|
||||
</view>
|
||||
<view class="u-alert-content" @tap.stop="click">
|
||||
<view class="u-alert-title" :class="'u-alert-tips--color--' + type" :style="[uTitleStyle]">
|
||||
{{title}}
|
||||
</view>
|
||||
<view v-if="description" class="u-alert-desc" :class="'u-alert-tips--color--' + type" :style="[descStyle]">
|
||||
{{description}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-icon-wrap">
|
||||
<u-icon @click="close" v-if="closeAble && !closeText" hoverClass="u-type-error-hover-color" name="close" color="#c0c4cc"
|
||||
:size="22" class="u-close-icon" :style="{
|
||||
top: description ? '18rpx' : '24rpx'
|
||||
}"></u-icon>
|
||||
</view>
|
||||
<text v-if="closeAble && closeText" class="u-close-text" :style="{
|
||||
top: description ? '18rpx' : '24rpx'
|
||||
}">{{closeText}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* alertTips 警告提示
|
||||
* @description 警告提示，展现需要关注的信息
|
||||
* @tutorial https://uviewui.com/components/alertTips.html
|
||||
* @property {String} title 显示的标题文字
|
||||
* @property {String} description 辅助性文字，颜色比title浅一点，字号也小一点，可选
|
||||
* @property {String} type 关闭按钮(默认为叉号icon图标)
|
||||
* @property {String} icon 图标名称
|
||||
* @property {Object} icon-style 图标的样式，对象形式
|
||||
* @property {Object} title-style 标题的样式，对象形式
|
||||
* @property {Object} desc-style 描述的样式，对象形式
|
||||
* @property {String} close-able 用文字替代关闭图标，close-able为true时有效
|
||||
* @property {Boolean} show-icon 是否显示左边的辅助图标
|
||||
* @property {Boolean} show 显示或隐藏组件
|
||||
* @event {Function} click 点击组件时触发
|
||||
* @event {Function} close 点击关闭按钮时触发
|
||||
*/
|
||||
export default {
|
||||
name: 'u-alert-tips',
|
||||
props: {
|
||||
// 显示文字
|
||||
title: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 主题，success/warning/info/error
|
||||
type: {
|
||||
type: String,
|
||||
default: 'warning'
|
||||
},
|
||||
// 辅助性文字
|
||||
description: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 是否可关闭
|
||||
closeAble: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 关闭按钮自定义文本
|
||||
closeText: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 是否显示图标
|
||||
showIcon: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 文字颜色，如果定义了color值，icon会失效
|
||||
color: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 背景颜色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 边框颜色
|
||||
borderColor: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 是否显示
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 左边显示的icon
|
||||
icon: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// icon的样式
|
||||
iconStyle: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 标题的样式
|
||||
titleStyle: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 描述文字的样式
|
||||
descStyle: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
uTitleStyle() {
|
||||
let style = {};
|
||||
// 如果有描述文字的话，标题进行加粗
|
||||
style.fontWeight = this.description ? 'bold' : 'normal';
|
||||
// 将用户传入样式对象和style合并，传入的优先级比style高，同属性会被覆盖
|
||||
return this.deepMerge(style, this.titleStyle);
|
||||
},
|
||||
uIcon() {
|
||||
// 如果有设置icon名称就使用，否则根据type主题，推定一个默认的图标
|
||||
return this.icon ? this.icon : this.type2icon(this.type);
|
||||
},
|
||||
uIconType() {
|
||||
// 如果有设置图标的样式，优先使用，没有的话，则用type的样式
|
||||
return Object.keys(this.iconStyle).length ? '' : this.type;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deepMerge(target, source) {
|
||||
if (source) {
|
||||
for (var s in source) {
|
||||
if (source.hasOwnProperty(s)) {
|
||||
var value = source[s];
|
||||
|
||||
if (typeof value === 'object' && typeof target[s] === 'object') {
|
||||
target[s] = this._extends({}, target[s], {}, value);
|
||||
} else {
|
||||
target[s] = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return target;
|
||||
},
|
||||
type2icon(type = 'success', fill = false) {
|
||||
// 如果非预置值,默认为success
|
||||
if (['primary', 'info', 'error', 'warning', 'success'].indexOf(type) == -1) type = 'success';
|
||||
let iconName = '';
|
||||
// 目前(2019-12-12),info和primary使用同一个图标
|
||||
switch (type) {
|
||||
case 'primary':
|
||||
iconName = 'info-circle';
|
||||
break;
|
||||
case 'info':
|
||||
iconName = 'info-circle';
|
||||
break;
|
||||
case 'error':
|
||||
iconName = 'close-circle';
|
||||
break;
|
||||
case 'warning':
|
||||
iconName = 'error-circle';
|
||||
break;
|
||||
case 'success':
|
||||
iconName = 'checkmark-circle';
|
||||
break;
|
||||
default:
|
||||
iconName = 'checkmark-circle';
|
||||
}
|
||||
// 是否是实体类型,加上-fill,在icon组件库中,实体的类名是后面加-fill的
|
||||
if (fill) iconName += '-fill';
|
||||
return iconName;
|
||||
},
|
||||
_extends() {
|
||||
_extends = Object.assign || function(target) {
|
||||
for (var i = 1; i < arguments.length; i++) {
|
||||
var source = arguments[i];
|
||||
|
||||
for (var key in source) {
|
||||
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
||||
target[key] = source[key];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return target;
|
||||
};
|
||||
|
||||
return _extends.apply(this, arguments);
|
||||
},
|
||||
// 点击内容
|
||||
click() {
|
||||
this.$emit('click');
|
||||
},
|
||||
// 点击关闭按钮
|
||||
close() {
|
||||
this.$emit('close');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './theme.scss';
|
||||
|
||||
.u-alert-tips {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
padding: 16rpx 30rpx;
|
||||
border-radius: 8rpx;
|
||||
position: relative;
|
||||
transition: all 0.3s linear;
|
||||
border: 1px solid #fff;
|
||||
|
||||
&--bg--primary-light {
|
||||
background-color: $u-type-primary-light;
|
||||
}
|
||||
|
||||
&--bg--info-light {
|
||||
background-color: $u-type-info-light;
|
||||
}
|
||||
|
||||
&--bg--success-light {
|
||||
background-color: $u-type-success-light;
|
||||
}
|
||||
|
||||
&--bg--warning-light {
|
||||
background-color: $u-type-warning-light;
|
||||
}
|
||||
|
||||
&--bg--error-light {
|
||||
background-color: $u-type-error-light;
|
||||
}
|
||||
|
||||
&--color--primary {
|
||||
color: $u-type-primary !important;
|
||||
}
|
||||
|
||||
&--color--info {
|
||||
color: $u-type-info !important;
|
||||
}
|
||||
|
||||
&--color--success {
|
||||
color: $u-type-success !important;
|
||||
}
|
||||
|
||||
&--color--warning {
|
||||
color: $u-type-warning !important;
|
||||
}
|
||||
|
||||
&--color--error {
|
||||
color: $u-type-error !important;
|
||||
}
|
||||
|
||||
&--border--primary-disabled {
|
||||
border-color: $u-type-primary-disabled;
|
||||
}
|
||||
|
||||
&--border--success-disabled {
|
||||
border-color: $u-type-success-disabled;
|
||||
}
|
||||
|
||||
&--border--error-disabled {
|
||||
border-color: $u-type-error-disabled;
|
||||
}
|
||||
|
||||
&--border--warning-disabled {
|
||||
border-color: $u-type-warning-disabled;
|
||||
}
|
||||
|
||||
&--border--info-disabled {
|
||||
border-color: $u-type-info-disabled;
|
||||
}
|
||||
}
|
||||
|
||||
.u-close-alert-tips {
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.u-icon {
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.u-alert-title {
|
||||
font-size: 28rpx;
|
||||
color: $u-main-color;
|
||||
}
|
||||
|
||||
.u-alert-desc {
|
||||
font-size: 24rpx;
|
||||
text-align: left;
|
||||
color: $u-content-color;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.u-close-icon {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.u-close-hover {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.u-close-text {
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 20rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
</style>
|
||||
910
components/u-icon/iconfont.css
Normal file
910
components/u-icon/iconfont.css
Normal file
File diff suppressed because one or more lines are too long
38
components/u-icon/theme.scss
Normal file
38
components/u-icon/theme.scss
Normal file
@@ -0,0 +1,38 @@
|
||||
// 此文件为uView的主题变量，这些变量目前只能通过uni.scss引入才有效，另外由于
|
||||
// uni.scss中引入的样式会同时混入到全局样式文件和单独每一个页面的样式中，造成微信程序包太大，
|
||||
// 故uni.scss只建议放scss变量名相关样式，其他的样式可以通过main.js或者App.vue引入
|
||||
|
||||
$u-main-color: #303133;
|
||||
$u-content-color: #606266;
|
||||
$u-tips-color: #909399;
|
||||
$u-light-color: #c0c4cc;
|
||||
$u-border-color: #e4e7ed;
|
||||
$u-bg-color: #f3f4f6;
|
||||
|
||||
$u-type-primary: #2979ff;
|
||||
$u-type-primary-light: #ecf5ff;
|
||||
$u-type-primary-disabled: #a0cfff;
|
||||
$u-type-primary-dark: #2b85e4;
|
||||
|
||||
$u-type-warning: #ff9900;
|
||||
$u-type-warning-disabled: #fcbd71;
|
||||
$u-type-warning-dark: #f29100;
|
||||
$u-type-warning-light: #fdf6ec;
|
||||
|
||||
$u-type-success: #19be6b;
|
||||
$u-type-success-disabled: #71d5a1;
|
||||
$u-type-success-dark: #18b566;
|
||||
$u-type-success-light: #dbf1e1;
|
||||
|
||||
$u-type-error: #fa3534;
|
||||
$u-type-error-disabled: #fab6b6;
|
||||
$u-type-error-dark: #dd6161;
|
||||
$u-type-error-light: #fef0f0;
|
||||
|
||||
$u-type-info: #909399;
|
||||
$u-type-info-disabled: #c8c9cc;
|
||||
$u-type-info-dark: #82848a;
|
||||
$u-type-info-light: #f4f4f5;
|
||||
|
||||
$u-form-item-height: 70rpx;
|
||||
$u-form-item-border-color: #dcdfe6;
|
||||
351
components/u-icon/u-icon.vue
Normal file
351
components/u-icon/u-icon.vue
Normal file
@@ -0,0 +1,351 @@
|
||||
<template>
|
||||
<view :style="[customStyle]" class="u-icon" @tap="click" :class="['u-icon--' + labelPos]">
|
||||
<image class="u-icon__img" v-if="isImg" :src="name" :mode="imgMode" :style="[imgStyle]"></image>
|
||||
<text v-else class="u-icon__icon" :class="customClass" :style="[iconStyle]" :hover-class="hoverClass"
|
||||
@touchstart="touchstart">
|
||||
<text v-if="showDecimalIcon" :style="[decimalIconStyle]" :class="decimalIconClass" :hover-class="hoverClass"
|
||||
class="u-icon__decimal">
|
||||
</text>
|
||||
</text>
|
||||
<!-- 这里进行空字符串判断，如果仅仅是v-if="label"，可能会出现传递0的时候，结果也无法显示 -->
|
||||
<text v-if="label !== ''" class="u-icon__label" :style="{
|
||||
color: labelColor,
|
||||
fontSize: $u.addUnit(labelSize),
|
||||
marginLeft: labelPos == 'right' ? $u.addUnit(marginLeft) : 0,
|
||||
marginTop: labelPos == 'bottom' ? $u.addUnit(marginTop) : 0,
|
||||
marginRight: labelPos == 'left' ? $u.addUnit(marginRight) : 0,
|
||||
marginBottom: labelPos == 'top' ? $u.addUnit(marginBottom) : 0,
|
||||
}">{{ label }}
|
||||
</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* icon 图标
|
||||
* @description 基于字体的图标集，包含了大多数常见场景的图标。
|
||||
* @tutorial https://www.uviewui.com/components/icon.html
|
||||
* @property {String} name 图标名称，见示例图标集
|
||||
* @property {String} color 图标颜色（默认inherit）
|
||||
* @property {String | Number} size 图标字体大小，单位rpx（默认32）
|
||||
* @property {String | Number} label-size label字体大小，单位rpx（默认28）
|
||||
* @property {String} label 图标右侧的label文字（默认28）
|
||||
* @property {String} label-pos label文字相对于图标的位置，只能right或bottom（默认right）
|
||||
* @property {String} label-color label字体颜色（默认#606266）
|
||||
* @property {Object} custom-style icon的样式，对象形式
|
||||
* @property {String} custom-prefix 自定义字体图标库时，需要写上此值
|
||||
* @property {String | Number} margin-left label在右侧时与图标的距离，单位rpx（默认6）
|
||||
* @property {String | Number} margin-top label在下方时与图标的距离，单位rpx（默认6）
|
||||
* @property {String | Number} margin-bottom label在上方时与图标的距离，单位rpx（默认6）
|
||||
* @property {String | Number} margin-right label在左侧时与图标的距离，单位rpx（默认6）
|
||||
* @property {String} label-pos label相对于图标的位置，只能right或bottom（默认right）
|
||||
* @property {String} index 一个用于区分多个图标的值，点击图标时通过click事件传出
|
||||
* @property {String} hover-class 图标按下去的样式类，用法同uni的view组件的hover-class参数，详情见官网
|
||||
* @property {String} width 显示图片小图标时的宽度
|
||||
* @property {String} height 显示图片小图标时的高度
|
||||
* @property {String} top 图标在垂直方向上的定位
|
||||
* @property {String} top 图标在垂直方向上的定位
|
||||
* @property {String} top 图标在垂直方向上的定位
|
||||
* @property {Boolean} show-decimal-icon 是否为DecimalIcon
|
||||
* @property {String} inactive-color 背景颜色，可接受主题色，仅Decimal时有效
|
||||
* @property {String | Number} percent 显示的百分比，仅Decimal时有效
|
||||
* @event {Function} click 点击图标时触发
|
||||
* @example <u-icon name="photo" color="#2979ff" size="28"></u-icon>
|
||||
*/
|
||||
|
||||
var config_type=[
|
||||
'primary',
|
||||
'success',
|
||||
'info',
|
||||
'error',
|
||||
'warning'
|
||||
]
|
||||
export default {
|
||||
name: 'u-icon',
|
||||
props: {
|
||||
// 图标类名
|
||||
name: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 图标颜色，可接受主题色
|
||||
color: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 字体大小，单位rpx
|
||||
size: {
|
||||
type: [Number, String],
|
||||
default: 'inherit'
|
||||
},
|
||||
// 是否显示粗体
|
||||
bold: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 点击图标的时候传递事件出去的index（用于区分点击了哪一个）
|
||||
index: {
|
||||
type: [Number, String],
|
||||
default: ''
|
||||
},
|
||||
// 触摸图标时的类名
|
||||
hoverClass: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
// 自定义扩展前缀，方便用户扩展自己的图标库
|
||||
customPrefix: {
|
||||
type: String,
|
||||
default: 'uicon'
|
||||
},
|
||||
// 图标右边或者下面的文字
|
||||
label: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
// label的位置，只能右边或者下边
|
||||
labelPos: {
|
||||
type: String,
|
||||
default: 'right'
|
||||
},
|
||||
// label的大小
|
||||
labelSize: {
|
||||
type: [String, Number],
|
||||
default: '28'
|
||||
},
|
||||
// label的颜色
|
||||
labelColor: {
|
||||
type: String,
|
||||
default: '#606266'
|
||||
},
|
||||
// label与图标的距离(横向排列)
|
||||
marginLeft: {
|
||||
type: [String, Number],
|
||||
default: '6'
|
||||
},
|
||||
// label与图标的距离(竖向排列)
|
||||
marginTop: {
|
||||
type: [String, Number],
|
||||
default: '6'
|
||||
},
|
||||
// label与图标的距离(竖向排列)
|
||||
marginRight: {
|
||||
type: [String, Number],
|
||||
default: '6'
|
||||
},
|
||||
// label与图标的距离(竖向排列)
|
||||
marginBottom: {
|
||||
type: [String, Number],
|
||||
default: '6'
|
||||
},
|
||||
// 图片的mode
|
||||
imgMode: {
|
||||
type: String,
|
||||
default: 'widthFix'
|
||||
},
|
||||
// 自定义样式
|
||||
customStyle: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 用于显示图片小图标时，图片的宽度
|
||||
width: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
// 用于显示图片小图标时，图片的高度
|
||||
height: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
// 用于解决某些情况下，让图标垂直居中的用途
|
||||
top: {
|
||||
type: [String, Number],
|
||||
default: 0
|
||||
},
|
||||
// 是否为DecimalIcon
|
||||
showDecimalIcon: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 背景颜色，可接受主题色，仅Decimal时有效
|
||||
inactiveColor: {
|
||||
type: String,
|
||||
default: '#ececec'
|
||||
},
|
||||
// 显示的百分比，仅Decimal时有效
|
||||
percent: {
|
||||
type: [Number, String],
|
||||
default: '50'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
customClass() {
|
||||
let classes = []
|
||||
classes.push(this.customPrefix + '-' + this.name)
|
||||
// uView的自定义图标类名为u-iconfont
|
||||
if (this.customPrefix == 'uicon') {
|
||||
classes.push('u-iconfont')
|
||||
} else {
|
||||
classes.push(this.customPrefix)
|
||||
}
|
||||
// 主题色，通过类配置
|
||||
if (this.showDecimalIcon && this.inactiveColor && config_type.includes(this.inactiveColor)) {
|
||||
classes.push('u-icon__icon--' + this.inactiveColor)
|
||||
} else if (this.color && config_type.includes(this.color)) classes.push('u-icon__icon--' + this.color)
|
||||
// 阿里，头条，百度小程序通过数组绑定类名时，无法直接使用[a, b, c]的形式，否则无法识别
|
||||
// 故需将其拆成一个字符串的形式，通过空格隔开各个类名
|
||||
//#ifdef MP-ALIPAY || MP-TOUTIAO || MP-BAIDU
|
||||
classes = classes.join(' ')
|
||||
//#endif
|
||||
return classes
|
||||
},
|
||||
iconStyle() {
|
||||
let style = {}
|
||||
style = {
|
||||
fontSize: this.size == 'inherit' ? 'inherit' : this.addUnit(this.size),
|
||||
fontWeight: this.bold ? 'bold' : 'normal',
|
||||
// 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
|
||||
top: this.addUnit(this.top)
|
||||
}
|
||||
// 非主题色值时，才当作颜色值
|
||||
if (this.showDecimalIcon && this.inactiveColor && !config_type.includes(this.inactiveColor)) {
|
||||
style.color = this.inactiveColor
|
||||
} else if (this.color && !config_type.includes(this.color)) style.color = this.color
|
||||
|
||||
return style
|
||||
},
|
||||
// 判断传入的name属性，是否图片路径，只要带有"/"均认为是图片形式
|
||||
isImg() {
|
||||
return this.name.indexOf('/') !== -1
|
||||
},
|
||||
|
||||
imgStyle() {
|
||||
let style = {}
|
||||
// 如果设置width和height属性，则优先使用，否则使用size属性
|
||||
style.width = this.width ? this.addUnit(this.width) : this.addUnit(this.size)
|
||||
style.height = this.height ? this.addUnit(this.height) : this.addUnit(this.size)
|
||||
return style
|
||||
},
|
||||
decimalIconStyle() {
|
||||
let style = {}
|
||||
style = {
|
||||
fontSize: this.size == 'inherit' ? 'inherit' : this.addUnit(this.size),
|
||||
fontWeight: this.bold ? 'bold' : 'normal',
|
||||
// 某些特殊情况需要设置一个到顶部的距离，才能更好的垂直居中
|
||||
top: this.addUnit(this.top),
|
||||
width: this.percent + '%'
|
||||
}
|
||||
// 非主题色值时，才当作颜色值
|
||||
if (this.color && !config_type.includes(this.color)) style.color = this.color
|
||||
return style
|
||||
},
|
||||
decimalIconClass() {
|
||||
let classes = []
|
||||
classes.push(this.customPrefix + '-' + this.name)
|
||||
// uView的自定义图标类名为u-iconfont
|
||||
if (this.customPrefix == 'uicon') {
|
||||
classes.push('u-iconfont')
|
||||
} else {
|
||||
classes.push(this.customPrefix)
|
||||
}
|
||||
// 主题色，通过类配置
|
||||
if (this.color && config_type.includes(this.color)) classes.push('u-icon__icon--' + this.color)
|
||||
else classes.push('u-icon__icon--primary')
|
||||
// 阿里，头条，百度小程序通过数组绑定类名时，无法直接使用[a, b, c]的形式，否则无法识别
|
||||
// 故需将其拆成一个字符串的形式，通过空格隔开各个类名
|
||||
//#ifdef MP-ALIPAY || MP-TOUTIAO || MP-BAIDU
|
||||
classes = classes.join(' ')
|
||||
//#endif
|
||||
return classes
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
addUnit(value = 'auto', unit = 'rpx'){
|
||||
value = String(value);
|
||||
// 用uView内置验证规则中的number判断是否为数值
|
||||
return (/^(?:-?\d+|-?\d{1,3}(?:,\d{3})+)?(?:\.\d+)?$/.test(value)) ? `${value}${unit}` : value;
|
||||
},
|
||||
click() {
|
||||
this.$emit('click', this.index)
|
||||
},
|
||||
touchstart() {
|
||||
this.$emit('touchstart', this.index)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import './theme.scss';
|
||||
@import './iconfont.css';
|
||||
|
||||
|
||||
.u-icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
&--left {
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&--right {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&--top {
|
||||
flex-direction: column-reverse;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&--bottom {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&__icon {
|
||||
position: relative;
|
||||
|
||||
&--primary {
|
||||
color: $u-type-primary;
|
||||
}
|
||||
|
||||
&--success {
|
||||
color: $u-type-success;
|
||||
}
|
||||
|
||||
&--error {
|
||||
color: $u-type-error;
|
||||
}
|
||||
|
||||
&--warning {
|
||||
color: $u-type-warning;
|
||||
}
|
||||
|
||||
&--info {
|
||||
color: $u-type-info;
|
||||
}
|
||||
}
|
||||
|
||||
&__decimal {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&__img {
|
||||
height: auto;
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
&__label {
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
88
components/u-time-line-item/u-time-line-item.vue
Normal file
88
components/u-time-line-item/u-time-line-item.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<view class="u-time-axis-item">
|
||||
<slot name="content" />
|
||||
<view class="u-time-axis-node">
|
||||
<slot name="node">
|
||||
<view class="u-dot" :style="[nodeStyle]">
|
||||
</view>
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* timeLineItem 时间轴Item
|
||||
* @description 时间轴组件一般用于物流信息展示，各种跟时间相关的记录等场景。(搭配u-time-line使用)
|
||||
* @tutorial https://www.uviewui.com/components/timeLine.html
|
||||
* @property {String} bg-color 左边节点的背景颜色，一般通过slot内容自定义背景颜色即可（默认#ffffff）
|
||||
* @property {String Number} node-top 节点左边图标绝对定位的top值，单位rpx
|
||||
* @example <u-time-line-item node-top="2">...</u-time-line-item>
|
||||
*/
|
||||
export default {
|
||||
name: "u-time-line-item",
|
||||
props: {
|
||||
// 节点的背景颜色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: "#ffffff"
|
||||
},
|
||||
// 节点左边图标绝对定位的top值
|
||||
nodeTop: {
|
||||
type: [String, Number],
|
||||
default: ""
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
nodeStyle() {
|
||||
let style = {
|
||||
backgroundColor: this.bgColor,
|
||||
};
|
||||
if (this.nodeTop != "") style.top = this.nodeTop + 'rpx';
|
||||
return style;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
.u-time-axis-item {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
// flex-direction: $direction;
|
||||
/* #endif */
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.u-time-axis-node {
|
||||
position: absolute;
|
||||
top: 12rpx;
|
||||
left: -40rpx;
|
||||
transform-origin: 0;
|
||||
transform: translateX(-50%);
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
// flex-direction: $direction;
|
||||
/* #endif */
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.u-dot {
|
||||
height: 16rpx;
|
||||
width: 16rpx;
|
||||
border-radius: 100rpx;
|
||||
background: #ddd;
|
||||
}
|
||||
</style>
|
||||
36
components/u-time-line/u-time-line.vue
Normal file
36
components/u-time-line/u-time-line.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<view class="u-time-axis">
|
||||
<slot />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "u-time-line",
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
.u-time-axis {
|
||||
padding-left: 40rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.u-time-axis::before {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 12rpx;
|
||||
width: 1px;
|
||||
bottom: 0;
|
||||
border-left: 1px solid #ddd;
|
||||
transform-origin: 0 0;
|
||||
transform: scaleX(0.5);
|
||||
}
|
||||
</style>
|
||||
30
index.html
Normal file
30
index.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<!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>
|
||||
37
main.js
Normal file
37
main.js
Normal file
@@ -0,0 +1,37 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
import App from './App'
|
||||
|
||||
import Vue from 'vue'
|
||||
import store from './store'
|
||||
import './uni.promisify.adaptor'
|
||||
import tools from './common/tools.js'
|
||||
import titleBar from '@/pages/component/title-bar/title-bar.vue'
|
||||
import tabBar from '@/pages/component/tab-bar/tab-bar.vue'
|
||||
import empty from '@/pages/component/empty/empty.vue'
|
||||
Vue.component("title-bar", titleBar)
|
||||
Vue.component("tab-bar", tabBar)
|
||||
Vue.component("empty", empty)
|
||||
// #ifdef H5
|
||||
Vue.config.ignoredElements.push('wx-open-launch-weapp')
|
||||
// #endif
|
||||
Vue.prototype.$store = store
|
||||
Vue.prototype.$util = tools
|
||||
Vue.prototype.$onLaunched = new Promise(resolve => {
|
||||
Vue.prototype.$isResolve = resolve
|
||||
})
|
||||
Vue.config.productionTip = false
|
||||
App.mpType = 'app'
|
||||
const app = new Vue({
|
||||
...App,
|
||||
store
|
||||
})
|
||||
app.$mount()
|
||||
103
manifest.json
Normal file
103
manifest.json
Normal file
@@ -0,0 +1,103 @@
|
||||
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
{
|
||||
"name" : "岳阳跨境电商协会",
|
||||
"appid" : "__UNI__1F195EB",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {},
|
||||
/* 应用发布信息 */
|
||||
"distribute" : {
|
||||
/* android打包配置 */
|
||||
"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打包配置 */
|
||||
"ios" : {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {}
|
||||
}
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx5585dbd917acf86d",
|
||||
"optimization" : {
|
||||
"subPackages" : true
|
||||
},
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
"usingComponents" : true,
|
||||
"requiredPrivateInfos" : [ "chooseLocation", "getLocation" ],
|
||||
"permission" : {
|
||||
"scope.userLocation" : {
|
||||
"desc" : "为了完善个人信息，小程序将获取您的位置"
|
||||
}
|
||||
}
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-toutiao" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"uniStatistics" : {
|
||||
"enable" : false
|
||||
},
|
||||
"vueVersion" : "2",
|
||||
"h5" : {
|
||||
"router" : {
|
||||
"mode" : "hash",
|
||||
"base" : "./"
|
||||
},
|
||||
"sdkConfigs" : {
|
||||
"maps" : {}
|
||||
},
|
||||
"unipush" : {
|
||||
"enable" : false
|
||||
}
|
||||
}
|
||||
}
|
||||
12
node_modules/.package-lock.json
generated
vendored
Normal file
12
node_modules/.package-lock.json
generated
vendored
Normal file
@@ -0,0 +1,12 @@
|
||||
{
|
||||
"name": "商协会-高级版",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"node_modules/weixin-js-sdk": {
|
||||
"version": "1.6.5",
|
||||
"resolved": "https://registry.npmjs.org/weixin-js-sdk/-/weixin-js-sdk-1.6.5.tgz",
|
||||
"integrity": "sha512-Gph1WAWB2YN/lMOFB/ymb+hbU/wYazzJgu6PMMktCy9cSCeW5wA6Zwt0dpahJbJ+RJEwtTv2x9iIu0U4enuVSQ=="
|
||||
}
|
||||
}
|
||||
}
|
||||
21
node_modules/weixin-js-sdk/LICENSE
generated
vendored
Normal file
21
node_modules/weixin-js-sdk/LICENSE
generated
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2023 Yanxi
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
36
node_modules/weixin-js-sdk/README.md
generated
vendored
Normal file
36
node_modules/weixin-js-sdk/README.md
generated
vendored
Normal file
@@ -0,0 +1,36 @@
|
||||
微信官方 js-sdk
|
||||
----
|
||||
|
||||
说明: 仅将官方 js-sdk 发布到 npm，支持 CommonJS，便于 browserify, webpack 等直接使用，支持 TypeScript。
|
||||
|
||||
|
||||
官方 JS 源码: https://res.wx.qq.com/open/js/jweixin-1.6.0.js
|
||||
|
||||
官方使用说明: https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html
|
||||
|
||||
安装:
|
||||
```shell
|
||||
npm install weixin-js-sdk
|
||||
```
|
||||
|
||||
使用:
|
||||
```javascript
|
||||
// commonjs
|
||||
var wx = require('weixin-js-sdk');
|
||||
|
||||
// es module
|
||||
import wx from 'weixin-js-sdk'
|
||||
```
|
||||
|
||||
### Old versions
|
||||
|
||||
* [1.0.0](https://github.com/yanxi123-com/weixin-js-sdk/tree/1.0.0)
|
||||
* [1.2.0](https://github.com/yanxi123-com/weixin-js-sdk/tree/1.2.0)
|
||||
|
||||
### 个人主页
|
||||
|
||||
* [https://yanxi123.com/](https://yanxi123.com/)
|
||||
|
||||
### 感谢
|
||||
|
||||
TypeScript 定义文件来自 [wx-jssdk-ts](https://github.com/zhaoky/wx-jssdk-ts/blob/master/index.d.ts)
|
||||
601
node_modules/weixin-js-sdk/index.d.ts
generated
vendored
Normal file
601
node_modules/weixin-js-sdk/index.d.ts
generated
vendored
Normal file
@@ -0,0 +1,601 @@
|
||||
// Type definitions for weixin jssdk 1.6.0
|
||||
// Project: https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
|
||||
declare namespace wx {
|
||||
type ImageSizeType = "original" | "compressed";
|
||||
type ImageSourceType = "album" | "camera";
|
||||
type VideoSourceType = "album" | "camera";
|
||||
type ApiMethod =
|
||||
| "onMenuShareTimeline"
|
||||
| "onMenuShareAppMessage"
|
||||
| "onMenuShareQQ"
|
||||
| "onMenuShareWeibo"
|
||||
| "onMenuShareQZone"
|
||||
| "updateAppMessageShareData"
|
||||
| "updateTimelineShareData"
|
||||
| "startRecord"
|
||||
| "stopRecord"
|
||||
| "onVoiceRecordEnd"
|
||||
| "playVoice"
|
||||
| "pauseVoice"
|
||||
| "stopVoice"
|
||||
| "onVoicePlayEnd"
|
||||
| "uploadVoice"
|
||||
| "downloadVoice"
|
||||
| "chooseImage"
|
||||
| "previewImage"
|
||||
| "uploadImage"
|
||||
| "downloadImage"
|
||||
| "translateVoice"
|
||||
| "getNetworkType"
|
||||
| "openLocation"
|
||||
| "getLocation"
|
||||
| "hideOptionMenu"
|
||||
| "showOptionMenu"
|
||||
| "hideMenuItems"
|
||||
| "showMenuItems"
|
||||
| "hideAllNonBaseMenuItem"
|
||||
| "showAllNonBaseMenuItem"
|
||||
| "closeWindow"
|
||||
| "scanQRCode"
|
||||
| "chooseWXPay"
|
||||
| "openProductSpecificView"
|
||||
| "addCard"
|
||||
| "chooseCard"
|
||||
| "openCard";
|
||||
// 所有JS接口列表
|
||||
type jsApiList = ApiMethod[];
|
||||
|
||||
// 开放标签列表
|
||||
// https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html
|
||||
type openTag = "wx-open-launch-weapp" | "wx-open-launch-app" | "wx-open-subscribe" | "wx-open-audio"
|
||||
type openTagList = openTag[];
|
||||
|
||||
// 所有菜单项列表
|
||||
// 基本类
|
||||
type menuBase =
|
||||
| "menuItem:exposeArticle" // 举报
|
||||
| "menuItem:setFont" // 调整字体
|
||||
| "menuItem:dayMode" // 日间模式
|
||||
| "menuItem:nightMode" // 夜间模式
|
||||
| "menuItem:refresh" // 刷新
|
||||
| "menuItem:profile" // 查看公众号（已添加）
|
||||
| "menuItem:addContact"; // 查看公众号（未添加）
|
||||
// 传播类
|
||||
type menuShare =
|
||||
| "menuItem:share:appMessage" // 发送给朋友
|
||||
| "menuItem:share:timeline" // 分享到朋友圈
|
||||
| "menuItem:share:qq" // 分享到QQ
|
||||
| "menuItem:share:weiboApp" // 分享到Weibo
|
||||
| "menuItem:favorite" // 收藏
|
||||
| "menuItem:share:facebook" // 分享到FB
|
||||
| "menuItem:share:QZone"; // 分享到 QQ 空间
|
||||
|
||||
// 保护类
|
||||
type menuProtected =
|
||||
| "menuItem:editTag" // 编辑标签
|
||||
| "menuItem:delete" // 删除
|
||||
| "menuItem:copyUrl" // 复制链接
|
||||
| "menuItem:originPage" // 原网页
|
||||
| "menuItem:readMode" // 阅读模式
|
||||
| "menuItem:openWithQQBrowser" // 在QQ浏览器中打开
|
||||
| "menuItem:openWithSafari" // 在Safari中打开
|
||||
| "menuItem:share:email" // 邮件
|
||||
| "menuItem:share:brand"; // 一些特殊公众号
|
||||
|
||||
type menuList = Array<menuBase | menuProtected | menuShare>;
|
||||
|
||||
function config(conf: {
|
||||
debug?: boolean; // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
|
||||
appId: string; // 必填，公众号的唯一标识
|
||||
timestamp: number; // 必填，生成签名的时间戳
|
||||
nonceStr: string; // 必填，生成签名的随机串
|
||||
signature: string; // 必填，签名，见附录1
|
||||
jsApiList?: jsApiList; // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
|
||||
openTagList?: openTagList;
|
||||
}): void;
|
||||
|
||||
interface Resouce {
|
||||
localId: string;
|
||||
}
|
||||
interface BaseParams {
|
||||
success?(...args: any[]): void;
|
||||
/** 接口调用失败的回调函数 */
|
||||
fail?(...args: any[]): void;
|
||||
/** 接口取消调用的回调函数 */
|
||||
cancel?(...args: any[]): void;
|
||||
/** 接口调用结束的回调函数（调用成功、失败都会执行） */
|
||||
complete?(...args: any[]): void;
|
||||
}
|
||||
function ready(fn: () => void): void;
|
||||
function error(fn: (err: { errMsg: string }) => void): void;
|
||||
|
||||
interface IcheckJsApi extends BaseParams {
|
||||
jsApiList: jsApiList; // 需要检测的JS接口列表，所有JS接口列表见附录2,
|
||||
// 以键值对的形式返回，可用的api值true，不可用为false
|
||||
// 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
|
||||
success(res: {
|
||||
checkResult: { [api: string]: boolean };
|
||||
errMsg: string;
|
||||
}): void;
|
||||
}
|
||||
/**
|
||||
* 判断当前客户端版本是否支持指定JS接口
|
||||
* 备注：checkJsApi接口是客户端6.0.2新引入的一个预留接口，第一期开放的接口均可不使用checkJsApi来检测。
|
||||
*/
|
||||
function checkJsApi(params: IcheckJsApi): void;
|
||||
|
||||
interface IonMenuShareTimeline extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
// 用户取消分享后执行的回调函数
|
||||
cancel(): void;
|
||||
}
|
||||
/*=============================基础接口================================*/
|
||||
/**
|
||||
* 获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
|
||||
*/
|
||||
function onMenuShareTimeline(params: IonMenuShareTimeline): void;
|
||||
|
||||
interface IonMenuShareAppMessage extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
desc: string; // 分享描述
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
type?: "music" | "video或link" | "link"; // 分享类型,music、video或link，不填默认为link
|
||||
dataUrl?: string; // 如果type是music或video，则要提供数据链接，默认为空
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
// 用户取消分享后执行的回调函数
|
||||
cancel(): void;
|
||||
}
|
||||
/**
|
||||
* 获取“分享给朋友”按钮点击状态及自定义分享内容接口
|
||||
*/
|
||||
function onMenuShareAppMessage(params: IonMenuShareAppMessage): void;
|
||||
|
||||
interface IonMenuShareQQ extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
desc: string; // 分享描述
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
// 用户取消分享后执行的回调函数
|
||||
cancel(): void;
|
||||
}
|
||||
/**
|
||||
* 获取“分享到QQ”按钮点击状态及自定义分享内容接口
|
||||
*/
|
||||
function onMenuShareQQ(params: IonMenuShareQQ): void;
|
||||
|
||||
interface IonMenuShareWeibo extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
desc: string; // 分享描述
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
// 用户取消分享后执行的回调函数
|
||||
cancel(): void;
|
||||
}
|
||||
/**
|
||||
* 获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口
|
||||
*/
|
||||
function onMenuShareWeibo(params: IonMenuShareWeibo): void;
|
||||
|
||||
interface IonMenuShareQZone extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
desc: string; // 分享描述
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
// 用户取消分享后执行的回调函数
|
||||
cancel(): void;
|
||||
}
|
||||
/**
|
||||
* 获取“分享到QQ空间”按钮点击状态及自定义分享内容接口
|
||||
*/
|
||||
function onMenuShareQZone(params: IonMenuShareQZone): void;
|
||||
|
||||
interface IupdateAppMessageShareData extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
desc: string; // 分享描述
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
}
|
||||
/**
|
||||
* 获取“分享给朋友”及“分享到QQ”按钮点击状态及自定义分享内容接口（新）
|
||||
*/
|
||||
function updateAppMessageShareData(params: IupdateAppMessageShareData): void;
|
||||
|
||||
interface IupdateTimelineShareData extends BaseParams {
|
||||
title: string; // 分享标题
|
||||
link: string; // 分享链接
|
||||
imgUrl: string; // 分享图标
|
||||
// 用户确认分享后执行的回调函数
|
||||
success(): void;
|
||||
}
|
||||
/**
|
||||
* 获取“分享到朋友圈”及“分享到QQ空间”按钮点击状态及自定义分享内容接口
|
||||
*/
|
||||
function updateTimelineShareData(params: IupdateTimelineShareData): void;
|
||||
/*=============================基础接口================================*/
|
||||
|
||||
/*=============================图像接口================================*/
|
||||
interface IchooseImage extends BaseParams {
|
||||
/** 最多可以选择的图片张数，默认9 */
|
||||
count?: number;
|
||||
/** original 原图，compressed 压缩图，默认二者都有 */
|
||||
sizeType?: ImageSizeType[];
|
||||
/** album 从相册选图，camera 使用相机，默认二者都有 */
|
||||
sourceType?: ImageSourceType[];
|
||||
/** 成功则返回图片的本地文件路径列表 tempFilePaths */
|
||||
success(res: {
|
||||
sourceType: string; // weixin album camera
|
||||
localIds: string[];
|
||||
errMsg: string;
|
||||
}): void;
|
||||
cancel(): void;
|
||||
}
|
||||
/**
|
||||
* 从本地相册选择图片或使用相机拍照。
|
||||
*/
|
||||
function chooseImage(params: IchooseImage): void;
|
||||
|
||||
interface IpreviewImage extends BaseParams {
|
||||
current: string; // 当前显示图片的http链接
|
||||
urls: string[]; // 需要预览的图片http链接列表
|
||||
}
|
||||
/**
|
||||
* 预览图片接口
|
||||
*/
|
||||
function previewImage(params: IpreviewImage): void;
|
||||
|
||||
interface IuploadResource extends BaseParams {
|
||||
localId: string; // 需要上传的图片的本地ID，由chooseImage接口获得
|
||||
isShowProgressTips: number; // 默认为1，显示进度提示
|
||||
// 返回图片的服务器端ID
|
||||
success(res: { serverId: string }): void;
|
||||
}
|
||||
/**
|
||||
* 上传图片接口
|
||||
*/
|
||||
function uploadImage(params: IuploadResource): void;
|
||||
|
||||
interface IdownloadResource extends BaseParams {
|
||||
serverId: string; // 需要下载的图片的服务器端ID，由uploadImage接口获得
|
||||
isShowProgressTips: number; // 默认为1，显示进度提示
|
||||
// 返回图片下载后的本地ID
|
||||
success(res: Resouce): void;
|
||||
}
|
||||
/**
|
||||
* 下载图片接口
|
||||
*/
|
||||
function downloadImage(params: IdownloadResource): void;
|
||||
|
||||
interface IgetLocalImgData extends BaseParams {
|
||||
localId: string; // 图片的localID
|
||||
// localData是图片的base64数据，可以用img标签显示
|
||||
success(res: { localData: string }): void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取本地图片接口
|
||||
*/
|
||||
function getLocalImgData(params: IgetLocalImgData): void;
|
||||
/*=============================图像接口================================*/
|
||||
/*=============================音频接口================================*/
|
||||
/**
|
||||
* 开始录音接口
|
||||
*/
|
||||
function startRecord(): void;
|
||||
|
||||
interface IstopRecord extends BaseParams {
|
||||
success(res: Resouce): void;
|
||||
}
|
||||
/**
|
||||
* 停止录音接口
|
||||
*/
|
||||
function stopRecord(params: IstopRecord): void;
|
||||
|
||||
interface IonVoiceRecordEnd extends BaseParams {
|
||||
// 录音时间超过一分钟没有停止的时候会执行 complete 回调
|
||||
complete(res: Resouce): void;
|
||||
}
|
||||
/**
|
||||
* 监听录音自动停止接口
|
||||
*/
|
||||
function onVoiceRecordEnd(params: IonVoiceRecordEnd): void;
|
||||
|
||||
interface IplaypausestopVoice extends BaseParams {
|
||||
localId: string; // 需要播放的音频的本地ID，由stopRecord接口获得
|
||||
}
|
||||
/**
|
||||
* 播放语音接口
|
||||
*/
|
||||
function playVoice(params: IplaypausestopVoice): void;
|
||||
|
||||
/**
|
||||
* 暂停播放接口
|
||||
*/
|
||||
function pauseVoice(params: IplaypausestopVoice): void;
|
||||
/**
|
||||
* 停止播放接口
|
||||
*/
|
||||
function stopVoice(params: IplaypausestopVoice): void;
|
||||
|
||||
interface IonVoicePlayEnd extends BaseParams {
|
||||
success(res: Resouce): void;
|
||||
}
|
||||
/**
|
||||
* 监听语音播放完毕接口
|
||||
*/
|
||||
function onVoicePlayEnd(params: IonVoicePlayEnd): void;
|
||||
/**
|
||||
* 上传语音接口
|
||||
* 备注：上传语音有效期3天，可用微信多媒体接口下载语音到自己的服务器
|
||||
* ，此处获得的 serverId 即 media_id，参考文档
|
||||
* ../12 / 58bfcfabbd501c7cd77c19bd9cfa8354.html
|
||||
* 目前多媒体文件下载接口的频率限制为10000次/ 天，
|
||||
* 如需要调高频率，请邮件weixin - open@qq.com,
|
||||
* 邮件主题为【申请多媒体接口调用量】，请对你的项目进行简单描述，
|
||||
* 附上产品体验链接，并对用户量和使用量进行说明。
|
||||
*/
|
||||
function uploadVoice(params: IuploadResource): void;
|
||||
/**
|
||||
* 下载语音接口
|
||||
*/
|
||||
function downloadVoice(params: IdownloadResource): void;
|
||||
/*=============================音频接口================================*/
|
||||
/*=============================智能接口================================*/
|
||||
|
||||
interface ItranslateVoice extends BaseParams {
|
||||
localId: string; // 需要识别的音频的本地Id，由录音相关接口获得
|
||||
isShowProgressTips: number; // 默认为1，显示进度提示
|
||||
success(res: { translateResult: string }): void;
|
||||
}
|
||||
/**
|
||||
* 识别音频并返回识别结果接口
|
||||
*/
|
||||
function translateVoice(params: ItranslateVoice): void;
|
||||
|
||||
/*=============================智能接口================================*/
|
||||
|
||||
/*=============================设备信息================================*/
|
||||
type networkType = "2g" | "3g" | "4g" | "wifi";
|
||||
interface IgetNetworkType extends BaseParams {
|
||||
success(res: { networkType: networkType }): void;
|
||||
}
|
||||
/**
|
||||
* 获取网络状态接口
|
||||
*/
|
||||
function getNetworkType(params: IgetNetworkType): void;
|
||||
/*=============================设备信息================================*/
|
||||
|
||||
/*=============================地理位置================================*/
|
||||
interface IopenLocation extends BaseParams {
|
||||
latitude: number; // 纬度，浮点数，范围为90 ~ -90
|
||||
longitude: number; // 经度，浮点数，范围为180 ~ -180。
|
||||
name: string; // 位置名
|
||||
address: string; // 地址详情说明
|
||||
scale: number; // 地图缩放级别,整形值,范围从1~28。默认为最大
|
||||
infoUrl: string; // 在查看位置界面底部显示的超链接,可点击跳转
|
||||
}
|
||||
/**
|
||||
* 使用微信内置地图查看位置接口
|
||||
*/
|
||||
function openLocation(params: IopenLocation): void;
|
||||
|
||||
interface IgetLocation extends BaseParams {
|
||||
type: "wgs84" | "gcj02"; // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
|
||||
success(res: {
|
||||
latitude: number; // 纬度，浮点数，范围为90 ~ -90
|
||||
longitude: number; // 经度，浮点数，范围为180 ~ -180。
|
||||
speed: number; // 速度，以米/每秒计
|
||||
accuracy: number; // 位置精度
|
||||
}): void;
|
||||
}
|
||||
/**
|
||||
* 获取地理位置接口
|
||||
*/
|
||||
function getLocation(params: IgetLocation): void;
|
||||
/*=============================地理位置================================*/
|
||||
/*=============================摇一摇周边================================*/
|
||||
interface IstartSearchBeacons extends BaseParams {
|
||||
ticket: string; // 摇周边的业务ticket, 系统自动添加在摇出来的页面链接后面
|
||||
// 开启查找完成后的回调函数
|
||||
complete(argv: any): void;
|
||||
}
|
||||
/**
|
||||
* 开启查找周边ibeacon设备接口
|
||||
* 备注：如需接入摇一摇周边功能，请参考：申请开通摇一摇周边
|
||||
*/
|
||||
function startSearchBeacons(params: IstartSearchBeacons): void;
|
||||
|
||||
interface IstopSearchBeacons extends BaseParams {
|
||||
// 关闭查找完成后的回调函数
|
||||
complete(res: any): void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 关闭查找周边ibeacon设备接口
|
||||
*/
|
||||
function stopSearchBeacons(params: IstopSearchBeacons): void;
|
||||
|
||||
interface IonSearchBeacons extends BaseParams {
|
||||
// 回调函数，可以数组形式取得该商家注册的在周边的相关设备列表
|
||||
complete(argv: any): void;
|
||||
}
|
||||
/**
|
||||
* 监听周边ibeacon设备接口
|
||||
*/
|
||||
function onSearchBeacons(params: IonSearchBeacons): void;
|
||||
/*=============================摇一摇周边================================*/
|
||||
/*=============================界面操作================================*/
|
||||
|
||||
/**
|
||||
* 隐藏右上角菜单接口
|
||||
*/
|
||||
function hideOptionMenu(): void;
|
||||
|
||||
/**
|
||||
* 显示右上角菜单接口
|
||||
*/
|
||||
function showOptionMenu(): void;
|
||||
|
||||
/**
|
||||
* 关闭当前网页窗口接口
|
||||
*/
|
||||
function closeWindow(): void;
|
||||
|
||||
interface IhideMenuItems extends BaseParams {
|
||||
menuList: Array<menuProtected | menuShare>; // 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
|
||||
}
|
||||
/**
|
||||
* 批量隐藏功能按钮接口
|
||||
*/
|
||||
function hideMenuItems(params: IhideMenuItems): void;
|
||||
|
||||
interface IshowMenuItems extends BaseParams {
|
||||
menuList: menuList; // 要显示的菜单项，所有menu项见附录3
|
||||
}
|
||||
/**
|
||||
* 批量显示功能按钮接口
|
||||
*/
|
||||
function showMenuItems(params: IshowMenuItems): void;
|
||||
|
||||
/**
|
||||
* 隐藏所有非基础按钮接口
|
||||
* “基本类”按钮详见附录3
|
||||
*/
|
||||
function hideAllNonBaseMenuItem(): void;
|
||||
|
||||
/**
|
||||
* 显示所有功能按钮接口
|
||||
*/
|
||||
function showAllNonBaseMenuItem(): void;
|
||||
/*=============================界面操作================================*/
|
||||
/*=============================微信扫一扫================================*/
|
||||
|
||||
type scanType = "qrCode" | "barCode";
|
||||
|
||||
interface IscanQRCode extends BaseParams {
|
||||
needResult: 0 | 1; // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
|
||||
scanType: scanType[]; // 可以指定扫二维码还是一维码，默认二者都有
|
||||
// 当needResult 为 1 时，扫码返回的结果
|
||||
success(res: { resultStr: string }): void;
|
||||
}
|
||||
/**
|
||||
* 调起微信扫一扫接口
|
||||
*/
|
||||
function scanQRCode(params: IscanQRCode): void;
|
||||
/*=============================微信扫一扫================================*/
|
||||
/*=============================微信小店================================*/
|
||||
|
||||
interface IopenProductSpecificView extends BaseParams {
|
||||
productId: string; // 商品id
|
||||
viewType: "0" | "1" | "2"; // 0.默认值，普通商品详情页1.扫一扫商品详情页2.小店商品详情页
|
||||
}
|
||||
/**
|
||||
* 跳转微信商品页接口
|
||||
*/
|
||||
function openProductSpecificView(params: IopenProductSpecificView): void;
|
||||
/*=============================微信卡券================================*/
|
||||
|
||||
interface IchooseCard extends BaseParams {
|
||||
shopId: string; // 门店Id
|
||||
cardType: string; // 卡券类型
|
||||
cardId: string; // 卡券Id
|
||||
timestamp: number; // 卡券签名时间戳
|
||||
nonceStr: string; // 卡券签名随机串
|
||||
signType: string; // 签名方式，默认'SHA1'
|
||||
cardSign: string; // 卡券签名
|
||||
success(res: { cardList: string[] }): void;
|
||||
}
|
||||
/**
|
||||
* 拉取适用卡券列表并获取用户选择信息
|
||||
*/
|
||||
function chooseCard(params: IchooseCard): void;
|
||||
|
||||
interface IaddCard extends BaseParams {
|
||||
cardList: Array<{
|
||||
cardId: string;
|
||||
cardExt: string;
|
||||
}>; // 需要添加的卡券列表
|
||||
success(res: { cardList: string[] }): void;
|
||||
}
|
||||
/**
|
||||
* 批量添加卡券接口
|
||||
*/
|
||||
function addCard(): void;
|
||||
|
||||
interface IopenCard extends BaseParams {
|
||||
cardList: Array<{
|
||||
cardId: string;
|
||||
code: string;
|
||||
}>; // 需要打开的卡券列表
|
||||
}
|
||||
/**
|
||||
* 查看微信卡包中的卡券接口
|
||||
*/
|
||||
function openCard(params: IopenCard): void;
|
||||
|
||||
interface IconsumeAndShareCard extends BaseParams {
|
||||
cardId: string;
|
||||
code: string;
|
||||
}
|
||||
/**
|
||||
* 核销后再次赠送卡券接口
|
||||
*/
|
||||
function consumeAndShareCard(params: IconsumeAndShareCard): void;
|
||||
/*=============================微信卡券================================*/
|
||||
/*=============================微信支付================================*/
|
||||
|
||||
interface IchooseWXPay extends BaseParams {
|
||||
timestamp: number; // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
|
||||
nonceStr: string; // 支付签名随机串，不长于 32 位
|
||||
package: string; // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***）
|
||||
signType: string; // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
|
||||
paySign: string; // 支付签名
|
||||
// 支付成功后的回调函数
|
||||
success(res: any): void;
|
||||
}
|
||||
/**
|
||||
* 发起一个微信支付请求
|
||||
*/
|
||||
function chooseWXPay(params: IchooseWXPay): void;
|
||||
/*=============================微信支付================================*/
|
||||
/*=============================微信小程序==============================*/
|
||||
interface miniProgramMethodsParams extends BaseParams {
|
||||
url: string;
|
||||
}
|
||||
interface miniProgramMethods {
|
||||
navigateTo(params: miniProgramMethodsParams): void;
|
||||
navigateBack(params: miniProgramMethodsParams): void;
|
||||
switchTab(params: miniProgramMethodsParams): void;
|
||||
reLaunch(params: miniProgramMethodsParams): void;
|
||||
redirectTo(params: miniProgramMethodsParams): void;
|
||||
postMessage(params: { data: any }): void;
|
||||
getEnv(fn: (res: any) => void): void;
|
||||
}
|
||||
const miniProgram: miniProgramMethods;
|
||||
/*=============================微信小程序==============================*/
|
||||
}
|
||||
declare function wx(): void;
|
||||
/*=============================微信内全局变量==============================*/
|
||||
declare global {
|
||||
interface Window {
|
||||
WeixinJSBridge: any;
|
||||
__wxjs_environment: any;
|
||||
}
|
||||
const WeixinJSBridge: any;
|
||||
}
|
||||
export default wx;
|
||||
891
node_modules/weixin-js-sdk/index.js
generated
vendored
Normal file
891
node_modules/weixin-js-sdk/index.js
generated
vendored
Normal file
@@ -0,0 +1,891 @@
|
||||
!(function (e, n) {
|
||||
module.exports = n(e);
|
||||
})(typeof window === "object" && window, function (r, e) {
|
||||
if (!r) {
|
||||
console.warn("can't use weixin-js-sdk in server side");
|
||||
return;
|
||||
}
|
||||
var a, c, n, i, t, o, s, d, l, u, p, f, m, g, h, S, y, I, v, _, w, T;
|
||||
if (!r.jWeixin)
|
||||
return (
|
||||
(a = {
|
||||
config: "preVerifyJSAPI",
|
||||
onMenuShareTimeline: "menu:share:timeline",
|
||||
onMenuShareAppMessage: "menu:share:appmessage",
|
||||
onMenuShareQQ: "menu:share:qq",
|
||||
onMenuShareWeibo: "menu:share:weiboApp",
|
||||
onMenuShareQZone: "menu:share:QZone",
|
||||
previewImage: "imagePreview",
|
||||
getLocation: "geoLocation",
|
||||
openProductSpecificView: "openProductViewWithPid",
|
||||
addCard: "batchAddCard",
|
||||
openCard: "batchViewCard",
|
||||
chooseWXPay: "getBrandWCPayRequest",
|
||||
openEnterpriseRedPacket: "getRecevieBizHongBaoRequest",
|
||||
startSearchBeacons: "startMonitoringBeacons",
|
||||
stopSearchBeacons: "stopMonitoringBeacons",
|
||||
onSearchBeacons: "onBeaconsInRange",
|
||||
consumeAndShareCard: "consumedShareCard",
|
||||
openAddress: "editAddress",
|
||||
}),
|
||||
(c = (function () {
|
||||
var e,
|
||||
n = {};
|
||||
for (e in a) n[a[e]] = e;
|
||||
return n;
|
||||
})()),
|
||||
(n = r.document),
|
||||
(i = n.title),
|
||||
(t = navigator.userAgent.toLowerCase()),
|
||||
(f = navigator.platform.toLowerCase()),
|
||||
(o = !(!f.match("mac") && !f.match("win"))),
|
||||
(s = -1 != t.indexOf("wxdebugger")),
|
||||
(d = -1 != t.indexOf("micromessenger")),
|
||||
(l = -1 != t.indexOf("android")),
|
||||
(u = -1 != t.indexOf("iphone") || -1 != t.indexOf("ipad")),
|
||||
(p = (f =
|
||||
t.match(/micromessenger\/(\d+\.\d+\.\d+)/) ||
|
||||
t.match(/micromessenger\/(\d+\.\d+)/))
|
||||
? f[1]
|
||||
: ""),
|
||||
(m = {
|
||||
initStartTime: L(),
|
||||
initEndTime: 0,
|
||||
preVerifyStartTime: 0,
|
||||
preVerifyEndTime: 0,
|
||||
}),
|
||||
(g = {
|
||||
version: 1,
|
||||
appId: "",
|
||||
initTime: 0,
|
||||
preVerifyTime: 0,
|
||||
networkType: "",
|
||||
isPreVerifyOk: 1,
|
||||
systemType: u ? 1 : l ? 2 : -1,
|
||||
clientVersion: p,
|
||||
url: encodeURIComponent(location.href),
|
||||
}),
|
||||
(h = {}),
|
||||
(S = { _completes: [] }),
|
||||
(y = { state: 0, data: {} }),
|
||||
O(function () {
|
||||
m.initEndTime = L();
|
||||
}),
|
||||
(I = !1),
|
||||
(v = []),
|
||||
(_ = {
|
||||
config: function (e) {
|
||||
C("config", (h = e));
|
||||
var o = !1 !== h.check;
|
||||
O(function () {
|
||||
if (o)
|
||||
k(
|
||||
a.config,
|
||||
{
|
||||
verifyJsApiList: A(h.jsApiList),
|
||||
verifyOpenTagList: A(h.openTagList),
|
||||
},
|
||||
((S._complete = function (e) {
|
||||
(m.preVerifyEndTime = L()), (y.state = 1), (y.data = e);
|
||||
}),
|
||||
(S.success = function (e) {
|
||||
g.isPreVerifyOk = 0;
|
||||
}),
|
||||
(S.fail = function (e) {
|
||||
S._fail ? S._fail(e) : (y.state = -1);
|
||||
}),
|
||||
(t = S._completes).push(function () {
|
||||
B();
|
||||
}),
|
||||
(S.complete = function (e) {
|
||||
for (var n = 0, i = t.length; n < i; ++n) t[n]();
|
||||
S._completes = [];
|
||||
}),
|
||||
S)
|
||||
),
|
||||
(m.preVerifyStartTime = L());
|
||||
else {
|
||||
y.state = 1;
|
||||
for (var e = S._completes, n = 0, i = e.length; n < i; ++n)
|
||||
e[n]();
|
||||
S._completes = [];
|
||||
}
|
||||
var t;
|
||||
}),
|
||||
_.invoke ||
|
||||
((_.invoke = function (e, n, i) {
|
||||
r.WeixinJSBridge && WeixinJSBridge.invoke(e, P(n), i);
|
||||
}),
|
||||
(_.on = function (e, n) {
|
||||
r.WeixinJSBridge && WeixinJSBridge.on(e, n);
|
||||
}));
|
||||
},
|
||||
ready: function (e) {
|
||||
(0 != y.state || (S._completes.push(e), !d && h.debug)) && e();
|
||||
},
|
||||
error: function (e) {
|
||||
p < "6.0.2" || (-1 == y.state ? e(y.data) : (S._fail = e));
|
||||
},
|
||||
checkJsApi: function (e) {
|
||||
k(
|
||||
"checkJsApi",
|
||||
{ jsApiList: A(e.jsApiList) },
|
||||
((e._complete = function (e) {
|
||||
l && (i = e.checkResult) && (e.checkResult = JSON.parse(i));
|
||||
var n,
|
||||
i = e,
|
||||
t = i.checkResult;
|
||||
for (n in t) {
|
||||
var o = c[n];
|
||||
o && ((t[o] = t[n]), delete t[n]);
|
||||
}
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
onMenuShareTimeline: function (e) {
|
||||
M(
|
||||
a.onMenuShareTimeline,
|
||||
{
|
||||
complete: function () {
|
||||
k(
|
||||
"shareTimeline",
|
||||
{
|
||||
title: e.title || i,
|
||||
desc: e.title || i,
|
||||
img_url: e.imgUrl || "",
|
||||
link: e.link || location.href,
|
||||
type: e.type || "link",
|
||||
data_url: e.dataUrl || "",
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
onMenuShareAppMessage: function (n) {
|
||||
M(
|
||||
a.onMenuShareAppMessage,
|
||||
{
|
||||
complete: function (e) {
|
||||
"favorite" === e.scene
|
||||
? k("sendAppMessage", {
|
||||
title: n.title || i,
|
||||
desc: n.desc || "",
|
||||
link: n.link || location.href,
|
||||
img_url: n.imgUrl || "",
|
||||
type: n.type || "link",
|
||||
data_url: n.dataUrl || "",
|
||||
})
|
||||
: k(
|
||||
"sendAppMessage",
|
||||
{
|
||||
title: n.title || i,
|
||||
desc: n.desc || "",
|
||||
link: n.link || location.href,
|
||||
img_url: n.imgUrl || "",
|
||||
type: n.type || "link",
|
||||
data_url: n.dataUrl || "",
|
||||
},
|
||||
n
|
||||
);
|
||||
},
|
||||
},
|
||||
n
|
||||
);
|
||||
},
|
||||
onMenuShareQQ: function (e) {
|
||||
M(
|
||||
a.onMenuShareQQ,
|
||||
{
|
||||
complete: function () {
|
||||
k(
|
||||
"shareQQ",
|
||||
{
|
||||
title: e.title || i,
|
||||
desc: e.desc || "",
|
||||
img_url: e.imgUrl || "",
|
||||
link: e.link || location.href,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
onMenuShareWeibo: function (e) {
|
||||
M(
|
||||
a.onMenuShareWeibo,
|
||||
{
|
||||
complete: function () {
|
||||
k(
|
||||
"shareWeiboApp",
|
||||
{
|
||||
title: e.title || i,
|
||||
desc: e.desc || "",
|
||||
img_url: e.imgUrl || "",
|
||||
link: e.link || location.href,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
onMenuShareQZone: function (e) {
|
||||
M(
|
||||
a.onMenuShareQZone,
|
||||
{
|
||||
complete: function () {
|
||||
k(
|
||||
"shareQZone",
|
||||
{
|
||||
title: e.title || i,
|
||||
desc: e.desc || "",
|
||||
img_url: e.imgUrl || "",
|
||||
link: e.link || location.href,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
updateTimelineShareData: function (e) {
|
||||
k(
|
||||
"updateTimelineShareData",
|
||||
{ title: e.title, link: e.link, imgUrl: e.imgUrl },
|
||||
e
|
||||
);
|
||||
},
|
||||
updateAppMessageShareData: function (e) {
|
||||
k(
|
||||
"updateAppMessageShareData",
|
||||
{ title: e.title, desc: e.desc, link: e.link, imgUrl: e.imgUrl },
|
||||
e
|
||||
);
|
||||
},
|
||||
startRecord: function (e) {
|
||||
k("startRecord", {}, e);
|
||||
},
|
||||
stopRecord: function (e) {
|
||||
k("stopRecord", {}, e);
|
||||
},
|
||||
onVoiceRecordEnd: function (e) {
|
||||
M("onVoiceRecordEnd", e);
|
||||
},
|
||||
playVoice: function (e) {
|
||||
k("playVoice", { localId: e.localId }, e);
|
||||
},
|
||||
pauseVoice: function (e) {
|
||||
k("pauseVoice", { localId: e.localId }, e);
|
||||
},
|
||||
stopVoice: function (e) {
|
||||
k("stopVoice", { localId: e.localId }, e);
|
||||
},
|
||||
onVoicePlayEnd: function (e) {
|
||||
M("onVoicePlayEnd", e);
|
||||
},
|
||||
uploadVoice: function (e) {
|
||||
k(
|
||||
"uploadVoice",
|
||||
{
|
||||
localId: e.localId,
|
||||
isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
downloadVoice: function (e) {
|
||||
k(
|
||||
"downloadVoice",
|
||||
{
|
||||
serverId: e.serverId,
|
||||
isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
translateVoice: function (e) {
|
||||
k(
|
||||
"translateVoice",
|
||||
{
|
||||
localId: e.localId,
|
||||
isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
chooseImage: function (e) {
|
||||
k(
|
||||
"chooseImage",
|
||||
{
|
||||
scene: "1|2",
|
||||
count: e.count || 9,
|
||||
sizeType: e.sizeType || ["original", "compressed"],
|
||||
sourceType: e.sourceType || ["album", "camera"],
|
||||
},
|
||||
((e._complete = function (e) {
|
||||
if (l) {
|
||||
var n = e.localIds;
|
||||
try {
|
||||
n && (e.localIds = JSON.parse(n));
|
||||
} catch (e) {}
|
||||
}
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
getLocation: function (e) {
|
||||
(e = e || {}),
|
||||
k(
|
||||
a.getLocation,
|
||||
{ type: e.type || "wgs84" },
|
||||
((e._complete = function (e) {
|
||||
delete e.type;
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
previewImage: function (e) {
|
||||
k(a.previewImage, { current: e.current, urls: e.urls }, e);
|
||||
},
|
||||
uploadImage: function (e) {
|
||||
k(
|
||||
"uploadImage",
|
||||
{
|
||||
localId: e.localId,
|
||||
isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
downloadImage: function (e) {
|
||||
k(
|
||||
"downloadImage",
|
||||
{
|
||||
serverId: e.serverId,
|
||||
isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
getLocalImgData: function (e) {
|
||||
!1 === I
|
||||
? ((I = !0),
|
||||
k(
|
||||
"getLocalImgData",
|
||||
{ localId: e.localId },
|
||||
((e._complete = function (e) {
|
||||
var n;
|
||||
(I = !1),
|
||||
0 < v.length && ((n = v.shift()), wx.getLocalImgData(n));
|
||||
}),
|
||||
e)
|
||||
))
|
||||
: v.push(e);
|
||||
},
|
||||
getNetworkType: function (e) {
|
||||
k(
|
||||
"getNetworkType",
|
||||
{},
|
||||
((e._complete = function (e) {
|
||||
var n = e,
|
||||
e = n.errMsg,
|
||||
i = ((n.errMsg = "getNetworkType:ok"), n.subtype);
|
||||
if ((delete n.subtype, i)) n.networkType = i;
|
||||
else {
|
||||
var i = e.indexOf(":"),
|
||||
t = e.substring(i + 1);
|
||||
switch (t) {
|
||||
case "wifi":
|
||||
case "edge":
|
||||
case "wwan":
|
||||
n.networkType = t;
|
||||
break;
|
||||
default:
|
||||
n.errMsg = "getNetworkType:fail";
|
||||
}
|
||||
}
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
openLocation: function (e) {
|
||||
k(
|
||||
"openLocation",
|
||||
{
|
||||
latitude: e.latitude,
|
||||
longitude: e.longitude,
|
||||
name: e.name || "",
|
||||
address: e.address || "",
|
||||
scale: e.scale || 28,
|
||||
infoUrl: e.infoUrl || "",
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
hideOptionMenu: function (e) {
|
||||
k("hideOptionMenu", {}, e);
|
||||
},
|
||||
showOptionMenu: function (e) {
|
||||
k("showOptionMenu", {}, e);
|
||||
},
|
||||
closeWindow: function (e) {
|
||||
k("closeWindow", {}, (e = e || {}));
|
||||
},
|
||||
hideMenuItems: function (e) {
|
||||
k("hideMenuItems", { menuList: e.menuList }, e);
|
||||
},
|
||||
showMenuItems: function (e) {
|
||||
k("showMenuItems", { menuList: e.menuList }, e);
|
||||
},
|
||||
hideAllNonBaseMenuItem: function (e) {
|
||||
k("hideAllNonBaseMenuItem", {}, e);
|
||||
},
|
||||
showAllNonBaseMenuItem: function (e) {
|
||||
k("showAllNonBaseMenuItem", {}, e);
|
||||
},
|
||||
scanQRCode: function (e) {
|
||||
k(
|
||||
"scanQRCode",
|
||||
{
|
||||
needResult: (e = e || {}).needResult || 0,
|
||||
scanType: e.scanType || ["qrCode", "barCode"],
|
||||
},
|
||||
((e._complete = function (e) {
|
||||
var n;
|
||||
u &&
|
||||
(n = e.resultStr) &&
|
||||
((n = JSON.parse(n)),
|
||||
(e.resultStr = n && n.scan_code && n.scan_code.scan_result));
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
openAddress: function (e) {
|
||||
k(
|
||||
a.openAddress,
|
||||
{},
|
||||
((e._complete = function (e) {
|
||||
((e = e).postalCode = e.addressPostalCode),
|
||||
delete e.addressPostalCode,
|
||||
(e.provinceName = e.proviceFirstStageName),
|
||||
delete e.proviceFirstStageName,
|
||||
(e.cityName = e.addressCitySecondStageName),
|
||||
delete e.addressCitySecondStageName,
|
||||
(e.countryName = e.addressCountiesThirdStageName),
|
||||
delete e.addressCountiesThirdStageName,
|
||||
(e.detailInfo = e.addressDetailInfo),
|
||||
delete e.addressDetailInfo;
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
openProductSpecificView: function (e) {
|
||||
k(
|
||||
a.openProductSpecificView,
|
||||
{
|
||||
pid: e.productId,
|
||||
view_type: e.viewType || 0,
|
||||
ext_info: e.extInfo,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
addCard: function (e) {
|
||||
for (var n = e.cardList, i = [], t = 0, o = n.length; t < o; ++t) {
|
||||
var r = n[t],
|
||||
r = { card_id: r.cardId, card_ext: r.cardExt };
|
||||
i.push(r);
|
||||
}
|
||||
k(
|
||||
a.addCard,
|
||||
{ card_list: i },
|
||||
((e._complete = function (e) {
|
||||
if ((n = e.card_list)) {
|
||||
for (var n, i = 0, t = (n = JSON.parse(n)).length; i < t; ++i) {
|
||||
var o = n[i];
|
||||
(o.cardId = o.card_id),
|
||||
(o.cardExt = o.card_ext),
|
||||
(o.isSuccess = !!o.is_succ),
|
||||
delete o.card_id,
|
||||
delete o.card_ext,
|
||||
delete o.is_succ;
|
||||
}
|
||||
(e.cardList = n), delete e.card_list;
|
||||
}
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
chooseCard: function (e) {
|
||||
k(
|
||||
"chooseCard",
|
||||
{
|
||||
app_id: h.appId,
|
||||
location_id: e.shopId || "",
|
||||
sign_type: e.signType || "SHA1",
|
||||
card_id: e.cardId || "",
|
||||
card_type: e.cardType || "",
|
||||
card_sign: e.cardSign,
|
||||
time_stamp: e.timestamp + "",
|
||||
nonce_str: e.nonceStr,
|
||||
},
|
||||
((e._complete = function (e) {
|
||||
(e.cardList = e.choose_card_info), delete e.choose_card_info;
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
openCard: function (e) {
|
||||
for (var n = e.cardList, i = [], t = 0, o = n.length; t < o; ++t) {
|
||||
var r = n[t],
|
||||
r = { card_id: r.cardId, code: r.code };
|
||||
i.push(r);
|
||||
}
|
||||
k(a.openCard, { card_list: i }, e);
|
||||
},
|
||||
consumeAndShareCard: function (e) {
|
||||
k(
|
||||
a.consumeAndShareCard,
|
||||
{ consumedCardId: e.cardId, consumedCode: e.code },
|
||||
e
|
||||
);
|
||||
},
|
||||
chooseWXPay: function (e) {
|
||||
k(a.chooseWXPay, x(e), e), B({ jsApiName: "chooseWXPay" });
|
||||
},
|
||||
openEnterpriseRedPacket: function (e) {
|
||||
k(a.openEnterpriseRedPacket, x(e), e);
|
||||
},
|
||||
startSearchBeacons: function (e) {
|
||||
k(a.startSearchBeacons, { ticket: e.ticket }, e);
|
||||
},
|
||||
stopSearchBeacons: function (e) {
|
||||
k(a.stopSearchBeacons, {}, e);
|
||||
},
|
||||
onSearchBeacons: function (e) {
|
||||
M(a.onSearchBeacons, e);
|
||||
},
|
||||
openEnterpriseChat: function (e) {
|
||||
k(
|
||||
"openEnterpriseChat",
|
||||
{ useridlist: e.userIds, chatname: e.groupName },
|
||||
e
|
||||
);
|
||||
},
|
||||
launchMiniProgram: function (e) {
|
||||
k(
|
||||
"launchMiniProgram",
|
||||
{
|
||||
targetAppId: e.targetAppId,
|
||||
path: (function (e) {
|
||||
var n;
|
||||
if ("string" == typeof e && 0 < e.length)
|
||||
return (
|
||||
(n = e.split("?")[0]),
|
||||
(n += ".html"),
|
||||
void 0 !== (e = e.split("?")[1]) ? n + "?" + e : n
|
||||
);
|
||||
})(e.path),
|
||||
envVersion: e.envVersion,
|
||||
},
|
||||
e
|
||||
);
|
||||
},
|
||||
openBusinessView: function (e) {
|
||||
k(
|
||||
"openBusinessView",
|
||||
{
|
||||
businessType: e.businessType,
|
||||
queryString: e.queryString || "",
|
||||
envVersion: e.envVersion,
|
||||
},
|
||||
((e._complete = function (n) {
|
||||
if (l) {
|
||||
var e = n.extraData;
|
||||
if (e)
|
||||
try {
|
||||
n.extraData = JSON.parse(e);
|
||||
} catch (e) {
|
||||
n.extraData = {};
|
||||
}
|
||||
}
|
||||
}),
|
||||
e)
|
||||
);
|
||||
},
|
||||
miniProgram: {
|
||||
navigateBack: function (e) {
|
||||
(e = e || {}),
|
||||
O(function () {
|
||||
k(
|
||||
"invokeMiniProgramAPI",
|
||||
{ name: "navigateBack", arg: { delta: e.delta || 1 } },
|
||||
e
|
||||
);
|
||||
});
|
||||
},
|
||||
navigateTo: function (e) {
|
||||
O(function () {
|
||||
k(
|
||||
"invokeMiniProgramAPI",
|
||||
{ name: "navigateTo", arg: { url: e.url } },
|
||||
e
|
||||
);
|
||||
});
|
||||
},
|
||||
redirectTo: function (e) {
|
||||
O(function () {
|
||||
k(
|
||||
"invokeMiniProgramAPI",
|
||||
{ name: "redirectTo", arg: { url: e.url } },
|
||||
e
|
||||
);
|
||||
});
|
||||
},
|
||||
switchTab: function (e) {
|
||||
O(function () {
|
||||
k(
|
||||
"invokeMiniProgramAPI",
|
||||
{ name: "switchTab", arg: { url: e.url } },
|
||||
e
|
||||
);
|
||||
});
|
||||
},
|
||||
reLaunch: function (e) {
|
||||
O(function () {
|
||||
k(
|
||||
"invokeMiniProgramAPI",
|
||||
{ name: "reLaunch", arg: { url: e.url } },
|
||||
e
|
||||
);
|
||||
});
|
||||
},
|
||||
postMessage: function (e) {
|
||||
O(function () {
|
||||
k(
|
||||
"invokeMiniProgramAPI",
|
||||
{ name: "postMessage", arg: e.data || {} },
|
||||
e
|
||||
);
|
||||
});
|
||||
},
|
||||
getEnv: function (e) {
|
||||
O(function () {
|
||||
e({ miniprogram: "miniprogram" === r.__wxjs_environment });
|
||||
});
|
||||
},
|
||||
},
|
||||
}),
|
||||
(w = 1),
|
||||
(T = {}),
|
||||
n.addEventListener(
|
||||
"error",
|
||||
function (e) {
|
||||
var n, i, t;
|
||||
l ||
|
||||
((t = (n = e.target).tagName),
|
||||
(i = n.src),
|
||||
"IMG" != t && "VIDEO" != t && "AUDIO" != t && "SOURCE" != t) ||
|
||||
(-1 != i.indexOf("wxlocalresource://") &&
|
||||
(e.preventDefault(),
|
||||
e.stopPropagation(),
|
||||
(t = n["wx-id"]) || ((t = w++), (n["wx-id"] = t)),
|
||||
T[t] ||
|
||||
((T[t] = !0),
|
||||
wx.ready(function () {
|
||||
wx.getLocalImgData({
|
||||
localId: i,
|
||||
success: function (e) {
|
||||
n.src = e.localData;
|
||||
},
|
||||
});
|
||||
}))));
|
||||
},
|
||||
!0
|
||||
),
|
||||
n.addEventListener(
|
||||
"load",
|
||||
function (e) {
|
||||
var n;
|
||||
l ||
|
||||
((n = (e = e.target).tagName),
|
||||
e.src,
|
||||
"IMG" != n && "VIDEO" != n && "AUDIO" != n && "SOURCE" != n) ||
|
||||
((n = e["wx-id"]) && (T[n] = !1));
|
||||
},
|
||||
!0
|
||||
),
|
||||
e && (r.wx = r.jWeixin = _),
|
||||
_
|
||||
);
|
||||
else return r.jWeixin;
|
||||
function k(n, e, i) {
|
||||
r.WeixinJSBridge
|
||||
? WeixinJSBridge.invoke(n, P(e), function (e) {
|
||||
V(n, e, i);
|
||||
})
|
||||
: C(n, i);
|
||||
}
|
||||
function M(n, i, t) {
|
||||
r.WeixinJSBridge
|
||||
? WeixinJSBridge.on(n, function (e) {
|
||||
t && t.trigger && t.trigger(e), V(n, e, i);
|
||||
})
|
||||
: C(n, t || i);
|
||||
}
|
||||
function P(e) {
|
||||
return (
|
||||
((e = e || {}).appId = h.appId),
|
||||
(e.verifyAppId = h.appId),
|
||||
(e.verifySignType = "sha1"),
|
||||
(e.verifyTimestamp = h.timestamp + ""),
|
||||
(e.verifyNonceStr = h.nonceStr),
|
||||
(e.verifySignature = h.signature),
|
||||
e
|
||||
);
|
||||
}
|
||||
function x(e) {
|
||||
return {
|
||||
timeStamp: e.timestamp + "",
|
||||
nonceStr: e.nonceStr,
|
||||
package: e.package,
|
||||
paySign: e.paySign,
|
||||
signType: e.signType || "SHA1",
|
||||
};
|
||||
}
|
||||
function V(e, n, i) {
|
||||
("openEnterpriseChat" != e && "openBusinessView" !== e) ||
|
||||
(n.errCode = n.err_code),
|
||||
delete n.err_code,
|
||||
delete n.err_desc,
|
||||
delete n.err_detail;
|
||||
var t = n.errMsg,
|
||||
e =
|
||||
(t ||
|
||||
((t = n.err_msg),
|
||||
delete n.err_msg,
|
||||
(t = (function (e, n) {
|
||||
var i = c[e];
|
||||
i && (e = i);
|
||||
i = "ok";
|
||||
{
|
||||
var t;
|
||||
n &&
|
||||
((t = n.indexOf(":")),
|
||||
("access denied" !=
|
||||
(i = (i = (i =
|
||||
-1 !=
|
||||
(i =
|
||||
-1 !=
|
||||
(i =
|
||||
"failed" ==
|
||||
(i = "confirm" == (i = n.substring(t + 1)) ? "ok" : i)
|
||||
? "fail"
|
||||
: i).indexOf("failed_")
|
||||
? i.substring(7)
|
||||
: i).indexOf("fail_")
|
||||
? i.substring(5)
|
||||
: i).replace(/_/g, " ")).toLowerCase()) &&
|
||||
"no permission to execute" != i) ||
|
||||
(i = "permission denied"),
|
||||
"" ==
|
||||
(i =
|
||||
"config" == e && "function not exist" == i ? "ok" : i)) &&
|
||||
(i = "fail");
|
||||
}
|
||||
return (n = e + ":" + i);
|
||||
})(e, t)),
|
||||
(n.errMsg = t)),
|
||||
(i = i || {})._complete && (i._complete(n), delete i._complete),
|
||||
(t = n.errMsg || ""),
|
||||
h.debug && !i.isInnerInvoke && alert(JSON.stringify(n)),
|
||||
t.indexOf(":"));
|
||||
switch (t.substring(e + 1)) {
|
||||
case "ok":
|
||||
i.success && i.success(n);
|
||||
break;
|
||||
case "cancel":
|
||||
i.cancel && i.cancel(n);
|
||||
break;
|
||||
default:
|
||||
i.fail && i.fail(n);
|
||||
}
|
||||
i.complete && i.complete(n);
|
||||
}
|
||||
function A(e) {
|
||||
if (e) {
|
||||
for (var n = 0, i = e.length; n < i; ++n) {
|
||||
var t = e[n],
|
||||
t = a[t];
|
||||
t && (e[n] = t);
|
||||
}
|
||||
return e;
|
||||
}
|
||||
}
|
||||
function C(e, n) {
|
||||
var i;
|
||||
!h.debug ||
|
||||
(n && n.isInnerInvoke) ||
|
||||
((i = c[e]) && (e = i),
|
||||
n && n._complete && delete n._complete,
|
||||
console.log('"' + e + '",', n || ""));
|
||||
}
|
||||
function B(n) {
|
||||
var i;
|
||||
o ||
|
||||
s ||
|
||||
h.debug ||
|
||||
p < "6.0.2" ||
|
||||
g.systemType < 0 ||
|
||||
((i = new Image()),
|
||||
(g.appId = h.appId),
|
||||
(g.initTime = m.initEndTime - m.initStartTime),
|
||||
(g.preVerifyTime = m.preVerifyEndTime - m.preVerifyStartTime),
|
||||
_.getNetworkType({
|
||||
isInnerInvoke: !0,
|
||||
success: function (e) {
|
||||
g.networkType = e.networkType;
|
||||
e =
|
||||
"https://open.weixin.qq.com/sdk/report?v=" +
|
||||
g.version +
|
||||
"&o=" +
|
||||
g.isPreVerifyOk +
|
||||
"&s=" +
|
||||
g.systemType +
|
||||
"&c=" +
|
||||
g.clientVersion +
|
||||
"&a=" +
|
||||
g.appId +
|
||||
"&n=" +
|
||||
g.networkType +
|
||||
"&i=" +
|
||||
g.initTime +
|
||||
"&p=" +
|
||||
g.preVerifyTime +
|
||||
"&u=" +
|
||||
g.url +
|
||||
"&jsapi_name=" +
|
||||
(n ? n.jsApiName : "");
|
||||
i.src = e;
|
||||
},
|
||||
}));
|
||||
}
|
||||
function L() {
|
||||
return new Date().getTime();
|
||||
}
|
||||
function O(e) {
|
||||
d &&
|
||||
(r.WeixinJSBridge
|
||||
? e()
|
||||
: n.addEventListener &&
|
||||
n.addEventListener("WeixinJSBridgeReady", e, !1));
|
||||
}
|
||||
});
|
||||
12
node_modules/weixin-js-sdk/package.json
generated
vendored
Normal file
12
node_modules/weixin-js-sdk/package.json
generated
vendored
Normal file
@@ -0,0 +1,12 @@
|
||||
{
|
||||
"name": "weixin-js-sdk",
|
||||
"version": "1.6.5",
|
||||
"license": "MIT",
|
||||
"main": "index.js",
|
||||
"description": "微信官方 js-sdk npm 安装版，支持 typescript",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/yanxi123-com/weixin-js-sdk"
|
||||
},
|
||||
"homepage": "https://yanxi123.com/"
|
||||
}
|
||||
17
package-lock.json
generated
Normal file
17
package-lock.json
generated
Normal file
@@ -0,0 +1,17 @@
|
||||
{
|
||||
"name": "商协会-高级版",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"dependencies": {
|
||||
"weixin-js-sdk": "^1.6.5"
|
||||
}
|
||||
},
|
||||
"node_modules/weixin-js-sdk": {
|
||||
"version": "1.6.5",
|
||||
"resolved": "https://registry.npmjs.org/weixin-js-sdk/-/weixin-js-sdk-1.6.5.tgz",
|
||||
"integrity": "sha512-Gph1WAWB2YN/lMOFB/ymb+hbU/wYazzJgu6PMMktCy9cSCeW5wA6Zwt0dpahJbJ+RJEwtTv2x9iIu0U4enuVSQ=="
|
||||
}
|
||||
}
|
||||
}
|
||||
5
package.json
Normal file
5
package.json
Normal file
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"weixin-js-sdk": "^1.6.5"
|
||||
}
|
||||
}
|
||||
791
pages.json
Normal file
791
pages.json
Normal file
@@ -0,0 +1,791 @@
|
||||
// +----------------------------------------------------------------------
|
||||
// | 麦沃德科技赋能开发者，助力商协会发展
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
// +----------------------------------------------------------------------
|
||||
|
||||
{
|
||||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员风采",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mall/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商城"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/demand/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供需",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/webview/webview",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "default"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/webview/imageText",
|
||||
"style": {
|
||||
"navigationBarTitleText": "详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/settings/system",
|
||||
"style": {
|
||||
"navigationBarTitleText": "系统设置"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/problem/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "常见问题",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/problem/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "常见问题"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/notice/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "消息通知",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/notice/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "通知详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/settings/user",
|
||||
"style": {
|
||||
"navigationBarTitleText": "修改信息"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/settings/agreement",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/mine/subscribe/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "消息订阅",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/association",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/article/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "平台动态",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/article/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "平台动态"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/search/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员搜索"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/search/result",
|
||||
"style": {
|
||||
"navigationBarTitleText": "搜索结果"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/industry",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员风采"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/units",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员单位"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/enterprise",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员企业"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/organization",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员团体"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/apply/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "申请入会"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/apply/enterprise",
|
||||
"style": {
|
||||
"navigationBarTitleText": "申请入会"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/apply/editor",
|
||||
"style": {
|
||||
"navigationBarTitleText": "编辑内容"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/apply/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/fees/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会费缴纳"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/fees/pay",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会费缴纳"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/fees/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/information",
|
||||
"style": {
|
||||
"navigationBarTitleText": "编辑资料"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/product/edit",
|
||||
"style": {
|
||||
"navigationBarTitleText": "产品维护"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/product/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/product/editor",
|
||||
"style": {
|
||||
"navigationBarTitleText": "介绍内容"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/member/product/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "产品详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/demand/search/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供需搜索"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/demand/search/result",
|
||||
"style": {
|
||||
"navigationBarTitleText": "搜索结果"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/diy/index",
|
||||
"style": {
|
||||
// #ifdef MP-WEIXIN
|
||||
"enablePullDownRefresh": true,
|
||||
// #endif
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/diy/richText",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/diy/search",
|
||||
"style": {
|
||||
"navigationBarTitleText": "搜索结果"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/error/error",
|
||||
"style": {
|
||||
"navigationBarTitleText": "系统维护"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/error/browser",
|
||||
"style": {
|
||||
"navigationBarTitleText": "系统错误"
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [{
|
||||
"root": "pagesMall",
|
||||
"pages": [{
|
||||
"path": "goods/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goods/list",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goods/order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单确认"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "address/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "地址管理"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "address/add",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的订单",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/payment",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单支付"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "refund/apply",
|
||||
"style": {
|
||||
"navigationBarTitleText": "申请退款"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "refund/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "退款列表",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "refund/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "退款详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "refund/goods",
|
||||
"style": {
|
||||
"navigationBarTitleText": "填写信息"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "refund/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "cart/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "购物车",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesDemand",
|
||||
"pages": [{
|
||||
"path": "demand/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供需详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "demand/list",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的发布",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "demand/publish",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供需详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "demand/add",
|
||||
"style": {
|
||||
"navigationBarTitleText": "发布供需"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "demand/edit",
|
||||
"style": {
|
||||
"navigationBarTitleText": "发布供需"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesTools",
|
||||
"pages": [{
|
||||
"path": "certificate/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "证书查询"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "certificate/result",
|
||||
"style": {
|
||||
"navigationBarTitleText": "查询结果"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "album/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "album/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "phoneBook/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "通讯录",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "sequence/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动接龙",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "sequence/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动接龙详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "sequence/feedback",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动接龙反馈"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "sequence/feedInfo",
|
||||
"style": {
|
||||
"navigationBarTitleText": "反馈信息"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "suggest/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "需求建议"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "publicize/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "推广会员",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "questionnaire/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "问卷调查",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "suggest/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "questionnaire/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "问卷详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "questionnaire/info",
|
||||
"style": {
|
||||
"navigationBarTitleText": "问卷反馈详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "institution/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "机构列表",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "institution/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "机构详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "institution/apply",
|
||||
"style": {
|
||||
"navigationBarTitleText": "申请加入"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "institution/editor",
|
||||
"style": {
|
||||
"navigationBarTitleText": "介绍内容"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "institution/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesActivity",
|
||||
"pages": [{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动列表",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "index/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "index/apply",
|
||||
"style": {
|
||||
"navigationBarTitleText": "填写报名信息"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "index/order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "index/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的活动",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "提交成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "verification/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动核销"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "verification/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动核销"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "search/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动搜索"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "search/result",
|
||||
"style": {
|
||||
"navigationBarTitleText": "搜索结果"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesCard",
|
||||
"pages": [{
|
||||
"path": "mine/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的名片",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mine/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "名片详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mine/edit",
|
||||
"style": {
|
||||
"navigationBarTitleText": "新建名片"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mine/manage",
|
||||
"style": {
|
||||
"navigationBarTitleText": "名片管理",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mine/custom",
|
||||
"style": {
|
||||
"navigationBarTitleText": "自定义背景"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "mine/editor",
|
||||
"style": {
|
||||
"navigationBarTitleText": "编辑内容"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "card/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "名片详情"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesAdmin",
|
||||
"pages": [{
|
||||
"path": "examine/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "审核会员",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "examine/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "审核会员详情"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pagesPoints",
|
||||
"pages": [{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "积分商城",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "index/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "积分明细"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goods/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goods/order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单确认"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goods/success",
|
||||
"style": {
|
||||
"navigationBarTitleText": "支付成功"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的订单",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "order/details",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单详情"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#FFFFFF",
|
||||
"navigationStyle": "custom",
|
||||
"backgroundColor": "#FFFFFF"
|
||||
},
|
||||
"tabBar": {
|
||||
"color": "#ffffff",
|
||||
"selectedColor": "#ffffff",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#ffffff",
|
||||
"custom": true,
|
||||
"list": [{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页",
|
||||
"visible": false
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/member/index",
|
||||
"text": "会员",
|
||||
"visible": false
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/mall/index",
|
||||
"text": "商城",
|
||||
"visible": false
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/demand/index",
|
||||
"text": "供需",
|
||||
"visible": false
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/mine/index",
|
||||
"text": "我的",
|
||||
"visible": false
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
265
pages/article/details.vue
Normal file
265
pages/article/details.vue
Normal file
@@ -0,0 +1,265 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 平台动态-详情 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="container" :style="{'--theme-color': themeColor}">
|
||||
<!-- 标题栏 -->
|
||||
<title-bar :title="pageTitle || '平台动态'"></title-bar>
|
||||
<!-- 内容区 -->
|
||||
<view class="container-main" v-if="loadEnd">
|
||||
<view class="main-title">{{articleInfo.title}}</view>
|
||||
<view class="main-tag flex justify-content-between align-items-center">
|
||||
<view class="tag-item flex-item">
|
||||
<text class="item-name">{{articleInfo.release}}</text>
|
||||
<text class="item-time">{{articleInfo.createtime}}</text>
|
||||
</view>
|
||||
<view class="tag-item flex align-items-center">
|
||||
<image class="item-icon" src="/static/see.png" mode="aspectFit"></image>
|
||||
<text class="item-number">{{articleInfo.read_num}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="main-content">
|
||||
<mp-html :content="articleInfo.content"></mp-html>
|
||||
</view>
|
||||
<view class="main-annex">
|
||||
<view class="annex-file" v-for="(item, index) in annexList" :key="index" @click="handleDownload(item.file, item.name)">
|
||||
<view class="file-name text-ellipsis">{{item.name}}</view>
|
||||
<view class="file-btn">下载附件</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部导航 -->
|
||||
<tab-bar></tab-bar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
// #ifdef H5
|
||||
import wx from 'weixin-js-sdk';
|
||||
// #endif
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 加载完成
|
||||
loadEnd: false,
|
||||
// 页面标题
|
||||
pageTitle: "",
|
||||
// 新闻id
|
||||
articleId: null,
|
||||
// 新闻详情
|
||||
articleInfo: {},
|
||||
// 附件列表
|
||||
annexList: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
shareTitle: state => state.app.shareTitle,
|
||||
})
|
||||
},
|
||||
onLoad(option) {
|
||||
this.articleId = option.id
|
||||
if (option.title) this.pageTitle = decodeURIComponent(option.title)
|
||||
uni.showLoading({
|
||||
title: "加载中"
|
||||
})
|
||||
this.getArticle(() => {
|
||||
this.loadEnd = true
|
||||
uni.hideLoading()
|
||||
// #ifdef H5
|
||||
this.initConfig()
|
||||
// #endif
|
||||
})
|
||||
},
|
||||
onShareAppMessage() {
|
||||
return {
|
||||
title: this.articleInfo.title,
|
||||
imageUrl: this.articleInfo.image,
|
||||
}
|
||||
},
|
||||
onShareTimeline() {
|
||||
return {
|
||||
title: this.articleInfo.title,
|
||||
imageUrl: this.articleInfo.image,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// #ifdef H5
|
||||
// 微信公众号初始化方法
|
||||
initConfig() {
|
||||
this.$util.request("main.WeChatConfig", {
|
||||
url: location.href.split('#')[0]
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
wx.config({
|
||||
debug: false,
|
||||
appId: res.data.appId,
|
||||
timestamp: Number(res.data.timestamp),
|
||||
nonceStr: res.data.nonceStr,
|
||||
signature: res.data.signature,
|
||||
jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"],
|
||||
openTagList: ["updateAppMessageShareData", "updateTimelineShareData"],
|
||||
})
|
||||
wx.ready(() => {
|
||||
wx.updateAppMessageShareData({
|
||||
title: this.articleInfo.title,
|
||||
imageUrl: this.articleInfo.image,
|
||||
desc: "",
|
||||
link: window.location.href,
|
||||
});
|
||||
wx.updateTimelineShareData({
|
||||
title: this.articleInfo.title,
|
||||
imageUrl: this.articleInfo.image,
|
||||
link: window.location.href,
|
||||
});
|
||||
});
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('通过config接口注入权限验证配置 ', error)
|
||||
})
|
||||
},
|
||||
// #endif
|
||||
// 获取文章详情
|
||||
getArticle(fn) {
|
||||
this.$util.request("main.article.details", {
|
||||
id: this.articleId
|
||||
}).then(res => {
|
||||
if (fn) fn()
|
||||
if (res.code == 1) {
|
||||
this.articleInfo = res.data
|
||||
this.annexList = res.data?.files || []
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
if (fn) fn()
|
||||
console.error('获取文章详情 ', error)
|
||||
})
|
||||
},
|
||||
// 下载附件
|
||||
handleDownload(file, name) {
|
||||
if (file) {
|
||||
uni.showLoading({
|
||||
mask: true,
|
||||
title: '加载中',
|
||||
})
|
||||
this.$util.downloadFile(file, 2, name).then(() => {
|
||||
uni.hideLoading()
|
||||
}).catch((error) => {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: error?.errMsg || '附件下载失败',
|
||||
})
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '暂无可下载附件',
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.container {
|
||||
.container-main {
|
||||
padding: 32rpx;
|
||||
|
||||
.main-title {
|
||||
font-weight: 600;
|
||||
font-size: 36rpx;
|
||||
line-height: 60rpx;
|
||||
color: #5A5B6E;
|
||||
}
|
||||
|
||||
.main-tag {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.tag-item {
|
||||
.item-name {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.item-time {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #8D929C;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.item-icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.item-number {
|
||||
margin-left: 8rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #8D929C;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-content {
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.main-annex {
|
||||
.annex-file {
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
border: 2rpx dashed var(--theme-color);
|
||||
padding: 24rpx 32rpx;
|
||||
|
||||
.file-name {
|
||||
flex: 1;
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.file-btn {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
271
pages/article/index.vue
Normal file
271
pages/article/index.vue
Normal file
@@ -0,0 +1,271 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 平台动态-列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="container" :style="{'--theme-color': themeColor}">
|
||||
<!-- 标题栏 -->
|
||||
<title-bar :title="getPageTitle()"></title-bar>
|
||||
<!-- 内容区 -->
|
||||
<view class="container-main" v-if="loadEnd">
|
||||
<!-- 顶部导航 -->
|
||||
<scroll-view scroll-x class="main-screen" :style="{top: titleBarHeight + 'px'}" v-if="showScreen && screenList.length">
|
||||
<view class="screen-item" @click="changeScreen(0)">
|
||||
<view class="text" :class="{active: selectScreen == 0}">全部</view>
|
||||
</view>
|
||||
<view class="screen-item" v-for="item in screenList" :key="item.id" @click="changeScreen(item.id)">
|
||||
<view class="text" :class="{active: selectScreen == item.id}">{{item.name}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- 新闻列表 -->
|
||||
<view class="main-list">
|
||||
<article-item :show-data="articleList" :show-title="getPageTitle()" v-if="articleList.length"></article-item>
|
||||
<empty top="30%" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部导航 -->
|
||||
<tab-bar></tab-bar>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import articleItem from "@/pages/component/article/index.vue"
|
||||
// #ifdef H5
|
||||
import wx from 'weixin-js-sdk';
|
||||
// #endif
|
||||
export default {
|
||||
components: {
|
||||
articleItem,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 加载完成
|
||||
loadEnd: false,
|
||||
// 标题栏高度
|
||||
titleBarHeight: 0,
|
||||
// 是否显示分类筛选
|
||||
showScreen: true,
|
||||
// 分类列表
|
||||
screenList: [],
|
||||
// 已选分类
|
||||
selectScreen: 0,
|
||||
// 页面标题
|
||||
pageTitle: "",
|
||||
// 新闻列表
|
||||
articleList: [],
|
||||
// 分类查询参数
|
||||
page: 1,
|
||||
limit: 20,
|
||||
hasMore: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
shareImage: state => state.app.shareImage,
|
||||
shareTitle: state => state.app.shareTitle,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
// #ifdef MP-WEIXIN
|
||||
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
||||
this.titleBarHeight = statusBarHeight + (menuButtonInfo.top - statusBarHeight) * 2 + menuButtonInfo.height
|
||||
// #endif
|
||||
},
|
||||
onLoad(option) {
|
||||
uni.showLoading({
|
||||
title: "加载中"
|
||||
})
|
||||
if (option.id) {
|
||||
this.selectScreen = option.id
|
||||
this.showScreen = false
|
||||
} else {
|
||||
this.showScreen = true
|
||||
}
|
||||
this.getArticleCategory()
|
||||
if (option.title) this.pageTitle = decodeURIComponent(option.title)
|
||||
this.getArticleList(() => {
|
||||
uni.hideLoading()
|
||||
this.loadEnd = true
|
||||
})
|
||||
// #ifdef H5
|
||||
this.initConfig()
|
||||
// #endif
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.page = 1
|
||||
this.getArticleList(() => {
|
||||
uni.stopPullDownRefresh()
|
||||
})
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.hasMore) {
|
||||
this.page++
|
||||
this.getArticleList()
|
||||
}
|
||||
},
|
||||
onShareAppMessage() {
|
||||
return {
|
||||
title: this.shareTitle,
|
||||
imageUrl: this.shareImage,
|
||||
}
|
||||
},
|
||||
onShareTimeline() {
|
||||
return {
|
||||
title: this.shareTitle,
|
||||
imageUrl: this.shareImage,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// #ifdef H5
|
||||
// 微信公众号初始化方法
|
||||
initConfig() {
|
||||
this.$util.request("main.WeChatConfig", {
|
||||
url: location.href.split('#')[0]
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
wx.config({
|
||||
debug: false,
|
||||
appId: res.data.appId,
|
||||
timestamp: Number(res.data.timestamp),
|
||||
nonceStr: res.data.nonceStr,
|
||||
signature: res.data.signature,
|
||||
jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"],
|
||||
openTagList: ["updateAppMessageShareData", "updateTimelineShareData"],
|
||||
})
|
||||
wx.ready(() => {
|
||||
wx.updateAppMessageShareData({
|
||||
title: this.shareTitle,
|
||||
desc: "",
|
||||
link: window.location.href,
|
||||
imgUrl: this.shareImage,
|
||||
});
|
||||
wx.updateTimelineShareData({
|
||||
title: this.shareTitle,
|
||||
link: window.location.href,
|
||||
imgUrl: this.shareImage,
|
||||
});
|
||||
});
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('通过config接口注入权限验证配置 ', error)
|
||||
})
|
||||
},
|
||||
// #endif
|
||||
// 获取页面标题
|
||||
getPageTitle() {
|
||||
if (this.pageTitle) {
|
||||
return this.pageTitle || "平台动态"
|
||||
} else {
|
||||
var pageTitle = "平台动态"
|
||||
if (this.selectScreen) {
|
||||
const index = this.screenList.findIndex(item => item.id == this.selectScreen)
|
||||
if (index > -1) pageTitle = this.screenList[index].name
|
||||
}
|
||||
return pageTitle
|
||||
}
|
||||
},
|
||||
// 获取文章分类
|
||||
getArticleCategory() {
|
||||
this.$util.request("main.article.category").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.screenList = res.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取文章列表 ', error)
|
||||
})
|
||||
},
|
||||
// 获取文章列表
|
||||
getArticleList(fn) {
|
||||
let data = {
|
||||
page: this.page,
|
||||
limit: this.limit,
|
||||
}
|
||||
if (this.selectScreen) data.cat_id = this.selectScreen
|
||||
this.$util.request("main.article.list", data).then(res => {
|
||||
if (fn) fn()
|
||||
if (res.code == 1) {
|
||||
let list = res.data.data
|
||||
this.hasMore = this.page < res.data.total / this.limit ? true : false
|
||||
this.articleList = this.page == 1 ? list : [...this.articleList, ...list];
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
if (fn) fn()
|
||||
console.error('获取文章列表 ', error)
|
||||
})
|
||||
},
|
||||
// 更改分类
|
||||
changeScreen(id) {
|
||||
this.selectScreen = id
|
||||
this.page = 1
|
||||
this.getArticleList()
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.container {
|
||||
.container-main {
|
||||
.main-screen {
|
||||
white-space: nowrap;
|
||||
background: #ffffff;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
|
||||
.screen-item {
|
||||
padding: 0 24rpx;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
min-width: 25%;
|
||||
|
||||
.text {
|
||||
padding: 36rpx 0;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
border-bottom: 4rpx solid transparent;
|
||||
|
||||
&.active {
|
||||
color: var(--theme-color);
|
||||
border-color: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-list {
|
||||
padding: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
537
pages/component/activity/apply.vue
Normal file
537
pages/component/activity/apply.vue
Normal file
@@ -0,0 +1,537 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-活动报名 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-activity-apply">
|
||||
<!-- 表单数据 -->
|
||||
<form class="apply-form">
|
||||
<view class="form-item" v-for="(item, index) in applyField" :key="index">
|
||||
<!-- 标题 -->
|
||||
<view class="item-title">
|
||||
<text class="required" v-if="item.required == 1">*</text>
|
||||
<text class="text">{{item.label}}</text>
|
||||
<text class="tips" v-if="item.type == 'image' || item.type == 'video'">（{{item.option}}）</text>
|
||||
</view>
|
||||
<!-- 文本字段 -->
|
||||
<block v-if="item.type == 'text'">
|
||||
<view class="item-input" :class="{disabled: item.disabled}">
|
||||
<input class="input" :disabled="item.disabled" type="text" v-model="item.value" :placeholder="item.option" placeholder-class="placeholder" />
|
||||
</view>
|
||||
</block>
|
||||
<!-- 数字字段 -->
|
||||
<block v-else-if="item.type == 'number'">
|
||||
<view class="item-input" :class="{disabled: item.disabled}">
|
||||
<input class="input" :disabled="item.disabled" type="number" :maxlength="item.field == 'mobile' ? 11 : -1" v-model="item.value" :placeholder="item.option" placeholder-class="placeholder" />
|
||||
</view>
|
||||
</block>
|
||||
<!-- 单选按钮 -->
|
||||
<block v-else-if="item.type == 'radio'">
|
||||
<view class="item-radio">
|
||||
<view class="radio" :class="{active: item.value == option}" v-for="(option, num) in getOption(item.option)" :key="num" @click="selectRadio(index, option)">
|
||||
<image src="/static/select.png" mode="aspectFit"></image>
|
||||
<text>{{option}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 复选按钮 -->
|
||||
<block v-else-if="item.type == 'checkbox'">
|
||||
<view class="item-radio">
|
||||
<view class="radio" :class="{active: item.value.includes(option)}" v-for="(option, num) in getOption(item.option)" :key="num" @click="selectCheckbox(index, option)">
|
||||
<image src="/static/select.png" mode="aspectFit"></image>
|
||||
<text>{{option}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 下拉列表 -->
|
||||
<block v-else-if="item.type == 'select'">
|
||||
<view class="item-input" @click="openSelectPicker(index)">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 日期字段 -->
|
||||
<block v-else-if="item.type == 'date'">
|
||||
<view class="item-input" @click="openDatePicker(index)">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/date.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 时间字段 -->
|
||||
<block v-else-if="item.type == 'time'">
|
||||
<view class="item-input" @click="openTimePicker(index)">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/time.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 日期时间 -->
|
||||
<block v-else-if="item.type == 'datetime'">
|
||||
<uni-datetime-picker v-model="item.value" :is-meeting="true" @show="pageChange(true)" @maskClick="pageChange(false)" @change="pageChange(false)">
|
||||
<view class="item-input">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/date.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</uni-datetime-picker>
|
||||
</block>
|
||||
<!-- 文本域 -->
|
||||
<block v-else-if="item.type == 'textarea'">
|
||||
<view class="item-input">
|
||||
<textarea class="textarea" type="text" maxlength="-1" v-model="item.value" :placeholder="'请输入' + item.label" placeholder-class="placeholder" />
|
||||
</view>
|
||||
</block>
|
||||
<!-- 图片上传 -->
|
||||
<block v-else-if="item.type == 'image'">
|
||||
<view class="item-upload">
|
||||
<view class="upload-image" v-if="item.value && item.value.length > 0" v-for="(img, num) in item.value" :key="num" @click="previewImage(index, num)">
|
||||
<image class="image-select" :src="img" mode="aspectFill"></image>
|
||||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index, num)"></image>
|
||||
</view>
|
||||
<view class="upload-image" v-if="!item.value || item.value.length < 9" @click="chooseImage(index, 9)">
|
||||
<view class="image-background"></view>
|
||||
<view class="image-choose">
|
||||
<view class="icon">
|
||||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="text">上传图片</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 视频上传 -->
|
||||
<block v-else-if="item.type == 'video'">
|
||||
<view class="item-upload">
|
||||
<view class="upload-image" v-if="item.value">
|
||||
<view class="image-video">
|
||||
<image class="video" src="/static/video.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click="deleteVideo(index)"></image>
|
||||
</view>
|
||||
<view class="upload-image" v-else @click="chooseVideo(index)">
|
||||
<view class="image-background"></view>
|
||||
<view class="image-choose">
|
||||
<view class="icon">
|
||||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="text">上传视频</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 地图选址 -->
|
||||
<block v-else-if="item.type == 'map'">
|
||||
<view class="item-input" @click="chooseLocation(index)">
|
||||
<view class="input text-ellipsis" v-if="item.value.address">{{item.value.address}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value.address" @click.stop="clearLocation(index)"></image>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</form>
|
||||
<!-- 单项选择框 -->
|
||||
<select-picker ref="selectPicker" :is-meeting="true" :title="selectTitle" @onChange="pageChange" @confirm="changeSelectPicker"></select-picker>
|
||||
<!-- 日期选择框 -->
|
||||
<date-picker ref="datePicker" :is-meeting="true" @onChange="pageChange" @confirm="changeDatePicker"></date-picker>
|
||||
<!-- 时间选择框 -->
|
||||
<time-picker ref="timePicker" :is-meeting="true" @onChange="pageChange" @confirm="changeTimePicker"></time-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import selectPicker from "@/pages/component/picker/select.vue"
|
||||
import datePicker from "@/pages/component/picker/date.vue"
|
||||
import timePicker from "@/pages/component/picker/time.vue"
|
||||
export default {
|
||||
name: "activityApply",
|
||||
props: ["showData"],
|
||||
components: {
|
||||
selectPicker,
|
||||
datePicker,
|
||||
timePicker,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 入会字段
|
||||
applyField: [],
|
||||
// 会员级别
|
||||
levelList: [],
|
||||
// 行业分类
|
||||
industryList: [],
|
||||
// 单选标题
|
||||
selectTitle: "",
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
showData: {
|
||||
handler(value) {
|
||||
this.applyField = value || [];
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 改变页面滚动状态
|
||||
pageChange(state) {
|
||||
this.$emit("onChange", state)
|
||||
},
|
||||
// 获取选项数据
|
||||
getOption(option) {
|
||||
return option.split(",")
|
||||
},
|
||||
// 选择单选
|
||||
selectRadio(index, option) {
|
||||
if (this.applyField[index].value == option) {
|
||||
this.applyField[index].value = ""
|
||||
} else {
|
||||
this.applyField[index].value = option
|
||||
}
|
||||
},
|
||||
// 选择复选
|
||||
selectCheckbox(index, option) {
|
||||
if (this.applyField[index].value.includes(option)) {
|
||||
this.$delete(this.applyField[index].value, this.applyField[index].value.indexOf(option))
|
||||
} else {
|
||||
this.applyField[index].value.push(option)
|
||||
}
|
||||
},
|
||||
// 选择图片
|
||||
chooseImage(index, limit = 9) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.chooseMedia({
|
||||
count: Number(limit) > 1 ? (limit - this.applyField[index].value.length) : 1,
|
||||
mediaType: ['image'],
|
||||
sourceType: ['album', 'camera'],
|
||||
sizeType: ['compressed'],
|
||||
success: (res) => {
|
||||
let list = res.tempFiles.map(item => item.tempFilePath)
|
||||
this.applyField[index].value = [...this.applyField[index].value, ...list]
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
uni.chooseImage({
|
||||
count: Number(limit) > 1 ? (limit - this.applyField[index].value.length) : 1,
|
||||
sourceType: ['album', 'camera '],
|
||||
sizeType: ['compressed'],
|
||||
success: (res) => {
|
||||
let list = res.tempFilePaths
|
||||
this.applyField[index].value = [...this.applyField[index].value, ...list]
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 删除图片
|
||||
deleteImage(i, j) {
|
||||
this.$delete(this.applyField[i].value, j)
|
||||
},
|
||||
// 预览图片
|
||||
previewImage(i, j = 0) {
|
||||
let list = this.applyField[i].value
|
||||
uni.previewImage({
|
||||
urls: list,
|
||||
current: j
|
||||
});
|
||||
},
|
||||
// 选择视频
|
||||
chooseVideo(index) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.chooseMedia({
|
||||
count: 1,
|
||||
mediaType: ['video'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success: (res) => {
|
||||
this.applyField[index].value = res.tempFiles[0].tempFilePath
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
uni.chooseVideo({
|
||||
sourceType: ['camera', 'album'],
|
||||
success: (res) => {
|
||||
this.applyField[index].value = res.tempFilePath;
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 删除视频
|
||||
deleteVideo(index) {
|
||||
this.applyField[index].value = ""
|
||||
},
|
||||
// 选择下拉选项
|
||||
openSelectPicker(index) {
|
||||
if (this.applyField[index].disabled) return
|
||||
this.selectTitle = this.applyField[index].label
|
||||
let list = this.applyField[index].option.split(",")
|
||||
this.$refs.selectPicker.open(list, this.applyField[index].value, index)
|
||||
},
|
||||
// 改变下拉选项
|
||||
changeSelectPicker(value, index) {
|
||||
this.applyField[index].value = value
|
||||
},
|
||||
// 选择日期
|
||||
openDatePicker(index) {
|
||||
this.$refs.datePicker.open(this.applyField[index].value, index)
|
||||
},
|
||||
// 改变日期
|
||||
changeDatePicker(value, index) {
|
||||
this.applyField[index].value = value
|
||||
},
|
||||
// 选择时间
|
||||
openTimePicker(index) {
|
||||
this.$refs.timePicker.open(this.applyField[index].value, index)
|
||||
},
|
||||
// 改变时间
|
||||
changeTimePicker(value, index) {
|
||||
this.applyField[index].value = value
|
||||
},
|
||||
// 清空已选数据
|
||||
clearValue(index) {
|
||||
this.applyField[index].value = ""
|
||||
},
|
||||
// 地址选择
|
||||
chooseLocation(index) {
|
||||
uni.chooseLocation({
|
||||
success: (res) => {
|
||||
this.applyField[index].value = {
|
||||
latitude: res.latitude,
|
||||
longitude: res.longitude,
|
||||
name: res.name,
|
||||
address: res.address
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 清空地址
|
||||
clearLocation(index) {
|
||||
this.applyField[index].value = {
|
||||
latitude: "",
|
||||
longitude: "",
|
||||
name: "",
|
||||
address: "",
|
||||
}
|
||||
},
|
||||
// 获取表单数据
|
||||
getApplyField(fn) {
|
||||
fn(JSON.parse(JSON.stringify(this.applyField)))
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-activity-apply {
|
||||
.apply-form {
|
||||
.form-item {
|
||||
margin-top: 32rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
|
||||
.required {
|
||||
color: #E60012;
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.item-input {
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
|
||||
&.disabled {
|
||||
.input {
|
||||
color: #8D929C;
|
||||
}
|
||||
}
|
||||
|
||||
.input {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
height: 104rpx;
|
||||
line-height: 104rpx;
|
||||
flex: 1;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
flex: 1;
|
||||
padding: 32rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
color: #8D929C;
|
||||
font-size: 28rpx;
|
||||
line-height: 104rpx;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
padding-right: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-radio {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-left: -26rpx;
|
||||
padding-top: 8rpx;
|
||||
|
||||
.radio {
|
||||
border-radius: 8rpx;
|
||||
background: #FFF;
|
||||
padding: 16rpx;
|
||||
margin-left: 26rpx;
|
||||
margin-top: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 8rpx;
|
||||
display: none;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #8D929C;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: var(--theme-color);
|
||||
|
||||
image {
|
||||
display: block;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-upload {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 32rpx;
|
||||
column-gap: 3.5%;
|
||||
row-gap: 24rpx;
|
||||
|
||||
.upload-image {
|
||||
position: relative;
|
||||
width: 31%;
|
||||
height: 0;
|
||||
padding-top: 31%;
|
||||
|
||||
.image-select {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.image-video {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 10rpx;
|
||||
background: var(--theme-color);
|
||||
padding: 56rpx;
|
||||
}
|
||||
|
||||
.image-delete {
|
||||
position: absolute;
|
||||
top: -16rpx;
|
||||
right: -16rpx;
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
|
||||
.image-choose {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 20rpx;
|
||||
right: 20rpx;
|
||||
bottom: 20rpx;
|
||||
z-index: 6;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
padding: 18rpx;
|
||||
background: var(--theme-color);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-top: 16rpx;
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.image-background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
background: var(--theme-color);
|
||||
opacity: 0.08;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
295
pages/component/activity/certificate.vue
Normal file
295
pages/component/activity/certificate.vue
Normal file
@@ -0,0 +1,295 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.maiwd.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-参会证书 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-activity-certificate">
|
||||
<!-- 参会证书 -->
|
||||
<canvas class="poster-canvas" :style="{width: posterWidth + 'px', height: posterHeight + 'px'}" canvas-id="myCanvas" id="myCanvas"></canvas>
|
||||
<!-- 参会证书模态框 -->
|
||||
<uni-popup ref="popupModal" type="center" @change="onChange">
|
||||
<view class="poster-popup flex-direction-column align-items-center" :style="{'--theme-color': themeColor, paddingTop: titleBarHeight + 'px'}">
|
||||
<view class="popup-close" @click="onClose()">
|
||||
<image class="icon" src="/static/closePopup.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<scroll-view scroll-y class="popup-content flex justify-content-center">
|
||||
<image class="image" :src="posterPath" mode="widthFix"></image>
|
||||
</scroll-view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="popup-btn" @click="saveImage">保存相册</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="popup-btn">长按图片保存相册</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import { loadImage, createPoster, canvasToTempFilePath } from "@/common/poster.js";
|
||||
export default {
|
||||
name: "activityCertificate",
|
||||
data() {
|
||||
return {
|
||||
// 标题栏高度
|
||||
titleBarHeight: 0,
|
||||
// 参会证书数据
|
||||
posterInfo: {},
|
||||
// 参会证书宽度
|
||||
posterWidth: 0,
|
||||
// 参会证书高度
|
||||
posterHeight: 0,
|
||||
// 图片资源是否准备完成
|
||||
posterReady: false,
|
||||
// 参会证书背景图片
|
||||
posterBackground: "",
|
||||
// 参会证书图片路径
|
||||
posterPath: "",
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
// #ifdef MP-WEIXIN
|
||||
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
||||
this.titleBarHeight = statusBarHeight + (menuButtonInfo.top - statusBarHeight) * 2 + menuButtonInfo.height
|
||||
// #endif
|
||||
},
|
||||
methods: {
|
||||
// 获取参会证书
|
||||
getPoster(activityId, applyId) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.$util.request("activity.certificate", {
|
||||
id: activityId,
|
||||
apply_id: applyId,
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.posterInfo = res.data
|
||||
this.posterWidth = res.data.data.bg.width
|
||||
this.posterHeight = res.data.data.bg.height
|
||||
this.$nextTick(() => {
|
||||
this.showNucleus()
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取参会证书 ', error)
|
||||
})
|
||||
},
|
||||
// 获取图片资源
|
||||
async showNucleus() {
|
||||
this.loadingResources().then((state) => {
|
||||
// 状态为 true 表示加载完成
|
||||
if (state) {
|
||||
this.posterReady = true
|
||||
this.createImage()
|
||||
}
|
||||
});
|
||||
},
|
||||
// 加载图片资源
|
||||
async loadingResources() {
|
||||
this.posterBackground = await loadImage(this.posterInfo.data.bg.img);
|
||||
return true;
|
||||
},
|
||||
// 生成参会证书
|
||||
async createImage() {
|
||||
if (!this.posterReady) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '参会证书图片资源加载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
};
|
||||
// 获取上下文对象
|
||||
const ctx = uni.createCanvasContext("myCanvas", this);
|
||||
// 创建参会证书
|
||||
let posterData = [{
|
||||
type: "image",
|
||||
url: this.posterBackground,
|
||||
config: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
w: parseFloat(this.posterWidth),
|
||||
h: parseFloat(this.posterHeight),
|
||||
},
|
||||
}]
|
||||
this.posterInfo.data.data.forEach((item) => {
|
||||
if (item.type == "text") {
|
||||
let content = ""
|
||||
if (item.item == "activity_name") content = this.posterInfo.activity_name || ""
|
||||
else if (item.item == "name") content = this.posterInfo.participant || ""
|
||||
else if (item.item == "time") content = this.posterInfo.time || ""
|
||||
let itemX = 0
|
||||
if (item.textAlign == "center") itemX = parseFloat(item.left) + parseFloat(item.width) / 2
|
||||
else if (item.textAlign == "right") itemX = parseFloat(item.left) + parseFloat(item.width)
|
||||
else itemX = parseFloat(item.left)
|
||||
let itemFont = "10px sans-serif"
|
||||
if (item.fontStyle == 2) {
|
||||
itemFont = `italic ${item.size} sans-serif`
|
||||
} else if (item.fontStyle == 3) {
|
||||
itemFont = `bold ${item.size} sans-serif`
|
||||
} else if (item.fontStyle == 4) {
|
||||
itemFont = `italic bold ${item.size} sans-serif`
|
||||
} else {
|
||||
itemFont = `${item.size} sans-serif`
|
||||
}
|
||||
posterData.push({
|
||||
type: "text",
|
||||
text: content || "",
|
||||
config: {
|
||||
x: itemX,
|
||||
y: parseFloat(item.top),
|
||||
color: item.color,
|
||||
font: itemFont,
|
||||
textAlign: item.textAlign,
|
||||
maxWidth: parseFloat(item.width),
|
||||
lineHeight: parseInt(item.height),
|
||||
isVerticalCenter: true
|
||||
},
|
||||
})
|
||||
}
|
||||
})
|
||||
await createPoster(ctx, posterData)
|
||||
const imagePath = await canvasToTempFilePath("myCanvas", this);
|
||||
this.posterPath = imagePath;
|
||||
this.$refs.popupModal.open()
|
||||
uni.hideLoading()
|
||||
},
|
||||
// 保存参会证书
|
||||
saveImage() {
|
||||
uni.authorize({
|
||||
scope: 'scope.writePhotosAlbum',
|
||||
success: () => {
|
||||
uni.getImageInfo({
|
||||
src: this.posterPath,
|
||||
success: (img) => {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: img.path,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success",
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(err);
|
||||
},
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(err)
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: () => {
|
||||
uni.showModal({
|
||||
title: '图片保存失败',
|
||||
content: '请确认是否已开启授权',
|
||||
confirmText: '开启授权',
|
||||
confirmColor: this.themeColor,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.openSetting({
|
||||
success: (setting) => {
|
||||
if (setting.authSetting["scope.writePhotosAlbum"]) {
|
||||
uni.showToast({
|
||||
title: '授权成功，请重新保存',
|
||||
icon: "none"
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请确定已打开保存权限',
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变页面滚动状态
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-activity-certificate {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.poster-canvas {
|
||||
position: fixed;
|
||||
top: 100vw;
|
||||
left: 100vh;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.poster-popup {
|
||||
.popup-close {
|
||||
width: 100%;
|
||||
margin-top: -112rpx;
|
||||
margin-bottom: 32rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
max-height: 55vh;
|
||||
|
||||
.image {
|
||||
width: 92vw;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-btn {
|
||||
margin-top: 32rpx;
|
||||
width: 336rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 26rpx 32rpx;
|
||||
border-radius: 16rpx;
|
||||
color: #FFFFFF;
|
||||
background: var(--theme-color);
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
686
pages/component/activity/index.vue
Normal file
686
pages/component/activity/index.vue
Normal file
@@ -0,0 +1,686 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-活动列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-activity" :style="{'--theme-color': themeColor}">
|
||||
<view class="activity-item" :class="{special: showType == 1}" v-for="item in showData" :key="item.id" @click="toDetails(item)">
|
||||
<view class="item-header flex justify-content-between align-items-center" v-if="showType == 2">
|
||||
<view class="header-number">订单号：{{item.order_no}}</view>
|
||||
<view class="header-status">
|
||||
<text style="color: #FF626E;" v-if="item.pay_state == 1">待付款</text>
|
||||
<block v-else-if="item.pay_state == 2">
|
||||
<text style="color: #FF9100;" v-if="item.activity_state == 1">报名中</text>
|
||||
<text v-else-if="item.activity_state == 2">进行中</text>
|
||||
<text style="color: #666666;" v-else-if="item.activity_state == 3">已结束</text>
|
||||
</block>
|
||||
<text style="color: #FF9100;" v-else-if="item.pay_state == 3">退款中</text>
|
||||
<text style="color: #666666;" v-else-if="item.pay_state == 4">已退款</text>
|
||||
<text style="color: #FF626E;" v-else-if="item.pay_state == 5">已驳回</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-info flex">
|
||||
<image class="info-image" :src="item.images" mode="aspectFill"></image>
|
||||
<view class="info-box flex-item">
|
||||
<view class="box-title text-ellipsis">{{item.name}}</view>
|
||||
<view class="box-tag flex align-items-center">
|
||||
<view class="icon" :style="{'background-image': 'url('+ iconTime +')'}" v-if="iconTime"></view>
|
||||
<text class="text flex-item text-ellipsis">{{item.start_time}} | {{item.week}}</text>
|
||||
</view>
|
||||
<view class="box-tag flex align-items-center" v-if="item.organizing_method == 1">
|
||||
<view class="icon" :style="{'background-image': 'url('+ iconNetwork +')'}" v-if="iconNetwork"></view>
|
||||
<text class="text flex-item text-ellipsis">报名成功后查看</text>
|
||||
</view>
|
||||
<view class="box-tag flex align-items-center" v-else-if="item.organizing_method == 2">
|
||||
<view class="icon" :style="{'background-image': 'url('+ iconLocation +')'}" v-if="iconLocation"></view>
|
||||
<text class="text flex-item text-ellipsis">{{item.address}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-footer flex align-items-center" v-if="showType == 2">
|
||||
<view class="footer-label">
|
||||
<text v-if="item.organizing_method == 1">线上活动</text>
|
||||
<text v-else-if="item.organizing_method == 2">线下活动</text>
|
||||
</view>
|
||||
<view class="footer-price flex-item">
|
||||
<block v-if="item.fees > 0">
|
||||
<text>￥</text>{{item.fees}}
|
||||
</block>
|
||||
<block v-else>免费</block>
|
||||
</view>
|
||||
<view class="footer-btn flex">
|
||||
<!-- 报名中 -->
|
||||
<block v-if="item.activity_state == 1">
|
||||
<!-- 待付款 -->
|
||||
<block v-if="item.pay_state == 1">
|
||||
<view class="btn" style="background: #FF626E;" @click.stop="toCancel(item.id)">取消参加</view>
|
||||
<view class="btn" @click.stop="toPayment(item.activity_id)">去支付</view>
|
||||
</block>
|
||||
<!-- 已付款 -->
|
||||
<block v-else-if="item.pay_state == 2">
|
||||
<view style="background: #FF626E;" class="btn" @click.stop="handleCancel(item.id)" v-if="parseFloat(item.fees) == 0">取消参加</view>
|
||||
<view style="background: #FF626E;" class="btn" @click.stop="handleRefund(item.id,item.activity_id)" v-else-if="item.refund == 1">申请退款</view>
|
||||
<view class="btn" style="background: #FFB656;" @click.stop="showWebsite(item.url)" v-if="item.organizing_method == 1">线上地址</view>
|
||||
<view class="btn" style="background: #FFB656;" @click.stop="handleVerification(item.activity_id, item.verification_method)" v-else-if="item.organizing_method == 2 && item.is_verifying == 1 && item.is_sign_in == 2">
|
||||
<text v-if="item.verification_method == 1">扫码签到</text>
|
||||
<text v-else>参会凭证</text>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 已驳回 -->
|
||||
<block v-else-if="item.pay_state == 5">
|
||||
<view class="btn" style="background: #FF626E;">驳回原因</view>
|
||||
</block>
|
||||
</block>
|
||||
<!-- 进行中 -->
|
||||
<block v-else-if="item.activity_state == 2 && item.pay_state == 2">
|
||||
<view class="btn" style="background: #FFB656;" @click.stop="showWebsite(item.url)" v-if="item.organizing_method == 1">线上地址</view>
|
||||
<view class="btn" style="background: #FFB656;" @click.stop="handleVerification(item.activity_id, item.verification_method)" v-else-if="item.organizing_method == 2 && item.is_verifying == 1 && item.is_sign_in == 2">
|
||||
<text v-if="item.verification_method == 1">扫码签到</text>
|
||||
<text v-else>参会凭证</text>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 已结束 -->
|
||||
<block v-else-if="item.activity_state == 3 && item.pay_state == 2">
|
||||
<view class="btn" @click.stop="showCertificate(item.activity_id, item.id)">参会证书</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 参会凭证 -->
|
||||
<activity-poster ref="activityPoster" @onChange="pageChange"></activity-poster>
|
||||
<!-- 参会证书 -->
|
||||
<activity-certificate ref="activityCertificate" @onChange="pageChange"></activity-certificate>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import activityPoster from "@/pages/component/activity/poster.vue"
|
||||
import activityCertificate from "@/pages/component/activity/certificate.vue"
|
||||
import svgData from "@/common/svg.js"
|
||||
// #ifdef H5
|
||||
import wx from 'weixin-js-sdk';
|
||||
// #endif
|
||||
export default {
|
||||
name: "activityIndex",
|
||||
props: ["showData", "showType"],
|
||||
components: {
|
||||
activityPoster,
|
||||
activityCertificate,
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
iconTime: state => {
|
||||
return svgData.svgToUrl("time", state.app.themeColor)
|
||||
},
|
||||
iconLocation: state => {
|
||||
return svgData.svgToUrl("location", state.app.themeColor)
|
||||
},
|
||||
iconNetwork: state => {
|
||||
return svgData.svgToUrl("network", state.app.themeColor)
|
||||
},
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 改变页面滚动状态
|
||||
pageChange(state) {
|
||||
this.$emit("onChange", state)
|
||||
},
|
||||
// 申请退款
|
||||
handleRefund(applyId, activity_id) {
|
||||
uni.showModal({
|
||||
content: "确认申请退款此活动？",
|
||||
confirmColor: "#FF626E",
|
||||
confirmText: "确认退款",
|
||||
cancelColor: "#999999",
|
||||
cancelText: "取消退款",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.$util.request("activity.applyRefund", {
|
||||
activity_id: activity_id,
|
||||
apply_id: applyId
|
||||
}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 1) {
|
||||
uni.redirectTo({
|
||||
url: "/pagesActivity/order/success"
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('申请退款 ', error)
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 未支付取消参加
|
||||
toCancel(applyId) {
|
||||
uni.showModal({
|
||||
content: "确认取消参加此活动？",
|
||||
confirmColor: "#FF626E",
|
||||
confirmText: "确认取消",
|
||||
cancelColor: "#999999",
|
||||
cancelText: "我再想想",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.$util.request("activity.applyDel", {
|
||||
id: applyId
|
||||
}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 1) {
|
||||
uni.showToast({
|
||||
title: "取消成功",
|
||||
icon: "success",
|
||||
mask: true,
|
||||
duration: 1500
|
||||
})
|
||||
this.$emit("getOrderList");
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('取消参加 ', error)
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 去支付
|
||||
toPayment(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/index/order?id=" + id
|
||||
})
|
||||
},
|
||||
// 取消参加
|
||||
handleCancel(applyId) {
|
||||
uni.showModal({
|
||||
content: "确认取消参加此活动？",
|
||||
confirmColor: "#FF626E",
|
||||
confirmText: "确认取消",
|
||||
cancelColor: "#999999",
|
||||
cancelText: "我再想想",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.$util.request("activity.applyCancel", {
|
||||
id: applyId
|
||||
}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 1) {
|
||||
uni.showToast({
|
||||
title: "取消成功",
|
||||
icon: "success",
|
||||
mask: true,
|
||||
duration: 1500
|
||||
})
|
||||
this.$emit("getOrderList");
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('取消参加 ', error)
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 线上地址
|
||||
showWebsite(url) {
|
||||
if (url) {
|
||||
uni.showModal({
|
||||
content: url,
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "复制链接",
|
||||
cancelColor: "#999999",
|
||||
cancelText: "关闭页面",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.$util.toPage({
|
||||
mode: 8,
|
||||
content: url
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "暂无线上地址，请稍后再试"
|
||||
})
|
||||
}
|
||||
},
|
||||
// 跳转详情
|
||||
toDetails(item) {
|
||||
if (this.showType == 2) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pagesActivity/order/details?id=${item.id}&activity_id=${item.activity_id}`
|
||||
})
|
||||
} else if (this.showType == 3) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/verification/details?id=" + item.id
|
||||
})
|
||||
} else {
|
||||
if (item.activity_auth == 2) {
|
||||
if (!uni.getStorageSync("token")) {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "该活动为会员专属，请登录后查看",
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "前往登录",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/index"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/index/details?id=" + item.id
|
||||
})
|
||||
} else {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/index/details?id=" + item.id
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
// 活动核销
|
||||
handleVerification(id, method) {
|
||||
if (method == 1) {
|
||||
this.handleScan(id)
|
||||
} else {
|
||||
this.$refs.activityPoster.getPoster(id)
|
||||
}
|
||||
},
|
||||
// 扫码核销
|
||||
handleScan(id) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.getAuthSetting(() => {
|
||||
uni.hideLoading()
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.scanCode({
|
||||
success: (res) => {
|
||||
if (res.path) {
|
||||
const parameter = this.getUrlParam(res.path)
|
||||
if (parameter && parameter.scene) {
|
||||
this.scanSign(parameter.scene, id)
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "签到失败，请检查签到码是否正确",
|
||||
duration: 2500
|
||||
})
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "签到失败，请检查签到码是否正确",
|
||||
duration: 2500
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
wx.scanQRCode({
|
||||
needResult: 1,
|
||||
scanType: ["qrCode"],
|
||||
success: (res) => {
|
||||
if (res.resultStr) {
|
||||
const parameter = this.getUrlParam(res.resultStr)
|
||||
if (parameter && parameter.scene) {
|
||||
this.scanSign(parameter.scene, id)
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "签到失败，请检查签到码是否正确",
|
||||
duration: 2500
|
||||
})
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: "签到失败，请检查签到码是否正确",
|
||||
duration: 2500
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "当前设备暂不支持扫码核销，请稍后再试",
|
||||
showCancel: false,
|
||||
confirmText: "我知道了"
|
||||
})
|
||||
},
|
||||
});
|
||||
// #endif
|
||||
})
|
||||
},
|
||||
// 自助核销
|
||||
scanSign(value, id) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.getLocation((location) => {
|
||||
if (!location) {
|
||||
uni.showToast({
|
||||
title: '位置获取失败，请确定已打开定位权限',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$util.request("activity.scanSign", {
|
||||
activity_id: id,
|
||||
validate_value: value,
|
||||
lng: location.longitude,
|
||||
lat: location.latitude,
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
uni.showToast({
|
||||
icon: "success",
|
||||
title: "签到成功",
|
||||
duration: 2000
|
||||
})
|
||||
this.$emit("getOrderList");
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('核销签到', error)
|
||||
})
|
||||
})
|
||||
},
|
||||
// 获取位置权限
|
||||
getAuthSetting(fn) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.getSetting({
|
||||
success: (setting) => {
|
||||
if (setting.authSetting && setting.authSetting.hasOwnProperty("scope.userLocation")) {
|
||||
if (setting.authSetting["scope.userLocation"]) {
|
||||
if (fn) fn()
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请重新授权获取您的地理位置，否则部分功能将无法使用',
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "授权",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.openSetting({
|
||||
success: (result) => {
|
||||
if (result.authSetting["scope.userLocation"]) {
|
||||
if (fn) fn()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请确定已打开定位权限',
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
title: '位置获取失败',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请授权获取您的地理位置，否则部分功能将无法使用',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
if (fn) fn()
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
if (fn) fn()
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
title: '位置获取失败',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
if (fn) fn()
|
||||
// #endif
|
||||
},
|
||||
// 获取当前地址
|
||||
getLocation(fn) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
geocode: true,
|
||||
success: (res) => {
|
||||
fn({
|
||||
latitude: res.latitude,
|
||||
longitude: res.longitude,
|
||||
})
|
||||
},
|
||||
fail: () => {
|
||||
fn()
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
wx.ready(() => {
|
||||
wx.getLocation({
|
||||
type: 'wgs84',
|
||||
success: (res) => {
|
||||
fn({
|
||||
latitude: res.latitude,
|
||||
longitude: res.longitude,
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
fn()
|
||||
},
|
||||
cancel: () => {
|
||||
fn()
|
||||
}
|
||||
});
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
// 截取地址栏参数
|
||||
getUrlParam(url) {
|
||||
const query = url.split("?")[1] || "";
|
||||
const params = {};
|
||||
query.split("&").forEach((pair) => {
|
||||
const [key, value] = pair.split("=");
|
||||
if (key) {
|
||||
params[key] = decodeURIComponent(value || "");
|
||||
}
|
||||
});
|
||||
return params;
|
||||
},
|
||||
// 参会证书
|
||||
showCertificate(activityId, applyId) {
|
||||
this.$refs.activityCertificate.getPoster(activityId, applyId)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-activity {
|
||||
.activity-item {
|
||||
margin-top: 32rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
padding: 32rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&.special {
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.item-header {
|
||||
padding-bottom: 32rpx;
|
||||
border-bottom: 1rpx solid #E4E4E4;
|
||||
margin-bottom: 32rpx;
|
||||
|
||||
.header-number {
|
||||
color: #999999;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.header-status {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-info {
|
||||
.info-image {
|
||||
width: 220rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
margin-left: 32rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.box-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.box-tag {
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
background-size: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #8D929C;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-footer {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.footer-label {
|
||||
color: var(--theme-color);
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
border-radius: 8rpx;
|
||||
background: #F6F7FB;
|
||||
}
|
||||
|
||||
.footer-price {
|
||||
margin-left: 16rpx;
|
||||
color: var(--theme-color);
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
line-height: 50rpx;
|
||||
|
||||
text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.footer-btn {
|
||||
margin-left: 16rpx;
|
||||
|
||||
.btn {
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 14rpx 24rpx;
|
||||
border-radius: 8rpx;
|
||||
background: var(--theme-color);
|
||||
margin-left: 12rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
508
pages/component/activity/poster.vue
Normal file
508
pages/component/activity/poster.vue
Normal file
@@ -0,0 +1,508 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.maiwd.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-参会凭证 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-activity-poster">
|
||||
<!-- 参会凭证 -->
|
||||
<canvas class="poster-canvas" :style="{width: posterWidth + 'px', height: posterHeight + 'px'}" canvas-id="myCanvas" id="myCanvas"></canvas>
|
||||
<!-- 二维码生成 -->
|
||||
<uqrcode class="poster-canvas" ref="qrcode" canvas-id="qrcode" :value="codeData" :options="{ margin: 4 }" v-if="codeData"></uqrcode>
|
||||
<!-- 参会凭证模态框 -->
|
||||
<uni-popup ref="popupModal" type="center" @change="onChange">
|
||||
<view class="poster-popup flex-direction-column align-items-center" :style="{'--theme-color': themeColor, paddingTop: titleBarHeight + 'px'}">
|
||||
<view class="popup-close" @click="onClose()">
|
||||
<image class="icon" src="/static/closePopup.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="popup-content flex justify-content-center">
|
||||
<image class="image" :src="posterPath" mode="aspectFit"></image>
|
||||
</view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="popup-btn" @click="saveImage">保存相册</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="popup-btn">长按图片保存相册</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import { loadImage, createPoster, canvasToTempFilePath } from "@/common/poster.js";
|
||||
export default {
|
||||
name: "activityPoster",
|
||||
data() {
|
||||
return {
|
||||
// 标题栏高度
|
||||
titleBarHeight: 0,
|
||||
// 参会凭证数据
|
||||
posterInfo: {},
|
||||
// 参会凭证宽度
|
||||
posterWidth: 0,
|
||||
// 参会凭证高度
|
||||
posterHeight: 0,
|
||||
// 图片资源是否准备完成
|
||||
posterReady: false,
|
||||
// 参会凭证用户头像
|
||||
posterAvatar: "",
|
||||
// 参会凭证二维码数据
|
||||
codeData: "",
|
||||
// 参会凭证二维码图片
|
||||
posterCode: "",
|
||||
// 参会凭证图片路径
|
||||
posterPath: "",
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
// #ifdef MP-WEIXIN
|
||||
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
||||
this.titleBarHeight = statusBarHeight + (menuButtonInfo.top - statusBarHeight) * 2 + menuButtonInfo.height
|
||||
// #endif
|
||||
},
|
||||
methods: {
|
||||
// 获取参会凭证
|
||||
getPoster(id) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.posterWidth = uni.getSystemInfoSync().windowWidth;
|
||||
this.posterHeight = parseInt(this.posterWidth * (456 / 311));
|
||||
this.$util.request("activity.attendance", {
|
||||
activity_id: id,
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.posterInfo = res.data
|
||||
this.codeData = {
|
||||
wechatId: res.data.wechat_id,
|
||||
}
|
||||
this.codeData = JSON.stringify(this.codeData)
|
||||
this.createQrcode()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取参会凭证 ', error)
|
||||
})
|
||||
},
|
||||
// base64转临时路径
|
||||
base64ToPath(base64) {
|
||||
let arr = base64.split(',');
|
||||
let mime = arr[0].match(/:(.*?);/)[1];
|
||||
let bstr = atob(arr[1]);
|
||||
let n = bstr.length;
|
||||
let u8arr = new Uint8Array(n);
|
||||
while (n--) {
|
||||
u8arr[n] = bstr.charCodeAt(n);
|
||||
}
|
||||
let blob = new Blob([u8arr], {
|
||||
type: mime
|
||||
});
|
||||
let url = URL.createObjectURL(blob);
|
||||
return url;
|
||||
},
|
||||
// 生成二维码
|
||||
createQrcode() {
|
||||
if (this.$refs.qrcode && this.$refs.qrcode.toTempFilePath) {
|
||||
this.$refs.qrcode.toTempFilePath({
|
||||
success: res => {
|
||||
// #ifdef MP-WEIXIN
|
||||
const base64Data = res.tempFilePath.replace(/^data:image\/\w+;base64,/, '');
|
||||
const filePath = `${wx.env.USER_DATA_PATH}/qrcode.jpg`
|
||||
uni.getFileSystemManager().writeFile({
|
||||
filePath,
|
||||
data: base64Data,
|
||||
encoding: "base64",
|
||||
success: () => {
|
||||
this.posterCode = filePath
|
||||
this.showNucleus()
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
this.posterCode = this.base64ToPath(res.tempFilePath);
|
||||
this.showNucleus()
|
||||
// #endif
|
||||
},
|
||||
fail: () => {
|
||||
setTimeout(() => {
|
||||
this.createQrcode()
|
||||
}, 200);
|
||||
},
|
||||
});
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
this.createQrcode()
|
||||
}, 200);
|
||||
}
|
||||
},
|
||||
// 获取图片资源
|
||||
async showNucleus() {
|
||||
this.loadingResources().then((state) => {
|
||||
if (state) {
|
||||
this.posterReady = true
|
||||
this.createImage()
|
||||
}
|
||||
});
|
||||
},
|
||||
// 加载图片资源
|
||||
async loadingResources() {
|
||||
this.posterCode = await loadImage(this.posterCode);
|
||||
this.posterAvatar = await loadImage(this.posterInfo.member_avatar);
|
||||
return true;
|
||||
},
|
||||
// 生成参会凭证
|
||||
async createImage() {
|
||||
if (!this.posterReady) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '参会凭证图片资源加载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
};
|
||||
// 获取上下文对象
|
||||
const ctx = uni.createCanvasContext("myCanvas", this);
|
||||
// 设置背景色1
|
||||
const x1 = 0;
|
||||
const y1 = 0;
|
||||
const width1 = this.posterWidth;
|
||||
const height1 = this.posterHeight;
|
||||
const radius1 = parseInt(this.posterWidth * (20 / 311));
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x1 + radius1, y1);
|
||||
ctx.lineTo(x1 + width1 - radius1, y1);
|
||||
ctx.arc(x1 + width1 - radius1, y1 + radius1, radius1, -Math.PI / 2, 0);
|
||||
ctx.lineTo(x1 + width1, y1 + height1 - radius1);
|
||||
ctx.arc(x1 + width1 - radius1, y1 + height1 - radius1, radius1, 0, Math.PI / 2);
|
||||
ctx.lineTo(x1 + radius1, y1 + height1);
|
||||
ctx.arc(x1 + radius1, y1 + height1 - radius1, radius1, Math.PI / 2, Math.PI);
|
||||
ctx.lineTo(x1, y1 + radius1);
|
||||
ctx.arc(x1 + radius1, y1 + radius1, radius1, Math.PI, -Math.PI / 2);
|
||||
ctx.closePath();
|
||||
ctx.setFillStyle('#ffffff')
|
||||
ctx.fill();
|
||||
ctx.setStrokeStyle('#ffffff')
|
||||
ctx.stroke();
|
||||
// 设置背景色2
|
||||
const x2 = 2;
|
||||
const y2 = 2;
|
||||
const width2 = parseInt(this.posterWidth - 4);
|
||||
const height2 = parseInt(this.posterHeight - 4);
|
||||
const radius2 = parseInt(this.posterWidth * (20 / 311));
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x2 + radius2, y2);
|
||||
ctx.lineTo(x2 + width2 - radius2, y2);
|
||||
ctx.arc(x2 + width2 - radius2, y2 + radius2, radius2, -Math.PI / 2, 0);
|
||||
ctx.lineTo(x2 + width2, y2 + height2 - radius2);
|
||||
ctx.arc(x2 + width2 - radius2, y2 + height2 - radius2, radius2, 0, Math.PI / 2);
|
||||
ctx.lineTo(x2 + radius2, y2 + height2);
|
||||
ctx.arc(x2 + radius2, y2 + height2 - radius2, radius2, Math.PI / 2, Math.PI);
|
||||
ctx.lineTo(x2, y2 + radius2);
|
||||
ctx.arc(x2 + radius2, y2 + radius2, radius2, Math.PI, -Math.PI / 2);
|
||||
ctx.closePath();
|
||||
ctx.setFillStyle(this.$util.hexToRgb(this.themeColor, .1))
|
||||
ctx.fill();
|
||||
ctx.setStrokeStyle('rgba(255, 255, 255, 0)')
|
||||
ctx.stroke();
|
||||
// 设置背景色3
|
||||
const x3 = parseInt(this.posterWidth * (16 / 311));
|
||||
const y3 = parseInt(this.posterWidth * (64 / 311));
|
||||
const width3 = parseInt(this.posterWidth - this.posterWidth * (32 / 311));
|
||||
const height3 = parseInt(this.posterWidth * (228 / 311));
|
||||
const radius3 = parseInt(this.posterWidth * (10 / 311));
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x3 + radius3, y3);
|
||||
ctx.lineTo(x3 + width3 - radius3, y3);
|
||||
ctx.arc(x3 + width3 - radius3, y3 + radius3, radius3, -Math.PI / 2, 0);
|
||||
ctx.lineTo(x3 + width3, y3 + height3 - radius3);
|
||||
ctx.arc(x3 + width3 - radius3, y3 + height3 - radius3, radius3, 0, Math.PI / 2);
|
||||
ctx.lineTo(x3 + radius3, y3 + height3);
|
||||
ctx.arc(x3 + radius3, y3 + height3 - radius3, radius3, Math.PI / 2, Math.PI);
|
||||
ctx.lineTo(x3, y3 + radius3);
|
||||
ctx.arc(x3 + radius3, y3 + radius3, radius3, Math.PI, -Math.PI / 2);
|
||||
ctx.closePath();
|
||||
const grd2 = ctx.createLinearGradient(0, 0, 0, parseInt(this.posterWidth * (321 / 311)))
|
||||
grd2.addColorStop(0, "#ffffff")
|
||||
grd2.addColorStop(1, "rgba(255, 255, 255, 0.4)")
|
||||
ctx.setFillStyle(grd2)
|
||||
ctx.fill();
|
||||
ctx.setStrokeStyle('rgba(255, 255, 255, 0)')
|
||||
ctx.stroke();
|
||||
// 创建参会凭证
|
||||
await createPoster(ctx, [{
|
||||
type: "text",
|
||||
text: "活动参会凭证",
|
||||
config: {
|
||||
x: parseInt(this.posterWidth / 2),
|
||||
y: parseInt(this.posterWidth * (36 / 311)),
|
||||
color: this.themeColor,
|
||||
font: `bold ${parseInt(this.posterWidth * (24 / 311))}px sans-serif`,
|
||||
textAlign: "center",
|
||||
lineHeight: parseInt(this.posterWidth * (28 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
url: this.posterAvatar,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (32 / 311)),
|
||||
y: parseInt(this.posterWidth * (80 / 311)),
|
||||
w: parseInt(this.posterWidth * (68 / 311)),
|
||||
h: parseInt(this.posterWidth * (68 / 311)),
|
||||
r: parseInt(this.posterWidth * (6 / 248))
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: this.posterInfo.member_name,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (108 / 311)),
|
||||
y: parseInt(this.posterWidth * (92 / 311)),
|
||||
color: "#5A5B6E",
|
||||
font: `bold ${parseInt(this.posterWidth * (18 / 311))}px sans-serif`,
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (177 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: this.posterInfo.mobile,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (108 / 311)),
|
||||
y: parseInt(this.posterWidth * (118 / 311)),
|
||||
color: "#5A5B6E",
|
||||
fontSize: parseInt(this.posterWidth * (12 / 311)).toString(),
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (177 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: this.posterInfo.member_level_name,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (108 / 311)),
|
||||
y: parseInt(this.posterWidth * (142 / 311)),
|
||||
color: "#5A5B6E",
|
||||
fontSize: parseInt(this.posterWidth * (12 / 311)).toString(),
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (177 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "活动",
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (32 / 311)),
|
||||
y: parseInt(this.posterWidth * (172 / 311)),
|
||||
color: "#5A5B6E",
|
||||
font: `bold ${parseInt(this.posterWidth * (14 / 311))}px sans-serif`,
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (247 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: this.posterInfo.activity_name,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (32 / 311)),
|
||||
y: parseInt(this.posterWidth * (196 / 311)),
|
||||
color: this.themeColor,
|
||||
fontSize: parseInt(this.posterWidth * (14 / 311)).toString(),
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (247 / 311)),
|
||||
wrap: true,
|
||||
lineNumber: 2,
|
||||
lineHeight: parseInt(this.posterWidth * (18 / 311)),
|
||||
isVerticalCenter: false
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "地址",
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (32 / 311)),
|
||||
y: parseInt(this.posterWidth * (235 / 311)),
|
||||
color: "#5A5B6E",
|
||||
font: `bold ${parseInt(this.posterWidth * (14 / 311))}px sans-serif`,
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (247 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: this.posterInfo.address,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (32 / 311)),
|
||||
y: parseInt(this.posterWidth * (259 / 311)),
|
||||
color: this.themeColor,
|
||||
fontSize: parseInt(this.posterWidth * (14 / 311)).toString(),
|
||||
textAlign: "left",
|
||||
maxWidth: parseInt(this.posterWidth * (247 / 311)),
|
||||
wrap: true,
|
||||
lineNumber: 2,
|
||||
lineHeight: parseInt(this.posterWidth * (18 / 311)),
|
||||
isVerticalCenter: false
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
url: this.posterCode,
|
||||
config: {
|
||||
x: parseInt(this.posterWidth * (106 / 311)),
|
||||
y: parseInt(this.posterWidth * (308 / 311)),
|
||||
w: parseInt(this.posterWidth * (100 / 311)),
|
||||
h: parseInt(this.posterWidth * (100 / 311)),
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "参会时，请出示二维码进行核销",
|
||||
config: {
|
||||
x: parseInt(this.posterWidth / 2),
|
||||
y: parseInt(this.posterWidth * (428 / 311)),
|
||||
color: "#5A5B6E",
|
||||
fontSize: parseInt(this.posterWidth * (14 / 311)).toString(),
|
||||
textAlign: "center",
|
||||
lineHeight: parseInt(this.posterWidth * (24 / 311)),
|
||||
},
|
||||
},
|
||||
])
|
||||
const imagePath = await canvasToTempFilePath("myCanvas", this);
|
||||
this.posterPath = imagePath;
|
||||
this.$refs.popupModal.open()
|
||||
uni.hideLoading()
|
||||
},
|
||||
// 保存参会凭证
|
||||
saveImage() {
|
||||
uni.authorize({
|
||||
scope: 'scope.writePhotosAlbum',
|
||||
success: () => {
|
||||
uni.getImageInfo({
|
||||
src: this.posterPath,
|
||||
success: (img) => {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: img.path,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success",
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(err);
|
||||
},
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(err)
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: () => {
|
||||
uni.showModal({
|
||||
title: '图片保存失败',
|
||||
content: '请确认是否已开启授权',
|
||||
confirmText: '开启授权',
|
||||
confirmColor: this.themeColor,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.openSetting({
|
||||
success: (setting) => {
|
||||
if (setting.authSetting["scope.writePhotosAlbum"]) {
|
||||
uni.showToast({
|
||||
title: '授权成功，请重新保存',
|
||||
icon: "none"
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请确定已打开保存权限',
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变页面滚动状态
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-activity-poster {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.poster-canvas {
|
||||
position: fixed;
|
||||
top: 100vw;
|
||||
left: 100vh;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.poster-popup {
|
||||
.popup-close {
|
||||
width: 100%;
|
||||
margin-top: -112rpx;
|
||||
margin-bottom: 32rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
.image {
|
||||
width: 80vw;
|
||||
height: 65vh;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-btn {
|
||||
margin-top: 32rpx;
|
||||
width: 336rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 26rpx 32rpx;
|
||||
border-radius: 16rpx;
|
||||
color: #FFFFFF;
|
||||
background: var(--theme-color);
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
112
pages/component/article/index.vue
Normal file
112
pages/component/article/index.vue
Normal file
@@ -0,0 +1,112 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-平台动态 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-article">
|
||||
<view class="article-item flex" :class="{special: showType == 1}" v-for="item in showData" :key="item.id" @click="toDetails(item)">
|
||||
<image class="item-image" :src="item.image" mode="aspectFill"></image>
|
||||
<view class="item-box flex-item flex-direction-column justify-content-between">
|
||||
<view class="box-title text-ellipsis-more">{{item.title}}</view>
|
||||
<view class="box-bottom flex justify-content-between align-items-center">
|
||||
<view class="bottom-view flex align-items-center">
|
||||
<image class="icon" src="/static/see.png" mode="aspectFit"></image>
|
||||
<text class="number">{{item.read_num}}</text>
|
||||
</view>
|
||||
<view class="bottom-time">{{item.createtime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "articleIndex",
|
||||
props: ["showData", "showType", "showTitle"],
|
||||
methods: {
|
||||
// 跳转详情
|
||||
toDetails(item) {
|
||||
if (item.type == 2) {
|
||||
this.$util.toPage({
|
||||
mode: 4,
|
||||
path: item.link,
|
||||
})
|
||||
this.$util.request("main.article.updateReadNum", { id: item.id })
|
||||
} else {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pages/article/details?id=${item.id}&title=${encodeURIComponent(this.showTitle || "")}`
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-article {
|
||||
.article-item {
|
||||
margin-top: 32rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
padding: 32rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&.special {
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.item-image {
|
||||
width: 220rpx;
|
||||
height: 192rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.item-box {
|
||||
margin-left: 16rpx;
|
||||
|
||||
.box-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.box-bottom {
|
||||
.bottom-view {
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.number {
|
||||
margin-left: 8rpx;
|
||||
color: #8D929C;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-time {
|
||||
color: #8D929C;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
183
pages/component/carousel/carousel.vue
Normal file
183
pages/component/carousel/carousel.vue
Normal file
@@ -0,0 +1,183 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-轮播图 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-carousel" :style="{height: height}">
|
||||
<swiper class="carousel-swiper" :style="{'border-radius': radius}" autoplay circular :interval="4000" :duration="800" @change="imgChange">
|
||||
<swiper-item v-for="(item, index) in showData" :key="index">
|
||||
<view class="swiper-item" :style="{'border-radius': radius}" @click="toDetails(index)">
|
||||
<image class="item-thumb" :src="item.image || item" mode="aspectFill"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="stringifyToParse(item.content).appid" :path="stringifyToParse(item.content).path" v-if="item.jump_type == 4">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="carousel-dots" :style="{right: right, bottom: bottom, '--theme-color': themeColor}">
|
||||
<view class="dots-item" :class="{active: imgIndex == index}" v-for="(item, index) in showData" :key="index"></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "carouselIndex",
|
||||
props: {
|
||||
// 组件内容
|
||||
showData: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// 组件高度
|
||||
height: {
|
||||
type: String,
|
||||
default: "334rpx",
|
||||
},
|
||||
// 组件圆角
|
||||
radius: {
|
||||
type: String,
|
||||
default: "16rpx",
|
||||
},
|
||||
// 指示点位置
|
||||
right: {
|
||||
type: String,
|
||||
default: "16rpx",
|
||||
},
|
||||
// 指示点距底部距离
|
||||
bottom: {
|
||||
type: String,
|
||||
default: "16rpx",
|
||||
},
|
||||
// 组件类型 1.普通轮播图，2.商城轮播图
|
||||
showType: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgIndex: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// JSON字符串转对象
|
||||
stringifyToParse(str) {
|
||||
try {
|
||||
return JSON.parse(str)
|
||||
} catch (e) {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 轮播图切换
|
||||
imgChange(e) {
|
||||
this.imgIndex = e.detail.current
|
||||
},
|
||||
// 跳转页面
|
||||
toDetails(index) {
|
||||
if (this.showData[index].jump_type == 1) {
|
||||
// 图文
|
||||
uni.navigateTo({
|
||||
url: `/pages/webview/imageText?type=${this.showType == 2 ? 3 : 1}&id=${this.showData[index].id}`
|
||||
})
|
||||
} else if (this.showData[index].jump_type == 2) {
|
||||
// 内部页面
|
||||
this.$util.toPage({
|
||||
path: this.showData[index].content,
|
||||
mode: 1,
|
||||
})
|
||||
} else if (this.showData[index].jump_type == 3) {
|
||||
// 外部链接
|
||||
this.$util.toPage({
|
||||
path: this.showData[index].content,
|
||||
mode: 4,
|
||||
})
|
||||
} else if (this.showData[index].jump_type == 4) {
|
||||
// 小程序
|
||||
this.$util.toPage({
|
||||
appId: JSON.parse(this.showData[index].content).appid,
|
||||
path: JSON.parse(this.showData[index].content).path,
|
||||
mode: 5,
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-carousel {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
.carousel-swiper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.swiper-item {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.item-thumb {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-dots {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
|
||||
.dots-item {
|
||||
width: 24rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 8rpx;
|
||||
background: #FFFFFF;
|
||||
margin-right: 4rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
161
pages/component/chains/index.vue
Normal file
161
pages/component/chains/index.vue
Normal file
@@ -0,0 +1,161 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-接龙列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-chains">
|
||||
<view class="chains-item" :class="{'chains-list-item': showType == 1}" v-for="item in showData" :key="item.id" @click="toDetails(item)">
|
||||
<view class="item-title text-ellipsis">{{item.name}}</view>
|
||||
<view class="item-tag flex justify-content-between">
|
||||
<view class="tag-box flex">
|
||||
<text style="margin-left: 0;">{{item.expire_time}}</text>
|
||||
<text v-if="item.type == 1">自由接龙</text>
|
||||
<text v-else>限定接龙</text>
|
||||
</view>
|
||||
<view class="tag-box flex">
|
||||
<text>浏览{{item.page_view}}</text>
|
||||
<text>参与{{item.part_total}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-btn flex align-items-center">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button open-type="share" class="btn-box clear flex align-items-center" @click.stop="setShareData(item)">
|
||||
<view class="icon" :style="{'background-image': 'url('+ iconInvite +')'}" v-if="iconInvite"></view>
|
||||
<text class="text">邀请填写</text>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<view class="btn-box flex align-items-center">
|
||||
<view class="icon" :style="{'background-image': 'url('+ iconInvite +')'}" v-if="iconInvite"></view>
|
||||
<text class="text">填写接龙</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="btn-line"></view>
|
||||
<view class="btn-box justify-content-end flex align-items-center" @click.stop="onContact(item.mobile)">
|
||||
<view class="icon" :style="{'background-image': 'url('+ iconPhone +')'}" v-if="iconPhone"></view>
|
||||
<text class="text">联系电话</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "chainsIndex",
|
||||
props: ["showData", "showType"],
|
||||
computed: {
|
||||
...mapState({
|
||||
jielongImg: state => state.app.jielongImg,
|
||||
themeColor: state => state.app.themeColor,
|
||||
iconInvite: state => {
|
||||
return svgData.svgToUrl("invite", state.app.themeColor)
|
||||
},
|
||||
iconPhone: state => {
|
||||
return svgData.svgToUrl("phone", state.app.themeColor)
|
||||
},
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 设置分享数据
|
||||
setShareData(item) {
|
||||
this.$emit('setShareData', {
|
||||
title: item.name,
|
||||
path: '/pagesTools/sequence/details?id=' + item.id,
|
||||
imageUrl: this.jielongImg,
|
||||
})
|
||||
},
|
||||
// 去详情
|
||||
toDetails(item) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesTools/sequence/details?id=" + item.id
|
||||
})
|
||||
},
|
||||
// 联系电话
|
||||
onContact(phone) {
|
||||
this.$util.toPage({
|
||||
mode: 6,
|
||||
phone: phone,
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-chains {
|
||||
.chains-item {
|
||||
margin-top: 32rpx;
|
||||
|
||||
&.chains-list-item {
|
||||
padding: 32rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.item-tag {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.tag-box {
|
||||
text {
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-btn {
|
||||
margin-top: 32rpx;
|
||||
border-top: 1rpx solid #E8E8E8;
|
||||
padding-top: 32rpx;
|
||||
|
||||
.btn-box {
|
||||
flex: 1;
|
||||
padding: 0 48rpx;
|
||||
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
background-size: 32rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 8rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-line {
|
||||
width: 0;
|
||||
height: 32rpx;
|
||||
border-left: 1rpx solid #E8E8E8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
481
pages/component/demand/index.vue
Normal file
481
pages/component/demand/index.vue
Normal file
@@ -0,0 +1,481 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-供需列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-demand" :style="{'--theme-color': themeColor}">
|
||||
<view class="demand-item" v-for="item in showData" :key="item.id" @click="toDetails(item.id)">
|
||||
<view class="item-top">
|
||||
<view class="top-order flex align-items-center" v-if="showType == 2">
|
||||
<view class="order-number flex-item">编号：{{item.number}}</view>
|
||||
<view class="order-status">
|
||||
<view class="status-label" style="color: #FF9100;" v-if="item.state == 1">审核中</view>
|
||||
<view class="status-label" :style="{ color: themeColor }" v-else-if="item.state == 2">发布中</view>
|
||||
<view class="status-label" style="color: #FF626E;" v-else-if="item.state == 3">已驳回</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="top-info flex align-items-center" v-else>
|
||||
<image class="info-avatar" :src="item.member.avatar" mode="aspectFill"></image>
|
||||
<view class="info-box flex-item">
|
||||
<view class="title text-ellipsis">{{ item.member.name }}</view>
|
||||
<view class="subtitle text-ellipsis">{{ item.member.level_name }} | {{ item.time }}</view>
|
||||
</view>
|
||||
<view class="info-btn" @click.stop="onContact(item.member.mobile)">联系TA</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-center">
|
||||
<view class="center-title text-ellipsis">{{ item.title }}</view>
|
||||
<view class="center-content text-ellipsis-more">{{ item.content }}</view>
|
||||
<view class="center-image" :class="{'special-image': (item.images.length < 3 || item.images.length === 4)}" v-if="item.images.length">
|
||||
<view class="image-box" v-for="(img, num) in item.images" :key="num" @click.stop="previewImage(item.images, num)">
|
||||
<image class="image" :src="img" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-bottom">
|
||||
<view class="bottom-order" v-if="showType == 2">
|
||||
<view class="order-box flex justify-content-between align-items-center" v-if="item.address || item.page_view">
|
||||
<view class="box-label flex-item">
|
||||
<view class="label-box inline-flex align-items-center" v-if="item.address">
|
||||
<view class="box-icon" :style="{'background-image': 'url('+ iconAddress +')'}" v-if="iconAddress"></view>
|
||||
<text class="box-text flex-item text-ellipsis">{{item.address}}</text>
|
||||
<view class="box-bg"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="box-btn flex align-items-center">
|
||||
<image class="icon" src="/static/see.png" mode="aspectFit"></image>
|
||||
<text class="text">{{ item.page_view }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-btn flex justify-content-end">
|
||||
<view class="btn" style="background: #FFB656;" @click.stop="handleEdit(item.id)">修改</view>
|
||||
<view class="btn" style="background: #FF626E;" @click.stop="handleDelete(item.id)">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom-info flex justify-content-between align-items-center" v-else>
|
||||
<view class="info-label flex-item">
|
||||
<view class="label-box inline-flex align-items-center" v-if="item.address">
|
||||
<view class="box-icon" :style="{'background-image': 'url('+ iconAddress +')'}" v-if="iconAddress"></view>
|
||||
<text class="box-text flex-item text-ellipsis">{{item.address}}</text>
|
||||
<view class="box-bg"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-other flex align-items-center">
|
||||
<view class="other-item flex align-items-center">
|
||||
<image class="icon" src="/static/see.png" mode="aspectFit"></image>
|
||||
<text class="text">{{ item.page_view }}</text>
|
||||
</view>
|
||||
<button open-type="share" class="other-item clear flex align-items-center" @click.stop="setShareData(item)">
|
||||
<image class="icon" src="/static/share.png" mode="aspectFit"></image>
|
||||
<text class="text">分享</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "componentDemand",
|
||||
props: ["showData", "showType"],
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
iconAddress: state => {
|
||||
return svgData.svgToUrl("address", state.app.themeColor)
|
||||
},
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 跳转详情
|
||||
toDetails(id) {
|
||||
if (this.showType == 2) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pagesDemand/demand/publish?id=${id}`
|
||||
})
|
||||
} else {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pagesDemand/demand/details?id=${id}`
|
||||
})
|
||||
}
|
||||
},
|
||||
// 联系ta
|
||||
onContact(phone) {
|
||||
// 获取商圈限制
|
||||
this.$util.request("demand.businessLimit", {
|
||||
type: 2
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
if (res.data.show_status == 1) {
|
||||
this.$util.toPage({
|
||||
mode: 6,
|
||||
phone: phone,
|
||||
})
|
||||
} else {
|
||||
if (uni.getStorageSync("token")) {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "联系电话需成为会员后可拨打!",
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "去加入",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.switchTab({
|
||||
url: "/pages/mine/index"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/index",
|
||||
animationType: "fade-in"
|
||||
})
|
||||
}
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取商圈分类', error)
|
||||
})
|
||||
},
|
||||
// 预览图片
|
||||
previewImage(list, index) {
|
||||
uni.previewImage({
|
||||
urls: list,
|
||||
current: index
|
||||
});
|
||||
},
|
||||
// 设置分享数据
|
||||
setShareData(item) {
|
||||
this.$emit('setShareData', {
|
||||
title: item.title,
|
||||
path: '/pagesDemand/demand/details?id=' + item.id,
|
||||
imageUrl: item.images.length ? item.images[0] : item.member.avatar,
|
||||
})
|
||||
},
|
||||
// 修改供需
|
||||
handleEdit(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesDemand/demand/edit?id=" + id
|
||||
})
|
||||
},
|
||||
// 删除供需
|
||||
handleDelete(id) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认删除此条吗?',
|
||||
confirmText: '确认删除',
|
||||
confirmColor: '#E50002',
|
||||
cancelText: '我再想想',
|
||||
cancelColor: '#999999',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.$util.request("demand.businessDel", {
|
||||
id: id,
|
||||
}).then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 1) {
|
||||
uni.showToast({
|
||||
title: "删除成功"
|
||||
})
|
||||
this.$emit("onReset")
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('删除发布', error)
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-demand {
|
||||
.demand-item {
|
||||
margin-top: 32rpx;
|
||||
padding: 32rpx 32rpx 24rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-top {
|
||||
.top-info {
|
||||
.info-avatar {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
margin-left: 24rpx;
|
||||
|
||||
.title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
margin-top: 12rpx;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.info-btn {
|
||||
margin-left: 24rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
background: var(--theme-color);
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.top-order {
|
||||
padding-bottom: 32rpx;
|
||||
border-bottom: 1px solid #E4E4E4;
|
||||
|
||||
.order-number {
|
||||
color: #979797;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.order-status {
|
||||
.status-label {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-center {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.center-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.center-content {
|
||||
margin-top: 24rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.center-image {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 16rpx;
|
||||
column-gap: 2%;
|
||||
row-gap: 14rpx;
|
||||
|
||||
.image-box {
|
||||
width: 32%;
|
||||
height: 0;
|
||||
padding-top: 32%;
|
||||
position: relative;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.image {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.special-image {
|
||||
justify-content: space-between;
|
||||
column-gap: 0;
|
||||
|
||||
.image-box {
|
||||
width: calc(50% - 8rpx);
|
||||
padding-top: calc(50% - 8rpx);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-bottom {
|
||||
.bottom-info {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.info-label {
|
||||
max-width: 280rpx;
|
||||
|
||||
.label-box {
|
||||
max-width: 100%;
|
||||
padding: 6rpx 18rpx 6rpx 8rpx;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.box-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: var(--theme-color);
|
||||
z-index: -1;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.box-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background-size: 24rpx;
|
||||
}
|
||||
|
||||
.box-text {
|
||||
margin-left: 8rpx;
|
||||
color: var(--theme-color);
|
||||
font-size: 20rpx;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.info-other {
|
||||
.other-item {
|
||||
margin-left: 32rpx;
|
||||
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 8rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-order {
|
||||
.order-box {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.box-label {
|
||||
max-width: 280rpx;
|
||||
|
||||
.label-box {
|
||||
max-width: 100%;
|
||||
padding: 6rpx 18rpx 6rpx 8rpx;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.box-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: var(--theme-color);
|
||||
z-index: -1;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.box-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background-size: 24rpx;
|
||||
}
|
||||
|
||||
.box-text {
|
||||
margin-left: 8rpx;
|
||||
color: var(--theme-color);
|
||||
font-size: 20rpx;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-btn {
|
||||
margin-left: 32rpx;
|
||||
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 8rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-btn {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.btn {
|
||||
padding: 16rpx 32rpx;
|
||||
border-radius: 8rpx;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
227
pages/component/diy/activityDiy.vue
Normal file
227
pages/component/diy/activityDiy.vue
Normal file
@@ -0,0 +1,227 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-商会活动 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-activity" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="activity-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="activity-list" :style="{rowGap: itemSpace}" v-if="activityList.length">
|
||||
<view class="list-item flex" v-for="item in activityList" :key="item.id" @click="toDetails(item.id, item.activity_auth)">
|
||||
<image class="item-image" :src="item.images" mode="aspectFill" v-if="showParams.showImg" :style="{ width: imgWidth, height: imgHeight, borderRadius: borderRadius}"></image>
|
||||
<view class="item-info flex-item" :style="{height: imgHeight}">
|
||||
<view class="info-title text-ellipsis" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
|
||||
<view class="info-tag flex align-items-center">
|
||||
<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconTime +')'}" v-if="showStyle.showIcon && iconTime"></view>
|
||||
<text class="text flex-item text-ellipsis" :style="{fontSize: contentSize}">{{item.start_time}} | {{item.week}}</text>
|
||||
</view>
|
||||
<view class="info-tag flex align-items-center" v-if="item.organizing_method == 1">
|
||||
<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconNetwork +')'}" v-if="showStyle.showIcon && iconNetwork"></view>
|
||||
<text class="text flex-item text-ellipsis" :style="{fontSize: contentSize}">报名成功后查看</text>
|
||||
</view>
|
||||
<view class="info-tag flex align-items-center" v-else-if="item.organizing_method == 2">
|
||||
<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconLocation +')'}" v-if="showStyle.showIcon && iconLocation"></view>
|
||||
<text class="text flex-item text-ellipsis" :style="{fontSize: contentSize}">{{item.address}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "activityDiy",
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
// 活动列表
|
||||
activityList: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor
|
||||
}),
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
imgWidth() {
|
||||
return uni.upx2px(this.showStyle.imgWidth * 2) + 'px';
|
||||
},
|
||||
imgHeight() {
|
||||
return uni.upx2px(this.showStyle.imgHeight * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
iconTime() {
|
||||
return svgData.svgToUrl("time", this.showStyle.iconColor)
|
||||
},
|
||||
iconLocation() {
|
||||
return svgData.svgToUrl("location", this.showStyle.iconColor)
|
||||
},
|
||||
iconNetwork() {
|
||||
return svgData.svgToUrl("network", this.showStyle.iconColor)
|
||||
},
|
||||
contentSize() {
|
||||
return uni.upx2px(this.showStyle.contentSize * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getActivityList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取活动列表
|
||||
getActivityList() {
|
||||
this.$util.request("activity.list", {
|
||||
page: 1,
|
||||
limit: this.showParams.count
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.activityList = res.data.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取活动列表 ', error)
|
||||
})
|
||||
},
|
||||
// 跳转详情
|
||||
toDetails(id, state) {
|
||||
if (state == 2) {
|
||||
if (!uni.getStorageSync("token")) {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "该活动为会员专属，请登录后查看",
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "前往登录",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/index"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/index/details?id=" + id
|
||||
})
|
||||
} else {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/index/details?id=" + id
|
||||
})
|
||||
}
|
||||
},
|
||||
// 跳转活动列表
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesActivity/index/index"
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-activity {
|
||||
.activity-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.activity-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.list-item {
|
||||
.item-image {
|
||||
margin-right: 32rpx;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.info-title {
|
||||
color: #5A5B6E;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.info-tag {
|
||||
.icon {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #8D929C;
|
||||
line-height: 1.3;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
299
pages/component/diy/albumDiy.vue
Normal file
299
pages/component/diy/albumDiy.vue
Normal file
@@ -0,0 +1,299 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-商会相册 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-album" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="album-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="album-list" :style="{rowGap: itemSpace}" v-if="albumList.length">
|
||||
<view class="list-item flex" v-for="item in albumList" :key="item.id" @click="toDetails(item.id)">
|
||||
<view class="item-timeline">
|
||||
<view class="timeline-time" v-if="item.showTime.month && item.showTime.day">
|
||||
<text :style="{fontSize: timeSize}">{{item.showTime.month}}/</text>
|
||||
<text :style="{fontSize: timeSizeSmall}">{{item.showTime.day}}</text>
|
||||
</view>
|
||||
<view class="timeline-time" v-else>{{item.release_date}}</view>
|
||||
<view class="timeline-point" :style="{background: showStyle.iconColor}"></view>
|
||||
<view class="timeline-line"></view>
|
||||
</view>
|
||||
<view class="item-content flex-item">
|
||||
<view class="content-title text-ellipsis-more" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
|
||||
<view class="content-box" v-if="item.files">
|
||||
<block v-if="item.type == 1">
|
||||
<view class="box-single" v-if="item.showImages.length == 1">
|
||||
<image class="image" :src="item.showImages[0]" :style="{borderRadius: borderRadius}" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="box-multiple" v-else-if="item.showImages.length">
|
||||
<view class="multiple-image" v-for="(img, index) in item.showImages" :key="index">
|
||||
<image class="image" :src="img" :style="{borderRadius: borderRadius}" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view class="box-cover" v-else-if="item.type == 2">
|
||||
<image class="cover-image" :src="item.image" mode="aspectFill"></image>
|
||||
<image class="cover-play" src="/static/play.png" mode="aspectFit"></image>
|
||||
<view class="cover-mask"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "albumDiy",
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
// 相册列表
|
||||
albumList: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
timeSize() {
|
||||
return uni.upx2px(this.showStyle.timeSize * 2) + 'px';
|
||||
},
|
||||
timeSizeSmall() {
|
||||
return uni.upx2px((this.showStyle.timeSize - 4) * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getAlbumList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取商会相册
|
||||
getAlbumList() {
|
||||
this.$util.request("album.albumDiyList", {
|
||||
limit: this.showParams.count,
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.albumList = res.data
|
||||
for (let i in this.albumList) {
|
||||
if (this.albumList[i].release_date) {
|
||||
this.albumList[i].showTime = this.cutDate(this.albumList[i].release_date)
|
||||
}
|
||||
if (this.albumList[i].type == 1 && this.albumList[i].files) {
|
||||
if (typeof(this.albumList[i].files) == "string") {
|
||||
this.albumList[i].showImages = this.albumList[i].files.split(",")
|
||||
} else {
|
||||
this.albumList[i].showImages = this.albumList[i].files
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取相册列表', error)
|
||||
})
|
||||
},
|
||||
// 截取日期
|
||||
cutDate(time) {
|
||||
let parts = time.split('/');
|
||||
let result = {}
|
||||
if (parts && parts.length == 3) {
|
||||
result = {
|
||||
month: parts[1],
|
||||
day: parts[2]
|
||||
};
|
||||
}
|
||||
return result
|
||||
},
|
||||
// 跳转相册详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesTools/album/details?id=" + id
|
||||
})
|
||||
},
|
||||
// 跳转相册列表
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesTools/album/index"
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-album {
|
||||
.album-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.album-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.list-item {
|
||||
.item-timeline {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.timeline-time {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.timeline-point {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-radius: 4rpx;
|
||||
background: var(--theme-color);
|
||||
}
|
||||
|
||||
.timeline-line {
|
||||
width: 2rpx;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
background: #F0F0F0;
|
||||
}
|
||||
}
|
||||
|
||||
.item-content {
|
||||
margin-left: 16rpx;
|
||||
position: relative;
|
||||
|
||||
.content-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.content-box {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.box-single {
|
||||
width: 100%;
|
||||
height: 240rpx;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.box-multiple {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
column-gap: 2%;
|
||||
row-gap: 16rpx;
|
||||
|
||||
.multiple-image {
|
||||
width: 32%;
|
||||
height: 0;
|
||||
padding-top: 32%;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.image {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box-cover {
|
||||
width: 100%;
|
||||
height: 240rpx;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.cover-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.cover-play {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.cover-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
231
pages/component/diy/articleDiy.vue
Normal file
231
pages/component/diy/articleDiy.vue
Normal file
@@ -0,0 +1,231 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-平台动态 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-article" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="article-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="article-list" :style="{rowGap: itemSpace }" v-if="articleList.length">
|
||||
<view class="list-item" :class="{'flex-row-reverse': showStyle.imgFloat == 'right'}" v-for="(item,index) in articleList" :key="index" @click="toDetails(item)">
|
||||
<view class="item-left" v-if="showParams.showImg">
|
||||
<image mode="aspectFill" :src="item.image" :style="{ width: imgWidth, height: imgHeight, float: showStyle.imgFloat || 'left', borderRadius: borderRadius}"></image>
|
||||
</view>
|
||||
<view class="item-right" :style="{height: imgHeight}">
|
||||
<view class="right-title" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.title}}</view>
|
||||
<view class="right-group flex align-items-center">
|
||||
<view class="group-view flex align-items-center" v-if="showParams.showReadNum">
|
||||
<image class="icon" src="/static/see.png" mode="aspectFit" :style="{width: viewSize, height: viewSize}"></image>
|
||||
<text class="number" :style="{fontSize: dateSize}">{{item.read_num}}</text>
|
||||
</view>
|
||||
<view class="group-date flex-item" :style="{fontSize: dateSize, textAlign: (!showParams.showReadNum && showStyle.imgFloat == 'right') ? 'left' : 'right'}">{{item.createtime}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: 'articleDiy',
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
articleList: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
imgWidth() {
|
||||
return uni.upx2px(this.showStyle.imgWidth * 2) + 'px';
|
||||
},
|
||||
imgHeight() {
|
||||
return uni.upx2px(this.showStyle.imgHeight * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
dateSize() {
|
||||
return uni.upx2px(this.showStyle.dateSize * 2) + 'px';
|
||||
},
|
||||
viewSize() {
|
||||
return uni.upx2px((this.showStyle.dateSize + 4) * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getArticleList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取新闻列表
|
||||
getArticleList() {
|
||||
let catId = ""
|
||||
if (this.showParams.category) {
|
||||
catId = this.showParams.category
|
||||
} else if (this.showParams.link && this.showParams.link.type == "Article") {
|
||||
catId = this.showParams.link.path.split("?id=")[1]
|
||||
}
|
||||
this.$util.request("main.article.list", {
|
||||
page: 1,
|
||||
limit: this.showParams.count,
|
||||
cat_id: catId
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.articleList = res.data.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取新闻列表 ', error)
|
||||
})
|
||||
},
|
||||
// 跳转查看更多
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pages/article/index?id=${this.showParams.category}&title=${encodeURIComponent(this.showParams.titleText || "")}`
|
||||
})
|
||||
},
|
||||
// 跳转新闻详情
|
||||
toDetails(item) {
|
||||
if (item.type == 2) {
|
||||
this.$util.toPage({
|
||||
mode: 4,
|
||||
path: item.link,
|
||||
})
|
||||
this.$util.request("main.article.updateReadNum", { id: item.id })
|
||||
} else {
|
||||
var title = ""
|
||||
if (this.showTitle) title = this.showParams.titleText || ""
|
||||
else title = this.showParams.categoryName || ""
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pages/article/details?id=${item.id}&title=${title || ""}`
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-article {
|
||||
.article-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.article-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.list-item {
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 10px;
|
||||
|
||||
&.flex-row-reverse {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
.item-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
flex: 1;
|
||||
|
||||
.right-title {
|
||||
line-height: 1.3;
|
||||
color: #333;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
}
|
||||
|
||||
.right-group {
|
||||
margin-top: 16rpx;
|
||||
column-gap: 8px;
|
||||
|
||||
.group-view {
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.number {
|
||||
margin-left: 8rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 24rpx;
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
|
||||
.group-date {
|
||||
color: #5A5B6E;
|
||||
line-height: 1.2;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
30
pages/component/diy/blankDiy.vue
Normal file
30
pages/component/diy/blankDiy.vue
Normal file
@@ -0,0 +1,30 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-辅助空白 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-blank" :style="{height: height, background: showStyle.background, borderRadius: itemBorderRadius}"></view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'blankDiy',
|
||||
props: ['showStyle'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
height() {
|
||||
return uni.upx2px(this.showStyle.height * 2) + 'px';
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
147
pages/component/diy/carouselDiy.vue
Normal file
147
pages/component/diy/carouselDiy.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-图片轮播 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-carousel" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<swiper class="carousel-list" autoplay :interval="showParams.interval" :duration="500" circular @change='change' :previous-margin="showParams.type === 'card' ? '120rpx' : '0rpx'" :next-margin="showParams.type === 'card' ? '120rpx' : '0rpx'" :style="{height: height, marginTop:showParams.type === 'card' ? '20rpx' : '0rpx', borderRadius: borderRadius}">
|
||||
<swiper-item v-for="(item, index) in showData" :key='index'>
|
||||
<button class="list-item clear" :class="[showParams.type != 'card' ? '' : (current == index ? 'crown-active' : 'crown')]" open-type="contact" :style="{width: iconSize, height: iconSize}" v-if="item.link && item.link.type == 'Service'">
|
||||
<image class="item-img" :src="getImagePath(item.imgUrl)" :style="{ borderRadius: showParams.type === 'card' ? '10rpx' : '0rpx'}" mode="aspectFill" @click="onClick(item.link)"></image>
|
||||
</button>
|
||||
<view class="list-item" :class="[showParams.type != 'card' ? '' : (current == index ? 'crown-active' : 'crown')]" v-else>
|
||||
<image class="item-img" :src="getImagePath(item.imgUrl)" :style="{ borderRadius: showParams.type === 'card' ? '10rpx' : '0rpx'}" mode="aspectFill" @click="onClick(item.link)"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="carousel-dots flex" :style="{paddingBottom: paddingTop}">
|
||||
<view class="dots-item" :style="{background: current == i ? (showStyle.dotColor || themeColor) : '#ffffff'}" v-for="(d, i) in showData" :key='i'></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: 'carouselDiy',
|
||||
props: ['showStyle', 'showData', 'showParams', 'domain'],
|
||||
data() {
|
||||
return {
|
||||
current: 0,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
}),
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
height() {
|
||||
return uni.upx2px(this.showStyle.height * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 点击事件
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
// 改变事件
|
||||
change(event) {
|
||||
this.current = event.detail.current
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.diy-carousel {
|
||||
position: relative;
|
||||
|
||||
.carousel-list {
|
||||
overflow: hidden;
|
||||
|
||||
.list-item {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
transition: 1.2s;
|
||||
|
||||
&.crown {
|
||||
transform: scale(0.93, 0.85);
|
||||
}
|
||||
|
||||
&.crown-active {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.item-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-dots {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 24rpx;
|
||||
|
||||
.dots-item {
|
||||
width: 24rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 8rpx;
|
||||
background: #FFFFFF;
|
||||
margin-right: 4rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
299
pages/component/diy/chainsDiy.vue
Normal file
299
pages/component/diy/chainsDiy.vue
Normal file
@@ -0,0 +1,299 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-活动接龙 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-chains" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="chains-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="chains-list" :style="{rowGap: itemSpace}" v-if="chainsList.length">
|
||||
<view class="list-item" v-for="item in chainsList" :key="item.id" @click="toDetails(item.id, item.jielong_auth)">
|
||||
<view class="item-title text-ellipsis" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
|
||||
<view class="item-tag flex justify-content-between">
|
||||
<view class="tag-box flex" :style="{fontSize: contentSize}">
|
||||
<text style="margin-left: 0;">{{item.expire_time}}</text>
|
||||
<text v-if="item.type == 1">自由接龙</text>
|
||||
<text v-else>限定接龙</text>
|
||||
</view>
|
||||
<view class="tag-box flex" :style="{fontSize: contentSize}">
|
||||
<text>浏览{{item.page_view}}</text>
|
||||
<text>参与{{item.part_total}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-btn flex align-items-center">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button open-type="share" class="btn-box clear flex align-items-center" @click.stop="setShareData(item)">
|
||||
<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconInvite +')'}" v-if="showStyle.showIcon && iconInvite"></view>
|
||||
<text class="text" :style="{fontSize: btnSize}">邀请填写</text>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<view class="btn-box flex align-items-center">
|
||||
<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconInvite +')'}" v-if="showStyle.showIcon && iconInvite"></view>
|
||||
<text class="text" :style="{fontSize: btnSize}">填写接龙</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="btn-line"></view>
|
||||
<view class="btn-box justify-content-end flex align-items-center" @click.stop="onContact(item.mobile)">
|
||||
<view class="icon" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconPhone +')'}" v-if="showStyle.showIcon && iconPhone"></view>
|
||||
<text class="text" :style="{fontSize: btnSize}">电话</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "chainsDiy",
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
chainsList: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
jielongImg: state => state.app.jielongImg,
|
||||
}),
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
contentSize() {
|
||||
return uni.upx2px(this.showStyle.contentSize * 2) + 'px';
|
||||
},
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
btnSize() {
|
||||
return uni.upx2px(this.showStyle.btnSize * 2) + 'px';
|
||||
},
|
||||
iconInvite() {
|
||||
return svgData.svgToUrl("invite", this.showStyle.iconColor)
|
||||
},
|
||||
iconPhone() {
|
||||
return svgData.svgToUrl("phone", this.showStyle.iconColor)
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getChainsList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取活动接龙
|
||||
getChainsList() {
|
||||
this.$util.request("sequence.chainsList", {
|
||||
page: 1,
|
||||
limit: this.showParams.count,
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.chainsList = res.data.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取接龙列表', error)
|
||||
})
|
||||
},
|
||||
// 跳转接龙详情
|
||||
toDetails(id, state) {
|
||||
if (state == 2) {
|
||||
this.getMemberState(() => {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesTools/sequence/details?id=" + id
|
||||
})
|
||||
})
|
||||
} else {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesTools/sequence/details?id=" + id
|
||||
})
|
||||
}
|
||||
},
|
||||
// 获取会员状态
|
||||
getMemberState(fn) {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true,
|
||||
})
|
||||
this.$util.request("member.state").then(res => {
|
||||
uni.hideLoading()
|
||||
if (res.code == 1) {
|
||||
if (res.data.state.state == 6) {
|
||||
fn()
|
||||
} else if (res.data.state.state == -1) {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "此页面需成为会员后可查看！",
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "去加入",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/apply/index"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "此页面需成为会员后可查看！",
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "前往查看",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.switchTab({
|
||||
url: "/pages/mine/index"
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取会员状态 ', error)
|
||||
})
|
||||
},
|
||||
// 跳转接龙列表
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesTools/sequence/index"
|
||||
})
|
||||
},
|
||||
// 联系电话
|
||||
onContact(phone) {
|
||||
this.$util.toPage({
|
||||
mode: 6,
|
||||
phone: phone,
|
||||
})
|
||||
},
|
||||
// 设置分享数据
|
||||
setShareData(item) {
|
||||
this.$emit('setShareData', {
|
||||
title: item.name,
|
||||
path: '/pagesTools/sequence/details?id=' + item.id,
|
||||
imageUrl: this.jielongImg,
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-chains {
|
||||
.chains-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.chains-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.list-item {
|
||||
.item-title {
|
||||
color: #5A5B6E;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.item-tag {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.tag-box {
|
||||
text {
|
||||
color: #999999;
|
||||
line-height: 1.4;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-btn {
|
||||
margin-top: 32rpx;
|
||||
border-top: 1rpx solid #E8E8E8;
|
||||
padding-top: 32rpx;
|
||||
|
||||
.btn-box {
|
||||
flex: 1;
|
||||
padding: 0 48rpx;
|
||||
|
||||
.text {
|
||||
margin-left: 8rpx;
|
||||
color: #5A5B6E;
|
||||
line-height: 1.4;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-line {
|
||||
width: 0;
|
||||
height: 32rpx;
|
||||
border-left: 1rpx solid #E8E8E8;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
266
pages/component/diy/cubeDiy.vue
Normal file
266
pages/component/diy/cubeDiy.vue
Normal file
@@ -0,0 +1,266 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-图片魔方 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-cube" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<!-- 橱窗布局 -->
|
||||
<view class="cube-display" v-if="showStyle.layout == -1 ">
|
||||
<view class="display-left" :style="{width: showStyle.imgWidth + '%', paddingReft: itemSpace}" v-if="showStyle.imgFloat == 'left'">
|
||||
<button class="clear" open-type="contact" v-if="showData[0].link && showData[0].link.type == 'Service'">
|
||||
<image class="image" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image class="image" @click="onClick(showData[0].link)" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[0].link.appid" :path="showData[0].link.path" v-if="showData[0].link && showData[0].link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
<view class="display-right" :style="'width:' + (100 - showStyle.imgWidth) + '%; ' + (showStyle.imgFloat == 'right' ? ('padding-right:' + itemSpace) : ('padding-left:' + itemSpace))" v-if="showStyle.model == 1">
|
||||
<view class="right-1" v-if="showData.length >= 2" :style="{paddingBottom: itemSpace}">
|
||||
<button class="clear" open-type="contact" v-if="showData[1].link && showData[1].link.type == 'Service'">
|
||||
<image class="image" :src="getImagePath(showData[1].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image class="image" @click="onClick(showData[1].link)" :src="getImagePath(showData[1].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[1].link.appid" :path="showData[1].link.path" v-if="showData[1].link && showData[1].link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
<view class="right-2" :style="{paddingTop: itemSpace}">
|
||||
<view class="right-2-left" v-if="showData.length >= 3" :style="{paddingRight: itemSpace}">
|
||||
<button class="clear" open-type="contact" v-if="showData[2].link && showData[2].link.type == 'Service'">
|
||||
<image class="image" :src="getImagePath(showData[2].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image class="image" @click="onClick(showData[2].link)" :src="getImagePath(showData[2].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[2].link.appid" :path="showData[2].link.path" v-if="showData[2].link && showData[2].link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
<view class="right-2-right" v-if="showData.length >= 4" :style="{paddingLeft: itemSpace}">
|
||||
<button class="clear" open-type="contact" v-if="showData[3].link && showData[3].link.type == 'Service'">
|
||||
<image class="image" :src="getImagePath(showData[3].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image class="image" @click="onClick(showData[3].link)" :src="getImagePath(showData[3].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[3].link.appid" :path="showData[3].link.path" v-if="showData[3].link && showData[3].link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="display-right" :style="'width:' + (100 - showStyle.imgWidth) + '%; ' + (showStyle.imgFloat == 'right' ? ('padding-right:' + itemSpace) : ('padding-left:' + itemSpace))" v-else>
|
||||
<view class="right-3" :style="{margin: '-' + itemSpace + ' 0', height: `calc(100% + ${itemSpace} + ${itemSpace})`}">
|
||||
<view class="item" v-for="(img, num) in showData" :key="num" v-if="num > 0 && num < 4" :style="{height:`calc(100% / ${showData.length > 4 ? 3 : showData.length - 1})`, padding: itemSpace + ' 0'}">
|
||||
<button class="clear" open-type="contact" v-if="img.link && img.link.type == 'Service'">
|
||||
<image class="image" :src="getImagePath(img.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image class="image" @click="onClick(img.link)" :src="getImagePath(img.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="img.link.appid" :path="img.link.path" v-if="img.link && img.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="display-left" :style="{width: showStyle.imgWidth + '%', paddingLeft: itemSpace}" v-if="showStyle.imgFloat == 'right'">
|
||||
<button class="clear" open-type="contact" v-if="showData[0].link && showData[0].link.type == 'Service'">
|
||||
<image class="image" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image class="image" @click="onClick(showData[0].link)" :src="getImagePath(showData[0].imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="showData[0].link.appid" :path="showData[0].link.path" v-if="showData[0].link && showData[0].link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 分列布局 -->
|
||||
<view class="cube-list" :style="{margin: '-' + itemSpace}" v-else>
|
||||
<view class="list-item" :style="{width: `calc(100% / ${showStyle.layout})`, padding: itemSpace}" v-for="(item, index) in showData" :key="index">
|
||||
<button class="clear" open-type="contact" v-if="item.link && item.link.type == 'Service'">
|
||||
<image :src="getImagePath(item.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image :src="getImagePath(item.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}" @click="onClick(item.link)"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="diy-cube-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'cubeDiy',
|
||||
props: ['showStyle', 'showData', 'domain'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
height() {
|
||||
return uni.upx2px(this.showStyle.height * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 点击事件
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-cube {
|
||||
overflow: hidden;
|
||||
|
||||
.cube-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.list-item {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.cube-display {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.display-left {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.display-right {
|
||||
width: auto;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.right-1 {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.right-2 {
|
||||
width: 100%;
|
||||
height: 50%;
|
||||
display: flex;
|
||||
|
||||
.right-2-left {
|
||||
position: relative;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.right-2-right {
|
||||
position: relative;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.right-3 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.diy-cube-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
335
pages/component/diy/demandDiy.vue
Normal file
335
pages/component/diy/demandDiy.vue
Normal file
@@ -0,0 +1,335 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-会员供需 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-demand" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="demand-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="demand-list" :style="{rowGap: itemSpace }" v-if="demandList.length">
|
||||
<view class="list-item" v-for="(item, index) in demandList" :key="index" @click="toDetails(item.id)">
|
||||
<view class="item-top flex align-items-center">
|
||||
<image class="top-avatar" :src="item.member.avatar" mode="aspectFill"></image>
|
||||
<view class="top-info flex-item">
|
||||
<view class="info-title text-ellipsis">{{ item.member.name }}</view>
|
||||
<view class="info-subtitle text-ellipsis">{{ item.member.level_name }} | {{ item.time }}</view>
|
||||
</view>
|
||||
<view class="top-btn" @click.stop="onContact(item.member.mobile)" :style="{background: showStyle.btnColor, color: showStyle.btnTextColor}" v-if="showParams.showContact">联系TA</view>
|
||||
</view>
|
||||
<view class="item-center">
|
||||
<view class="center-title text-ellipsis" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{ item.title }}</view>
|
||||
<view class="center-content text-ellipsis-more" :style="{fontSize: contentSize}">{{ item.content }}</view>
|
||||
<view class="center-image" :class="{'special-image': (item.images.length < 3 || item.images.length === 4)}" v-if="item.images.length">
|
||||
<view class="image-box" v-for="(img, num) in item.images" :key="num" @click.stop="previewImage(item.images, num)">
|
||||
<image class="image" :src="img" mode="aspectFill"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-bottom flex justify-content-between align-items-center">
|
||||
<view class="bottom-label flex-item">
|
||||
<view class="label-box inline-flex align-items-center" v-if="item.address">
|
||||
<view class="box-icon" :style="{'background-image': 'url('+ iconAddress +')'}" v-if="iconAddress"></view>
|
||||
<text class="box-text flex-item text-ellipsis" :style="{color: showStyle.addressColor}">{{item.address}}</text>
|
||||
<view class="box-bg" :style="{background: showStyle.addressColor}"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom-other flex align-items-center">
|
||||
<view class="other-item flex align-items-center">
|
||||
<image class="icon" src="/static/see.png" mode="aspectFit"></image>
|
||||
<text class="text">{{ item.page_view }}</text>
|
||||
</view>
|
||||
<button open-type="share" class="other-item clear flex align-items-center" @click.stop="setShareData(item)">
|
||||
<image class="icon" src="/static/share.png" mode="aspectFit"></image>
|
||||
<text class="text">分享</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: 'demandDiy',
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
demandList: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
contentSize() {
|
||||
return uni.upx2px(this.showStyle.contentSize * 2) + 'px';
|
||||
},
|
||||
iconAddress() {
|
||||
return svgData.svgToUrl("address", this.showStyle.addressColor)
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getDemandList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取供需列表
|
||||
getDemandList() {
|
||||
this.$util.request("demand.businessDiyList", {
|
||||
limit: this.showParams.count,
|
||||
category_id: this.showParams.category || ""
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
let list = res.data || []
|
||||
list.forEach((el) => {
|
||||
el.images = this.splitImages(el.images)
|
||||
if (el.createtime) el.time = this.$util.getDateBeforeNow(el.createtime)
|
||||
});
|
||||
this.demandList = list;
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取供需列表 ', error)
|
||||
})
|
||||
},
|
||||
// 字符串转数组格式图片
|
||||
splitImages(images) {
|
||||
try {
|
||||
if (images) return images.split(',');
|
||||
else return []
|
||||
} catch (error) {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
// 跳转查看更多
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pages/demand/index`
|
||||
})
|
||||
},
|
||||
// 跳转供需详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pagesDemand/demand/details?id=${id}`
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-demand {
|
||||
.demand-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.demand-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.list-item {
|
||||
.item-top {
|
||||
.top-avatar {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.top-info {
|
||||
margin-left: 24rpx;
|
||||
|
||||
.info-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.info-subtitle {
|
||||
margin-top: 12rpx;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.top-btn {
|
||||
margin-left: 24rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-center {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.center-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.center-content {
|
||||
margin-top: 24rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.center-image {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 16rpx;
|
||||
column-gap: 2%;
|
||||
row-gap: 14rpx;
|
||||
|
||||
.image-box {
|
||||
width: 32%;
|
||||
height: 0;
|
||||
padding-top: 32%;
|
||||
position: relative;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.image {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.special-image {
|
||||
justify-content: space-between;
|
||||
column-gap: 0;
|
||||
|
||||
.image-box {
|
||||
width: calc(50% - 8rpx);
|
||||
padding-top: calc(50% - 8rpx);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-bottom {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.bottom-label {
|
||||
max-width: 280rpx;
|
||||
|
||||
.label-box {
|
||||
max-width: 100%;
|
||||
padding: 6rpx 18rpx 6rpx 8rpx;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border-radius: 8rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.box-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
opacity: 0.1;
|
||||
}
|
||||
|
||||
.box-icon {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background-size: 24rpx;
|
||||
}
|
||||
|
||||
.box-text {
|
||||
margin-left: 8rpx;
|
||||
font-size: 20rpx;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-other {
|
||||
.other-item {
|
||||
margin-left: 32rpx;
|
||||
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-left: 8rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
124
pages/component/diy/floatDiy.vue
Normal file
124
pages/component/diy/floatDiy.vue
Normal file
@@ -0,0 +1,124 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会与发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-悬浮按钮 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-float" :style="{right: right, bottom: bottom, opacity: showStyle.opacity / 100}">
|
||||
<block v-if="showParams.type == 'service'">
|
||||
<button open-type="contact" class="btn-normal">
|
||||
<view class="float-icon">
|
||||
<image :src="getImagePath(showParams.image)"></image>
|
||||
</view>
|
||||
</button>
|
||||
</block>
|
||||
<block v-else>
|
||||
<button class="btn-normal" @click="onClick(showParams.link)">
|
||||
<view class="float-icon">
|
||||
<image :src="getImagePath(showParams.image)"></image>
|
||||
</view>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="float-absolute" :appid="showParams.link.appid" :path="showParams.link.path" v-if="showParams.link && showParams.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</button>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'floatDiy',
|
||||
props: ['showStyle', 'showParams', 'domain'],
|
||||
computed: {
|
||||
right() {
|
||||
return uni.upx2px(this.showStyle.right * 2) + '%';
|
||||
},
|
||||
bottom() {
|
||||
return uni.upx2px(this.showStyle.bottom * 2) + '%';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 点击事件
|
||||
onClick(e) {
|
||||
if (this.showParams.type != 'link' && !this.showParams.link) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 在线客服 */
|
||||
.diy-float {
|
||||
position: fixed;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.diy-float .float-icon {
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.diy-float .float-icon image {
|
||||
display: block;
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.diy-float .float-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.btn-normal {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
line-height: normal;
|
||||
background: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
font-size: unset;
|
||||
text-align: unset;
|
||||
overflow: visible;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.btn-normal:after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.btn-normal.button-hover {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
button:after {
|
||||
content: none;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
165
pages/component/diy/goodsDiy.vue
Normal file
165
pages/component/diy/goodsDiy.vue
Normal file
@@ -0,0 +1,165 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-商城商品 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-goods" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="goods-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-list flex flex-wrap justify-content-between" :style="{rowGap: itemSpace}" v-if="goodsList">
|
||||
<view class="list-item" v-for="item in goodsList" :key="item.id" @click="toDetails(item.id)">
|
||||
<image class="item-image" :src="item.image" :style="{height: imgHeight, borderRadius: `${borderRadius} ${borderRadius} 0 0`}" mode="aspectFill"></image>
|
||||
<view class="item-name text-ellipsis-more" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{item.name}}</view>
|
||||
<view class="item-price" :style="{fontSize: priceSize, color: showStyle.priceColor}">￥{{item.price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "goodsDiy",
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
goodsList: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
imgHeight() {
|
||||
return uni.upx2px(this.showStyle.imgHeight * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
priceSize() {
|
||||
return uni.upx2px(this.showStyle.priceSize * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getGoodsList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取商城商品
|
||||
getGoodsList() {
|
||||
this.$util.request("mall.goodsList", {
|
||||
page: 1,
|
||||
limit: 4
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.goodsList = res.data.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取商城商品', error)
|
||||
})
|
||||
},
|
||||
// 跳转商城详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesMall/goods/details?id=" + id
|
||||
})
|
||||
},
|
||||
// 跳转商城列表
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/mall/index"
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-goods {
|
||||
.goods-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.goods-list {
|
||||
.list-item {
|
||||
width: calc(50% - 16rpx);
|
||||
padding-bottom: 20rpx;
|
||||
|
||||
.item-image {
|
||||
width: 100%;
|
||||
height: 296rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
line-height: 40rpx;
|
||||
height: 80rpx;
|
||||
color: #000000;
|
||||
margin-top: 16rpx;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
.item-price {
|
||||
margin-top: 16rpx;
|
||||
font-weight: 600;
|
||||
line-height: 1.3;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
94
pages/component/diy/imagesDiy.vue
Normal file
94
pages/component/diy/imagesDiy.vue
Normal file
@@ -0,0 +1,94 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-单图组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-images" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="item-image" v-for="(item, index) in showData" :key="index" :style="{paddingTop: paddingTop}">
|
||||
<button class="clear" open-type="contact" v-if="item.link && item.link.type == 'Service'">
|
||||
<image :src="getImagePath(item.imgUrl)" mode="widthFix" :style="{borderRadius: borderRadius}"></image>
|
||||
</button>
|
||||
<block v-else>
|
||||
<image :src="getImagePath(item.imgUrl)" mode="widthFix" @click="onClick(item.link)" :style="{borderRadius: borderRadius}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'imagesDiy',
|
||||
props: ['showStyle', 'showData', 'domain'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 跳转
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-images {
|
||||
.item-image {
|
||||
position: relative;
|
||||
|
||||
&:first-child {
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
|
||||
image {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
246
pages/component/diy/index.vue
Normal file
246
pages/component/diy/index.vue
Normal file
@@ -0,0 +1,246 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-自定义装修 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view :style="{padding: paddingTop + ' ' + paddingLeft}">
|
||||
<block v-for="(item,index) in showData.items" :key='index'>
|
||||
<!-- 图片轮播 -->
|
||||
<block v-if="item.type == 'carouselDiy'">
|
||||
<carousel-diy :showStyle="item.style" :showData="item.data" :showParams="item.params" :domain="showData.domain" @onClick="onClick"></carousel-diy>
|
||||
</block>
|
||||
<!-- 单图组 -->
|
||||
<block v-if="item.type == 'imagesDiy'">
|
||||
<images-diy :showStyle="item.style" :showData="item.data" :domain="showData.domain" @onClick="onClick"></images-diy>
|
||||
</block>
|
||||
<!-- 导航组 -->
|
||||
<block v-if="item.type == 'navDiy'">
|
||||
<nav-diy :showStyle="item.style" :showData="item.data" :domain="showData.domain" @onClick="onClick"></nav-diy>
|
||||
</block>
|
||||
<!-- 图片魔方 -->
|
||||
<block v-if="item.type == 'cubeDiy'">
|
||||
<cube-diy :showStyle="item.style" :showData="item.data" :domain="showData.domain" @onClick="onClick"></cube-diy>
|
||||
</block>
|
||||
<!-- 信息卡片 -->
|
||||
<block v-if="item.type == 'infoCardDiy'">
|
||||
<info-card-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain" @onClick="onClick"></info-card-diy>
|
||||
</block>
|
||||
<!-- 按钮组 -->
|
||||
<block v-if="item.type == 'textButtonDiy'">
|
||||
<text-button-diy :showStyle="item.style" :showData="item.data" @onClick="onClick"></text-button-diy>
|
||||
</block>
|
||||
<!-- 标题 -->
|
||||
<block v-if="item.type == 'titleDiy'">
|
||||
<title-diy :showStyle="item.style" :showParams="item.params" @onClick="onClick"></title-diy>
|
||||
</block>
|
||||
<!-- 视频 -->
|
||||
<block v-if="item.type == 'videoDiy'">
|
||||
<video-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain"></video-diy>
|
||||
</block>
|
||||
<!-- 地图 -->
|
||||
<block v-if="item.type == 'mapDiy'">
|
||||
<map-diy :showStyle="item.style" :showParams="item.params"></map-diy>
|
||||
</block>
|
||||
<!-- 平台动态 -->
|
||||
<block v-if="item.type == 'articleDiy'">
|
||||
<article-diy :ref="'articleDiy_' + index" :showStyle="item.style" :showParams="item.params"></article-diy>
|
||||
</block>
|
||||
<!-- 商会介绍 -->
|
||||
<block v-if="item.type == 'introduceDiy'">
|
||||
<introduce-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain"></introduce-diy>
|
||||
</block>
|
||||
<!-- 会员展示 -->
|
||||
<block v-if="item.type == 'memberDiy'">
|
||||
<member-diy :ref="'memberDiy_' + index" :showStyle="item.style" :showParams="item.params"></member-diy>
|
||||
</block>
|
||||
<!-- 商会活动 -->
|
||||
<block v-if="item.type == 'activityDiy'">
|
||||
<activity-diy :ref="'activityDiy_' + index" :showStyle="item.style" :showParams="item.params"></activity-diy>
|
||||
</block>
|
||||
<!-- 活动接龙 -->
|
||||
<block v-if="item.type == 'chainsDiy'">
|
||||
<chains-diy :ref="'chainsDiy_' + index" :showStyle="item.style" :showParams="item.params" @setShareData="setShareData"></chains-diy>
|
||||
</block>
|
||||
<!-- 商会相册 -->
|
||||
<block v-if="item.type == 'albumDiy'">
|
||||
<album-diy :ref="'albumDiy_' + index" :showStyle="item.style" :showParams="item.params"></album-diy>
|
||||
</block>
|
||||
<!-- 商城商品 -->
|
||||
<block v-if="item.type == 'goodsDiy'">
|
||||
<goods-diy :ref="'goodsDiy_' + index" :showStyle="item.style" :showParams="item.params"></goods-diy>
|
||||
</block>
|
||||
<!-- 会员供需 -->
|
||||
<block v-if="item.type == 'demandDiy'">
|
||||
<demand-diy :ref="'demandDiy_' + index" :showStyle="item.style" :showParams="item.params"></demand-diy>
|
||||
</block>
|
||||
<!-- 会员地图 -->
|
||||
<block v-if="item.type == 'memberMapDiy'">
|
||||
<member-map-diy :ref="'memberMapDiy_' + index" :showMap="item.map" :showCategory="item.category" :spaceHeight="spaceHeight"></member-map-diy>
|
||||
</block>
|
||||
<!-- 搜索 -->
|
||||
<block v-if="item.type == 'searchDiy'">
|
||||
<search-diy :showStyle="item.style" :showParams="item.params"></search-diy>
|
||||
</block>
|
||||
<!-- 辅助线条 -->
|
||||
<block v-if="item.type == 'lineDiy'">
|
||||
<line-diy :showStyle="item.style"></line-diy>
|
||||
</block>
|
||||
<!-- 辅助空白 -->
|
||||
<block v-if="item.type == 'blankDiy'">
|
||||
<blank-diy :showStyle="item.style"></blank-diy>
|
||||
</block>
|
||||
<!-- 消息通知 -->
|
||||
<block v-if="item.type == 'noticeDiy'">
|
||||
<notice-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain"></notice-diy>
|
||||
</block>
|
||||
<!-- 文本组 -->
|
||||
<block v-if="item.type == 'textDiy'">
|
||||
<text-diy :showStyle="item.style"></text-diy>
|
||||
</block>
|
||||
<!-- 富文本 -->
|
||||
<block v-if="item.type == 'richTextDiy'">
|
||||
<rich-text-diy :showStyle="item.style" :showParams="item.params"></rich-text-diy>
|
||||
</block>
|
||||
<!-- 警告提示 -->
|
||||
<block v-if="item.type == 'warnDiy'">
|
||||
<warn-diy :showStyle="item.style" :showParams="item.params"></warn-diy>
|
||||
</block>
|
||||
<!-- 时间线 -->
|
||||
<block v-if="item.type == 'timelineDiy'">
|
||||
<timeline-diy :showStyle="item.style" :showData="item.data"></timeline-diy>
|
||||
</block>
|
||||
<!-- 悬浮按钮 -->
|
||||
<block v-if="item.type == 'floatDiy'">
|
||||
<float-diy :showStyle="item.style" :showParams="item.params" :domain="showData.domain" @onClick="onClick"></float-diy>
|
||||
</block>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import carouselDiy from './carouselDiy.vue'
|
||||
import imagesDiy from './imagesDiy.vue'
|
||||
import navDiy from './navDiy.vue'
|
||||
import cubeDiy from './cubeDiy.vue'
|
||||
import infoCardDiy from './infoCardDiy.vue'
|
||||
import textButtonDiy from './textButtonDiy.vue'
|
||||
import titleDiy from './titleDiy.vue'
|
||||
import videoDiy from './videoDiy.vue'
|
||||
import mapDiy from './mapDiy.vue'
|
||||
import articleDiy from './articleDiy.vue'
|
||||
import introduceDiy from './introduceDiy.vue'
|
||||
import memberDiy from './memberDiy.vue'
|
||||
import activityDiy from './activityDiy.vue'
|
||||
import chainsDiy from './chainsDiy.vue'
|
||||
import albumDiy from './albumDiy.vue'
|
||||
import goodsDiy from './goodsDiy.vue'
|
||||
import demandDiy from './demandDiy.vue'
|
||||
import memberMapDiy from './memberMapDiy.vue'
|
||||
import searchDiy from './searchDiy.vue'
|
||||
import lineDiy from './lineDiy.vue'
|
||||
import blankDiy from './blankDiy.vue'
|
||||
import noticeDiy from './noticeDiy.vue'
|
||||
import textDiy from './textDiy.vue'
|
||||
import richTextDiy from './richTextDiy.vue'
|
||||
import warnDiy from './warnDiy.vue'
|
||||
import timelineDiy from './timelineDiy.vue'
|
||||
import floatDiy from './floatDiy.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
carouselDiy,
|
||||
imagesDiy,
|
||||
navDiy,
|
||||
cubeDiy,
|
||||
infoCardDiy,
|
||||
textButtonDiy,
|
||||
titleDiy,
|
||||
videoDiy,
|
||||
mapDiy,
|
||||
articleDiy,
|
||||
introduceDiy,
|
||||
memberDiy,
|
||||
activityDiy,
|
||||
chainsDiy,
|
||||
albumDiy,
|
||||
goodsDiy,
|
||||
demandDiy,
|
||||
memberMapDiy,
|
||||
searchDiy,
|
||||
lineDiy,
|
||||
blankDiy,
|
||||
noticeDiy,
|
||||
textDiy,
|
||||
richTextDiy,
|
||||
warnDiy,
|
||||
timelineDiy,
|
||||
floatDiy,
|
||||
},
|
||||
props: ['showData', 'spaceHeight'],
|
||||
computed: {
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showData.page.style.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showData.page.style.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 更新数据
|
||||
updateData() {
|
||||
for (var key in this.$refs) {
|
||||
const type = key.split("_")[0]
|
||||
switch (type) {
|
||||
case "articleDiy":
|
||||
this.$refs[key][0].getArticleList()
|
||||
break;
|
||||
case "memberDiy":
|
||||
this.$refs[key][0].getMemberList()
|
||||
break;
|
||||
case "activityDiy":
|
||||
this.$refs[key][0].getActivityList()
|
||||
break;
|
||||
case "chainsDiy":
|
||||
this.$refs[key][0].getChainsList()
|
||||
break;
|
||||
case "albumDiy":
|
||||
this.$refs[key][0].getAlbumList()
|
||||
break;
|
||||
case "goodsDiy":
|
||||
this.$refs[key][0].getGoodsList()
|
||||
break;
|
||||
case "demandDiy":
|
||||
this.$refs[key][0].getDemandList()
|
||||
break;
|
||||
case "memberMapDiy":
|
||||
this.$refs[key][0].getMemberList()
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 按钮点击
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
if (e.type == "Fixed" && (e.Fixed_type == "Fixed_type_7" || e.Fixed_type == "Fixed_type_8")) {
|
||||
this.$emit("toPage", e)
|
||||
} else {
|
||||
this.$util.openLink(e);
|
||||
}
|
||||
},
|
||||
// 设置分享数据
|
||||
setShareData(data) {
|
||||
this.$emit('setShareData', data)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
135
pages/component/diy/infoCardDiy.vue
Normal file
135
pages/component/diy/infoCardDiy.vue
Normal file
@@ -0,0 +1,135 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-信息卡片 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-info-card" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<image class="card-image" mode="aspectFill" :src="getImagePath(showParams.image)" :style="{borderRadius: borderRadius}"></image>
|
||||
<view class="card-box">
|
||||
<view class="title">{{showParams.title}}</view>
|
||||
<view class="content">{{showParams.content}}</view>
|
||||
<button class="btn clear" open-type="contact" :style="{background: showStyle.btnBackground, borderRadius: btnBorderRadius, color: showStyle.btnColor}" v-if="showParams.link && showParams.link.type == 'Service'">{{showParams.btnTxt}}</button>
|
||||
<view class="btn" @click="onClick(showParams.link)" :style="{background: showStyle.btnBackground, borderRadius: btnBorderRadius, color: showStyle.btnColor}" v-else>
|
||||
<text>{{showParams.btnTxt}}</text>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="absolute" :appid="showParams.link.appid" :path="showParams.link.path" v-if="showParams.link && showParams.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .wx-btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="wx-btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'infoCardDiy',
|
||||
props: ['showStyle', 'showParams', 'domain'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
btnBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.btnBorderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-info-card {
|
||||
display: flex;
|
||||
|
||||
.card-image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.card-box {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
margin-left: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
|
||||
.title {
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
line-height: 1.3;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
font-size: 24rpx;
|
||||
line-height: 1.4;
|
||||
margin: 16rpx 0;
|
||||
color: #333;
|
||||
word-wrap: normal;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
}
|
||||
|
||||
.btn {
|
||||
position: relative;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
padding: 0 28rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 54rpx;
|
||||
text-align: center;
|
||||
|
||||
.absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
90
pages/component/diy/introduceDiy.vue
Normal file
90
pages/component/diy/introduceDiy.vue
Normal file
@@ -0,0 +1,90 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-商会介绍 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-introduce" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<image class="introduce-image" :src="getImagePath(showParams.imgUrl)" :style="{width: iconSize, height: iconSize, borderRadius: borderRadius}" mode="aspectFill"></image>
|
||||
<text class="introduce-title" :style="{fontSize: nameSize, fontWeight: showStyle.nameWeight}">{{showParams.name}}</text>
|
||||
<view class="introduce-btn" :style="{fontSize: btnSize, borderRadius: btnBorderRadius, background: `linear-gradient(90deg, ${showStyle.btnColor1} 0, ${showStyle.btnColor2} 100%)`}" @click="onClick()">{{showParams.btnName}}</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'introduceDiy',
|
||||
props: ['showStyle', 'showParams', 'domain'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
btnBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.btnBorderRadius * 2) + 'px';
|
||||
},
|
||||
btnSize() {
|
||||
return uni.upx2px(this.showStyle.btnSize * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 点击事件
|
||||
onClick() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/index/association"
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-introduce {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.introduce-title {
|
||||
margin-left: 16rpx;
|
||||
color: #5A5B6E;
|
||||
line-height: 1.3;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.introduce-btn {
|
||||
margin-left: 16rpx;
|
||||
color: #ffffff;
|
||||
line-height: 1.3;
|
||||
padding: 14rpx 40rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
45
pages/component/diy/lineDiy.vue
Normal file
45
pages/component/diy/lineDiy.vue
Normal file
@@ -0,0 +1,45 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-辅助线 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-line" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="line" :style="{borderTop: line}">
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'lineDiy',
|
||||
props: ['showStyle'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
line() {
|
||||
return uni.upx2px(this.showStyle.lineHeight * 2) + 'px' + ' ' + this.showStyle.lineStyle + ' ' + this.showStyle.lineColor;
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-line .line {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
56
pages/component/diy/mapDiy.vue
Normal file
56
pages/component/diy/mapDiy.vue
Normal file
@@ -0,0 +1,56 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-地图组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-map" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<map class="map" :latitude="showParams.latitude" :longitude="showParams.longitude" :style="{height: height}" @click="onClick"></map>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'mapDiy',
|
||||
props: ['showStyle', 'showParams'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
height() {
|
||||
return uni.upx2px(this.showStyle.height * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 点击事件
|
||||
onClick() {
|
||||
this.$util.toPage({
|
||||
mode: 7,
|
||||
address: {
|
||||
latitude: this.showParams.latitude,
|
||||
longitude: this.showParams.longitude,
|
||||
},
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-map .map {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
218
pages/component/diy/memberDiy.vue
Normal file
218
pages/component/diy/memberDiy.vue
Normal file
@@ -0,0 +1,218 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-可滚动会员列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-member" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="member-title" :style="{marginBottom: titleSpace}" v-if="showParams.showTitle">
|
||||
<view :style="{fontSize: titleFontSize,fontWeight: showStyle.titleFontStyle, color: showStyle.titleColor}">{{showParams.titleText}}</view>
|
||||
<view :style="{fontSize: titleBtnSize, color: showStyle.titleBtnColor}" @click="toMore()">
|
||||
<text v-if="showParams.titleBtnType == 'text'">{{showParams.titleBtnText}}</text>
|
||||
<view :style="{'background-image': 'url('+ titleIconMore +')', width: titleIconSize, height: titleIconSize, backgroundSize: titleIconSize}" v-else-if="titleIconMore"></view>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="memberList.length">
|
||||
<view class="member-swiper" v-if="showStyle.isAutoRoll">
|
||||
<z-swiper v-model="memberList" :options="{loop: (memberList.length > 9 ? true : false), autoplay: {delay: showStyle.rollDelay || 2000, disableOnInteraction: false}, speed: showStyle.rollSpeed || 1000, slidesPerView: 'auto', spaceBetween: showStyle.itemSpace}">
|
||||
<z-swiper-item v-for="(item, index) in memberList" :key="index" :custom-style="{width: iconSize}">
|
||||
<view class="swiper-item" @click="toDetails(item.id)">
|
||||
<image class="item-avatar" :style="{width: iconSize, height: iconSize, borderRadius: iconRadius}" :src="item.avatar" mode="aspectFill"></image>
|
||||
<view class="item-label text-ellipsis" :style="{fontSize: pSize, color: showStyle.pColor, background: showStyle.pBackground, borderRadius: showStyle.pRadiusType == 'full' ? pRadius : showStyle.pRadiusType == 'half' ? `0 ${pRadius} 0 ${pRadius}` : 0}">{{item.level_name}}</view>
|
||||
<view class="item-name text-ellipsis" :style="{fontSize: nameSize, color: showStyle.nameColor,}">{{item.name}}</view>
|
||||
</view>
|
||||
</z-swiper-item>
|
||||
</z-swiper>
|
||||
</view>
|
||||
<scroll-view scroll-x class="member-scroll" v-else>
|
||||
<view class="scroll-item" :style="{width: iconSize, marginLeft: itemSpace}" v-for="item in memberList" :key="item.id" @click="toDetails(item.id)">
|
||||
<image class="item-avatar" :style="{width: iconSize, height: iconSize, borderRadius: iconRadius}" :src="item.avatar" mode="aspectFill"></image>
|
||||
<view class="item-label text-ellipsis" :style="{
|
||||
fontSize: pSize,
|
||||
color: showStyle.pColor,
|
||||
background: showStyle.pBackground,
|
||||
borderRadius: showStyle.pRadiusType == 'full' ? pRadius : showStyle.pRadiusType == 'half' ? `0 ${pRadius} 0 ${pRadius}` : 0
|
||||
}">{{item.level_name}}</view>
|
||||
<view class="item-name text-ellipsis" :style="{fontSize: nameSize, color: showStyle.nameColor,}">{{item.name}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</block>
|
||||
<empty top="0" padding="0" width="200rpx" size="28rpx" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "memberDiy",
|
||||
props: ['showStyle', 'showParams'],
|
||||
data() {
|
||||
return {
|
||||
// 会员列表
|
||||
memberList: [],
|
||||
// 轮播图高度
|
||||
carouselHeight: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
titleFontSize() {
|
||||
return uni.upx2px(this.showStyle.titleFontSize * 2) + 'px';
|
||||
},
|
||||
titleBtnSize() {
|
||||
return uni.upx2px(this.showStyle.titleBtnSize * 2) + 'px';
|
||||
},
|
||||
titleIconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.titleBtnColor)
|
||||
},
|
||||
titleIconSize() {
|
||||
return uni.upx2px(this.showStyle.titleIconSize * 2) + 'px';
|
||||
},
|
||||
titleSpace() {
|
||||
return uni.upx2px(this.showStyle.titleSpace * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
iconRadius() {
|
||||
return uni.upx2px(this.showStyle.iconRadius * 2) + 'px';
|
||||
},
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
pSize() {
|
||||
return uni.upx2px(this.showStyle.pSize * 2) + 'px';
|
||||
},
|
||||
pRadius() {
|
||||
return uni.upx2px(this.showStyle.pRadius * 2) + 'px';
|
||||
},
|
||||
nameSize() {
|
||||
return uni.upx2px(this.showStyle.nameSize * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showParams: {
|
||||
handler(value) {
|
||||
if (value) this.getMemberList()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
showStyle: {
|
||||
handler(value) {
|
||||
if (value) {
|
||||
this.carouselHeight = `calc(${uni.upx2px((value.iconSize + value.pSize + value.nameSize) * 2)}px + 22rpx)`
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 跳转会员详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/details?id=" + id
|
||||
})
|
||||
},
|
||||
// 获取会员列表
|
||||
getMemberList() {
|
||||
this.$util.request("member.diyList", {
|
||||
limit: this.showParams.count,
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.memberList = res.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取会员列表 ', error)
|
||||
})
|
||||
},
|
||||
// 跳转会员列表
|
||||
toMore() {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/index"
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-member {
|
||||
.member-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.member-scroll {
|
||||
white-space: nowrap;
|
||||
|
||||
.scroll-item {
|
||||
display: inline-block;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.item-label {
|
||||
line-height: 1;
|
||||
padding: 10rpx 8rpx;
|
||||
margin-top: -16rpx;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
color: #5A5B6E;
|
||||
line-height: 1;
|
||||
margin-top: 18rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.member-swiper {
|
||||
.swiper-item {
|
||||
.item-label {
|
||||
line-height: 1;
|
||||
padding: 10rpx 8rpx;
|
||||
margin-top: -16rpx;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
color: #5A5B6E;
|
||||
line-height: 1;
|
||||
margin-top: 18rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
695
pages/component/diy/memberMapDiy.vue
Normal file
695
pages/component/diy/memberMapDiy.vue
Normal file
@@ -0,0 +1,695 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-会员地图 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-member-map" :class="{'flex-column': showCategory.styleMode == 2 && showMap.heightType == 1}" :style="{height: showMap.heightType == 2 ? `auto` : `calc(100vh - ${spaceHeight}px)`, background: showMap.background, borderRadius: mapItemBorderRadius}" v-if="loadEnd">
|
||||
<view class="map-classify style-2" v-if="showCategory.styleMode == 2 && classifyList.length" @scrolltolower="scrollBottom" :style="{background: showCategory.background, padding: `0 ${categoryPaddingLeft}`}">
|
||||
<scroll-view scroll-x class="classify-list" :style="{padding: `${categoryPaddingTop} 0`}">
|
||||
<view class="list-item" @click="changeClassify(-1)" :style="{
|
||||
background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>全部</text>
|
||||
</view>
|
||||
<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
|
||||
marginLeft: categoryItemSpace,
|
||||
background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="classify-more" @click="handleExpand(1)">
|
||||
<view class="more-icon" :style="{'background-image': 'url('+ categoryIconDown +')'}" v-if="categoryIconDown"></view>
|
||||
<text class="more-text" :style="{color: showCategory.expandColor}">展开列表</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="map-classify style-1" v-else-if="classifyList.length" :style="{
|
||||
top: categoryMarginTop,
|
||||
left: showCategory.position == 'right' ? 'initial' : categoryMarginLeft,
|
||||
right: showCategory.position == 'right' ? categoryMarginLeft : 'initial',
|
||||
width: showCategory.widthType == 2 ? `${showCategory.widthNumber}%` : 'auto',
|
||||
maxWidth: `calc((100% - ${categoryMarginLeft} - ${categoryMarginLeft}) * ${showCategory.widthType == 2 ? `${showCategory.widthNumber / 100}` : 1})`,
|
||||
maxHeight: showMap.heightType == 2 ? categoryMaxHeight : `calc(100vh - ${spaceHeight}px - ${categoryMaxHeight})`,
|
||||
alignItems: showCategory.position == 'right' ? 'flex-end' : 'flex-start'}">
|
||||
<view class="classify-more" :class="{collapse: !isExpandCategory1}" @click="handleExpand()" :style="{
|
||||
background: showCategory.background,
|
||||
borderRadius: isExpandCategory1 ? categoryBorderRadius : (showCategory.position == 'right' ? `${categoryBorderRadius} 0 0 ${categoryBorderRadius}` : `0 ${categoryBorderRadius} ${categoryBorderRadius} 0`),
|
||||
left: showCategory.position == 'right' ? 'initial' : `-${categoryMarginLeft}`,
|
||||
right: showCategory.position == 'right' ? `-${categoryMarginLeft}` : 'initial',}">
|
||||
<text class="more-text" :style="{color: showCategory.expandColor}">{{isExpandCategory1 ? "收起" : "展开"}}列表</text>
|
||||
<view class="more-icon" :style="{'background-image': 'url('+ categoryIconDown +')'}" v-if="categoryIconDown"></view>
|
||||
</view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<uni-transition style="width: 100%;" :mode-class="showCategory.position == 'right' ? 'slide-right' : 'slide-left'" :duration="80" :show="isExpandCategory1">
|
||||
<scroll-view scroll-y @scrolltolower="scrollBottom" :style="{
|
||||
borderRadius: categoryBorderRadius,
|
||||
background: showCategory.background,
|
||||
maxHeight: showMap.heightType == 2 ? `calc(${categoryMaxHeight} - 80rpx)` : `calc(100vh - 80rpx - ${spaceHeight}px - ${categoryMaxHeight})`}">
|
||||
<view class="classify-list" :style="{rowGap: categoryItemSpace, padding: `${categoryPaddingTop} ${categoryPaddingLeft}`}">
|
||||
<view class="list-item" @click="changeClassify(-1)" :style="{
|
||||
background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>全部</text>
|
||||
</view>
|
||||
<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
|
||||
background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</uni-transition>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<scroll-view scroll-y @scrolltolower="scrollBottom" v-if="isExpandCategory1" :style="{
|
||||
borderRadius: categoryBorderRadius,
|
||||
background: showCategory.background,
|
||||
maxHeight: showMap.heightType == 2 ? `calc(${categoryMaxHeight} - 80rpx)` : `calc(100vh - 80rpx - ${spaceHeight}px - ${categoryMaxHeight})`}">
|
||||
<view class="classify-list" :style="{rowGap: categoryItemSpace, padding: `${categoryPaddingTop} ${categoryPaddingLeft}`}">
|
||||
<view class="list-item" @click="changeClassify(-1)" :style="{
|
||||
background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>全部</text>
|
||||
</view>
|
||||
<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
|
||||
background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<view class="map-context" :style="{height: showMap.heightType == 2 ? mapHeight : '100%', padding: mapPadding}">
|
||||
<map class="map" id="map" :style="{borderRadius: mapBorderRadius}" :markers="markersList" :include-points="includePoints" @callouttap="toMemberDetails" @markertap="toMemberDetails">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<cover-view slot="callout" class="map-callout" v-if="memberList.length">
|
||||
<cover-view :marker-id="Number(item.id)" v-for="item in memberList" :key="item.id">
|
||||
<cover-view class="callout-item">
|
||||
<cover-image class="item-avatar" :src="item.avatar"></cover-image>
|
||||
<cover-view class="item-name">{{item.name}}</cover-view>
|
||||
</cover-view>
|
||||
</cover-view>
|
||||
</cover-view>
|
||||
<!-- #endif -->
|
||||
</map>
|
||||
</view>
|
||||
<view class="map-popup" v-if="showCategory.styleMode == 2 && isExpandCategory2">
|
||||
<view class="popup-classify" :style="{background: showCategory.background, padding: `0 ${categoryPaddingLeft}`}">
|
||||
<scroll-view scroll-y class="classify-scroll" :style="{maxHeight: `${componentHeight}px`, padding: `${categoryPaddingTop} 0`}">
|
||||
<view class="scroll-list" :style="{gap: categoryItemSpace}">
|
||||
<view class="list-item" @click="changeClassify(-1)" :style="{
|
||||
background: (!selectClassify.length ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: !selectClassify.length ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>全部</text>
|
||||
</view>
|
||||
<view class="list-item" v-for="(item, index) in classifyList" :key="index" @click="changeClassify(item.id)" :style="{
|
||||
background: (selectClassify.includes(item.id) ? showCategory.btnActiveBackground : showCategory.btnBackground),
|
||||
borderRadius: categoryBtnBorderRadius,
|
||||
padding: categoryBtnPadding,
|
||||
color: selectClassify.includes(item.id) ? showCategory.btnActiveColor : showCategory.btnColor}">
|
||||
<text>{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="scroll-space"></view>
|
||||
</scroll-view>
|
||||
<view class="classify-more" :style="{background: showCategory.background}" @click="handleExpand(2)">
|
||||
<view class="more-icon" style="transform: rotate(180deg);" :style="{'background-image': 'url('+ categoryIconDown +')'}" v-if="categoryIconDown"></view>
|
||||
<text class="more-text" :style="{color: showCategory.expandColor}">收起列表</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "memberMapDiy",
|
||||
props: ['showMap', 'showCategory', 'spaceHeight'],
|
||||
data() {
|
||||
return {
|
||||
// 加载完成
|
||||
loadEnd: false,
|
||||
// 分类列表 1.行业分类，2.分支机构，3.会员级别
|
||||
classifyList: [],
|
||||
// 已选分类
|
||||
selectClassify: [],
|
||||
// 分类查询参数
|
||||
page: 1,
|
||||
limit: 100,
|
||||
hasMore: false,
|
||||
// 会员列表
|
||||
memberList: [],
|
||||
// 地图标记点
|
||||
markersList: [],
|
||||
// 所有标记点
|
||||
includePoints: [],
|
||||
// 查询数据防抖延时器
|
||||
loadTimer: null,
|
||||
// 页面跳转防抖延时器
|
||||
toPageTimer: null,
|
||||
// 分类弹窗是否展开-样式1
|
||||
isExpandCategory1: true,
|
||||
// 分类弹窗是否展开-样式2
|
||||
isExpandCategory2: false,
|
||||
// 组件高度
|
||||
componentHeight: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
mapItemBorderRadius() {
|
||||
return uni.upx2px(this.showMap.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
mapHeight() {
|
||||
if (this.showMap.heightType == 2) {
|
||||
return uni.upx2px(this.showMap.height * 2) + 'px';
|
||||
} else {
|
||||
return '100%';
|
||||
}
|
||||
},
|
||||
mapBorderRadius() {
|
||||
return uni.upx2px(this.showMap.borderRadius * 2) + 'px';
|
||||
},
|
||||
mapPadding() {
|
||||
return `${uni.upx2px(this.showMap.paddingTop * 2)}px ${uni.upx2px(this.showMap.paddingLeft * 2)}px`;
|
||||
},
|
||||
categoryBorderRadius() {
|
||||
return uni.upx2px(this.showCategory.borderRadius * 2) + 'px';
|
||||
},
|
||||
categoryMaxHeight() {
|
||||
var maxHeight = 0
|
||||
if (this.showMap.heightType == 2) {
|
||||
maxHeight = this.showMap.height - (this.showCategory.marginTop * 2)
|
||||
return uni.upx2px(maxHeight * 2) + 'px';
|
||||
} else {
|
||||
maxHeight = this.showCategory.marginTop * 2
|
||||
return uni.upx2px(maxHeight * 2) + 'px';
|
||||
}
|
||||
},
|
||||
categoryMarginTop() {
|
||||
return `${uni.upx2px(this.showCategory.marginTop * 2)}px`
|
||||
},
|
||||
categoryMarginLeft() {
|
||||
return `${uni.upx2px(this.showCategory.marginLeft * 2)}px`
|
||||
},
|
||||
categoryIconDown() {
|
||||
return svgData.svgToUrl("expand", this.showCategory.expandColor)
|
||||
},
|
||||
categoryPaddingTop() {
|
||||
return `${uni.upx2px(this.showCategory.paddingTop * 2)}px`
|
||||
},
|
||||
categoryPaddingLeft() {
|
||||
return `${uni.upx2px(this.showCategory.paddingLeft * 2)}px`
|
||||
},
|
||||
categoryItemSpace() {
|
||||
return uni.upx2px(this.showCategory.itemSpace * 2) + 'px';
|
||||
},
|
||||
categoryBtnBorderRadius() {
|
||||
return uni.upx2px(this.showCategory.btnBorderRadius * 2) + 'px';
|
||||
},
|
||||
categoryBtnPadding() {
|
||||
return `${uni.upx2px(this.showCategory.btnPaddingTop * 2)}px ${uni.upx2px(this.showCategory.btnPaddingLeft * 2)}px`
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
showCategory: {
|
||||
handler(value) {
|
||||
if (value) {
|
||||
this.getClassifyList()
|
||||
this.getMemberList()
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
},
|
||||
destroyed() {
|
||||
if (this.loadTimer) clearTimeout(this.loadTimer)
|
||||
if (this.toPageTimer) clearTimeout(this.toPageTimer)
|
||||
},
|
||||
methods: {
|
||||
// 获取会员列表
|
||||
getMemberList() {
|
||||
var data = { type: this.showCategory.type }
|
||||
if (this.selectClassify.length) {
|
||||
if (this.showCategory.type == 1) {
|
||||
data.member_level_id = this.selectClassify.join(",")
|
||||
} else if (this.showCategory.type == 2) {
|
||||
data.industry_category_id = this.selectClassify.join(",")
|
||||
} else if (this.showCategory.type == 3) {
|
||||
data.institution_id = this.selectClassify.join(",")
|
||||
}
|
||||
}
|
||||
this.$util.request("member.memberMapList", data).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.memberList = res.data || []
|
||||
var markersPoints = []
|
||||
res.data.forEach((item) => {
|
||||
if (item.latitude && item.longitude) {
|
||||
markersPoints.push({
|
||||
id: Number(item.id),
|
||||
latitude: item.latitude,
|
||||
longitude: item.longitude,
|
||||
// #ifdef H5
|
||||
iconPath: item.avatar,
|
||||
width: 28,
|
||||
height: 28,
|
||||
callout: {
|
||||
display: "ALWAYS",
|
||||
content: item.name,
|
||||
fontSize: 12,
|
||||
borderRadius: 4,
|
||||
padding: 5,
|
||||
},
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
iconPath: "/static/point.png",
|
||||
width: 20,
|
||||
height: 20,
|
||||
customCallout: {
|
||||
anchorX: 0,
|
||||
anchorY: 28,
|
||||
display: "ALWAYS",
|
||||
},
|
||||
// #endif
|
||||
})
|
||||
}
|
||||
});
|
||||
// #ifdef MP-WEIXIN
|
||||
this.markersList = markersPoints
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
this.markersList = []
|
||||
this.$nextTick(() => {
|
||||
this.markersList = markersPoints
|
||||
})
|
||||
// #endif
|
||||
const allPoints = res.data.filter(el => el.latitude && el.longitude).map(item => ({
|
||||
latitude: item.latitude,
|
||||
longitude: item.longitude,
|
||||
}));
|
||||
// #ifdef MP-WEIXIN
|
||||
this._mapContext = uni.createMapContext('map', this);
|
||||
this._mapContext.initMarkerCluster({
|
||||
enableDefaultStyle: false,
|
||||
zoomOnClick: true,
|
||||
gridSize: 60,
|
||||
});
|
||||
this._mapContext.includePoints({
|
||||
padding: [100, 100, 100, 100],
|
||||
points: allPoints,
|
||||
});
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
this.includePoints = this.calculateBounds(allPoints)
|
||||
// #endif
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取会员列表 ', error)
|
||||
})
|
||||
},
|
||||
// 计算所有点的边界
|
||||
calculateBounds(points) {
|
||||
if (!points || points.length === 0) return null;
|
||||
let minLat = Infinity;
|
||||
let maxLat = -Infinity;
|
||||
let minLng = Infinity;
|
||||
let maxLng = -Infinity;
|
||||
points.forEach(point => {
|
||||
const lat = point.latitude;
|
||||
const lng = point.longitude;
|
||||
minLat = Math.min(minLat, lat);
|
||||
maxLat = Math.max(maxLat, lat);
|
||||
minLng = Math.min(minLng, lng);
|
||||
maxLng = Math.max(maxLng, lng);
|
||||
});
|
||||
const latRange = maxLat - minLat;
|
||||
const lngRange = maxLng - minLng;
|
||||
const topPadding = latRange * 0.4;
|
||||
const bottomPadding = latRange * 0.3;
|
||||
const leftPadding = lngRange * 0.3;
|
||||
const rightPadding = lngRange * 0.3;
|
||||
minLat = minLat - bottomPadding;
|
||||
maxLat = maxLat + topPadding;
|
||||
minLng = minLng - leftPadding;
|
||||
maxLng = maxLng + rightPadding;
|
||||
return [{ latitude: minLat, longitude: minLng }, { latitude: maxLat, longitude: maxLng }];
|
||||
},
|
||||
// 获取分类列表
|
||||
getClassifyList() {
|
||||
// type: 1.会员级别，2.行业分类，3.分支机构
|
||||
const endFunction = () => {
|
||||
this.loadEnd = true
|
||||
setTimeout(() => {
|
||||
uni.createSelectorQuery().in(this).select('.diy-member-map').boundingClientRect(data => {
|
||||
this.componentHeight = data?.height
|
||||
}).exec();
|
||||
}, 200);
|
||||
}
|
||||
if (this.showCategory.type == 2) {
|
||||
this.getIndustry(() => {
|
||||
endFunction()
|
||||
})
|
||||
} else if (this.showCategory.type == 3) {
|
||||
this.page = 1
|
||||
this.getInstitution(() => {
|
||||
endFunction()
|
||||
})
|
||||
} else {
|
||||
this.getMemberLevel(() => {
|
||||
endFunction()
|
||||
})
|
||||
}
|
||||
},
|
||||
// 获取会员级别
|
||||
getMemberLevel(fn) {
|
||||
this.$util.request("member.level").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.classifyList = res.data || []
|
||||
if (fn) fn()
|
||||
} else {
|
||||
if (fn) fn()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
if (fn) fn()
|
||||
console.error('获取会员级别 ', error)
|
||||
})
|
||||
},
|
||||
// 获取行业分类
|
||||
getIndustry(fn) {
|
||||
this.$util.request("member.industry").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.classifyList = res.data || []
|
||||
if (fn) fn()
|
||||
} else {
|
||||
if (fn) fn()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
if (fn) fn()
|
||||
console.error('获取行业分类 ', error)
|
||||
})
|
||||
},
|
||||
// 获取分支机构
|
||||
getInstitution(fn) {
|
||||
this.$util.request("institution.list", {
|
||||
page: this.page,
|
||||
limit: this.limit
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
let list = res.data.data
|
||||
this.hasMore = this.page < res.data.total / this.limit ? true : false
|
||||
this.classifyList = this.page == 1 ? list : [...this.classifyList, ...list];
|
||||
if (fn) fn()
|
||||
} else {
|
||||
if (fn) fn()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
if (fn) fn()
|
||||
console.error('获取机构列表', error)
|
||||
})
|
||||
},
|
||||
// 滚动到底部
|
||||
scrollBottom() {
|
||||
if (this.hasMore) {
|
||||
this.page++
|
||||
this.getInstitution()
|
||||
}
|
||||
},
|
||||
// 更换分类
|
||||
changeClassify(id) {
|
||||
if (id == -1) {
|
||||
this.selectClassify = []
|
||||
} else {
|
||||
const index = this.selectClassify.findIndex(item => item == id)
|
||||
if (index > -1) {
|
||||
this.$delete(this.selectClassify, index)
|
||||
} else {
|
||||
this.selectClassify.push(id)
|
||||
}
|
||||
}
|
||||
if (this.loadTimer) clearTimeout(this.loadTimer)
|
||||
this.loadTimer = setTimeout(() => {
|
||||
this.getMemberList()
|
||||
}, 400);
|
||||
},
|
||||
// 跳转会员详情
|
||||
toMemberDetails(res) {
|
||||
if (this.toPageTimer) clearTimeout(this.toPageTimer)
|
||||
this.toPageTimer = setTimeout(() => {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/details?id=" + res.detail.markerId,
|
||||
})
|
||||
}, 50);
|
||||
},
|
||||
// 展开/折叠分类列表
|
||||
handleExpand(type) {
|
||||
uni.createSelectorQuery().in(this).select('.diy-member-map').boundingClientRect(data => {
|
||||
this.componentHeight = data?.height
|
||||
}).exec();
|
||||
if (this.showCategory.styleMode == 2) {
|
||||
this.isExpandCategory2 = type == 1 ? true : false
|
||||
} else {
|
||||
this.isExpandCategory1 = !this.isExpandCategory1
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-member-map {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
&.flex-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.map-context {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
.map {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.callout-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 16rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
|
||||
.item-avatar {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
border-radius: 16rpx;
|
||||
object-fit: cover;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.map-classify {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
|
||||
.classify-list {
|
||||
height: 100%;
|
||||
|
||||
.list-item {
|
||||
line-height: 1.4;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.classify-more {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 12rpx 24rpx;
|
||||
gap: 8rpx;
|
||||
|
||||
.more-icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.more-text {
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&.style-1 {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
|
||||
.classify-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.classify-more {
|
||||
min-width: 184rpx;
|
||||
margin-bottom: 16rpx;
|
||||
width: 100%;
|
||||
|
||||
.more-icon {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
&.collapse {
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
|
||||
.more-icon {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.style-2 {
|
||||
.classify-list {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
||||
.list-item {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.map-more {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 12rpx 24rpx;
|
||||
|
||||
.more-icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.more-text {
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.map-popup {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
|
||||
.popup-classify {
|
||||
position: relative;
|
||||
|
||||
.classify-scroll {
|
||||
box-sizing: border-box;
|
||||
|
||||
.scroll-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.list-item {
|
||||
line-height: 1.4;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-space {
|
||||
width: 100%;
|
||||
height: 56rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.classify-more {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 12rpx 24rpx;
|
||||
|
||||
.more-icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
.more-text {
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
124
pages/component/diy/menuDiy.vue
Normal file
124
pages/component/diy/menuDiy.vue
Normal file
@@ -0,0 +1,124 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-按钮组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-menu">
|
||||
<block v-for="(item, index) in showData" :key="index">
|
||||
<button class="menu-item clear" open-type="contact" :style="{marginTop: (index >= parseInt(showStyle.rowsNum) ? itemSpace : 0), width: `calc(100% / ${showStyle.rowsNum})`}" v-if="item.link && item.link.type == 'Service'">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image mode="widthFix" :src="getImagePath(item.imgUrl)" :style="{borderRadius: borderRadius}"></image>
|
||||
</view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
</button>
|
||||
<view class="menu-item" :style="{marginTop: (index >= parseInt(showStyle.rowsNum) ? itemSpace : 0), width: `calc(100% / ${showStyle.rowsNum})`}" @click="onClick(item.link, item.text)" v-else>
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image mode="widthFix" :src="getImagePath(item.imgUrl)" :style="{borderRadius: borderRadius}"></image>
|
||||
</view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'menuDiy',
|
||||
props: ['showStyle', 'showData', 'domain'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
iconSize() {
|
||||
let size = this.showStyle.iconSize || 44
|
||||
return uni.upx2px(size * 2) + 'px';
|
||||
},
|
||||
borderRadius() {
|
||||
return uni.upx2px(this.showStyle.borderRadius * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
let size = this.showStyle.fontSize || 14
|
||||
return uni.upx2px(size * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 点击事件
|
||||
onClick(e, title) {
|
||||
if (!e) return;
|
||||
if (e.type == "Custom" && e.path.indexOf('/pages/article/index') > -1) {
|
||||
if (e.path.indexOf("?") > -1) e.path += `&title=${encodeURIComponent(title || "")}`
|
||||
else e.path += `?title=${encodeURIComponent(title || "")}`
|
||||
}
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.diy-menu {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.menu-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.item-image {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.item-text {
|
||||
width: 100%;
|
||||
line-height: 1;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
139
pages/component/diy/navDiy.vue
Normal file
139
pages/component/diy/navDiy.vue
Normal file
@@ -0,0 +1,139 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-导航组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-nav" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<block v-if="!showStyle.rowsLimit || showStyle.rowsLimit == -1">
|
||||
<menu-diy :showStyle="showStyle" :showData="showData" :domain="domain" @onClick="onClick"></menu-diy>
|
||||
</block>
|
||||
<block v-else-if="menuList.length == 1">
|
||||
<menu-diy :showStyle="showStyle" :showData="menuList[0]" :domain="domain" @onClick="onClick"></menu-diy>
|
||||
</block>
|
||||
<block v-else>
|
||||
<swiper :style="{height: carouselHeight}" @change="carouselChange">
|
||||
<swiper-item v-for="(menu, number) in menuList" :key="number">
|
||||
<menu-diy :showStyle="showStyle" :showData="menu" :domain="domain" @onClick="onClick"></menu-diy>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="carousel-dots">
|
||||
<view class="dots-item" :style="{background: carouseIndex == i ? (showStyle.dotColor || themeColor) : '#F1F1F1'}" v-for="(d, i) in menuList" :key="i"></view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import menuDiy from './menuDiy.vue'
|
||||
export default {
|
||||
name: 'navDiy',
|
||||
components: {
|
||||
menuDiy
|
||||
},
|
||||
props: ['showStyle', 'showData', 'showParams', 'domain'],
|
||||
data() {
|
||||
return {
|
||||
// 已选索引
|
||||
carouseIndex: 0,
|
||||
// 菜单列表
|
||||
menuList: [],
|
||||
// 轮播图高度
|
||||
carouselHeight: 0,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
showData: {
|
||||
handler(value) {
|
||||
if (value && value.length) {
|
||||
this.menuList = this.splitArray(value);
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
showStyle: {
|
||||
handler(value) {
|
||||
if (value) {
|
||||
let height = 0
|
||||
let iconSize = value.iconSize || 44
|
||||
let fontSize = value.fontSize || 14
|
||||
if (value.rowsLimit) {
|
||||
height = `calc(${uni.upx2px(((iconSize + fontSize) * value.rowsLimit + value.itemSpace * (value.rowsLimit - 1)) * 2)}px + ${12 * value.rowsLimit}rpx)`
|
||||
}
|
||||
this.carouselHeight = height;
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
}),
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 轮播图切换
|
||||
carouselChange(e) {
|
||||
this.carouseIndex = e.detail.current
|
||||
},
|
||||
// 切割数组
|
||||
splitArray(arr) {
|
||||
var result = [];
|
||||
if (this.showStyle.rowsLimit && this.showStyle.rowsLimit > 0 && arr.length > this.showStyle.rowsNum * this.showStyle.rowsLimit) {
|
||||
for (var i = 0; i < arr.length; i += parseInt(this.showStyle.rowsNum * this.showStyle.rowsLimit)) {
|
||||
var chunk = arr.slice(i, i + parseInt(this.showStyle.rowsNum * this.showStyle.rowsLimit));
|
||||
result.push(chunk);
|
||||
}
|
||||
} else {
|
||||
result[0] = arr
|
||||
}
|
||||
return result;
|
||||
},
|
||||
// 点击事件
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.diy-nav {
|
||||
.carousel-dots {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 20px;
|
||||
|
||||
.dots-item {
|
||||
width: 24rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 8rpx;
|
||||
background: #F1F1F1;
|
||||
margin-right: 4rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
386
pages/component/diy/noticeDiy.vue
Normal file
386
pages/component/diy/noticeDiy.vue
Normal file
@@ -0,0 +1,386 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-消息通知 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view v-if="show" class="uni-noticebar" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}" @click="onClick">
|
||||
<view v-if="showParams.showImg && showParams.icon" class="zan-noticebar__left-icon" style="float: left;">
|
||||
<image :src="getImagePath(showParams.icon)" mode="aspectFit" />
|
||||
</view>
|
||||
<view ref="textBox" class="uni-noticebar__content-wrapper" :class="{'uni-noticebar__content-wrapper--scrollable':scrollable, 'uni-noticebar__content-wrapper--single':!scrollable && (single || moreText)}">
|
||||
<view :id="elIdBox" class="uni-noticebar__content" :class="{'uni-noticebar__content--scrollable':scrollable, 'uni-noticebar__content--single':!scrollable && (single || moreText)}">
|
||||
<text :id="elId" ref="animationEle" class="uni-noticebar__content-text" :class="{'uni-noticebar__content-text--scrollable':scrollable,'uni-noticebar__content-text--single':!scrollable && (single || moreText)}" :style="{color: showStyle.textColor, width:wrapWidth+'px', 'animationDuration': animationDuration, '-webkit-animationDuration': animationDuration ,animationPlayState: webviewHide?'paused':animationPlayState,'-webkit-animationPlayState':webviewHide?'paused':animationPlayState, animationDelay: animationDelay, '-webkit-animationDelay':animationDelay}">{{showParams.text}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="showGetMore === true || showGetMore === 'true'" class="uni-noticebar__more" @click="clickMore">
|
||||
<text v-if="moreText" :style="{ color: moreColor }" class="uni-noticebar__more-text">{{ moreText }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef APP-NVUE
|
||||
const dom = weex.requireModule('dom');
|
||||
const animation = weex.requireModule('animation');
|
||||
// #endif
|
||||
export default {
|
||||
name: 'notice',
|
||||
props: {
|
||||
moreText: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
speed: {
|
||||
// 默认1s滚动100px
|
||||
type: Number,
|
||||
default: 100
|
||||
},
|
||||
moreColor: {
|
||||
type: String,
|
||||
default: '#999999'
|
||||
},
|
||||
single: {
|
||||
// 是否单行
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
},
|
||||
scrollable: {
|
||||
// 是否滚动，添加后控制单行效果取消
|
||||
type: [Boolean, String],
|
||||
default: true
|
||||
},
|
||||
showGetMore: {
|
||||
// 是否显示右侧查看更多
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
},
|
||||
showClose: {
|
||||
// 是否显示左侧关闭按钮
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
},
|
||||
showStyle: {},
|
||||
showParams: {},
|
||||
domain: '',
|
||||
},
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
data() {
|
||||
const elId = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
|
||||
const elIdBox = `Uni_${Math.ceil(Math.random() * 10e5).toString(36)}`
|
||||
return {
|
||||
textWidth: 0,
|
||||
boxWidth: 0,
|
||||
wrapWidth: '',
|
||||
webviewHide: false,
|
||||
// #ifdef APP-NVUE
|
||||
stopAnimation: false,
|
||||
// #endif
|
||||
elId: elId,
|
||||
elIdBox: elIdBox,
|
||||
show: true,
|
||||
animationDuration: 'none',
|
||||
animationPlayState: 'paused',
|
||||
animationDelay: '0s',
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// #ifdef APP-PLUS
|
||||
var pages = getCurrentPages();
|
||||
var page = pages[pages.length - 1];
|
||||
var currentWebview = page.$getAppWebview();
|
||||
currentWebview.addEventListener('hide', () => {
|
||||
this.webviewHide = true
|
||||
})
|
||||
currentWebview.addEventListener('show', () => {
|
||||
this.webviewHide = false
|
||||
})
|
||||
// #endif
|
||||
this.$nextTick(() => {
|
||||
this.initSize()
|
||||
})
|
||||
},
|
||||
// #ifdef APP-NVUE
|
||||
beforeDestroy() {
|
||||
this.stopAnimation = true
|
||||
},
|
||||
// #endif
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
initSize() {
|
||||
if (this.scrollable) {
|
||||
// #ifndef APP-NVUE
|
||||
let query = [],
|
||||
boxWidth = 0,
|
||||
textWidth = 0;
|
||||
let textQuery = new Promise((resolve, reject) => {
|
||||
uni.createSelectorQuery()
|
||||
// #ifndef MP-ALIPAY
|
||||
.in(this)
|
||||
// #endif
|
||||
.select(`#${this.elId}`)
|
||||
.boundingClientRect()
|
||||
.exec(ret => {
|
||||
this.textWidth = ret[0].width
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
let boxQuery = new Promise((resolve, reject) => {
|
||||
uni.createSelectorQuery()
|
||||
// #ifndef MP-ALIPAY
|
||||
.in(this)
|
||||
// #endif
|
||||
.select(`#${this.elIdBox}`)
|
||||
.boundingClientRect()
|
||||
.exec(ret => {
|
||||
this.boxWidth = ret[0].width
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
query.push(textQuery)
|
||||
query.push(boxQuery)
|
||||
Promise.all(query).then(() => {
|
||||
this.animationDuration = `${this.textWidth / this.speed}s`
|
||||
this.animationDelay = `-${this.boxWidth / this.speed}s`
|
||||
setTimeout(() => {
|
||||
this.animationPlayState = 'running'
|
||||
}, 1000)
|
||||
})
|
||||
// #endif
|
||||
// #ifdef APP-NVUE
|
||||
dom.getComponentRect(this.$refs['animationEle'], (res) => {
|
||||
let winWidth = uni.getSystemInfoSync().windowWidth
|
||||
this.textWidth = res.size.width
|
||||
animation.transition(this.$refs['animationEle'], {
|
||||
styles: {
|
||||
transform: `translateX(-${winWidth}px)`
|
||||
},
|
||||
duration: 0,
|
||||
timingFunction: 'linear',
|
||||
delay: 0
|
||||
}, () => {
|
||||
if (!this.stopAnimation) {
|
||||
animation.transition(this.$refs['animationEle'], {
|
||||
styles: {
|
||||
transform: `translateX(-${this.textWidth}px)`
|
||||
},
|
||||
timingFunction: 'linear',
|
||||
duration: (this.textWidth - winWidth) / this.speed * 1000,
|
||||
delay: 1000
|
||||
}, () => {
|
||||
if (!this.stopAnimation) {
|
||||
this.loopAnimation()
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
// #endif
|
||||
}
|
||||
// #ifdef APP-NVUE
|
||||
if (!this.scrollable && (this.single || this.moreText)) {
|
||||
dom.getComponentRect(this.$refs['textBox'], (res) => {
|
||||
this.wrapWidth = res.size.width
|
||||
})
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
loopAnimation() {
|
||||
// #ifdef APP-NVUE
|
||||
animation.transition(this.$refs['animationEle'], {
|
||||
styles: {
|
||||
transform: `translateX(0px)`
|
||||
},
|
||||
duration: 0
|
||||
}, () => {
|
||||
if (!this.stopAnimation) {
|
||||
animation.transition(this.$refs['animationEle'], {
|
||||
styles: {
|
||||
transform: `translateX(-${this.textWidth}px)`
|
||||
},
|
||||
duration: this.textWidth / this.speed * 1000,
|
||||
timingFunction: 'linear',
|
||||
delay: 0
|
||||
}, () => {
|
||||
if (!this.stopAnimation) {
|
||||
this.loopAnimation()
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
clickMore() {
|
||||
this.$emit('getmore')
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
this.$emit('close')
|
||||
},
|
||||
onClick() {
|
||||
this.$emit('click')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.uni-noticebar {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: 6px 12px;
|
||||
// margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.uni-noticebar-close {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.uni-noticebar-icon {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.uni-noticebar__content-wrapper {
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.uni-noticebar__content-wrapper--single {
|
||||
/* #ifndef APP-NVUE */
|
||||
line-height: 18px;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-noticebar__content-wrapper--single,
|
||||
.uni-noticebar__content-wrapper--scrollable {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
/* #ifndef APP-NVUE */
|
||||
.uni-noticebar__content-wrapper--scrollable {
|
||||
position: relative;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
.uni-noticebar__content--scrollable {
|
||||
/* #ifdef APP-NVUE */
|
||||
flex: 0;
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
flex: 1;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-noticebar__content--single {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: flex;
|
||||
flex: none;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-noticebar__content-text {
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
/* #ifndef APP-NVUE */
|
||||
word-break: break-all;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-noticebar__content-text--single {
|
||||
/* #ifdef APP-NVUE */
|
||||
lines: 1;
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
display: block;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
/* #endif */
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.uni-noticebar__content-text--scrollable {
|
||||
/* #ifdef APP-NVUE */
|
||||
lines: 1;
|
||||
padding-left: 750rpx;
|
||||
/* #endif */
|
||||
/* #ifndef APP-NVUE */
|
||||
position: absolute;
|
||||
display: block;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
white-space: nowrap;
|
||||
padding-left: 100%;
|
||||
animation: notice 10s 0s linear infinite both;
|
||||
animation-play-state: paused;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.uni-noticebar__more {
|
||||
/* #ifndef APP-NVUE */
|
||||
display: inline-flex;
|
||||
/* #endif */
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.uni-noticebar__more-text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@keyframes notice {
|
||||
100% {
|
||||
transform: translate3d(-100%, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.zan-noticebar__left-icon {
|
||||
height: 36upx;
|
||||
min-width: 40upx;
|
||||
padding-top: 2upx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.zan-noticebar__left-icon>image {
|
||||
width: 32upx;
|
||||
height: 32upx;
|
||||
}
|
||||
</style>
|
||||
36
pages/component/diy/richTextDiy.vue
Normal file
36
pages/component/diy/richTextDiy.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-富文本 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<!-- 富文本 -->
|
||||
<view class="diy-richText" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<mp-html :content="showParams.content" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'richTextDiy',
|
||||
props: ['showStyle', 'showParams'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
95
pages/component/diy/searchDiy.vue
Normal file
95
pages/component/diy/searchDiy.vue
Normal file
@@ -0,0 +1,95 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-搜索 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-search" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="search-input" :style="{'--placeholder-color': showStyle.placeholderColor, padding: inputPaddingTop + ' ' + inputPaddingLeft, background: showStyle.inputBackground, borderRadius: inputBorderRadius}">
|
||||
<view :style="{'background-image': 'url('+ iconSearch +')', width: iconSize, height: iconSize, backgroundSize: iconSize}" v-if="iconSearch"></view>
|
||||
<input class="input-box" type="text" confirm-type="search" :style="{fontSize: fontSize, color: showStyle.inputColor}" :placeholder="showParams.placeholder" placeholder-class="placeholder" @confirm="handleSearch" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "searchDiy",
|
||||
props: ['showStyle', 'showParams'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
iconSearch() {
|
||||
return svgData.svgToUrl("search", this.showStyle.iconColor)
|
||||
},
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
|
||||
},
|
||||
inputBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.inputBorderRadius * 2) + 'px';
|
||||
},
|
||||
inputPaddingTop() {
|
||||
return uni.upx2px(this.showStyle.inputPaddingTop * 2) + 'px';
|
||||
},
|
||||
inputPaddingLeft() {
|
||||
return uni.upx2px(this.showStyle.inputPaddingLeft * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 搜索
|
||||
handleSearch(e) {
|
||||
if (!e.detail.value) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: this.showParams.placeholder,
|
||||
duration: 2000
|
||||
})
|
||||
return
|
||||
}
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pages/diy/search?keyword=${encodeURIComponent(e.detail.value)}`
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-search {
|
||||
.search-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.input-box {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
min-height: auto;
|
||||
line-height: 1.4;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
color: var(--placeholder-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
88
pages/component/diy/textButtonDiy.vue
Normal file
88
pages/component/diy/textButtonDiy.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-按钮组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-text-button" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<block v-for="(item, index) in showData" :key="index">
|
||||
<button class="item clear" open-type="contact" :style="{color: showStyle.textColor, fontSize: fontSize}" v-if="item.link && item.link.type == 'Service'">
|
||||
{{item.text}}
|
||||
</button>
|
||||
<view class="item" :style="{color: showStyle.textColor, fontSize: fontSize}" @click="onClick(item.link)" v-else>
|
||||
<text>{{item.text}}</text>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'textButtonDiy',
|
||||
props: ['showStyle', 'showData'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.diy-text-button {
|
||||
height: auto;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
padding: 0.5rem;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
color: #666;
|
||||
font-size: 0.75rem;
|
||||
width: 1%;
|
||||
display: table-cell;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
transition: background-color 300ms;
|
||||
-webkit-transition: background-color 300ms;
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
40
pages/component/diy/textDiy.vue
Normal file
40
pages/component/diy/textDiy.vue
Normal file
@@ -0,0 +1,40 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-文本组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view :style="{background: showStyle.background, borderRadius: itemBorderRadius, padding: paddingTop +' '+ paddingLeft, textAlign: showStyle.textAlign, color: showStyle.textColor, fontSize: fontSize}">
|
||||
<text v-if="showStyle.fontStyle == 'bold'" style="font-weight: bold;">{{showStyle.text}}</text>
|
||||
<text v-else-if="showStyle.fontStyle == 'italic'" style="font-style: italic;">{{showStyle.text}}</text>
|
||||
<text v-else>{{showStyle.text}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'textDiy',
|
||||
props: ['showStyle'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
55
pages/component/diy/timelineDiy.vue
Normal file
55
pages/component/diy/timelineDiy.vue
Normal file
@@ -0,0 +1,55 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-时间线 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-timeline" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<u-time-line>
|
||||
<u-time-line-item v-for="(item,index) in showData" :key="index" :bgColor="item.color">
|
||||
<template v-slot:content>
|
||||
<view>
|
||||
<view class="u-order-desc">{{item.content}}</view>
|
||||
<view class="u-order-time" v-if="item.hide">{{item.time}}</view>
|
||||
</view>
|
||||
</template>
|
||||
</u-time-line-item>
|
||||
</u-time-line>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['showStyle', 'showData'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-timeline .u-order-time {
|
||||
color: rgb(200, 200, 200);
|
||||
font-size: 26rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.diy-timeline .u-time-axis-item {
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
</style>
|
||||
106
pages/component/diy/titleDiy.vue
Normal file
106
pages/component/diy/titleDiy.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-标题 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-title" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<view class="title-text" :style="{fontSize: fontSize, color: showStyle.color}">
|
||||
<text class="italic" v-if="showStyle.fontStyle == 'italic'">{{showParams.title}}</text>
|
||||
<text class="bold" v-else-if="showStyle.fontStyle == 'bold'">{{showParams.title}}</text>
|
||||
<text v-else>{{showParams.title}}</text>
|
||||
</view>
|
||||
<button class="title-btn clear" open-type="contact" v-if="showParams.link && showParams.link.type == 'Service'">
|
||||
<text :style="{fontSize: btnSize, color: showStyle.btnColor}" v-if="showParams.btnType == 'text'">{{showParams.btnText}}</text>
|
||||
<view class="btn" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconMore +')'}" v-else-if="iconMore && showParams.btnType == 'icon'"></view>
|
||||
</button>
|
||||
<view class="title-btn" @click="onClick(showParams.link)" v-else>
|
||||
<text :style="{fontSize: btnSize, color: showStyle.btnColor}" v-if="showParams.btnType == 'text'">{{showParams.btnText}}</text>
|
||||
<view class="btn" :style="{width: iconSize, height: iconSize, backgroundSize: iconSize, backgroundImage: 'url('+ iconMore +')'}" v-else-if="iconMore && showParams.btnType == 'icon'"></view>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="btn-absolute" :appid="showParams.link.appid" :path="showParams.link.path" v-if="showParams.link && showParams.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .wx-btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="wx-btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: 'titleDiy',
|
||||
props: ['showStyle', 'showParams'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
|
||||
},
|
||||
btnSize() {
|
||||
return uni.upx2px(this.showStyle.btnSize * 2) + 'px';
|
||||
},
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
iconMore() {
|
||||
return svgData.svgToUrl("more", this.showStyle.btnColor)
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 点击事件
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$emit("onClick", e)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.title-text {
|
||||
.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.title-btn {
|
||||
position: relative;
|
||||
|
||||
.btn-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
52
pages/component/diy/videoDiy.vue
Normal file
52
pages/component/diy/videoDiy.vue
Normal file
@@ -0,0 +1,52 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-视频 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-video" :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<video :src="showParams.videoUrl" :poster="getImagePath(showParams.poster)" :autoplay="showParams.autoplay == 1" controls="false"></video>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'videoDiy',
|
||||
props: ['showStyle', 'showParams', 'domain'],
|
||||
computed: {
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.diy-video video {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
48
pages/component/diy/warnDiy.vue
Normal file
48
pages/component/diy/warnDiy.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-警告提示 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<block v-if="isshow">
|
||||
<view :style="{padding: paddingTop + ' ' + paddingLeft, background: showStyle.background, borderRadius: itemBorderRadius}">
|
||||
<u-alert-tips :type="showStyle.type" :title="showParams.title" :description="showParams.description" :close-able="showParams.closable" :show="show" @close="onClick" :show-icon="showParams.showIcon"></u-alert-tips>
|
||||
</view>
|
||||
</block>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['showStyle', 'showParams'],
|
||||
computed: {
|
||||
itemBorderRadius() {
|
||||
return uni.upx2px(this.showStyle.itemBorderRadius * 2) + 'px';
|
||||
},
|
||||
paddingTop() {
|
||||
return uni.upx2px(this.showStyle.paddingTop * 2) + 'px';
|
||||
},
|
||||
paddingLeft() {
|
||||
return uni.upx2px(this.showStyle.paddingLeft * 2) + 'px';
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: true,
|
||||
isshow: true,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onClick() {
|
||||
this.show = false;
|
||||
this.isshow = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
92
pages/component/empty/empty.vue
Normal file
92
pages/component/empty/empty.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-内容为空 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-empty" :style="{marginTop: top, padding: padding}">
|
||||
<image class="image" :style="{width: width, height: width}" src="/static/empty.png" mode="widthFix"></image>
|
||||
<view class="text" :style="{fontSize: size}">
|
||||
<text>{{title}}</text>
|
||||
<view class="btn" @click="callback" v-if="btnText" :style="{ color: themeColor }">{{btnText}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "emptyIndex",
|
||||
props: {
|
||||
// 距顶部位置 注：center为居中显示
|
||||
top: {
|
||||
type: String,
|
||||
default: "32rpx"
|
||||
},
|
||||
// 盒子内边距
|
||||
padding: {
|
||||
type: String,
|
||||
default: "32rpx"
|
||||
},
|
||||
// 图标尺寸
|
||||
width: {
|
||||
type: String,
|
||||
default: "260rpx"
|
||||
},
|
||||
// 文字大小
|
||||
size: {
|
||||
type: String,
|
||||
default: "32rpx"
|
||||
},
|
||||
// 标题
|
||||
title: {
|
||||
type: String,
|
||||
default: "暂无相关内容~"
|
||||
},
|
||||
// 快捷按钮文字 注：为空则不显示
|
||||
btnText: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 快捷按钮回调函数
|
||||
callback() {
|
||||
this.$emit("callback")
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-empty {
|
||||
text-align: center;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
margin: 0 auto 32rpx;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #888;
|
||||
line-height: 1.4;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
85
pages/component/mall/goods.vue
Normal file
85
pages/component/mall/goods.vue
Normal file
@@ -0,0 +1,85 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-商会商品 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-mall-goods">
|
||||
<view class="goods-item flex" v-for="item in showData" :key="item.id" @click="toDetails(item.id)">
|
||||
<image class="item-image" :src="item.image" mode="aspectFill"></image>
|
||||
<view class="item-info flex-item flex-direction-column justify-content-between">
|
||||
<view class="info-title text-ellipsis-more">{{ item.name }}</view>
|
||||
<view class="info-price">￥{{ item.price }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "mallGoods",
|
||||
props: ["showData"],
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 跳转商品详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pagesMall/goods/details?id=" + id
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-mall-goods {
|
||||
.goods-item {
|
||||
margin-top: 32rpx;
|
||||
padding: 32rpx;
|
||||
background: #FFF;
|
||||
border-radius: 10rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
margin-left: 24rpx;
|
||||
|
||||
.info-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.info-price {
|
||||
margin-top: 16rpx;
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
969
pages/component/member/apply.vue
Normal file
969
pages/component/member/apply.vue
Normal file
@@ -0,0 +1,969 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-申请入会 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-member-apply" :style="{'--theme-color': themeColor}">
|
||||
<!-- 表单数据 -->
|
||||
<form class="component-member-apply-form">
|
||||
<view class="component-member-apply-form-item" v-for="(item, index) in applyField" :key="index" v-if="!isApply || item.apply_show != 2">
|
||||
<!-- 标题 -->
|
||||
<view class="item-title">
|
||||
<text class="required" v-if="item.required == 1">*</text>
|
||||
<text class="text">{{item.label}}</text>
|
||||
<text class="tips" v-if="item.type == 'image' || item.type == 'cert' || item.type == 'video' || item.type == 'file'">（{{item.option}}）</text>
|
||||
</view>
|
||||
<!-- 文本字段 -->
|
||||
<block v-if="item.type == 'text'">
|
||||
<!-- 地址选择 -->
|
||||
<view class="item-input" @click="chooseLocation(index)" v-if="showType == 1 && item.field == 'address'">
|
||||
<view class="input text-ellipsis" v-if="item.value.address">{{item.value.address}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value.address" @click.stop="clearLocation(index)"></image>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
<!-- 文本框 -->
|
||||
<view class="item-input" :class="{disabled: item.disabled}" v-else>
|
||||
<input class="input" :disabled="item.disabled" type="text" v-model="item.value" :placeholder="item.option" placeholder-class="placeholder" />
|
||||
</view>
|
||||
</block>
|
||||
<!-- 数字字段 -->
|
||||
<block v-else-if="item.type == 'number'">
|
||||
<view class="item-input" :class="{disabled: item.disabled}">
|
||||
<input class="input" :disabled="item.disabled" type="number" :maxlength="(showType == 1 && item.field == 'mobile') ? 11 : -1" v-model="item.value" :placeholder="item.option" placeholder-class="placeholder" />
|
||||
</view>
|
||||
<view class="item-switch" @click="changeMobileAuth()" v-if="showType == 1 && item.field == 'mobile' && mobileAuth">
|
||||
<view class="switch-label">手机号是否对外</view>
|
||||
<view class="switch-box" :class="{'select': mobileAuth == 1}">
|
||||
<view class="round"></view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 单选按钮 -->
|
||||
<block v-else-if="item.type == 'radio'">
|
||||
<view class="item-radio">
|
||||
<view class="radio" :class="{active: item.value == option}" v-for="(option, num) in getOption(item.option)" :key="num" @click="selectRadio(index, option)">
|
||||
<image src="/static/select.png" mode="aspectFit"></image>
|
||||
<text>{{option}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 复选按钮 -->
|
||||
<block v-else-if="item.type == 'checkbox'">
|
||||
<view class="item-radio">
|
||||
<view class="radio" :class="{active: item.value.includes(option)}" v-for="(option, num) in getOption(item.option)" :key="num" @click="selectCheckbox(index, option)">
|
||||
<image src="/static/select.png" mode="aspectFit"></image>
|
||||
<text>{{option}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 下拉列表 -->
|
||||
<block v-else-if="item.type == 'select'">
|
||||
<!-- 会员级别 -->
|
||||
<view class="item-input" :class="{disabled: item.disabled}" @click="openSelectPicker(index)" v-if="showType == 1 && item.field == 'member_level_id'">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{getMemberLevelName(item.value)}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-if="!item.disabled"></image>
|
||||
</view>
|
||||
<!-- 行业分类 -->
|
||||
<view class="item-input" @click="openSelectPicker(index)" v-else-if="showType == 1 && item.field == 'industry_category_id'">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{getIndustryName(item.value)}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
<!-- 籍贯 -->
|
||||
<view class="item-input" @click="openSelectPicker(index)" v-else-if="showType == 1 && item.field == 'native_place'">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>{{item.option}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
<!-- 下拉列表 -->
|
||||
<view class="item-input" @click="openSelectPicker(index)" v-else>
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 日期字段 -->
|
||||
<block v-else-if="item.type == 'date'">
|
||||
<view class="item-input" @click="openDatePicker(index)">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/date.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 时间字段 -->
|
||||
<block v-else-if="item.type == 'time'">
|
||||
<view class="item-input" @click="openTimePicker(index)">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/time.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 日期时间 -->
|
||||
<block v-else-if="item.type == 'datetime'">
|
||||
<uni-datetime-picker v-model="item.value">
|
||||
<view class="item-input">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{item.value}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>请选择{{item.label}}</view>
|
||||
<image class="icon" src="/static/del.png" mode="aspectFit" v-if="item.value" @click.stop="clearValue(index)"></image>
|
||||
<image class="icon" src="/static/date.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
</uni-datetime-picker>
|
||||
</block>
|
||||
<!-- 文本域 -->
|
||||
<block v-else-if="item.type == 'textarea'">
|
||||
<view class="item-input" @click="toEditor(index)" v-if="showType == 1 && item.field == 'introduce_content'">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{getEditorText(item.value) || ('编辑' + item.label)}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>{{item.option}}</view>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="item-input" @click="toEditor(index)" v-else-if="showType == 2 && item.field == 'company_introduction'">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{getEditorText(item.value) || ('编辑' + item.label)}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>{{item.option}}</view>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="item-input" @click="toEditor(index)" v-else-if="showType == 3 && item.field == 'organize_introduction'">
|
||||
<view class="input text-ellipsis" v-if="item.value">{{getEditorText(item.value) || ('编辑' + item.label)}}</view>
|
||||
<view class="input placeholder text-ellipsis" v-else>{{item.option}}</view>
|
||||
<image class="icon" src="/static/right.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="item-input" v-else>
|
||||
<textarea class="textarea" type="text" maxlength="-1" v-model="item.value" :placeholder="item.option" placeholder-class="placeholder" />
|
||||
</view>
|
||||
</block>
|
||||
<!-- 证书上传 -->
|
||||
<block v-else-if="item.type == 'cert'">
|
||||
<view class="item-input">
|
||||
<input class="input" type="text" v-model="item.value.name" placeholder="请输入姓名" placeholder-class="placeholder" />
|
||||
</view>
|
||||
<view class="item-input">
|
||||
<input class="input" type="text" v-model="item.value.number" placeholder="请输入证书编号" placeholder-class="placeholder" />
|
||||
</view>
|
||||
<view class="item-upload">
|
||||
<view class="upload-image" v-if="item.value.image" @click="previewImage(index)">
|
||||
<image class="image-select" :src="item.value.image" mode="aspectFill"></image>
|
||||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||||
</view>
|
||||
<view class="upload-image" v-else @click="chooseImage(index, 1)">
|
||||
<view class="image-background"></view>
|
||||
<view class="image-choose">
|
||||
<view class="icon">
|
||||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="text">上传证书</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 图片上传 -->
|
||||
<block v-else-if="item.type == 'image'">
|
||||
<!-- 单图上传 -->
|
||||
<view class="item-upload" v-if="(showType == 1 && item.field == 'avatar') || (showType == 2 && item.field == 'company_logo') || (showType == 3 && item.field == 'organize_logo')">
|
||||
<view class="upload-image" v-if="item.value" @click="previewImage(index)">
|
||||
<image class="image-select" :src="item.value" mode="aspectFill"></image>
|
||||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index)"></image>
|
||||
</view>
|
||||
<view class="upload-image" v-else @click="chooseImage(index, 1)">
|
||||
<view class="image-background"></view>
|
||||
<view class="image-choose">
|
||||
<view class="icon">
|
||||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="text">点击上传</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 多图上传 -->
|
||||
<view class="item-upload" v-else>
|
||||
<view class="upload-image" v-if="item.value && item.value.length > 0" v-for="(img, num) in item.value" :key="num" @click="previewImage(index, num)">
|
||||
<image class="image-select" :src="img" mode="aspectFill"></image>
|
||||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click.stop="deleteImage(index, num)"></image>
|
||||
</view>
|
||||
<view class="upload-image" v-if="!item.value || item.value.length < 9" @click="chooseImage(index, 9)">
|
||||
<view class="image-background"></view>
|
||||
<view class="image-choose">
|
||||
<view class="icon">
|
||||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="text">上传图片</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 视频上传 -->
|
||||
<block v-else-if="item.type == 'video'">
|
||||
<view class="item-upload">
|
||||
<view class="upload-image" v-if="item.value">
|
||||
<view class="image-video">
|
||||
<image class="video" src="/static/video.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<image class="image-delete" src="/static/delete.png" mode="aspectFit" @click="deleteVideo(index)"></image>
|
||||
</view>
|
||||
<view class="upload-image" v-else @click="chooseVideo(index)">
|
||||
<view class="image-background"></view>
|
||||
<view class="image-choose">
|
||||
<view class="icon">
|
||||
<image src="/static/camera.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="text">上传视频</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- 文件上传 -->
|
||||
<block v-else-if="item.type == 'file'">
|
||||
<view class="item-files">
|
||||
<view class="files-upload flex align-items-center" v-if="!item.value || item.value.length < 9" @click="chooseFiles(index)">
|
||||
<view class="upload-icon" :style="{'background-image': 'url('+ iconUpload +')'}" v-if="iconUpload"></view>
|
||||
<view class="upload-info flex-item">
|
||||
<view class="info-title">点击上传</view>
|
||||
<view class="info-tips" v-if="item.value.length">已上传{{item.value.length}}/9，每个附件大小不能超过10M</view>
|
||||
<view class="info-tips" v-else>可上传9个，每个附件大小不能超过10M</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="files-list" v-if="item.value && item.value.length > 0">
|
||||
<view class="list-item flex align-items-center" v-for="(file, num) in item.value" :key="num">
|
||||
<view class="item-name flex-item">{{file.name}}</view>
|
||||
<image class="item-delete" src="/static/delete.png" mode="aspectFit" @click="deleteFiles(index, num)"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</form>
|
||||
<!-- 单项选择框 -->
|
||||
<select-picker ref="selectPicker" :title="selectTitle" @onChange="pageChange" @confirm="changeSelectPicker"></select-picker>
|
||||
<!-- 省市区选择框 -->
|
||||
<address-picker ref="addressPicker" @onChange="pageChange" @confirm="changeSelectPicker"></address-picker>
|
||||
<!-- 日期选择框 -->
|
||||
<date-picker ref="datePicker" @onChange="pageChange" @confirm="changeDatePicker"></date-picker>
|
||||
<!-- 时间选择框 -->
|
||||
<time-picker ref="timePicker" @onChange="pageChange" @confirm="changeTimePicker"></time-picker>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import selectPicker from "@/pages/component/picker/select.vue"
|
||||
import addressPicker from "@/pages/component/picker/address.vue"
|
||||
import datePicker from "@/pages/component/picker/date.vue"
|
||||
import timePicker from "@/pages/component/picker/time.vue"
|
||||
import svgData from "@/common/svg.js"
|
||||
export default {
|
||||
name: "memberApply",
|
||||
props: ["isApply", "showData", "showType", "mobileAuth"],
|
||||
components: {
|
||||
selectPicker,
|
||||
addressPicker,
|
||||
datePicker,
|
||||
timePicker,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 入会字段
|
||||
applyField: [],
|
||||
// 会员级别
|
||||
levelList: [],
|
||||
// 行业分类
|
||||
industryList: [],
|
||||
// 单选标题
|
||||
selectTitle: "",
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
showData: {
|
||||
handler(value) {
|
||||
this.applyField = value || [];
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
iconUpload: state => {
|
||||
return svgData.svgToUrl("upload", state.app.themeColor)
|
||||
}
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
if (this.showType == 1) {
|
||||
this.getIndustry()
|
||||
this.getMemberLevel()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 改变页面滚动状态
|
||||
pageChange(state) {
|
||||
this.$emit("onChange", state)
|
||||
},
|
||||
// 获取选项数据
|
||||
getOption(option) {
|
||||
return option.split(",")
|
||||
},
|
||||
// 获取会员级别
|
||||
getMemberLevel(fn) {
|
||||
this.$util.request("member.level").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.levelList = res.data
|
||||
if (fn) fn()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取会员级别 ', error)
|
||||
})
|
||||
},
|
||||
// 获取行业分类
|
||||
getIndustry(fn) {
|
||||
this.$util.request("member.industry").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.industryList = res.data
|
||||
if (fn) fn()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取行业分类 ', error)
|
||||
})
|
||||
},
|
||||
// 获取会员级别名称
|
||||
getMemberLevelName(id) {
|
||||
for (let i in this.levelList) {
|
||||
if (this.levelList[i].id == id) return this.levelList[i].name
|
||||
}
|
||||
},
|
||||
// 获取行业分类
|
||||
getIndustryName(id) {
|
||||
for (let i in this.industryList) {
|
||||
if (this.industryList[i].id == id) return this.industryList[i].name
|
||||
}
|
||||
},
|
||||
// 选择单选
|
||||
selectRadio(index, option) {
|
||||
if (this.applyField[index].value == option) {
|
||||
this.applyField[index].value = ""
|
||||
} else {
|
||||
this.applyField[index].value = option
|
||||
}
|
||||
},
|
||||
// 选择复选
|
||||
selectCheckbox(index, option) {
|
||||
if (this.applyField[index].value.includes(option)) {
|
||||
this.$delete(this.applyField[index].value, this.applyField[index].value.indexOf(option))
|
||||
} else {
|
||||
this.applyField[index].value.push(option)
|
||||
}
|
||||
},
|
||||
// 选择图片
|
||||
chooseImage(index, limit = 9) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.chooseMedia({
|
||||
count: Number(limit) > 1 ? (limit - this.applyField[index].value.length) : 1,
|
||||
mediaType: ['image'],
|
||||
sourceType: ['album', 'camera'],
|
||||
sizeType: ['compressed'],
|
||||
success: (res) => {
|
||||
let list = res.tempFiles.map(item => item.tempFilePath)
|
||||
if ((this.showType == 1 && this.applyField[index].field == "avatar") || (this.showType == 2 && this.applyField[index].field == 'company_logo') || (this.showType == 3 && this.applyField[index].field == 'organize_logo')) {
|
||||
this.applyField[index].value = list[0]
|
||||
} else if (this.applyField[index].type == "cert") {
|
||||
this.applyField[index].value.image = list[0]
|
||||
} else {
|
||||
this.applyField[index].value = [...this.applyField[index].value, ...list]
|
||||
}
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
uni.chooseImage({
|
||||
count: Number(limit) > 1 ? (limit - this.applyField[index].value.length) : 1,
|
||||
mediaType: ['image'],
|
||||
sourceType: ['album', 'camera'],
|
||||
sizeType: ['compressed'],
|
||||
success: (res) => {
|
||||
let list = res.tempFilePaths
|
||||
if ((this.showType == 1 && this.applyField[index].field == "avatar") || (this.showType == 2 && this.applyField[index].field == 'company_logo') || (this.showType == 3 && this.applyField[index].field == 'organize_logo')) {
|
||||
this.applyField[index].value = list[0]
|
||||
} else if (this.applyField[index].type == "cert") {
|
||||
this.applyField[index].value.image = list[0]
|
||||
} else {
|
||||
this.applyField[index].value = [...this.applyField[index].value, ...list]
|
||||
}
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 删除图片
|
||||
deleteImage(i, j) {
|
||||
if ((this.showType == 1 && this.applyField[i].field == "avatar") || (this.showType == 2 && this.applyField[i].field == 'company_logo') || (this.showType == 3 && this.applyField[i].field == 'organize_logo')) {
|
||||
this.applyField[i].value = ""
|
||||
} else if (this.applyField[i].type == "cert") {
|
||||
this.applyField[i].value.image = ""
|
||||
} else {
|
||||
this.$delete(this.applyField[i].value, j)
|
||||
}
|
||||
},
|
||||
// 预览图片
|
||||
previewImage(i, j = 0) {
|
||||
let list = []
|
||||
if ((this.showType == 1 && this.applyField[i].field == "avatar") || (this.showType == 2 && this.applyField[i].field == 'company_logo') || (this.showType == 3 && this.applyField[i].field == 'organize_logo')) {
|
||||
list = [this.applyField[i].value]
|
||||
} else if (this.applyField[i].type == "cert") {
|
||||
list = [this.applyField[i].value.image]
|
||||
} else {
|
||||
list = this.applyField[i].value
|
||||
}
|
||||
uni.previewImage({
|
||||
urls: list,
|
||||
current: j
|
||||
});
|
||||
},
|
||||
// 选择视频
|
||||
chooseVideo(index) {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.chooseMedia({
|
||||
count: 1,
|
||||
mediaType: ['video'],
|
||||
sourceType: ['album', 'camera'],
|
||||
camera: 'back',
|
||||
success: (res) => {
|
||||
this.applyField[index].value = res.tempFiles[0].tempFilePath
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
uni.chooseVideo({
|
||||
sourceType: ['camera', 'album'],
|
||||
success: (res) => {
|
||||
this.applyField[index].value = res.tempFilePath;
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 删除视频
|
||||
deleteVideo(index) {
|
||||
this.applyField[index].value = ""
|
||||
},
|
||||
// 选择文件
|
||||
chooseFiles(index) {
|
||||
// #ifdef MP-WEIXIN
|
||||
wx.chooseMessageFile({
|
||||
count: 9 - this.applyField[index].value.length,
|
||||
type: 'file',
|
||||
extension: ['.pdf', '.doc', '.docx', '.xls', '.xlsx'],
|
||||
success: (res) => {
|
||||
let list = []
|
||||
let exceed = []
|
||||
res.tempFiles.forEach(item => {
|
||||
if (parseFloat(item.size / 1024) <= 10240) {
|
||||
list.push({
|
||||
name: item.name,
|
||||
path: item.path,
|
||||
})
|
||||
} else {
|
||||
exceed.push(item.name)
|
||||
}
|
||||
})
|
||||
if (exceed.length) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: exceed.join("、") + "超过10M",
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
this.applyField[index].value = [...this.applyField[index].value, ...list]
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
let extensionLimit = ['.pdf', '.doc', '.docx', '.xls', '.xlsx']
|
||||
uni.chooseFile({
|
||||
count: 9 - this.applyField[index].value.length,
|
||||
type: "all",
|
||||
extension: extensionLimit,
|
||||
success: (res) => {
|
||||
let list = []
|
||||
let typeError = []
|
||||
let exceed = []
|
||||
res.tempFiles.forEach(item => {
|
||||
let extension = item.name.split('.')
|
||||
extension = extension[extension.length - 1]
|
||||
if (!extensionLimit.includes('.' + extension)) {
|
||||
typeError.push(item.name)
|
||||
} else if (parseFloat(item.size / 1024) <= 10240) {
|
||||
list.push({
|
||||
name: item.name,
|
||||
path: item.path,
|
||||
})
|
||||
} else {
|
||||
exceed.push(item.name)
|
||||
}
|
||||
})
|
||||
if (typeError.length) {
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: typeError.join("、") + "文件类型错误，请选择pdf、doc、docx、xls、xlsx格式文件",
|
||||
showCancel: false,
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "我知道了"
|
||||
})
|
||||
} else if (exceed.length) {
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: exceed.join("、") + "超过10M",
|
||||
showCancel: false,
|
||||
confirmColor: this.themeColor,
|
||||
confirmText: "我知道了"
|
||||
})
|
||||
} else this.applyField[index].value = [...this.applyField[index].value, ...list]
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
// 删除文件
|
||||
deleteFiles(i, j) {
|
||||
this.$delete(this.applyField[i].value, j)
|
||||
},
|
||||
// 选择下拉选项
|
||||
openSelectPicker(index) {
|
||||
if (this.applyField[index].disabled) return
|
||||
this.selectTitle = this.applyField[index].label
|
||||
if (this.showType == 1 && this.applyField[index].field == "member_level_id") {
|
||||
if (this.levelList.length) this.$refs.selectPicker.open(this.levelList, this.applyField[index].value, index)
|
||||
else {
|
||||
this.getMemberLevel(() => {
|
||||
this.$refs.selectPicker.open(this.levelList, this.applyField[index].value, index)
|
||||
})
|
||||
}
|
||||
} else if (this.showType == 1 && this.applyField[index].field == "industry_category_id") {
|
||||
if (this.industryList.length) this.$refs.selectPicker.open(this.industryList, this.applyField[index].value, index)
|
||||
else {
|
||||
this.getIndustry(() => {
|
||||
this.$refs.selectPicker.open(this.industryList, this.applyField[index].value, index)
|
||||
})
|
||||
}
|
||||
} else if (this.showType == 1 && this.applyField[index].field == "native_place") {
|
||||
this.$refs.addressPicker.open(this.applyField[index].value, index)
|
||||
} else {
|
||||
let list = this.applyField[index].option.split(",")
|
||||
this.$refs.selectPicker.open(list, this.applyField[index].value, index)
|
||||
}
|
||||
},
|
||||
// 改变下拉选项
|
||||
changeSelectPicker(value, index) {
|
||||
if (this.showType == 1 && this.applyField[index].field == "native_place") {
|
||||
this.applyField[index].value = value.province + "/" + value.city + "/" + value.area
|
||||
} else if (this.showType == 1 && (this.applyField[index].field == "member_level_id" || this.applyField[index].field == "industry_category_id")) {
|
||||
this.applyField[index].value = value.id
|
||||
} else {
|
||||
this.applyField[index].value = value
|
||||
}
|
||||
},
|
||||
// 打开地图选择位置
|
||||
chooseLocation(index) {
|
||||
uni.chooseLocation({
|
||||
success: (res) => {
|
||||
this.applyField[index].value = {
|
||||
latitude: res.latitude,
|
||||
longitude: res.longitude,
|
||||
name: res.name,
|
||||
address: res.address
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// 清空地址
|
||||
clearLocation(index) {
|
||||
this.applyField[index].value = {
|
||||
latitude: "",
|
||||
longitude: "",
|
||||
name: "",
|
||||
address: "",
|
||||
}
|
||||
},
|
||||
// 改变手机号对外状态
|
||||
changeMobileAuth() {
|
||||
const result = this.mobileAuth == 1 ? 2 : 1
|
||||
this.$emit("changeMobileAuth", result)
|
||||
},
|
||||
// 选择日期
|
||||
openDatePicker(index) {
|
||||
this.$refs.datePicker.open(this.applyField[index].value, index)
|
||||
},
|
||||
// 改变日期
|
||||
changeDatePicker(value, index) {
|
||||
this.applyField[index].value = value
|
||||
},
|
||||
// 选择时间
|
||||
openTimePicker(index) {
|
||||
this.$refs.timePicker.open(this.applyField[index].value, index)
|
||||
},
|
||||
// 改变时间
|
||||
changeTimePicker(value, index) {
|
||||
this.applyField[index].value = value
|
||||
},
|
||||
// 清空已选数据
|
||||
clearValue(index) {
|
||||
this.applyField[index].value = ""
|
||||
},
|
||||
// 跳转编辑器页面
|
||||
toEditor(index) {
|
||||
this.$store.commit('app/setEditorContent', this.applyField[index].value)
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: `/pages/member/apply/editor?params=${index}`
|
||||
})
|
||||
},
|
||||
// 设置编辑器内容
|
||||
setEditorData(e) {
|
||||
this.applyField[e.params].value = e.content
|
||||
},
|
||||
// 提取富文本文字
|
||||
getEditorText(e) {
|
||||
if (e) return e.replace(/<[^>]+>/g, '')
|
||||
else return ""
|
||||
},
|
||||
// 获取表单数据
|
||||
getApplyField(fn) {
|
||||
fn(JSON.parse(JSON.stringify(this.applyField)))
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-member-apply {
|
||||
.component-member-apply-form {
|
||||
.component-member-apply-form-item {
|
||||
margin-top: 32rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
|
||||
.required {
|
||||
color: #E60012;
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.item-input {
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 16rpx;
|
||||
background: #ffffff;
|
||||
|
||||
&.disabled {
|
||||
.input {
|
||||
color: #ACADB7
|
||||
}
|
||||
}
|
||||
|
||||
.input {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
height: 104rpx;
|
||||
line-height: 104rpx;
|
||||
flex: 1;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
flex: 1;
|
||||
padding: 32rpx;
|
||||
height: 200rpx;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
color: #ACADB7;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
padding-right: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-radio {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-left: -26rpx;
|
||||
padding-top: 8rpx;
|
||||
|
||||
.radio {
|
||||
border-radius: 8rpx;
|
||||
background: #ffffff;
|
||||
padding: 16rpx;
|
||||
margin-left: 26rpx;
|
||||
margin-top: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 8rpx;
|
||||
display: none;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #ACADB7;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: var(--theme-color);
|
||||
|
||||
image {
|
||||
display: block;
|
||||
}
|
||||
|
||||
text {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-upload {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 32rpx;
|
||||
column-gap: 3.5%;
|
||||
row-gap: 24rpx;
|
||||
|
||||
.upload-image {
|
||||
position: relative;
|
||||
width: 31%;
|
||||
height: 0;
|
||||
padding-top: 31%;
|
||||
|
||||
.image-select {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.image-video {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 10rpx;
|
||||
background: var(--theme-color);
|
||||
padding: 56rpx;
|
||||
}
|
||||
|
||||
.image-delete {
|
||||
position: absolute;
|
||||
top: -16rpx;
|
||||
right: -16rpx;
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
|
||||
.image-choose {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 20rpx;
|
||||
right: 20rpx;
|
||||
bottom: 20rpx;
|
||||
z-index: 6;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: #ffffff;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
padding: 18rpx;
|
||||
background: var(--theme-color);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.text {
|
||||
margin-top: 16rpx;
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.image-background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
background: var(--theme-color);
|
||||
opacity: 0.08;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-files {
|
||||
.files-upload {
|
||||
position: relative;
|
||||
margin-top: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
padding: 52rpx;
|
||||
|
||||
.upload-icon {
|
||||
width: 72rpx;
|
||||
height: 64rpx;
|
||||
background-size: 72rpx 64rpx;
|
||||
}
|
||||
|
||||
.upload-info {
|
||||
margin-left: 32rpx;
|
||||
|
||||
.info-title {
|
||||
color: var(--theme-color);
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.info-tips {
|
||||
margin-top: 8rpx;
|
||||
color: #BBBDBF;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 20rpx;
|
||||
right: 20rpx;
|
||||
bottom: 20rpx;
|
||||
border-radius: 16rpx;
|
||||
border: 1px dashed #D4D6D9;
|
||||
}
|
||||
}
|
||||
|
||||
.files-list {
|
||||
margin-top: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
padding: 36rpx 32rpx;
|
||||
|
||||
.list-item {
|
||||
margin-top: 32rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
color: #ACADB7;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.item-delete {
|
||||
margin-left: 20rpx;
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-switch {
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 16rpx;
|
||||
background: #ffffff;
|
||||
padding: 32rpx;
|
||||
|
||||
.switch-label {
|
||||
flex: 1;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.switch-box {
|
||||
margin-left: 20rpx;
|
||||
width: 72rpx;
|
||||
height: 36rpx;
|
||||
padding: 2rpx;
|
||||
background: #D9D9D9;
|
||||
border-radius: 18rpx;
|
||||
transition: all .3s;
|
||||
|
||||
.round {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
border-radius: 50%;
|
||||
background: #FFFFFF;
|
||||
margin-left: 0;
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
&.select {
|
||||
background: var(--theme-color);
|
||||
|
||||
.round {
|
||||
margin-left: calc(100% - 32rpx);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
139
pages/component/member/custom.vue
Normal file
139
pages/component/member/custom.vue
Normal file
@@ -0,0 +1,139 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-会员自定义字段 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-member-custom">
|
||||
<block v-for="(item, index) in showData" :key="index" v-if="item.show == 1">
|
||||
<!-- 图片 -->
|
||||
<view class="custom-item" v-if="item.type == 'image'">
|
||||
<view class="item-title">{{item.label}}</view>
|
||||
<view class="item-list" v-if="item.value">
|
||||
<view class="list-image" v-for="(img, num) in item.value.split(',')" :key="num">
|
||||
<image class="image" :src="img" mode="aspectFill" @click="previewImage(index, num)"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-value" v-else>暂未完善</view>
|
||||
</view>
|
||||
<!-- 视频 -->
|
||||
<view class="custom-item" v-else-if="item.type == 'video'">
|
||||
<view class="item-title">{{item.label}}</view>
|
||||
<view class="item-video" v-if="item.value">
|
||||
<video class="video" :src="item.value" controls></video>
|
||||
</view>
|
||||
<view class="item-value" v-else>暂未完善</view>
|
||||
</view>
|
||||
<!-- 证书 -->
|
||||
<view class="custom-item" v-else-if="item.type == 'cert'">
|
||||
<view class="item-title">{{item.label}}</view>
|
||||
<view class="item-image" v-if="item.value">
|
||||
<image class="image" :src="item.value" mode="widthFix" @click="previewImage(index)"></image>
|
||||
</view>
|
||||
<view class="item-value" v-else>暂未完善</view>
|
||||
</view>
|
||||
<!-- 其他 -->
|
||||
<view class="custom-item flex flex-wrap justify-content-between" v-else>
|
||||
<view class="item-title">{{item.label}}</view>
|
||||
<view class="item-value">{{item.value || "暂未完善"}}</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "memberCustom",
|
||||
props: ["showData"],
|
||||
methods: {
|
||||
// 预览图片
|
||||
previewImage(i, j = 0) {
|
||||
let list = []
|
||||
if (this.showData[i].type == "cert") {
|
||||
list = [this.showData[i].value]
|
||||
} else {
|
||||
list = this.showData[i].value.split(",")
|
||||
}
|
||||
uni.previewImage({
|
||||
urls: list,
|
||||
current: j
|
||||
});
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-member-custom {
|
||||
.custom-item {
|
||||
margin-top: 32rpx;
|
||||
padding: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #ffffff;
|
||||
row-gap: 24rpx;
|
||||
column-gap: 48rpx;
|
||||
|
||||
.item-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.item-value {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.item-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 32rpx;
|
||||
column-gap: 3.5%;
|
||||
row-gap: 24rpx;
|
||||
|
||||
.list-image {
|
||||
position: relative;
|
||||
width: 31%;
|
||||
height: 0;
|
||||
padding-top: 31%;
|
||||
|
||||
.image {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-video {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.video {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.item-image {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
105
pages/component/member/index.vue
Normal file
105
pages/component/member/index.vue
Normal file
@@ -0,0 +1,105 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-会员列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-member" :style="{'--theme-color': themeColor}">
|
||||
<view class="member-item flex" v-for="item in showData" :key="item.id" @click="toDetails(item.id)">
|
||||
<image class="item-avatar" :src="item.avatar" mode="aspectFill"></image>
|
||||
<view class="item-info flex-item flex-direction-column justify-content-between">
|
||||
<view class="info-head flex">
|
||||
<view class="head-name flex-item text-ellipsis">{{item.name}}</view>
|
||||
<view class="head-tag" v-if="item.distance">{{item.distance}}</view>
|
||||
</view>
|
||||
<view class="info-tag text-ellipsis" v-if="item.native_place">{{item.native_place}}</view>
|
||||
<view class="info-label flex justify-content-between">
|
||||
<text class="text-ellipsis">{{item.level_name}}</text>
|
||||
<text class="text-ellipsis" style="margin-left: 16rpx;" v-if="item.industry_category_name">{{item.industry_category_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "memberIndex",
|
||||
props: ["showData"],
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 跳转会员详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/details?id=" + id
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-member {
|
||||
white-space: nowrap;
|
||||
|
||||
.member-item {
|
||||
margin-top: 32rpx;
|
||||
padding: 32rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #ffffff;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-avatar {
|
||||
width: 144rpx;
|
||||
height: 144rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
margin-left: 32rpx;
|
||||
|
||||
.info-head {
|
||||
.head-name {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
|
||||
.head-tag {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.info-tag {
|
||||
color: #C4C4C4;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
color: var(--theme-color);
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
322
pages/component/member/poster.vue
Normal file
322
pages/component/member/poster.vue
Normal file
@@ -0,0 +1,322 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.maiwd.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-电子会牌 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-member-poster">
|
||||
<!-- 电子会牌 -->
|
||||
<canvas class="poster-canvas" :style="{width: posterWidth + 'px', height: posterHeight + 'px'}" canvas-id="myCanvas" id="myCanvas"></canvas>
|
||||
<!-- 电子会牌模态框 -->
|
||||
<uni-popup ref="popupModal" type="center" @change="onChange">
|
||||
<view class="poster-popup flex-direction-column align-items-center" :style="{'--theme-color': themeColor, paddingTop: titleBarHeight + 'px'}">
|
||||
<view class="popup-close" @click="onClose()">
|
||||
<image class="icon" src="/static/closePopup.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="popup-content flex justify-content-center">
|
||||
<image class="image" :src="posterPath" mode="aspectFit"></image>
|
||||
</view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="popup-btn" @click="saveImage">保存相册</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="popup-btn">长按图片保存相册</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import { loadImage, createPoster, canvasToTempFilePath } from "@/common/poster.js";
|
||||
export default {
|
||||
name: "memberPoster",
|
||||
data() {
|
||||
return {
|
||||
// 标题栏高度
|
||||
titleBarHeight: 0,
|
||||
// 电子会牌数据
|
||||
posterInfo: {},
|
||||
// 电子会牌宽度
|
||||
posterWidth: 0,
|
||||
// 电子会牌高度
|
||||
posterHeight: 0,
|
||||
// 图片资源是否准备完成
|
||||
posterReady: false,
|
||||
// 电子会牌背景图片
|
||||
posterBackground: "",
|
||||
// 电子会牌用户头像图片
|
||||
posterAvatar: "",
|
||||
// 电子会牌二维码图片
|
||||
posterCode: "",
|
||||
// 电子会牌图片路径
|
||||
posterPath: "",
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
// #ifdef MP-WEIXIN
|
||||
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
||||
this.titleBarHeight = statusBarHeight + (menuButtonInfo.top - statusBarHeight) * 2 + menuButtonInfo.height
|
||||
// #endif
|
||||
},
|
||||
methods: {
|
||||
// 获取电子会牌
|
||||
getPoster() {
|
||||
uni.showLoading({
|
||||
title: "加载中",
|
||||
mask: true
|
||||
})
|
||||
this.$util.request("mine.poster").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.posterInfo = res.data
|
||||
this.posterWidth = res.data.willbrand.bg.width
|
||||
this.posterHeight = res.data.willbrand.bg.height
|
||||
this.$nextTick(() => {
|
||||
this.showNucleus()
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取电子会牌 ', error)
|
||||
})
|
||||
},
|
||||
// 获取图片资源
|
||||
async showNucleus() {
|
||||
this.loadingResources().then((state) => {
|
||||
// 状态为 true 表示加载完成
|
||||
if (state) {
|
||||
this.posterReady = true
|
||||
this.createImage()
|
||||
}
|
||||
});
|
||||
},
|
||||
// 加载图片资源
|
||||
async loadingResources() {
|
||||
this.posterBackground = await loadImage(this.posterInfo.willbrand.bg.img);
|
||||
this.posterCode = await loadImage(this.posterInfo.applet_qrcode_path);
|
||||
if (this.posterInfo.avatar) this.posterAvatar = await loadImage(this.posterInfo.avatar);
|
||||
return true;
|
||||
},
|
||||
// 生成电子会牌
|
||||
async createImage() {
|
||||
if (!this.posterReady) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '电子会牌图片资源加载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
};
|
||||
// 获取上下文对象
|
||||
const ctx = uni.createCanvasContext("myCanvas", this);
|
||||
// 创建电子会牌
|
||||
let posterData = [{
|
||||
type: "image",
|
||||
url: this.posterBackground,
|
||||
config: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
w: parseFloat(this.posterWidth),
|
||||
h: parseFloat(this.posterHeight),
|
||||
},
|
||||
}]
|
||||
this.posterInfo.willbrand.data.forEach((item) => {
|
||||
if (item.type == "text") {
|
||||
let content = ""
|
||||
if (item.item == "name") content = this.posterInfo.member_name || ""
|
||||
else if (item.item == "post") content = this.posterInfo.member_level_name || ""
|
||||
else if (item.item == "cardid") content = this.posterInfo.number || ""
|
||||
else if (item.item == "period") content = this.posterInfo.join_time || ""
|
||||
else if (item.item == "expire") content = this.posterInfo.expire_time || ""
|
||||
else if (item.item == "company_organize") content = this.posterInfo.company_name || this.posterInfo.organize_name || ""
|
||||
let itemX = 0
|
||||
if (item.textAlign == "center") itemX = parseFloat(item.left) + parseFloat(item.width) / 2
|
||||
else if (item.textAlign == "right") itemX = parseFloat(item.left) + parseFloat(item.width)
|
||||
else itemX = parseFloat(item.left)
|
||||
let itemFont = "10px sans-serif"
|
||||
if (item.fontStyle == 2) {
|
||||
itemFont = `italic ${item.size} sans-serif`
|
||||
} else if (item.fontStyle == 3) {
|
||||
itemFont = `bold ${item.size} sans-serif`
|
||||
} else if (item.fontStyle == 4) {
|
||||
itemFont = `italic bold ${item.size} sans-serif`
|
||||
} else {
|
||||
itemFont = `${item.size} sans-serif`
|
||||
}
|
||||
posterData.push({
|
||||
type: "text",
|
||||
text: content || "",
|
||||
config: {
|
||||
x: itemX,
|
||||
y: parseFloat(item.top),
|
||||
color: item.color,
|
||||
font: itemFont,
|
||||
textAlign: item.textAlign,
|
||||
maxWidth: parseFloat(item.width),
|
||||
lineHeight: parseInt(item.height),
|
||||
isVerticalCenter: true
|
||||
},
|
||||
})
|
||||
} else if (item.type == "img") {
|
||||
let imgUrl = ""
|
||||
let radius = 0
|
||||
if (item.item == "qr") {
|
||||
imgUrl = this.posterCode
|
||||
radius = 0
|
||||
} else if (item.item == "avatar") {
|
||||
imgUrl = this.posterAvatar
|
||||
radius = parseFloat(item.width) / 2
|
||||
}
|
||||
if (imgUrl) {
|
||||
posterData.push({
|
||||
type: "image",
|
||||
url: imgUrl,
|
||||
config: {
|
||||
x: parseFloat(item.left),
|
||||
y: parseFloat(item.top),
|
||||
w: parseFloat(item.width),
|
||||
h: parseFloat(item.height),
|
||||
r: parseInt(radius),
|
||||
},
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
await createPoster(ctx, posterData)
|
||||
const imagePath = await canvasToTempFilePath("myCanvas", this);
|
||||
this.posterPath = imagePath;
|
||||
this.$refs.popupModal.open()
|
||||
uni.hideLoading()
|
||||
},
|
||||
// 保存电子会牌
|
||||
saveImage() {
|
||||
uni.authorize({
|
||||
scope: 'scope.writePhotosAlbum',
|
||||
success: () => {
|
||||
uni.getImageInfo({
|
||||
src: this.posterPath,
|
||||
success: (img) => {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: img.path,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success",
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(err);
|
||||
},
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error(err)
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: () => {
|
||||
uni.showModal({
|
||||
title: '图片保存失败',
|
||||
content: '请确认是否已开启授权',
|
||||
confirmText: '开启授权',
|
||||
confirmColor: this.themeColor,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.openSetting({
|
||||
success: (setting) => {
|
||||
if (setting.authSetting["scope.writePhotosAlbum"]) {
|
||||
uni.showToast({
|
||||
title: '授权成功，请重新保存',
|
||||
icon: "none"
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请确定已打开保存权限',
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变页面滚动状态
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-member-poster {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.poster-canvas {
|
||||
position: fixed;
|
||||
top: 100vw;
|
||||
left: 100vh;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.poster-popup {
|
||||
.popup-close {
|
||||
width: 100%;
|
||||
margin-top: -112rpx;
|
||||
margin-bottom: 32rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.icon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
.image {
|
||||
width: 80vw;
|
||||
height: 65vh;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-btn {
|
||||
margin-top: 32rpx;
|
||||
width: 336rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 26rpx 32rpx;
|
||||
border-radius: 16rpx;
|
||||
color: #FFFFFF;
|
||||
background: var(--theme-color);
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
167
pages/component/member/product.vue
Normal file
167
pages/component/member/product.vue
Normal file
@@ -0,0 +1,167 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-产品维护 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-member-product" v-if="loadEnd">
|
||||
<view class="product-list" v-if="productList.length">
|
||||
<view class="list-item" v-for="item in productList" :key="item.id">
|
||||
<image class="item-image" :src="item.image" mode="aspectFill"></image>
|
||||
<view class="item-name text-ellipsis-more">{{item.name}}</view>
|
||||
<view class="item-group flex flex-center">
|
||||
<view class="group-btn" style="background: #FFB656;" @click="handleEdit(item.id)">修改</view>
|
||||
<view class="group-btn" style="background: #FF626E;" @click="handleDelete(item.id)">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<empty top="30%" title="暂无相关内容~" v-else></empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "componentMemberProduct",
|
||||
data() {
|
||||
return {
|
||||
// 加载完成
|
||||
loadEnd: false,
|
||||
// 产品列表
|
||||
productList: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
uni.showLoading({
|
||||
title: "加载中"
|
||||
})
|
||||
this.getProductList(() => {
|
||||
this.loadEnd = true
|
||||
uni.hideLoading()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 获取产品列表
|
||||
getProductList(fn) {
|
||||
this.$util.request("member.product.list").then(res => {
|
||||
if (fn) fn()
|
||||
if (res.code == 1) {
|
||||
this.productList = res.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
if (fn) fn()
|
||||
console.error('获取产品列表 ', error)
|
||||
})
|
||||
},
|
||||
// 修改产品
|
||||
handleEdit(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/product/edit?id=" + id
|
||||
})
|
||||
},
|
||||
// 删除产品
|
||||
handleDelete(id) {
|
||||
uni.showModal({
|
||||
title: "系统提示",
|
||||
content: "是否删除该产品？",
|
||||
confirmColor: "#E50002",
|
||||
confirmText: "删除",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
mask: true,
|
||||
title: "加载中"
|
||||
})
|
||||
this.$util.request("member.product.delete", {
|
||||
id: id
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.getProductList(() => {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
icon: "success",
|
||||
title: "删除成功"
|
||||
})
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading()
|
||||
console.error('删除产品 ', error)
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-member-product {
|
||||
.product-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 2fr);
|
||||
column-gap: 28rpx;
|
||||
row-gap: 32rpx;
|
||||
|
||||
.list-item {
|
||||
padding: 32rpx;
|
||||
background: #FFF;
|
||||
border-radius: 16rpx;
|
||||
|
||||
.item-image {
|
||||
width: 100%;
|
||||
height: 266rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
margin-top: 24rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
line-height: 34rpx;
|
||||
height: 68rpx;
|
||||
}
|
||||
|
||||
.item-group {
|
||||
margin-top: 24rpx;
|
||||
column-gap: 16rpx;
|
||||
|
||||
.group-btn {
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
padding: 12rpx 24rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
103
pages/component/member/scroll.vue
Normal file
103
pages/component/member/scroll.vue
Normal file
@@ -0,0 +1,103 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-可滚动会员列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<scroll-view scroll-x :scroll-left="scrollLeft" class="component-member-scroll" :style="{'--theme-color': themeColor}" @scrolltolower="scrolltolower">
|
||||
<view class="scroll-item" v-for="item in showData" :key="item.id" @click="toDetails(item.id)">
|
||||
<image class="item-avatar" :src="item.avatar" mode="aspectFill"></image>
|
||||
<view class="item-label text-ellipsis">{{item.level_name}}</view>
|
||||
<view class="item-name text-ellipsis">{{item.name}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "memberScroll",
|
||||
props: ["showData"],
|
||||
data() {
|
||||
return {
|
||||
// 横向滚动条位置
|
||||
scrollLeft: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 重置横向滚动条位置
|
||||
resetScrollLeft() {
|
||||
this.scrollLeft = 0.1
|
||||
this.$nextTick(() => {
|
||||
this.scrollLeft = 0
|
||||
})
|
||||
},
|
||||
// 滚动到最右侧
|
||||
scrolltolower() {
|
||||
this.$emit("scrolltolower")
|
||||
},
|
||||
// 跳转会员详情
|
||||
toDetails(id) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/details?id=" + id
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-member-scroll {
|
||||
white-space: nowrap;
|
||||
|
||||
.scroll-item {
|
||||
display: inline-block;
|
||||
width: 128rpx;
|
||||
margin-left: 36rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.item-avatar {
|
||||
width: 128rpx;
|
||||
height: 128rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.item-label {
|
||||
color: #ffffff;
|
||||
font-size: 20rpx;
|
||||
line-height: 28rpx;
|
||||
padding: 8rpx;
|
||||
border-radius: 4rpx 20rpx 4rpx 20rpx;
|
||||
background: var(--theme-color);
|
||||
margin-top: -16rpx;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
margin-top: 16rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
124
pages/component/member/units.vue
Normal file
124
pages/component/member/units.vue
Normal file
@@ -0,0 +1,124 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-会员单位列表 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-member-units">
|
||||
<view class="units-item flex" v-for="item in showData" :key="item.id" @click="toDetails(item.id, item.type)">
|
||||
<image class="item-logo" :src="item.logo" mode="aspectFill"></image>
|
||||
<view class="item-info flex-item flex-direction-column justify-content-between">
|
||||
<view class="info-name text-ellipsis">{{item.name}}</view>
|
||||
<view class="info-introduction text-ellipsis-more">{{item.introduction}}</view>
|
||||
</view>
|
||||
<view class="item-level">
|
||||
<view class="bg" :style="{background: themeColor}"></view>
|
||||
<view class="text">{{item.level_name}}单位</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "memberUnits",
|
||||
props: ["showData"],
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 跳转会员详情
|
||||
toDetails(id, type) {
|
||||
if (type == 2) {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/enterprise?id=" + id
|
||||
})
|
||||
} else {
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: "/pages/member/organization?id=" + id
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-member-units {
|
||||
.units-item {
|
||||
position: relative;
|
||||
margin-top: 32rpx;
|
||||
padding: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.item-logo {
|
||||
width: 156rpx;
|
||||
height: 156rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
margin-left: 32rpx;
|
||||
|
||||
.info-name {
|
||||
color: #333;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.info-introduction {
|
||||
margin-top: 16rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-level {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
border-bottom-right-radius: 16rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #FFF;
|
||||
font-size: 24rpx;
|
||||
line-height: 34rpx;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
181
pages/component/menu/carousel.vue
Normal file
181
pages/component/menu/carousel.vue
Normal file
@@ -0,0 +1,181 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-轮播菜单 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-menu-carousel" v-if="menuList && menuList.length">
|
||||
<block v-if="menuList.length === 1">
|
||||
<menu-nav :show-data="menuList[0]" :row-number="rowNumber" :icon-size="iconSize" :font-size="fontSize" :line-height="lineHeight" :font-color="fontColor" :space="space" :margin-top="marginTop" @toPage="toPage"></menu-nav>
|
||||
</block>
|
||||
<block v-else>
|
||||
<swiper class="carousel-swiper" :style="{height: height}" @change="carouselChange">
|
||||
<swiper-item v-for="(item, index) in menuList" :key="index">
|
||||
<menu-nav :show-data="item" :row-number="rowNumber" :icon-size="iconSize" :font-size="fontSize" :line-height="lineHeight" :font-color="fontColor" :space="space" :margin-top="marginTop" @toPage="toPage"></menu-nav>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="carousel-dots" :style="{'--theme-color': themeColor}">
|
||||
<view class="dots-item" :class="{active: carouseIndex == index}" v-for="(item, index) in menuList" :key="index"></view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
import menuNav from "@/pages/component/menu/menu.vue"
|
||||
export default {
|
||||
name: "menuCarousel",
|
||||
components: {
|
||||
menuNav,
|
||||
},
|
||||
props: {
|
||||
// 组件内容
|
||||
showData: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// 组件高度
|
||||
height: {
|
||||
type: String,
|
||||
default: "390rpx",
|
||||
},
|
||||
// 每排数量
|
||||
rowNumber: {
|
||||
type: Number,
|
||||
default: 4,
|
||||
},
|
||||
// 图标尺寸
|
||||
iconSize: {
|
||||
type: String,
|
||||
default: "96rpx",
|
||||
},
|
||||
// 文字尺寸
|
||||
fontSize: {
|
||||
type: String,
|
||||
default: "28rpx",
|
||||
},
|
||||
// 文字行高
|
||||
lineHeight: {
|
||||
type: String,
|
||||
default: "40rpx",
|
||||
},
|
||||
// 文字颜色
|
||||
fontColor: {
|
||||
type: String,
|
||||
default: "#5A5B6E",
|
||||
},
|
||||
// 图文间隔
|
||||
space: {
|
||||
type: String,
|
||||
default: "16rpx",
|
||||
},
|
||||
// 上下间隔
|
||||
marginTop: {
|
||||
type: String,
|
||||
default: "32rpx",
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 已选索引
|
||||
carouseIndex: 0,
|
||||
// 菜单列表
|
||||
menuList: [],
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
showData: {
|
||||
handler(value) {
|
||||
if (value && value.length) {
|
||||
this.menuList = this.splitArray(value);
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 轮播图切换
|
||||
carouselChange(e) {
|
||||
this.carouseIndex = e.detail.current
|
||||
},
|
||||
// 切割数组
|
||||
splitArray(arr) {
|
||||
var result = [];
|
||||
for (var i = 0; i < arr.length; i += 8) {
|
||||
var chunk = arr.slice(i, i + 8);
|
||||
result.push(chunk);
|
||||
}
|
||||
return result;
|
||||
},
|
||||
// 跳转详情
|
||||
toPage(item) {
|
||||
this.$emit("toPage", item)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-menu-carousel {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
.carousel-swiper {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.swiper-item {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.item-thumb {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-dots {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
|
||||
.dots-item {
|
||||
width: 24rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 8rpx;
|
||||
background: #F1F1F1;
|
||||
margin-right: 4rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
160
pages/component/menu/menu.vue
Normal file
160
pages/component/menu/menu.vue
Normal file
@@ -0,0 +1,160 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-菜单 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-menu flex flex-wrap">
|
||||
<block v-for="(item, index) in showData" :key="index" @click="toPage(index)">
|
||||
<button class="menu-item clear" open-type="contact" :style="{width: (parseFloat(100 / rowNumber).toFixed(2) + '%'), marginTop: (index < rowNumber ? 0 : marginTop)}" v-if="item.info == 'contact'">
|
||||
<image :src="item.icon" :style="{width: iconSize, height: iconSize}" mode="aspectFit"></image>
|
||||
<text class="text-ellipsis" :style="{fontSize: fontSize, color: fontColor, lineHeight: lineHeight, marginTop: space}">{{item.name}}</text>
|
||||
</button>
|
||||
<view class="menu-item" :style="{width: (parseFloat(100 / rowNumber).toFixed(2) + '%'), marginTop: (index < rowNumber ? 0 : marginTop)}" @click="toPage(index)" v-else>
|
||||
<view class="item-icon" :style="{width: iconSize, height: iconSize}">
|
||||
<image :src="item.icon" mode="aspectFit"></image>
|
||||
<view class="count" :style="{background: themeColor}" v-if="item.count && parseInt(countData[item.count]) > 0">{{parseInt(countData[item.count]) > 99 ? '99+' : countData[item.count]}}</view>
|
||||
</view>
|
||||
<text class="text-ellipsis" :style="{fontSize: fontSize, color: fontColor, lineHeight: lineHeight, marginTop: space}">{{item.name}}</text>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="item.content.appid" :path="item.content.path" v-if="item.skip_type == 3">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "menuIndex",
|
||||
props: {
|
||||
// 组件内容
|
||||
showData: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
// 组件数量
|
||||
countData: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
// 每排数量
|
||||
rowNumber: {
|
||||
type: Number,
|
||||
default: 4,
|
||||
},
|
||||
// 图标尺寸
|
||||
iconSize: {
|
||||
type: String,
|
||||
default: "96rpx",
|
||||
},
|
||||
// 文字尺寸
|
||||
fontSize: {
|
||||
type: String,
|
||||
default: "28rpx",
|
||||
},
|
||||
// 文字行高
|
||||
lineHeight: {
|
||||
type: String,
|
||||
default: "40rpx",
|
||||
},
|
||||
// 文字颜色
|
||||
fontColor: {
|
||||
type: String,
|
||||
default: "#5A5B6E",
|
||||
},
|
||||
// 图文间隔
|
||||
space: {
|
||||
type: String,
|
||||
default: "16rpx",
|
||||
},
|
||||
// 上下间隔
|
||||
marginTop: {
|
||||
type: String,
|
||||
default: "32rpx",
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
toPage(index) {
|
||||
// #ifdef H5
|
||||
if (this.showData[index].skip_type == 3) return
|
||||
// #endif
|
||||
if (this.showData[index].info) {
|
||||
this.$util.toPage(this.showData[index].info)
|
||||
} else {
|
||||
this.$emit("toPage", this.showData[index])
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-menu {
|
||||
.menu-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
|
||||
.item-icon {
|
||||
position: relative;
|
||||
|
||||
.count {
|
||||
position: absolute;
|
||||
top: -8rpx;
|
||||
left: 50%;
|
||||
margin-left: 16rpx;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 32rpx;
|
||||
padding: 0 8rpx;
|
||||
min-width: 32rpx;
|
||||
border-radius: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
text {
|
||||
width: 100%;
|
||||
padding: 0 8rpx;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
206
pages/component/mine/admin.vue
Normal file
206
pages/component/mine/admin.vue
Normal file
@@ -0,0 +1,206 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-按钮组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-menu" :class="{'vertical-layout': showStyle.layout == 2}" :style="{'row-gap': `${showStyle.itemSpace}px`}">
|
||||
<block v-for="(item, index) in showData" :key="index">
|
||||
<!-- 核销活动 -->
|
||||
<view class="menu-item" :style="{width: `calc(100% / ${showStyle.rowsNum})`}" @click="toPage(item.type)" v-if="item.type == 'verificationActivity' && userInfo.is_verifying == 1">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image mode="aspectFit" :src="getImagePath(item.imgUrl)"></image>
|
||||
</view>
|
||||
<view class="item-space" :style="{width: graphicSpace, height: graphicSpace}"></view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
<image class="item-icon" src="/static/right.png" mode="aspectFit" :style="{width: fontSize, height: fontSize}"></image>
|
||||
</view>
|
||||
<!-- 审核会员 -->
|
||||
<view class="menu-item" :style="{width: `calc(100% / ${showStyle.rowsNum})`}" @click="toPage(item.type)" v-else-if="item.type == 'examineMember' && userInfo.set_admin == 1">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image class="image" mode="aspectFit" :src="getImagePath(item.imgUrl)"></image>
|
||||
<view class="count" v-if="userInfo && parseInt(userInfo.member_apply_count) > 0">{{parseInt(userInfo.member_apply_count) > 99 ? '99+' : userInfo.member_apply_count}}</view>
|
||||
</view>
|
||||
<view class="item-space" :style="{width: graphicSpace, height: graphicSpace}"></view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
<view class="item-count" v-if="userInfo && parseInt(userInfo.member_apply_count) > 0">{{parseInt(userInfo.member_apply_count) > 99 ? '99+' : userInfo.member_apply_count}}</view>
|
||||
<image class="item-icon" src="/static/right.png" mode="aspectFit" :style="{width: fontSize, height: fontSize}"></image>
|
||||
</view>
|
||||
<!-- 消息订阅 -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="menu-item" :style="{width: `calc(100% / ${showStyle.rowsNum})`}" @click="toPage(item.type)" v-else-if="item.type == 'subscribeMessage' && userInfo.set_admin == 1">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image class="image" mode="aspectFit" :src="getImagePath(item.imgUrl)"></image>
|
||||
</view>
|
||||
<view class="item-space" :style="{width: graphicSpace, height: graphicSpace}"></view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
<image class="item-icon" src="/static/right.png" mode="aspectFit" :style="{width: fontSize, height: fontSize}"></image>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: 'mineMenu',
|
||||
props: ['showStyle', 'showData', 'domain'],
|
||||
computed: {
|
||||
...mapState({
|
||||
userInfo: state => state.user.userInfo,
|
||||
adminStatus: state => {
|
||||
let status = false
|
||||
if (state.user.userInfo.is_verifying == 1) {
|
||||
status = true
|
||||
}
|
||||
if (state.user.userInfo.set_admin == 1) {
|
||||
status = true
|
||||
}
|
||||
return status
|
||||
},
|
||||
adminCount: state => {
|
||||
return {
|
||||
member_apply_count: state.user.userInfo.member_apply_count || 0
|
||||
}
|
||||
},
|
||||
}),
|
||||
iconSize() {
|
||||
let size = this.showStyle.iconSize || 44
|
||||
return uni.upx2px(size * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
let size = this.showStyle.fontSize || 14
|
||||
return uni.upx2px(size * 2) + 'px';
|
||||
},
|
||||
graphicSpace() {
|
||||
return uni.upx2px(this.showStyle.graphicSpace * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 跳转页面
|
||||
toPage(type) {
|
||||
var path = ""
|
||||
if (type == "subscribeMessage") {
|
||||
path = "/pages/mine/subscribe/index"
|
||||
} else if (type == "verificationActivity") {
|
||||
path = "/pagesActivity/verification/index"
|
||||
} else if (type == "examineMember") {
|
||||
path = "/pagesAdmin/examine/index"
|
||||
}
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: path,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.diy-menu {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.menu-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 8rpx;
|
||||
|
||||
.item-image {
|
||||
position: relative;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.count {
|
||||
position: absolute;
|
||||
top: -12rpx;
|
||||
right: -16rpx;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 20rpx;
|
||||
line-height: 28rpx;
|
||||
padding: 0 8rpx;
|
||||
min-width: 28rpx;
|
||||
background: #FF4646;
|
||||
border-radius: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-text {
|
||||
width: 100%;
|
||||
line-height: 1.4;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.item-count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.item-icon {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.vertical-layout {
|
||||
flex-direction: column;
|
||||
padding: 0 16px;
|
||||
|
||||
.menu-item {
|
||||
flex-direction: row;
|
||||
width: 100% !important;
|
||||
padding: 0;
|
||||
|
||||
.item-image .count {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.item-text {
|
||||
flex: 1;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.item-count {
|
||||
display: block;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 20rpx;
|
||||
line-height: 28rpx;
|
||||
padding: 0 8rpx;
|
||||
min-width: 28rpx;
|
||||
background: #FF4646;
|
||||
border-radius: 28rpx;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.item-icon {
|
||||
display: block;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
143
pages/component/mine/menu.vue
Normal file
143
pages/component/mine/menu.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-按钮组 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="diy-menu" :class="{'vertical-layout': showStyle.layout == 2}" :style="{'row-gap': `${showStyle.itemSpace}px`}">
|
||||
<block v-for="(item, index) in showData" :key="index">
|
||||
<view class="menu-item" :style="{width: `calc(100% / ${showStyle.rowsNum})`}" @click="onClick(item.link)" v-if="!item.link || item.link.type != 'Service'">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image mode="aspectFit" :src="getImagePath(item.imgUrl)"></image>
|
||||
</view>
|
||||
<view class="item-space" :style="{width: graphicSpace, height: graphicSpace}"></view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
<image class="item-icon" src="/static/right.png" mode="aspectFit" :style="{width: fontSize, height: fontSize}"></image>
|
||||
<!-- #ifdef H5 -->
|
||||
<wx-open-launch-weapp class="item-absolute" :appid="item.link.appid" :path="item.link.path" v-if="item.link && item.link.type == 'WXMp'">
|
||||
<script type="text/wxtag-template">
|
||||
<style> .btn { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } </style>
|
||||
<view class="btn"></view>
|
||||
</script>
|
||||
</wx-open-launch-weapp>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button class="menu-item clear" open-type="contact" :style="{width: `calc(100% / ${showStyle.rowsNum})`}" v-else-if="item.link.type == 'Service'">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image mode="aspectFit" :src="getImagePath(item.imgUrl)"></image>
|
||||
</view>
|
||||
<view class="item-space" :style="{width: graphicSpace, height: graphicSpace}"></view>
|
||||
<view class="item-text text-ellipsis" :style="{color: showStyle.textColor, fontSize: fontSize}">{{ item.text }}</view>
|
||||
<image class="item-icon" src="/static/right.png" mode="aspectFit" :style="{width: fontSize, height: fontSize}"></image>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: 'mineMenu',
|
||||
props: ['showStyle', 'showData', 'domain'],
|
||||
computed: {
|
||||
iconSize() {
|
||||
let size = this.showStyle.iconSize || 44
|
||||
return uni.upx2px(size * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
let size = this.showStyle.fontSize || 14
|
||||
return uni.upx2px(size * 2) + 'px';
|
||||
},
|
||||
graphicSpace() {
|
||||
return uni.upx2px(this.showStyle.graphicSpace * 2) + 'px';
|
||||
},
|
||||
itemSpace() {
|
||||
return uni.upx2px(this.showStyle.itemSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 点击事件
|
||||
onClick(e) {
|
||||
if (!e) return;
|
||||
this.$util.openLink(e);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.diy-menu {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.menu-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 8rpx;
|
||||
|
||||
.item-image {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
}
|
||||
|
||||
.item-text {
|
||||
width: 100%;
|
||||
line-height: 1.4;
|
||||
font-size: 28rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.item-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.item-absolute {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.vertical-layout {
|
||||
flex-direction: column;
|
||||
padding: 0 16px;
|
||||
|
||||
.menu-item {
|
||||
flex-direction: row;
|
||||
width: 100% !important;
|
||||
padding: 0;
|
||||
|
||||
.item-text {
|
||||
flex: 1;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.item-icon {
|
||||
display: block;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
136
pages/component/mine/order.vue
Normal file
136
pages/component/mine/order.vue
Normal file
@@ -0,0 +1,136 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-订单菜单 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
<template>
|
||||
<view class="component-menu-order">
|
||||
<view class="order-cloumn" :style="{width: (100 / showData.length) + '%'}" v-for="(item, index) in showData" :key="index">
|
||||
<view class="cloumn-item" @click="toPage(item.type)">
|
||||
<view class="item-image" :style="{width: iconSize, height: iconSize}">
|
||||
<image class="image" :src="getImagePath(item.imgUrl)" mode="aspectFit" v-if="item.imgUrl"></image>
|
||||
<view class="count" v-if="parseInt(getOrderNumber(item.type)) > 0">{{parseInt(getOrderNumber(item.type)) > 99 ? '99+' : getOrderNumber(item.type)}}</view>
|
||||
</view>
|
||||
<view class="item-text" :style="{fontSize: fontSize, color: showStyle.textColor, marginTop: graphicSpace}">{{item.text}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "mineOrder",
|
||||
props: ['showStyle', 'showData', 'domain'],
|
||||
computed: {
|
||||
...mapState({
|
||||
orderInfo: state => state.user.userInfo.order || {},
|
||||
}),
|
||||
iconSize() {
|
||||
return uni.upx2px(this.showStyle.iconSize * 2) + 'px';
|
||||
},
|
||||
fontSize() {
|
||||
return uni.upx2px(this.showStyle.fontSize * 2) + 'px';
|
||||
},
|
||||
graphicSpace() {
|
||||
return uni.upx2px(this.showStyle.graphicSpace * 2) + 'px';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// 获取图片地址
|
||||
getImagePath(url) {
|
||||
if (url.indexOf('http') > -1) {
|
||||
return url
|
||||
} else {
|
||||
return this.domain + url
|
||||
}
|
||||
},
|
||||
// 获取该状态的订单数量
|
||||
getOrderNumber(type) {
|
||||
if (type == 1) {
|
||||
return this.orderInfo.unpaid_count || 0
|
||||
} else if (type == 2) {
|
||||
return this.orderInfo.to_be_shipped_count || 0
|
||||
} else if (type == 3) {
|
||||
return this.orderInfo.to_be_received_count || 0
|
||||
} else if (type == 4) {
|
||||
return this.orderInfo.refund_count || 0
|
||||
}
|
||||
return 0
|
||||
},
|
||||
// 跳转页面
|
||||
toPage(type) {
|
||||
var path = ""
|
||||
if (type == 1) {
|
||||
path = "/pagesMall/order/index?id=1"
|
||||
} else if (type == 2) {
|
||||
path = "/pagesMall/order/index?id=2"
|
||||
} else if (type == 3) {
|
||||
path = "/pagesMall/order/index?id=3"
|
||||
} else if (type == 4) {
|
||||
path = "/pagesMall/refund/index"
|
||||
}
|
||||
this.$util.toPage({
|
||||
mode: 1,
|
||||
path: path,
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-menu-order {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
.order-cloumn {
|
||||
width: 25%;
|
||||
|
||||
.cloumn-item {
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
|
||||
.item-image {
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.count {
|
||||
position: absolute;
|
||||
top: -12rpx;
|
||||
right: -16rpx;
|
||||
color: #FFF;
|
||||
text-align: center;
|
||||
font-size: 20rpx;
|
||||
line-height: 26rpx;
|
||||
padding: 0 8rpx;
|
||||
min-width: 26rpx;
|
||||
background: #FF4646;
|
||||
border-radius: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item-text {
|
||||
text-align: center;
|
||||
line-height: 1.4;
|
||||
color: #5A5B6E;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1060
pages/component/mine/user-info.vue
Normal file
1060
pages/component/mine/user-info.vue
Normal file
File diff suppressed because it is too large
Load Diff
180
pages/component/modal/confirm.vue
Normal file
180
pages/component/modal/confirm.vue
Normal file
@@ -0,0 +1,180 @@
|
||||
<!-- 组件-确认弹窗 开发者: 麦沃德科技-半夏 -->
|
||||
|
||||
<template>
|
||||
<view class="component-modal-confirm">
|
||||
<uni-popup ref="popup" type="center" @change="onChange">
|
||||
<view class="modal-confirm" :style="{width: editable ? '688rpx' : '544rpx'}">
|
||||
<view class="confirm-title" v-if="title">{{title}}</view>
|
||||
<view class="confirm-input" v-if="editable">
|
||||
<textarea class="textarea" v-model="inputData" :placeholder="placeholderText" :placeholder-class="placeholder" />
|
||||
</view>
|
||||
<view class="confirm-content" v-else>
|
||||
<rich-text :nodes="content"></rich-text>
|
||||
</view>
|
||||
<view class="confirm-footer">
|
||||
<view class="footer-btn" :style="{color: cancelColor}" v-if="showCancel" @click="handleCancel()">{{cancelText}}</view>
|
||||
<view class="footer-btn" :style="{color: confirmColor}" @click="handleConfirm()">{{confirmText}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 模态框标题
|
||||
title: "",
|
||||
// 模态框内容
|
||||
content: "",
|
||||
// 是否显示取消按钮
|
||||
showCancel: true,
|
||||
// 取消按钮文字
|
||||
cancelText: "取消",
|
||||
// 取消按钮颜色
|
||||
cancelColor: "#8D929C",
|
||||
// 确认按钮文字
|
||||
confirmText: "确定",
|
||||
// 确认按钮颜色
|
||||
confirmColor: "#DE2828",
|
||||
// 是否显示输入框
|
||||
editable: false,
|
||||
// 显示输入框时的提示文本
|
||||
placeholderText: "请输入",
|
||||
// 回调函数
|
||||
callback: null,
|
||||
// 输入内容
|
||||
inputData: "",
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 打开弹窗
|
||||
open(e) {
|
||||
this.title = e.title || ""
|
||||
this.content = e.content || ""
|
||||
this.showCancel = e.showCancel === false ? false : true
|
||||
this.cancelText = e.cancelText || "取消"
|
||||
this.cancelColor = e.cancelColor || "#8D929C"
|
||||
this.confirmText = e.confirmText || "确定"
|
||||
this.confirmColor = e.confirmColor || "#325DFF"
|
||||
this.editable = e.editable || false
|
||||
this.placeholderText = e.placeholderText || "请输入"
|
||||
this.callback = e.success
|
||||
this.inputData = ""
|
||||
this.$refs.popup.open()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
// 取消按钮
|
||||
handleCancel() {
|
||||
if (this.callback) {
|
||||
this.callback({
|
||||
cancel: true,
|
||||
})
|
||||
}
|
||||
this.$refs.popup.close()
|
||||
},
|
||||
// 确认按钮
|
||||
handleConfirm() {
|
||||
if (this.callback) {
|
||||
if (this.editable) {
|
||||
if (!this.inputData) {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: this.placeholderText
|
||||
})
|
||||
return
|
||||
}
|
||||
this.callback({
|
||||
confirm: true,
|
||||
content: this.inputData
|
||||
})
|
||||
this.$refs.popup.close()
|
||||
} else {
|
||||
this.callback({
|
||||
confirm: true
|
||||
})
|
||||
this.$refs.popup.close()
|
||||
}
|
||||
} else {
|
||||
this.$refs.popup.close()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-modal-confirm {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.modal-confirm {
|
||||
width: 544rpx;
|
||||
max-width: 92vw;
|
||||
border-radius: 16rpx;
|
||||
background: #FFF;
|
||||
padding-top: 32rpx;
|
||||
|
||||
.confirm-title {
|
||||
color: #5A5B6E;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
padding: 0 32rpx 16rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.confirm-content {
|
||||
padding: 32rpx 48rpx 64rpx;
|
||||
color: #5A5B6E;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.confirm-input {
|
||||
padding: 16rpx 32rpx 32rpx;
|
||||
|
||||
.textarea {
|
||||
padding: 32rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #F6F7FB;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
height: 240rpx;
|
||||
color: #5A5B6E;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
color: #8D929C;
|
||||
}
|
||||
}
|
||||
|
||||
.confirm-footer {
|
||||
border-top: 1px solid #E5E5E5;
|
||||
display: flex;
|
||||
|
||||
.footer-btn {
|
||||
flex: 1;
|
||||
width: 50%;
|
||||
padding: 28rpx 20rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 48rpx;
|
||||
border-left: 1px solid #E5E5E5;
|
||||
|
||||
&:first-child {
|
||||
border-left: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
204
pages/component/modal/level.vue
Normal file
204
pages/component/modal/level.vue
Normal file
@@ -0,0 +1,204 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-级别选择弹窗 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-modal-level" @click.stop>
|
||||
<uni-popup ref="popupModal" type="bottom" :safe-area="false" @change="onChange">
|
||||
<view class="popup-box" :style="{'--theme-color': themeColor}">
|
||||
<view class="popup-header">
|
||||
<view class="title">会员级别</view>
|
||||
<image class="close" src="/static/close.png" mode="aspectFit" @click="onClose"></image>
|
||||
</view>
|
||||
<view class="popup-content flex-direction-column">
|
||||
<scroll-view scroll-y class="contetnt-scroll flex-item">
|
||||
<view class="scroll-list flex flex-wrap">
|
||||
<view class="list-item" :class="{active: selectItem.includes(item)}" v-for="item in levelList" :key="item.id" @click="selectLevel(item)">{{item.name}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="popup-btn">
|
||||
<view class="btn" @click="onReset">重置</view>
|
||||
<view class="btn confirm" @click="onConfirm">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "modalLevel",
|
||||
data() {
|
||||
return {
|
||||
// 级别列表
|
||||
levelList: [],
|
||||
// 已选项目
|
||||
selectItem: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 打开模态框
|
||||
open(value) {
|
||||
this.levelList = []
|
||||
this.getLevelList(value)
|
||||
this.$refs.popupModal.open()
|
||||
},
|
||||
// 获取级别数据
|
||||
getLevelList(value) {
|
||||
// 获取会员级别
|
||||
this.$util.request("member.level").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.levelList = res.data
|
||||
this.selectItem = []
|
||||
for (let i in this.levelList) {
|
||||
for (let j in value) {
|
||||
if (this.levelList[i].id == value[j].id) {
|
||||
this.selectItem.push(this.levelList[i])
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取会员级别 ', error)
|
||||
})
|
||||
},
|
||||
// 选择级别
|
||||
selectLevel(item) {
|
||||
if (this.selectItem.includes(item)) {
|
||||
this.$delete(this.selectItem, this.selectItem.indexOf(item))
|
||||
} else {
|
||||
this.selectItem.push(item)
|
||||
}
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 重置
|
||||
onReset() {
|
||||
this.selectItem = []
|
||||
this.$emit("callback", [])
|
||||
this.onClose()
|
||||
},
|
||||
// 确认
|
||||
onConfirm() {
|
||||
this.$emit("callback", this.selectItem)
|
||||
this.onClose()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-modal-level {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.popup-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 40rpx 40rpx 0 0;
|
||||
padding-top: 32rpx;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.popup-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 32rpx 0 64rpx;
|
||||
|
||||
.title {
|
||||
color: #333;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.close {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
padding: 12rpx 32rpx 32rpx;
|
||||
height: 60vh;
|
||||
|
||||
.contetnt-scroll {
|
||||
overflow: hidden;
|
||||
padding: 0 12rpx;
|
||||
|
||||
.scroll-list {
|
||||
margin-left: -32rpx;
|
||||
|
||||
.list-item {
|
||||
margin-top: 32rpx;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
padding: 16rpx;
|
||||
min-width: 200rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #F6F7FB;
|
||||
margin-left: 32rpx;
|
||||
|
||||
&.active {
|
||||
background: var(--theme-color);
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-top: 1rpx solid #F6F7FB;
|
||||
padding: 16rpx 32rpx;
|
||||
|
||||
.btn {
|
||||
width: 48%;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #F0F0F0;
|
||||
text-align: center;
|
||||
|
||||
&.confirm {
|
||||
color: #FFFFFF;
|
||||
background: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
328
pages/component/modal/region.vue
Normal file
328
pages/component/modal/region.vue
Normal file
@@ -0,0 +1,328 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-地区选择弹窗 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-modal-region" @click.stop>
|
||||
<uni-popup ref="popupModal" type="bottom" :safe-area="false" @change="onChange">
|
||||
<view class="popup-box" :style="{'--theme-color': themeColor}">
|
||||
<view class="popup-header">
|
||||
<view class="title">地区选择</view>
|
||||
<image class="close" src="/static/close.png" mode="aspectFit" @click="onClose"></image>
|
||||
</view>
|
||||
<view class="popup-content flex-direction-column">
|
||||
<view class="contetnt-select flex">
|
||||
<view class="select-item flex" @click="selectProvince = '';selectCity = '';selectArea = '';">
|
||||
<view class="item-title">省：</view>
|
||||
<view class="item-value">{{selectProvince || "请选择"}}</view>
|
||||
</view>
|
||||
<view class="select-item flex" @click="selectCity = '';selectArea = '';">
|
||||
<view class="item-title">市：</view>
|
||||
<view class="item-value">{{selectCity || "请选择"}}</view>
|
||||
</view>
|
||||
<view class="select-item flex">
|
||||
<view class="item-title">区/县：</view>
|
||||
<view class="item-value" v-if="selectCity">{{selectArea || "全部"}}</view>
|
||||
<view class="item-value" v-else>请选择</view>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view scroll-y class="contetnt-city flex-item">
|
||||
<view class="city-list">
|
||||
<block v-if="provinceList.length && !selectProvince">
|
||||
<view class="list-item" v-for="(item, index) in provinceList" :key="index" @click="changeProvince(item.id, item.name)">{{item.name}}</view>
|
||||
</block>
|
||||
<block v-if="cityList.length && !selectCity">
|
||||
<view class="list-item" v-for="(item, index) in cityList" :key="index" @click="changeCity(item.id, item.name)">{{item.name}}</view>
|
||||
</block>
|
||||
<block v-if="areaList.length">
|
||||
<view class="list-item" :class="{active: selectArea == ''}" @click="changeArea('')">全部</view>
|
||||
<view class="list-item" :class="{active: selectArea == item.name}" v-for="(item, index) in areaList" :key="index" @click="changeArea(item.name)">{{item.name}}</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="city-empty" v-if="!provinceList.length && !cityList.length && !areaList.length">暂无相关数据</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="popup-btn">
|
||||
<view class="btn" @click="onReset">重置</view>
|
||||
<view class="btn confirm" @click="onConfirm">确认</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "modalRegion",
|
||||
data() {
|
||||
return {
|
||||
// 省份列表
|
||||
provinceList: [],
|
||||
// 城市列表
|
||||
cityList: [],
|
||||
// 区县列表
|
||||
areaList: [],
|
||||
// 已选省份
|
||||
selectProvince: "",
|
||||
// 已选城市
|
||||
selectCity: "",
|
||||
// 已选区县
|
||||
selectArea: "",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 打开模态框
|
||||
open(value) {
|
||||
this.provinceList = []
|
||||
this.cityList = []
|
||||
this.areaList = []
|
||||
this.selectProvince = value.province || ""
|
||||
this.selectCity = value.city || ""
|
||||
this.selectArea = value.area || ""
|
||||
this.getProvinceList()
|
||||
this.$refs.popupModal.open()
|
||||
},
|
||||
// 获取省份数据
|
||||
getProvinceList() {
|
||||
this.$util.request("main.address.province").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.provinceList = res.data.data
|
||||
for (let i in this.provinceList) {
|
||||
if (this.provinceList[i].name == this.selectProvince) {
|
||||
this.getCityList(this.provinceList[i].id)
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取省份数据 ', error)
|
||||
})
|
||||
},
|
||||
// 获取城市数据
|
||||
getCityList(id) {
|
||||
this.$util.request("main.address.city", {
|
||||
crea_id: id
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.cityList = res.data.data
|
||||
for (let i in this.cityList) {
|
||||
if (this.cityList[i].name == this.selectCity) {
|
||||
this.getAreaList(this.cityList[i].id)
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取城市数据 ', error)
|
||||
})
|
||||
},
|
||||
// 获取区县数据
|
||||
getAreaList(id) {
|
||||
this.$util.request("main.address.area", {
|
||||
crea_id: id
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
this.areaList = res.data.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取区县数据 ', error)
|
||||
})
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 重置
|
||||
onReset() {
|
||||
this.cityList = []
|
||||
this.areaList = []
|
||||
this.selectProvince = ""
|
||||
this.selectCity = ""
|
||||
this.selectArea = ""
|
||||
this.$emit("callback", {
|
||||
province: "",
|
||||
city: "",
|
||||
area: "",
|
||||
})
|
||||
this.onClose()
|
||||
},
|
||||
// 选择省份
|
||||
changeProvince(id, name) {
|
||||
this.selectProvince = name
|
||||
this.getCityList(id)
|
||||
},
|
||||
// 选择城市
|
||||
changeCity(id, name) {
|
||||
this.selectCity = name
|
||||
this.getAreaList(id)
|
||||
},
|
||||
// 选择区县
|
||||
changeArea(name) {
|
||||
this.selectArea = name
|
||||
},
|
||||
// 确认
|
||||
onConfirm() {
|
||||
if (this.selectProvince && this.selectCity) {
|
||||
this.$emit("callback", {
|
||||
province: this.selectProvince,
|
||||
city: this.selectCity,
|
||||
area: this.selectArea,
|
||||
})
|
||||
} else {
|
||||
this.$emit("callback", {})
|
||||
}
|
||||
this.onClose()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-modal-region {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.popup-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 40rpx 40rpx 0 0;
|
||||
padding: 32rpx 32rpx 0;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.popup-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 32rpx;
|
||||
|
||||
.title {
|
||||
color: #333;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.close {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
padding: 32rpx 0;
|
||||
height: 65vh;
|
||||
|
||||
.contetnt-select {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.select-item {
|
||||
margin-left: 32rpx;
|
||||
|
||||
&:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.item-title {
|
||||
color: #333;
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.item-value {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contetnt-city {
|
||||
padding-top: 32rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.city-list {
|
||||
.list-item {
|
||||
margin-top: 32rpx;
|
||||
color: #333;
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
|
||||
&.active {
|
||||
color: var(--theme-color);
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.city-empty {
|
||||
padding: 48rpx 0 24rpx;
|
||||
color: #A0A2B3;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-top: 1rpx solid #F6F7FB;
|
||||
padding: 16rpx 32rpx;
|
||||
|
||||
.btn {
|
||||
width: 48%;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #F0F0F0;
|
||||
text-align: center;
|
||||
|
||||
&.confirm {
|
||||
color: #FFFFFF;
|
||||
background: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
264
pages/component/picker/address.vue
Normal file
264
pages/component/picker/address.vue
Normal file
@@ -0,0 +1,264 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-省市区选择器 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-picker-address" @click.stop>
|
||||
<uni-popup ref="popupModal" type="bottom" :safe-area="false" @change="onChange">
|
||||
<view class="modal-box" :style="{'--theme-color': themeColor}">
|
||||
<view class="modal-head">
|
||||
<view class="head-title">地址选择</view>
|
||||
<view class="head-btn" @click="handleConfirm">确认</view>
|
||||
</view>
|
||||
<view class="modal-content flex align-items-center">
|
||||
<picker-view class="content-picker" indicator-style="height: 70rpx;" :value="selectValue" @change="handleChange">
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item, index) in provinceList" :key="index">{{item.name}}</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item, index) in cityList" :key="index">{{item.name}}</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item, index) in areaList" :key="index">{{item.name}}</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
<view class="modal-btn" @click="onClose">取消</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "addressPicker",
|
||||
data() {
|
||||
return {
|
||||
// 省份列表
|
||||
provinceList: [],
|
||||
// 城市列表
|
||||
cityList: [],
|
||||
// 地区列表
|
||||
areaList: [],
|
||||
// 已选地址
|
||||
addressList: [],
|
||||
// 已选数据
|
||||
selectValue: [0, 0, 0],
|
||||
// 参数
|
||||
parameter: "",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
this.getProvinceList()
|
||||
},
|
||||
methods: {
|
||||
// 打开模态框
|
||||
open(value, parameter) {
|
||||
const list = value.split("/")
|
||||
this.addressList = list
|
||||
this.parameter = parameter
|
||||
this.setValueChange()
|
||||
this.$refs.popupModal.open()
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
// 数值改变
|
||||
async handleChange(e) {
|
||||
if (this.selectValue[0] != e.target.value[0]) {
|
||||
this.selectValue = [e.target.value[0], 0, 0]
|
||||
this.cityList = await this.getCityList(this.provinceList[this.selectValue[0]].id)
|
||||
this.areaList = await this.getAreaList(this.cityList[this.selectValue[1]].id)
|
||||
} else if (this.selectValue[1] != e.target.value[1]) {
|
||||
this.selectValue = [e.target.value[0], e.target.value[1], 0]
|
||||
this.areaList = await this.getAreaList(this.cityList[this.selectValue[1]].id)
|
||||
} else {
|
||||
this.selectValue = e.target.value
|
||||
}
|
||||
},
|
||||
// 设置选中数值
|
||||
async setValueChange() {
|
||||
var selectData = [0, 0, 0]
|
||||
if (this.addressList[0]) {
|
||||
for (var i = 0; i < this.provinceList.length; i++) {
|
||||
if (this.provinceList[i].name == this.addressList[0]) {
|
||||
selectData[0] = i
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
this.cityList = await this.getCityList(this.provinceList[selectData[0]].id)
|
||||
if (this.addressList[1]) {
|
||||
for (var i = 0; i < this.cityList.length; i++) {
|
||||
if (this.cityList[i].name == this.addressList[1]) {
|
||||
selectData[1] = i
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
this.areaList = await this.getAreaList(this.cityList[selectData[1]].id)
|
||||
if (this.addressList[2]) {
|
||||
for (var i = 0; i < this.areaList.length; i++) {
|
||||
if (this.areaList[i].name == this.addressList[2]) {
|
||||
selectData[2] = i
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.selectValue = selectData
|
||||
this.$forceUpdate()
|
||||
})
|
||||
},
|
||||
// 确认
|
||||
handleConfirm() {
|
||||
var data = {
|
||||
province: this.provinceList[this.selectValue[0]].name,
|
||||
city: this.cityList[this.selectValue[1]].name,
|
||||
area: this.areaList[this.selectValue[2]].name,
|
||||
}
|
||||
this.$emit("confirm", data, this.parameter)
|
||||
this.onClose()
|
||||
},
|
||||
// 获取省份数据
|
||||
getProvinceList() {
|
||||
this.$util.request("main.address.province").then(res => {
|
||||
if (res.code == 1) {
|
||||
this.provinceList = res.data.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取省份数据 ', error)
|
||||
})
|
||||
},
|
||||
// 获取城市数据
|
||||
getCityList(id) {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$util.request("main.address.city", {
|
||||
crea_id: id
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
resolve(res.data.data)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
reject(false)
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取城市数据 ', error)
|
||||
reject(false)
|
||||
})
|
||||
})
|
||||
},
|
||||
// 获取地区数据
|
||||
getAreaList(id) {
|
||||
return new Promise((resolve, reject) => {
|
||||
this.$util.request("main.address.area", {
|
||||
crea_id: id
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
resolve(res.data.data)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
reject(false)
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取省份数据 ', error)
|
||||
reject(false)
|
||||
})
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-picker-address {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.modal-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
width: 100vw;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.modal-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32rpx;
|
||||
|
||||
.head-title {
|
||||
flex: 1;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
padding-left: 128rpx;
|
||||
}
|
||||
|
||||
.head-btn {
|
||||
color: #FFF;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 12rpx 36rpx;
|
||||
border-radius: 10rpx;
|
||||
background: var(--theme-color);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
padding-bottom: 32rpx;
|
||||
|
||||
.content-picker {
|
||||
height: 400rpx;
|
||||
flex: 1;
|
||||
|
||||
.picker-column {
|
||||
line-height: 70rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal-btn {
|
||||
color: #E10602;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
padding: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
192
pages/component/picker/date.vue
Normal file
192
pages/component/picker/date.vue
Normal file
@@ -0,0 +1,192 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-日期选择框 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-picker-date" @click.stop>
|
||||
<uni-popup ref="popupModal" type="bottom" :safe-area="false" @change="onChange">
|
||||
<view class="modal-box" :style="{'--theme-color': themeColor}">
|
||||
<view class="modal-head">
|
||||
<view class="head-btn cancel" @click="onClose">取消</view>
|
||||
<view class="head-title">选择日期</view>
|
||||
<view class="head-btn" @click="handleConfirm">确认</view>
|
||||
</view>
|
||||
<view class="modal-content flex-item">
|
||||
<picker-view class="picker-view" indicator-style="height: 50px;" :immediate-change="true" :value="selectValue" @change="handleChange">
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item,index) in yearList" :key="index">{{item}}年</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item,index) in monthList" :key="index">{{item}}月</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item,index) in dayList" :key="index">{{item}}日</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "datePicker",
|
||||
data() {
|
||||
const date = new Date()
|
||||
const year = date.getFullYear()
|
||||
const month = date.getMonth() + 1
|
||||
const day = date.getDate()
|
||||
let years = []
|
||||
let months = []
|
||||
let days = []
|
||||
for (let i = parseInt(year) - 150; i <= parseInt(year) + 150; i++) {
|
||||
years.push(i)
|
||||
}
|
||||
for (let i = 1; i <= 12; i++) {
|
||||
months.push(i)
|
||||
}
|
||||
for (let i = 1; i <= new Date(year, month, 0).getDate(); i++) {
|
||||
days.push(i)
|
||||
}
|
||||
return {
|
||||
// 当前日期
|
||||
nowDate: [year, month, day],
|
||||
// 年列表
|
||||
yearList: years,
|
||||
// 月列表
|
||||
monthList: months,
|
||||
// 日列表
|
||||
dayList: days,
|
||||
// 已选数据
|
||||
selectValue: [year, month - 1, day - 1],
|
||||
// 参数
|
||||
parameter: "",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 打开模态框
|
||||
open(value, parameter) {
|
||||
this.parameter = parameter
|
||||
if (value) {
|
||||
var date = value.split("-")
|
||||
var yearIndex = this.yearList.findIndex(item => {
|
||||
if (item == date[0]) return true
|
||||
})
|
||||
var monthIndex = this.monthList.findIndex(item => {
|
||||
if (item == date[1]) return true
|
||||
})
|
||||
var dayIndex = this.dayList.findIndex(item => {
|
||||
if (item == date[2]) return true
|
||||
})
|
||||
this.selectValue = [yearIndex, monthIndex, dayIndex]
|
||||
} else {
|
||||
this.selectValue = [this.yearList.indexOf(this.nowDate[0]), this.monthList.indexOf(this.nowDate[1]), this.dayList.indexOf(this.nowDate[2])]
|
||||
}
|
||||
this.$refs.popupModal.open()
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
// 时间改变
|
||||
handleChange(e) {
|
||||
if (this.selectValue[0] != e.target.value[0] || this.selectValue[1] != e.target.value[1]) {
|
||||
var days = []
|
||||
var year = this.yearList[e.target.value[0]]
|
||||
var month = this.monthList[e.target.value[1]]
|
||||
for (let i = 1; i <= new Date(year, month, 0).getDate(); i++) {
|
||||
days.push(i)
|
||||
}
|
||||
this.dayList = days
|
||||
}
|
||||
this.selectValue = e.target.value
|
||||
if (this.selectValue[2] > this.dayList.length - 1) {
|
||||
this.selectValue[2] = this.dayList.length - 1
|
||||
}
|
||||
},
|
||||
// 确认
|
||||
handleConfirm() {
|
||||
var year = parseInt(this.yearList[this.selectValue[0]]) < 10 ? "0" + this.yearList[this.selectValue[0]] : this.yearList[this.selectValue[0]]
|
||||
var month = parseInt(this.monthList[this.selectValue[1]]) < 10 ? "0" + this.monthList[this.selectValue[1]] : this.monthList[this.selectValue[1]]
|
||||
var day = parseInt(this.dayList[this.selectValue[2]]) < 10 ? "0" + this.dayList[this.selectValue[2]] : this.dayList[this.selectValue[2]]
|
||||
var data = year + "-" + month + "-" + day
|
||||
this.$emit("confirm", data, this.parameter)
|
||||
this.onClose()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-picker-date {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.modal-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
width: 100vw;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.modal-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32rpx;
|
||||
|
||||
.head-title {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
.head-btn {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
|
||||
&.cancel {
|
||||
color: #979797;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
padding-bottom: 32rpx;
|
||||
|
||||
.picker-view {
|
||||
height: 400rpx;
|
||||
flex: 1;
|
||||
|
||||
.picker-column {
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
166
pages/component/picker/select.vue
Normal file
166
pages/component/picker/select.vue
Normal file
@@ -0,0 +1,166 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-单项选择框 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-picker-select" @click.stop>
|
||||
<uni-popup ref="popupModal" type="bottom" :safe-area="false" @change="onChange">
|
||||
<view class="modal-box" :style="{'--theme-color': themeColor}">
|
||||
<view class="modal-head">
|
||||
<view class="head-title text-ellipsis">{{title}}</view>
|
||||
<view class="head-btn" @click="handleConfirm">确认</view>
|
||||
</view>
|
||||
<view class="modal-content flex align-items-center" v-if="loadEnd">
|
||||
<picker-view class="content-picker" indicator-style="height: 50px;" :immediate-change="true" :value="selectValue" @change="handleChange">
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="(item, index) in selectList" :key="index">{{item.name || item}}</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
<view class="modal-btn" @click="onClose">取消</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "selectPicker",
|
||||
props: ["title"],
|
||||
data() {
|
||||
return {
|
||||
// 加载完成
|
||||
loadEnd: false,
|
||||
// 参数
|
||||
parameter: null,
|
||||
// 数据列表
|
||||
selectList: [],
|
||||
// 已选数据
|
||||
selectValue: [0],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 打开模态框
|
||||
open(list, value, parameter) {
|
||||
this.selectList = list
|
||||
this.parameter = parameter
|
||||
if (value) {
|
||||
for (var i = 0; i < list.length; i++) {
|
||||
if (typeof(list[i]) == "object") {
|
||||
if (list[i].id == value) {
|
||||
this.selectValue = [i]
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
if (list[i] == value) {
|
||||
this.selectValue = [i]
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.selectValue = [0]
|
||||
}
|
||||
this.selectValue = [...this.selectValue]
|
||||
this.loadEnd = true
|
||||
this.$refs.popupModal.open()
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.loadEnd = false
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
// 改变值
|
||||
handleChange(e) {
|
||||
this.selectValue = [...e.target.value]
|
||||
},
|
||||
// 确认
|
||||
handleConfirm() {
|
||||
this.$emit("confirm", this.selectList[this.selectValue[0]], this.parameter)
|
||||
this.onClose()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-picker-select {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.modal-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
width: 100vw;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.modal-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32rpx;
|
||||
|
||||
.head-title {
|
||||
flex: 1;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
line-height: 44rpx;
|
||||
padding-left: 128rpx;
|
||||
padding: 0 32rpx 0 160rpx;
|
||||
}
|
||||
|
||||
.head-btn {
|
||||
color: #FFF;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
padding: 12rpx 36rpx;
|
||||
border-radius: 10rpx;
|
||||
background: var(--theme-color);
|
||||
}
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
padding-bottom: 32rpx;
|
||||
|
||||
.content-picker {
|
||||
height: 400rpx;
|
||||
flex: 1;
|
||||
|
||||
.picker-column {
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal-btn {
|
||||
color: #E10602;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
padding: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
148
pages/component/picker/time.vue
Normal file
148
pages/component/picker/time.vue
Normal file
@@ -0,0 +1,148 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-时间选择框 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-picker-time" @click.stop>
|
||||
<uni-popup ref="popupModal" type="bottom" :safe-area="false" @change="onChange">
|
||||
<view class="modal-box" :style="{'--theme-color': themeColor}">
|
||||
<view class="modal-head">
|
||||
<view class="head-btn cancel" @click="onClose">取消</view>
|
||||
<view class="head-title">选择时间</view>
|
||||
<view class="head-btn" @click="handleConfirm">确认</view>
|
||||
</view>
|
||||
<view class="modal-content flex-item">
|
||||
<picker-view class="picker-view" indicator-style="height: 50px;" :immediate-change="true" :value="selectValue" @change="handleChange">
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="item in 24" :key="item">{{item < 10 ? "0" + item : item}}时</view>
|
||||
</picker-view-column>
|
||||
<picker-view-column>
|
||||
<view class="picker-column" v-for="item in 60" :key="item">{{item < 10 ? "0" + item : item}}分</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "timePicker",
|
||||
data() {
|
||||
const date = new Date()
|
||||
const hours = date.getHours();
|
||||
const minutes = date.getMinutes();
|
||||
return {
|
||||
// 当前时间
|
||||
nowTime: [hours, minutes],
|
||||
// 已选数据
|
||||
selectValue: [hours, minutes],
|
||||
// 参数
|
||||
parameter: "",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 打开模态框
|
||||
open(value, parameter) {
|
||||
this.parameter = parameter
|
||||
if (value) {
|
||||
var time = value.split(":")
|
||||
this.selectValue = [parseInt(time[0]), parseInt(time[1])]
|
||||
} else {
|
||||
this.selectValue = [parseInt(this.nowTime[0]), parseInt(this.nowTime[1])]
|
||||
}
|
||||
this.$refs.popupModal.open()
|
||||
},
|
||||
// 关闭弹窗
|
||||
onClose() {
|
||||
this.$refs.popupModal.close()
|
||||
},
|
||||
// 改变事件
|
||||
onChange(e) {
|
||||
this.$emit("onChange", e.show)
|
||||
},
|
||||
// 时间改变
|
||||
handleChange(e) {
|
||||
this.selectValue = e.target.value
|
||||
},
|
||||
// 确认
|
||||
handleConfirm() {
|
||||
var hours = parseInt(this.selectValue[0]) < 10 ? "0" + this.selectValue[0] : this.selectValue[0]
|
||||
var minutes = parseInt(this.selectValue[1]) < 10 ? "0" + this.selectValue[1] : this.selectValue[1]
|
||||
var time = hours + ":" + minutes
|
||||
this.$emit("confirm", time, this.parameter)
|
||||
this.onClose()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.component-picker-time {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
||||
.modal-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
width: 100vw;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
|
||||
.modal-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 32rpx;
|
||||
|
||||
.head-title {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
|
||||
.head-btn {
|
||||
color: var(--theme-color);
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
|
||||
&.cancel {
|
||||
color: #979797;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
padding-bottom: 32rpx;
|
||||
|
||||
.picker-view {
|
||||
height: 400rpx;
|
||||
flex: 1;
|
||||
|
||||
.picker-column {
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
144
pages/component/tab-bar/tab-bar.vue
Normal file
144
pages/component/tab-bar/tab-bar.vue
Normal file
@@ -0,0 +1,144 @@
|
||||
<!-- +----------------------------------------------------------------------
|
||||
| 麦沃德科技赋能开发者，助力商协会发展
|
||||
+----------------------------------------------------------------------
|
||||
| Copyright (c) 2017～2024 www.wdsxh.cn All rights reserved.
|
||||
+----------------------------------------------------------------------
|
||||
| 沃德商协会系统并不是自由软件，不加密，并不代表开源，未经许可不可自由转售和商用
|
||||
+----------------------------------------------------------------------
|
||||
| Author: MY WORLD Team <bd@maiwd.cn> www.maiwd.cn
|
||||
+----------------------------------------------------------------------
|
||||
| 组件-底部导航 开发者: 麦沃德科技-半夏
|
||||
+---------------------------------------------------------------------- -->
|
||||
|
||||
<template>
|
||||
<view class="component-tab-bar" v-if="tabBarList && tabBarList.length">
|
||||
<view class="tab-bar-main" :style="{'--theme-color': themeColor}">
|
||||
<view class="main-item wbcentre" v-for="(item, index) in tabBarList" :key="index" @click="tabBarPages(index)">
|
||||
<image class="item-img" :src="item.selicon" mode="aspectFit" v-if="item.path == currentPath"></image>
|
||||
<image class="item-img" :src="item.icon" mode="aspectFit" v-else></image>
|
||||
<view class="item-text" :class="{active: item.path == currentPath}">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: "tabBar",
|
||||
data() {
|
||||
return {
|
||||
// 当前页面路径
|
||||
currentPath: ""
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
themeColor: state => state.app.themeColor,
|
||||
tabBarList: state => {
|
||||
let list = state.app.tabBarList
|
||||
let pages = getCurrentPages();
|
||||
let isShow = false
|
||||
if (pages && pages.length) {
|
||||
let currentPath = "/" + pages[pages.length - 1].route;
|
||||
if (list.length) {
|
||||
for (let i in list) {
|
||||
if (currentPath == list[i].path) {
|
||||
isShow = true
|
||||
// #ifdef MP-WEIXIN
|
||||
wx.hideHomeButton();
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!isShow) list = []
|
||||
return list
|
||||
},
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
let pages = getCurrentPages();
|
||||
this.currentPath = "/" + pages[pages.length - 1].route;
|
||||
},
|
||||
methods: {
|
||||
// 跳转底部导航
|
||||
tabBarPages(index) {
|
||||
const item = this.tabBarList[index]
|
||||
if (item.jump_type == 1) {
|
||||
// 图文
|
||||
if (item.path == this.currentPath) return
|
||||
uni.navigateTo({
|
||||
url: "/pages/webview/imageText?type=2&id=" + item.id
|
||||
})
|
||||
} else if (item.jump_type == 2) {
|
||||
// 内部页面
|
||||
if (item.path == this.currentPath) return
|
||||
this.$util.toPage({
|
||||
path: item.path,
|
||||
mode: 3
|
||||
})
|
||||
} else if (item.jump_type == 3) {
|
||||
// 外部链接
|
||||
this.$util.toPage({
|
||||
path: item.path,
|
||||
mode: 4,
|
||||
})
|
||||
} else if (item.jump_type == 4) {
|
||||
// 小程序
|
||||
this.$util.toPage({
|
||||
appId: JSON.parse(item.path).appid,
|
||||
path: JSON.parse(item.path).path,
|
||||
mode: 5,
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-tab-bar {
|
||||
width: 100%;
|
||||
height: 126rpx;
|
||||
|
||||
.tab-bar-main {
|
||||
background: #fff;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 998;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
border-top: 2rpx solid #F6F7FB;
|
||||
|
||||
.main-item {
|
||||
flex: 1;
|
||||
height: 124rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.item-img {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.item-text {
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
margin-top: 4rpx;
|
||||
text-align: center;
|
||||
|
||||
&.active {
|
||||
color: var(--theme-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
176
pages/component/title-bar/title-bar.vue
Normal file
176
pages/component/title-bar/title-bar.vue
Normal file
@@ -0,0 +1,176 @@
|
||||
<!-- 组件-标题栏 开发者: 麦沃德科技半夏 -->
|
||||
<template>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="component-title-bar" :style="{background: backgroundColor, position: positionMode}">
|
||||
<view class="title-bar-status" :style="{height: statusBarHeight + 'px'}"></view>
|
||||
<view class="title-bar-main" :style="{height: titleBarHeight + 'px'}">
|
||||
<view class="main-back" v-if="showBack || !isHideBtn" @click="goBack()">
|
||||
<image class="icon" src="/static/back.png" mode="aspectFit" v-if="frontColor == 'white'"></image>
|
||||
<image class="icon" src="/static/back_b.png" mode="aspectFit" v-else></image>
|
||||
</view>
|
||||
<view class="main-title">
|
||||
<view class="title text-ellipsis" :style="{color: frontColor, fontSize: titleFontSize + 'px'}">{{title}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="title-bar-border" v-if="backgroundColor == '#fff'"></view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view></view>
|
||||
<!-- #endif -->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from "vuex"
|
||||
export default {
|
||||
name: 'titleBar',
|
||||
props: {
|
||||
// 组件标题
|
||||
title: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
// 组件背景色
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: "#fff"
|
||||
},
|
||||
// 组件文字颜色
|
||||
frontColor: {
|
||||
type: String,
|
||||
default: "black"
|
||||
},
|
||||
// 是否总是显示返回按钮
|
||||
showBack: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 定位模式
|
||||
positionMode: {
|
||||
type: String,
|
||||
default: "sticky"
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 状态栏高度
|
||||
statusBarHeight: 0,
|
||||
// 标题栏高度
|
||||
titleBarHeight: 0,
|
||||
// 标题文字尺寸
|
||||
titleFontSize: 16,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
isHideBtn: state => {
|
||||
let list = state.app.tabBarList
|
||||
let pages = getCurrentPages();
|
||||
let isHide = false
|
||||
if (pages && pages.length) {
|
||||
let currentPath = "/" + pages[pages.length - 1].route;
|
||||
if (list.length) {
|
||||
for (let i in list) {
|
||||
if (currentPath == list[i].path) {
|
||||
isHide = true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return isHide
|
||||
},
|
||||
})
|
||||
},
|
||||
mounted() {
|
||||
// #ifdef MP-WEIXIN
|
||||
let systemInfo = uni.getSystemInfoSync()
|
||||
this.titleFontSize = systemInfo.fontSizeSetting || 16
|
||||
this.statusBarHeight = systemInfo.statusBarHeight
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
||||
this.titleBarHeight = (menuButtonInfo.top - this.statusBarHeight) * 2 + menuButtonInfo.height
|
||||
// #endif
|
||||
},
|
||||
watch: {
|
||||
title: {
|
||||
handler(value) {
|
||||
// #ifndef MP-WEIXIN
|
||||
if (value) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: value
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 返回上一页
|
||||
goBack() {
|
||||
if (getCurrentPages().length == 1) {
|
||||
uni.switchTab({
|
||||
url: "/pages/index/index"
|
||||
})
|
||||
} else {
|
||||
uni.navigateBack()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component-title-bar {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 998;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
|
||||
.title-bar-status {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.title-bar-main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
padding: 0 25%;
|
||||
|
||||
.main-back {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
position: absolute;
|
||||
left: 32rpx;
|
||||
|
||||
.icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.main-title {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
|
||||
.title {
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.title-bar-border {
|
||||
width: 100%;
|
||||
height: 1rpx;
|
||||
background: #F6F7FB;
|
||||
margin-top: -1rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user