Compare commits
No commits in common. "master" and "myb" have entirely different histories.
2
App.vue
2
App.vue
@ -1,6 +1,6 @@
|
||||
<style lang="scss">
|
||||
/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
|
||||
@import "uni_modules/uview-ui/index.scss";
|
||||
@import "uview-ui/index.scss";
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
@ -1,13 +0,0 @@
|
||||
export const apiArr = {
|
||||
orderList: '/api/v2/wechat/commodity/order', // 商品订单列表
|
||||
afterSalesList: '/api/v2/wechat/commodity/after-sales/list', // 商品订单售后列表
|
||||
afterSaleCreate: "/api/v2/wechat/commodity/after-sales/refund-info/create", //商品订单售后信息创建
|
||||
cancelOrConfirm: "/api/v2/wechat/commodity/order/cancel_or_confirm", //商品订单确认收货或取消
|
||||
isAllow: "/api/v2/wechat/commodity/after-sales/is-allow", //判断订单是否能申请售后
|
||||
revokeApply: "/api/v2/wechat/commodity/after-sales/revoke-apply", //撤销售后申请
|
||||
changeGoodsList: "/api/v2/wechat/commodity/after-sales/change-goods-list", //商品售后换货商品列表
|
||||
updateApply: "/api/v2/wechat/commodity/after-sales/update-apply", //商品订单售后修改申请
|
||||
createReview: "/api/v2/wechat/commodity/review/create", //创建订单评价
|
||||
orderRefund: "/api/v2/wechat/commodity/order/refund", //商品订单退款
|
||||
selectGoodsDetail: "/api/v2/wechat/commodity/goods-info/by-goods", //根据货品id查询商品货品信息
|
||||
};
|
||||
@ -1,60 +1,47 @@
|
||||
export const apiArr = {
|
||||
isShowSearch: "/api/v1/wechat/home-page/search-enable/info", // 获取搜索框是否显示
|
||||
hotWord: "/api/v1/wechat/home-page/search-hot-word/info", // 获取搜索框热词
|
||||
list: "/api/v1/wechat/community/list", // 获取社区列表
|
||||
info: "/api/v1/wechat/community/info", // 获取单个社区信息
|
||||
isJoin: "/api/v1/wechat/community/is-join", // 用户是否加入社区、楼宇、房间
|
||||
tipsList: "/api/v1/wechat/community/tips/list", // 获取全部通知列表
|
||||
oneTips: "/api/v1/wechat/community/tips/one", // 获取单个社区通知
|
||||
apply: "/api/v1/wechat/community/apply", // 申请加入小区
|
||||
getFacilityList: "/api/v1/wechat/community/facility/list", //获取楼号，
|
||||
getRoomList: "/api/v1/wechat/community/room/list", //获取房间号
|
||||
ownerList: "/api/v1/wechat/community/owner/list", // 获取社区业主列表
|
||||
list: '/api/v1/wechat/community/list', // 获取社区列表
|
||||
info: '/api/v1/wechat/community/info', // 获取单个社区信息
|
||||
isJoin: '/api/v1/wechat/community/is-join', // 用户是否加入社区、楼宇、房间
|
||||
tipsList: '/api/v1/wechat/community/tips/list', // 获取全部通知列表
|
||||
oneTips: '/api/v1/wechat/community/tips/one', // 获取单个社区通知
|
||||
apply: '/api/v1/wechat/community/apply', // 申请加入小区
|
||||
getFacilityList: '/api/v1/wechat/community/facility/list', //获取楼号，
|
||||
getRoomList: '/api/v1/wechat/community/room/list', //获取房间号
|
||||
ownerList: '/api/v1/wechat/community/owner/list', // 获取社区业主列表
|
||||
|
||||
submit: "/api/v1/wechat/community/owner/feedback-create", //报修提交
|
||||
getListByRepair: "/api/v1/wechat/community/owner/feedback-list", //报事报修列表
|
||||
getInfoById: "/api/v1/wechat/community/owner/feedback-info", //报事报修根据id查询详情
|
||||
submit: "/api/v1/wechat/community/owner/feedback-create", //报修提交
|
||||
getListByRepair: "/api/v1/wechat/community/owner/feedback-list",//报事报修列表
|
||||
getInfoById: "/api/v1/wechat/community/owner/feedback-info", //报事报修根据id查询详情
|
||||
|
||||
getUserCommunity: "/api/v1/wechat/community/owner/mylist", //获取用户社区信息
|
||||
getUserCommunity: "/api/v1/wechat/community/owner/mylist",//获取用户社区信息
|
||||
|
||||
get_host_info: "https://zhsq.hshuishang.com/Miniapi/Index/get_host_info",
|
||||
get_host_info: 'https://zhsq.hshuishang.com/Miniapi/Index/get_host_info',
|
||||
|
||||
get_community_area_list:
|
||||
"https://zhsq.hshuishang.com/Miniapi/Community/get_community_area_list",
|
||||
|
||||
carList: "/api/v1/wechat/community/car/list", // 获取社区列表
|
||||
addCar: "/api/v1/wechat/community/car/add", // 添加车辆
|
||||
getCarList: "/api/v1/wechat/community/car/list", //获取车辆列表
|
||||
deleteItem: "/api/v1/wechat/community/car/del", //删除车牌
|
||||
|
||||
getBanner: "/api/v1/wechat/home-page/banner-list", //获取banner图
|
||||
getButton: "/api/v1/wechat/home-page/button-list", //获取button
|
||||
getHotWords: "/api/v1/wechat/home-page/search-hot-word/info", //搜索热词
|
||||
|
||||
getAllList: "/api/v2/wechat/community/get-all-list", //获取小区信息列表
|
||||
commRoomSelect: "/api/v2/wechat/community-room/comm-room-select", //房源筛选器
|
||||
|
||||
commInfo: "/api/v2/wechat/mpuser-crud/community-owner/info", //我的房产信息小区列表
|
||||
create: "/api/v2/wechat/community-owners/create", //创建新的业主信息
|
||||
|
||||
communityInfo: "/api/v2/community/get-one", //获取小区信息
|
||||
|
||||
workCommunityList: "/api/v2/wechat/community-worker/work-comm-list", //员工小区列表
|
||||
|
||||
getOrderList: "/api/v2/wechat/community-orders/get-all-list", //获取账单
|
||||
getCommunityRoomList: "/api/v2/wechat/community-room/list", //获取房源列表
|
||||
getUserGovenmentMoney:
|
||||
"/api/v2/wechat/government-housing-fund-flow-crud/user", //获取用户公积金
|
||||
createPayOrder: "/api/v2/wechat/community-order-pay/create", //创建缴费
|
||||
getPayOrderInfo: "/api/v2/wechat/community-order-pay/get-one", //根据缴费信息获取支付信息
|
||||
getPayOrderList: "/api/v2/wechat/community-order-pay/get-page", //查询缴费记录
|
||||
OrderPay: "/api/v2/wechat/community-order-pay/preorder", //预下单
|
||||
tradeQuery: "/api/v2/wechat/community-order-pay/trade-query", //缴费查单
|
||||
|
||||
checkComm: "/api/v2/wechat/community/check-comm", //检查小区是否属于当前用户
|
||||
|
||||
delPay: "/api/v2/wechat/community-order-pay/del", //检查小区是否属于当前用户
|
||||
get_community_area_list: "https://zhsq.hshuishang.com/Miniapi/Community/get_community_area_list",
|
||||
|
||||
|
||||
getShopList: "/api/v2/wechat/merchant-crud-list/by-user", //根据用户获取商家列表
|
||||
};
|
||||
carList: '/api/v1/wechat/community/car/list', // 获取社区列表
|
||||
addCar: '/api/v1/wechat/community/car/add', // 添加车辆
|
||||
getCarList: '/api/v1/wechat/community/car/list', //获取车辆列表
|
||||
deleteItem: "/api/v1/wechat/community/car/del",//删除车牌
|
||||
|
||||
getBanner: "/api/v1/wechat/home-page/banner-list",//获取banner图
|
||||
getButton: "/api/v1/wechat/home-page/button-list",//获取button
|
||||
getHotWords: "/api/v1/wechat/home-page/search-hot-word/info",//搜索热词
|
||||
|
||||
|
||||
getAllList: "/api/v2/wechat/community/get-all-list",//获取小区信息列表
|
||||
commRoomSelect: "/api/v2/wechat/community-room/comm-room-select",//房源筛选器
|
||||
|
||||
commInfo: "/api/v2/wechat/mpuser-crud/community-owner/info",//我的房产信息小区列表
|
||||
create: "/api/v2/wechat/community-owners/create",//创建新的业主信息
|
||||
|
||||
|
||||
getOrderList:"/api/v2/wechat/community-orders/get-all-list",//获取账单
|
||||
getCommunityRoomList:"/api/v2/wechat/community-room/list", //获取房源列表
|
||||
getUserGovenmentMoney:"/api/v2/wechat/government-housing-fund-flow-crud/user", //获取用户公积金
|
||||
createPayOrder:"/api/v2/wechat/community-order-pay/create", //创建缴费
|
||||
getPayOrderInfo:"/api/v2/wechat/community-order-pay/get-one", //根据缴费信息获取支付信息
|
||||
getPayOrderList:"/api/v2/wechat/community-order-pay/get-page", //查询缴费记录
|
||||
OrderPay:"/api/v2/wechat/community-order-pay/preorder",//预下单
|
||||
};
|
||||
@ -1,10 +0,0 @@
|
||||
export const apiArr = {
|
||||
ecApply: "/api/v2/wechat/lkl-split-business/ec-apply", //电子合同申请
|
||||
ecQuery: "/api/v2/wechat/lkl-split-business/ec-query", //电子合同查询
|
||||
ecDownload: "/api/v2/wechat/lkl-split-business/ec-download", //电子合同下载
|
||||
upload: "/api/v2/wechat/lkl-split-business/upload", //附件上传
|
||||
applyLedgerReceiver: "/api/v2/wechat/lkl-split-business/apply-ledger-receiver", //分账接收方创建申请
|
||||
applyBind: "/api/v2/wechat/lkl-split-business/apply-bind", //分账关系绑定申请
|
||||
addMer: "/api/v2/wechat/lkl-split-business/add-mer", //商户进件
|
||||
applyLedgerMer: "/api/v2/wechat/lkl-split-business/apply-ledger-mer", //商户分账业务开通申请
|
||||
};
|
||||
@ -1,6 +0,0 @@
|
||||
export const apiArr = {
|
||||
csGetMsgList: "/api/v2/wechat/contactServer/getMsgList", //获取联系客服消息列表
|
||||
csGetMsgRecord: "/api/v2/wechat/contactServer/getMsgRecord", //获取联系客服消息记录
|
||||
csGetToClientId: "/api/v2/wechat/contactServer/getToClientId", //获取联系客服客户端ID
|
||||
csGetMchContactList: "/api/v2/wechat/contactServer/mchContactList", //商户客服列表
|
||||
};
|
||||
@ -1,7 +0,0 @@
|
||||
export const apiArr = {
|
||||
groupBuyList: "/api/v2/wechat/commodity/group-buy/list", //团购列表
|
||||
groupGoodsList: "/api/v2/wechat/commodity/group-goods/list", //团购商品列表
|
||||
groupBuyAddress: "/api/v2/wechat/commodity/group-buy/address", //团购自提地址
|
||||
groupBuyRecord: "/api/v2/wechat/commodity/group-buy/buy-record", //团购购买记录
|
||||
groupBuyWriteOff: "/api/v2/wechat/commodity/group-buy/write-off", //团购核销
|
||||
};
|
||||
22
api/park.js
22
api/park.js
@ -1,22 +0,0 @@
|
||||
export const apiArr = {
|
||||
carList: '/api/v2/wechat/smart-parking/car/list', // 车辆列表
|
||||
carAdd: '/api/v2/wechat/smart-parking/car/add', // 车辆添加
|
||||
|
||||
monthCardCreate: '/api/v2/wechat/smart-parking/month-card/create', // 月卡订单创建
|
||||
monthCardOrderList: '/api/v2/wechat/smart-parking/month-card/order/list', // 包月订单列表
|
||||
monthCardOrderPreorder: '/api/v2/wechat/smart-parking/month-card/order/preorder', // 月卡充值预下单
|
||||
monthCardOrderQuery: '/api/v2/wechat/smart-parking/month-card/order/trade_query', // 月卡充值订单交易查询
|
||||
billingRulesList: '/api/v2/wechat/smart-parking/billing-rules/list', // 月卡计费规则列表
|
||||
|
||||
tempParkingCreate: '/api/v2/wechat/smart-parking/temp-parking/create', // 临时车缴费订单创建
|
||||
tempParkingInfo: '/api/v2/wechat/smart-parking/temp-parking/info', // 临时车缴费信息
|
||||
tempParkingOrderDelete: '/api/v2/wechat/smart-parking/temp-parking/order/delete', // 临时车停车订单删除
|
||||
tempParkingOrderInfo: '/api/v2/wechat/smart-parking/temp-parking/order/info', // 临时车停车订单信息
|
||||
tempParkingOrderList: '/api/v2/wechat/smart-parking/temp-parking/order/list', // 临时车停车订单列表
|
||||
tempParkingOrderPreorder: '/api/v2/wechat/smart-parking/temp-parking/preorder', // 临时车缴费订单预下单
|
||||
tempParkingOrderQuery: '/api/v2/wechat/smart-parking/temp-parking/trade_query', // 临时车缴费订单交易查询
|
||||
|
||||
parkList: '/api/v2/wechat/smart-parking/parking/list', // 停车场列表
|
||||
|
||||
deleteCar: '/api/v2/wechat/smart-parking/car/del', // 删除车辆
|
||||
}
|
||||
@ -1,5 +1,4 @@
|
||||
export const apiPay = {
|
||||
pay: '/api/v1/lakala/preorder', //预下单
|
||||
queryPay: '/api/v1/lakala/trade-query', //查询交易结果
|
||||
qrcode: '/api/v2/wechat/quick-payment-record-crud/qrcode' //快捷支付二维码
|
||||
queryPay: '/api/v1/lakala/trade-query' //查询交易结果
|
||||
}
|
||||
@ -1,5 +0,0 @@
|
||||
export const apiArr = {
|
||||
routingInspectionList: "/api/v2/wechat/inspection-task/list", //巡检任务列表
|
||||
routingInspectionInfo: "/api/v2/wechat/inspection-task/info", //巡检任务详情
|
||||
routingInspectionSubmit: "/api/v2/wechat/inspection-task/submit", //巡检任务提交
|
||||
};
|
||||
35
api/shop.js
35
api/shop.js
@ -1,28 +1,17 @@
|
||||
export const apiArr = {
|
||||
goodsCateList: "/api/v2/wechat/commodity/cate",//商品分类列表
|
||||
getGoodsList: "/api/v2/wechat/commodity", //商品分类
|
||||
getGoodsInfo: "/api/v2/wechat/commodity/info", //商品详情
|
||||
getCar: "/api/v2/wechat/commodity/cart",//购物车
|
||||
getCarCount: "/api/v2/wechat/commodity/cart/all_count",//购物车数量
|
||||
addCar: "/api/v2/wechat/commodity/cart/add",//添加购物车
|
||||
deleteCar: "/api/v2/wechat/commodity/cart/delete",//删除购物车
|
||||
updateCar: "/api/v2/wechat/commodity/cart/update",//更新购物车信息
|
||||
getUserDefAddress: "/api/v2/wechat/commodity/receiving_address/get_default",//获取用户默认地址
|
||||
createOrder: "/api/v2/wechat/commodity/order/create",//创建商品订单
|
||||
payOrder: "/api/v2/wechat/commodity/order/pay",//支付订单
|
||||
getGoodsList:"/api/v2/wechat/commodity", //商品分类
|
||||
getGoodsInfo:"/api/v2/wechat/commodity/info", //商品详情
|
||||
getCar:"/api/v2/wechat/commodity/cart",//购物车
|
||||
getCarCount:"/api/v2/wechat/commodity/cart/all_count",//购物车数量
|
||||
addCar:"/api/v2/wechat/commodity/cart/add",//添加购物车
|
||||
deleteCar:"/api/v2/wechat/commodity/cart/delete",//删除购物车
|
||||
addressList: '/api/v2/wechat/commodity/receiving_address', // 收货地址列表
|
||||
addAddress: '/api/v2/wechat/commodity/receiving_address/add', // 收货地址添加
|
||||
addressDel: '/api/v2/wechat/commodity/receiving_address/delete', // 收货地址删除
|
||||
settingDefaultAddress: '/api/v2/wechat/commodity/receiving_address/default', // 收货地址设置默认
|
||||
updateAddress: '/api/v2/wechat/commodity/receiving_address/update', // 收货地址修改
|
||||
deleteAddress: '/api/v2/wechat/commodity/receiving_address/delete', // 收货地址删除
|
||||
addAddress: '/api/v2/wechat/commodity/receiving_address/add', // 收货地址添加
|
||||
addAddressList: '/api/v2/wechat/commodity/receiving_address', // 收货地址列表
|
||||
queryOrder: '/api/v2/wechat/commodity/order/trade_query', // 查询订单
|
||||
getComment: '/api/v2/wechat/commodity/review/list', // 获取评论
|
||||
|
||||
mergePreorder: '/api/v2/wechat/commodity/order/preorder', // 商品订单合并预下单
|
||||
|
||||
goodsSearch: '/api/v2/wechat/commodity/search', // 商品搜索
|
||||
cancelPay: '/api/v2/wechat/commodity/order/cancel_pay', // 用户取消支付
|
||||
|
||||
|
||||
adverGoodsList: '/api/v2/wechat/commodity/adver-goods-list', // 广告货品列表
|
||||
updateCar:"/api/v2/wechat/commodity/cart/update",
|
||||
updateCar:"/api/v2/wechat/commodity/cart/update",//更新购物车信息
|
||||
getUserDefAddress:"/api/v2/wechat/commodity/receiving_address/get_default",//获取用户默认地址
|
||||
}
|
||||
@ -1,9 +1,6 @@
|
||||
export const apiArr = {
|
||||
getCateList: "/api/v2/wechat/merchant-cate-crud/list", //商家分类列表
|
||||
getMerchantList: "/api/v2/wechat/merchant-info-crud/page", //商家列表
|
||||
getCateList: "/api/v2/wechat/merchant-cate-crud/list", //小区房源列表
|
||||
getHomeBanner: "/api/v2/wechat/home-banner-region-crud/page", //获取首页banner及其广告
|
||||
getButtonNum:"/api/v2/wechat/nav-display-crud/info",//获取首页button的行数 数量
|
||||
getHomeButton:"/api/v2/wechat/home-button-region-crud/page", //获取首页button
|
||||
|
||||
statusQuery:"/api/v2/wechat/store-info-crud/status-query", //门店审核状态查询
|
||||
};
|
||||
@ -1,6 +1,4 @@
|
||||
export const apiArr = {
|
||||
getUserInfo: '/api/v2/wechat/mpuser-crud/info', // 获取城市列表
|
||||
userInfoUpdate: '/api/v2/wechat/mpuser-crud/update', // 会员信息更新
|
||||
getAccumulationFund: '/api/v2/wechat/government-housing-fund-flow-crud/page', // 物业费
|
||||
getPoints: '/api/v2/wechat/member-points-flow-crud/page', // 积分
|
||||
}
|
||||
@ -2,7 +2,6 @@ export const apiArr = {
|
||||
getMerChantCateList:"/api/v2/wechat/merchant-cate-crud/list", //商家分类
|
||||
getMerchantList:"/api/v2/wechat/merchant-info-crud/page",//商家列表
|
||||
createComment:"/api/v2/wechat/merchant-evaluation-crud/creat",//创建用户评价
|
||||
getMerchantInfo:"/api/v2/wechat/merchant-info-crud/info",//获取商家信息详情
|
||||
getMerchantComment:"/api/v2/wechat/merchant-evaluation-crud/page",//获取商家评价
|
||||
merChantCommentLike:"/api/v2/wechat/merchant-evaluation-like-crud/creat",//点赞
|
||||
merChantCommentUnlike:"/api/v2/wechat/merchant-evaluation-like-crud/del",//取消点赞
|
||||
@ -21,8 +20,6 @@ export const apiArr = {
|
||||
|
||||
createPay:"/api/v2/wechat/quick-payment-record-crud/creat",//创建支付信息
|
||||
getPayInfo:"/api/v2/wechat/quick-payment-record-crud/info", //支付记录
|
||||
getPreOrderInfo:"/api/v2/wechat/quick-payment-record-crud/preorder", //预下单
|
||||
tradeQuery:"/api/v2/wechat/quick-payment-record-crud/trade-query", //查单
|
||||
|
||||
|
||||
createStore:"/api/v2/wechat/store-info-crud/creat",//门店信息创建
|
||||
|
||||
@ -1,4 +0,0 @@
|
||||
export const apiArr = {
|
||||
walletList: "/api/v2/wechat/wallet/list", // 商户钱包
|
||||
walletChangeList: "/api/v2/wechat/wallet/change/list", // 商户钱包变更详情
|
||||
};
|
||||
@ -1,5 +0,0 @@
|
||||
{
|
||||
"adapteByMiniprogram": {
|
||||
"userName": "gh_ca4a91c192dd"
|
||||
}
|
||||
}
|
||||
@ -1,282 +0,0 @@
|
||||
<template>
|
||||
<view class="key-container" @click="hide" v-show="showMask">
|
||||
<uni-transition :modeClass="['slide-bottom']" :show="show"
|
||||
:styles="{height:'100vh'}"
|
||||
:duration="duration">
|
||||
<view class="key-content" @click.stop>
|
||||
<slot></slot>
|
||||
<view class="key-box block flex">
|
||||
<view class="key-left">
|
||||
<view class="key-top flex flex-wrap">
|
||||
<view class="btn-box" v-for="(item,index) in numArr" :key="index">
|
||||
<button hover-class="active" class="cu-btn key-btn text-black text-xl" @click.stop="keydown(item)">{{item}}</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="key-bottom">
|
||||
<view class="btn-zero">
|
||||
<button hover-class="active" class="cu-btn key-btn text-black text-xl" @click.stop="keydown('0')">0</button>
|
||||
</view>
|
||||
<view class="btn-point">
|
||||
<button hover-class="active" class="cu-btn key-btn text-black text-xl" @click.stop="keydown('.')">.</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="key-right">
|
||||
<view class="del">
|
||||
<button hover-class="active" class="cu-btn key-btn text-black text-xl" @click.stop="del">
|
||||
<text class="zm iconbackspace text-xl"></text>
|
||||
</button>
|
||||
</view>
|
||||
<view class="confirm">
|
||||
<button hover-class="active" :style="[confirmStyle]" class="cu-btn" @click.stop="confirm">
|
||||
<text class="confirm-text">{{confirmText}}</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-transition>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* 付款组件
|
||||
* @property {Number} duration - 弹出动画时长，默认为300
|
||||
* @event {Function} change - 数字改变触发，参数为数字
|
||||
* @event {Function} confirm - 付款时触发，参数为数字
|
||||
* @event {Function} hide - 关闭键盘触发，参数为空
|
||||
*/
|
||||
// 使用方法,查看同级目录exmple
|
||||
import uniTransition from '../uni-transition/uni-transition.vue'
|
||||
export default{
|
||||
components:{
|
||||
uniTransition
|
||||
},
|
||||
props:{
|
||||
duration:{
|
||||
type:Number,//弹出动画时常
|
||||
default:300
|
||||
},
|
||||
confirmText:{
|
||||
type:String,
|
||||
default:'付款'
|
||||
},
|
||||
confirmStyle:{
|
||||
type:Object,
|
||||
default:()=>{
|
||||
return{
|
||||
backgroundColor:'#57BE6D'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
value:'',//输出的值
|
||||
show:false,//显示键盘
|
||||
showMask:false,//遮罩层
|
||||
numArr:[1,2,3,4,5,6,7,8,9]
|
||||
}
|
||||
},
|
||||
|
||||
watch:{
|
||||
value(newval,oldval){
|
||||
this.$emit("change",newval);
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
close(){
|
||||
this.show = false;
|
||||
setTimeout(()=>{
|
||||
this.showMask = false;
|
||||
},this.duration)
|
||||
},
|
||||
open(){
|
||||
this.value = '';
|
||||
this.show = true;
|
||||
this.showMask = true;
|
||||
},
|
||||
del(){
|
||||
if(this.value.length){
|
||||
this.value = this.value.slice(0,this.value.length-1);
|
||||
}
|
||||
},
|
||||
keydown(e){
|
||||
switch(e){
|
||||
case '.':
|
||||
// 当输入为点的时候，如果第一次输入点，则补零
|
||||
if(!this.value.length){
|
||||
this.value = '0.';
|
||||
}else{
|
||||
if(this.value.indexOf('.')>-1){
|
||||
// 如果已经有点，则无效
|
||||
}else{
|
||||
this.value = this.value+''+e;
|
||||
}
|
||||
}
|
||||
break;
|
||||
case '0':
|
||||
if(this.value.length === 0){
|
||||
this.value = this.value+''+e;
|
||||
}
|
||||
if(Number(this.value) === 0 && this.value.indexOf('.')== -1){
|
||||
// 当输入为零的时候，如果value转换成数字为零，且没有点则无效
|
||||
}else{
|
||||
this.value = this.value+''+e;
|
||||
}
|
||||
break;
|
||||
default:
|
||||
this.value = this.value+''+e;
|
||||
break;
|
||||
}
|
||||
},
|
||||
hide(){
|
||||
this.$emit('hide');
|
||||
this.close();
|
||||
},
|
||||
confirm(){
|
||||
this.$emit('confirm',this.value);
|
||||
this.close();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@font-face {
|
||||
font-family: 'zm'; /* project id 2442084 */
|
||||
src: url('https://at.alicdn.com/t/font_2442084_o72ps3802ih.eot');
|
||||
src: url('https://at.alicdn.com/t/font_2442084_o72ps3802ih.eot?#iefix') format('embedded-opentype'),
|
||||
url('https://at.alicdn.com/t/font_2442084_o72ps3802ih.woff2') format('woff2'),
|
||||
url('https://at.alicdn.com/t/font_2442084_o72ps3802ih.woff') format('woff'),
|
||||
url('https://at.alicdn.com/t/font_2442084_o72ps3802ih.ttf') format('truetype'),
|
||||
url('https://at.alicdn.com/t/font_2442084_o72ps3802ih.svg#zm') format('svg');
|
||||
}
|
||||
|
||||
.zm {
|
||||
font-family: "zm" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.iconbackspace:before {
|
||||
content: "\ef11";
|
||||
}
|
||||
|
||||
.flex{
|
||||
display: flex;
|
||||
}
|
||||
.flex-wrap{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.cu-btn {
|
||||
position: relative;
|
||||
border: 0rpx;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
padding: 0 30rpx;
|
||||
font-size: 28rpx;
|
||||
height: 64rpx;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
overflow: visible;
|
||||
margin-left: initial;
|
||||
transform: translate(0rpx, 0rpx);
|
||||
margin-right: initial;
|
||||
}
|
||||
|
||||
.cu-btn::after {
|
||||
display: none;
|
||||
}
|
||||
.text-xl{
|
||||
font-size:36rpx;
|
||||
font-weight: bold;
|
||||
font-family: 'microsoft-yahei';
|
||||
}
|
||||
.text-black{
|
||||
color:#333;
|
||||
}
|
||||
.active{
|
||||
background-color: #ddd !important;
|
||||
transform: translate(2rpx,2rpx);
|
||||
}
|
||||
.key-container{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
top:0;
|
||||
left:0;
|
||||
right:0;
|
||||
.key-content{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100vw;
|
||||
background-color: #F7F7F7;
|
||||
}
|
||||
}
|
||||
.key-box{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding:10rpx 10rpx 0;
|
||||
.key-left{
|
||||
width: 75%;
|
||||
}
|
||||
.key-right{
|
||||
width: 25%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.key-bottom{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
.del{
|
||||
width: 100%;
|
||||
}
|
||||
.btn-box{
|
||||
width: 33.33%;
|
||||
padding:0 10rpx 10rpx 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.btn-zero{
|
||||
width: 66.66%;
|
||||
padding:0 10rpx 10rpx 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.btn-point{
|
||||
width: 33.33%;
|
||||
padding:0 10rpx 10rpx 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.key-right{
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.key-btn{
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.confirm{
|
||||
width: 100%;
|
||||
flex:1;
|
||||
padding: 10rpx 0 10rpx 0;
|
||||
box-sizing: border-box;
|
||||
button{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.confirm-text{
|
||||
color:#fff;
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,41 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<button type="default" @click="open">打开键盘</button>
|
||||
{{value}}
|
||||
<cu-keyboard ref="cukeyboard" @change="change" @confirm="confirm" @hide="hide"></cu-keyboard>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value:''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
change(e){
|
||||
this.value = e;
|
||||
console.log("数字改变",e);
|
||||
},
|
||||
open(){
|
||||
console.log("打开键盘");
|
||||
this.$refs.cukeyboard.open();
|
||||
},
|
||||
confirm(e){
|
||||
console.log("付款",e);
|
||||
},
|
||||
hide(){
|
||||
console.log("关闭键盘")
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@ -1,24 +1,21 @@
|
||||
|
||||
.foot-fixed {
|
||||
position: fixed;
|
||||
bottom: -10px;
|
||||
bottom: -1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border-top: 1px solid #E8E8E8;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
|
||||
/* height: 8%; */
|
||||
box-shadow: 0 0 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item {
|
||||
width: 20%;
|
||||
float: left;
|
||||
@ -30,88 +27,48 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #666;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
|
||||
.foot-fixed .foot-item .foot-icon-box {
|
||||
.foot-fixed .foot-item .foot-icon-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 66rpx;
|
||||
height: 66rpx;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item .foot-icon {
|
||||
width: 47rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item .foot-icon2 {
|
||||
width: 66rpx;
|
||||
height: 66rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.foot-icon3{
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
|
||||
.foot-fixed .foot-item .foot-label {
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item .foot-label {
|
||||
height: 15px;
|
||||
line-height: 15px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.foot-fixed .foot-item span {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item {
|
||||
position: relative;
|
||||
margin-top: -30rpx;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item .foot-icon-box {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
background: #fff;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 20rpx rgba(255, 77, 79, 0.5);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: -20rpx;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item .foot-icon {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.foot-fixed .scan-item .foot-label {
|
||||
margin-top: 10rpx;
|
||||
color: #FF4D4F;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 自定义导航栏 */
|
||||
.nav-box {
|
||||
|
||||
@ -1,231 +1,141 @@
|
||||
<template>
|
||||
<view class="foot-fixed">
|
||||
<view v-for="(item, index) in navList" :key="index">
|
||||
<view id="navIndex" :style="{ width: foot_width }" @click="jump" :data-idx="index" :data-url="item.url"
|
||||
:class="{ 'foot-item': true, 'scan-item': item.isScan }">
|
||||
<view class="foot-icon-box">
|
||||
<image class="foot-icon" :src="item.photo" mode="widthFix" v-if="current != index" :style="{
|
||||
width: item.photo.includes('footer_localLife.png')
|
||||
? '70rpx'
|
||||
: '',
|
||||
}"></image>
|
||||
<image
|
||||
:class="{ 'foot-icon3': item.photo.includes('footer_richScan.png'), 'foot-icon2': !item.photo.includes('footer_richScan.png') }"
|
||||
:src="item.photoAc" mode="widthFix" v-if="current == index"></image>
|
||||
</view>
|
||||
<view class="foot-fixed">
|
||||
<view v-for="(item, index) in navList" :key='index'>
|
||||
<view id="navIndex" :style="{width:foot_width}" @click="jump" :data-idx="index" :data-url="item.url"
|
||||
class="foot-item">
|
||||
|
||||
<text class="foot-label" id="navIndexLabel">{{ item.nav_name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="foot-icon-box">
|
||||
<image class="foot-icon" :src="item.photo" mode="widthFix" v-if="current != index"></image>
|
||||
<image class="foot-icon2" :src="item.photoAc" mode="widthFix" v-if="current == index"></image>
|
||||
</view>
|
||||
|
||||
|
||||
<text class="foot-label" id="navIndexLabel">{{item.nav_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "nav",
|
||||
props:{
|
||||
current:{
|
||||
type:Number,
|
||||
default: 0,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navList: [
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_home.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_homeAc.png",
|
||||
nav_name:"首页",
|
||||
url:"/pages/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_community.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_communityAc.png",
|
||||
nav_name:"我的小区",
|
||||
url:"/packages/community/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shop.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_shopAc.png",
|
||||
nav_name:"优选商城",
|
||||
url:"/packages/shop/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_door.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_communityAc.png",
|
||||
nav_name:"到家服务",
|
||||
url:"/packages/homeServer/index/index"
|
||||
},
|
||||
{
|
||||
photo:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_mine.png",
|
||||
photoAc:"https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/footer_mineAc.png",
|
||||
nav_name:"我的",
|
||||
url:"/pages/user/index"
|
||||
},
|
||||
],
|
||||
foot_width: '20%',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
getFootnav() {
|
||||
let _that = this;
|
||||
uni.request({
|
||||
url: 'https://zhsq.hshuishang.com/Miniapi/Index/footer_nav_list',
|
||||
method: 'post',
|
||||
header: {
|
||||
'Content-type': 'application/x-www-form-urlencoded'
|
||||
},
|
||||
data: {},
|
||||
dataType: 'json',
|
||||
success: (result) => {
|
||||
result.data[0].url = "/pages/index/index"
|
||||
result.data[1].url = "/pages/device/device"
|
||||
result.data[2].nav_name = "手机通行"
|
||||
result.data[2].url = "/pages/phoneGo/phoneGo"
|
||||
|
||||
import { NavgateTo } from "../../utils";
|
||||
result.data[3].url = `/packages/community/index/index`
|
||||
result.data[4].url = "/pages/user/index"
|
||||
|
||||
export default {
|
||||
name: "nav",
|
||||
props: {
|
||||
current: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
foot_width() {
|
||||
// 动态计算导航项宽度，确保均匀分布
|
||||
return (100 / this.navList.length).toFixed(2) + '%';
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
navList: [
|
||||
{
|
||||
photo:
|
||||
"https://static.hshuishang.com/property-img-file/footer_home.png",
|
||||
photoAc:
|
||||
"https://static.hshuishang.com/property-img-file/footer_homeAc.png",
|
||||
nav_name: "智慧首页",
|
||||
url: "/pages/index/index",
|
||||
},
|
||||
{
|
||||
photo:
|
||||
"https://static.hshuishang.com/property-img-file/footer_facility.png",
|
||||
photoAc:
|
||||
"https://static.hshuishang.com/property-img-file/footer_facilityAc.png",
|
||||
nav_name: "智能设备",
|
||||
url: "/packages/smartDevice/index/index",
|
||||
},
|
||||
{
|
||||
photo:
|
||||
"https://static.hshuishang.com/property-img-file/footer_richScan.png",
|
||||
photoAc:
|
||||
"https://static.hshuishang.com/property-img-file/footer_richScan.png",
|
||||
url: "",
|
||||
isScan: true,
|
||||
},
|
||||
{
|
||||
photo:
|
||||
"https://static.hshuishang.com/property-img-file/footer_community.png",
|
||||
photoAc:
|
||||
"https://static.hshuishang.com/property-img-file/footer_communityAc.png",
|
||||
nav_name: "我的小区",
|
||||
url: "/packages/community/index/index",
|
||||
},
|
||||
// {
|
||||
// photo: "https://static.hshuishang.com/property-img-file/footer_localLife.png",
|
||||
// photoAc: "https://static.hshuishang.com/property-img-file/footer_localLifeAc.png",
|
||||
// nav_name: "本地生活",
|
||||
// url: "/packages/localLife/index/index",
|
||||
// },
|
||||
// {
|
||||
// photo:
|
||||
// "https://static.hshuishang.com/property-img-file/footer_shop.png",
|
||||
// photoAc:
|
||||
// "https://static.hshuishang.com/property-img-file/footer_shopAc.png",
|
||||
// nav_name: "优选商城",
|
||||
// url: "/packages/shop/index/index",
|
||||
// },
|
||||
// {
|
||||
// photo:
|
||||
// "https://static.hshuishang.com/property-img-file/footer_door.png",
|
||||
// photoAc:
|
||||
// "https://static.hshuishang.com/property-img-file/footer_communityAc.png",
|
||||
// nav_name: "到家服务",
|
||||
// url: "/packages/homeServer/index/index",
|
||||
// },
|
||||
{
|
||||
photo:
|
||||
"https://static.hshuishang.com/property-img-file/footer_mine.png",
|
||||
photoAc:
|
||||
"https://static.hshuishang.com/property-img-file/footer_mineAc.png",
|
||||
nav_name: "个人中心",
|
||||
url: "/pages/user/index",
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getFootnav() {
|
||||
let _that = this;
|
||||
uni.request({
|
||||
url: "https://zhsq.hshuishang.com/Miniapi/Index/footer_nav_list",
|
||||
method: "post",
|
||||
header: {
|
||||
"Content-type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
data: {},
|
||||
dataType: "json",
|
||||
success: (result) => {
|
||||
result.data[0].url = "/pages/index/index";
|
||||
result.data[1].url = "/pages/device/device";
|
||||
result.data[2].nav_name = "手机通行";
|
||||
result.data[2].url = "/pages/phoneGo/phoneGo";
|
||||
result.data.splice(1, 2);
|
||||
let footWidth = (100 / result.data.length).toFixed(2) + '%';
|
||||
this.navList = result.data;
|
||||
this.foot_width = footWidth;
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
//暂未开通
|
||||
NotOpen() {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '此功能暂未开通！',
|
||||
showCancel: false,
|
||||
complete: (res) => {
|
||||
if (res.cancel) {
|
||||
|
||||
result.data[3].url = `/packages/community/index/index`;
|
||||
result.data[4].url = "/pages/user/index";
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
result.data.splice(1, 2);
|
||||
let footWidth = (100 / result.data.length).toFixed(2) + "%";
|
||||
this.navList = result.data;
|
||||
this.foot_width = footWidth;
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
//暂未开通
|
||||
NotOpen() {
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "此功能暂未开通！",
|
||||
showCancel: false,
|
||||
complete: (res) => {
|
||||
if (res.cancel) {
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
jump(e) {
|
||||
const ctoken = uni.getStorageSync('ctoken');
|
||||
const authen = ['/pages/index/index', '/pages/user/index','/pages/user/index'];
|
||||
// 除首页及个人中心页不需要鉴定ctoken， 其他tab页均需存在登录态才可访问
|
||||
if (authen.includes(e.currentTarget.dataset.url)) {
|
||||
uni.redirectTo({
|
||||
url: e.currentTarget.dataset.url,
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!ctoken) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/login/login',
|
||||
})
|
||||
return;
|
||||
}
|
||||
|
||||
jump(e) {
|
||||
const url = e.currentTarget.dataset.url;
|
||||
const index = e.currentTarget.dataset.idx;
|
||||
const item = this.navList[index];
|
||||
uni.redirectTo({
|
||||
url: e.currentTarget.dataset.url,
|
||||
})
|
||||
},
|
||||
|
||||
// 检查是否为扫码功能
|
||||
if (item.isScan) {
|
||||
// 调用uni-app的扫码API
|
||||
uni.scanCode({
|
||||
success: (res) => {
|
||||
// 扫码成功后的处理逻辑
|
||||
console.log('扫码结果:', res);
|
||||
|
||||
// 检查res中是否包含path字段
|
||||
if (res.path) {
|
||||
console.log('扫码结果中的path:', res.path);
|
||||
|
||||
// 解析path字段，提取scene参数的值
|
||||
const pathParts = res.path.split('?');
|
||||
if (pathParts.length > 1) {
|
||||
const queryParams = pathParts[1].split('&');
|
||||
for (const param of queryParams) {
|
||||
const [key, value] = param.split('=');
|
||||
if (key === 'scene') {
|
||||
const params = {
|
||||
id: value
|
||||
}
|
||||
uni.setStorageSync('merchantInfo', params);
|
||||
NavgateTo('/packages/localLife/detail/index')
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('扫码失败:', err);
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 检查url是否存在且不为空
|
||||
if (!url || url.trim() === '') {
|
||||
this.NotOpen();
|
||||
return;
|
||||
}
|
||||
|
||||
const ctoken = uni.getStorageSync("ctoken");
|
||||
const authen = [
|
||||
"/pages/index/index",
|
||||
"/pages/user/index",
|
||||
"/packages/smartDevice/index/index",
|
||||
];
|
||||
// 除首页及个人中心页不需要鉴定ctoken， 其他tab页均需存在登录态才可访问
|
||||
if (authen.includes(url)) {
|
||||
uni.redirectTo({
|
||||
url: url,
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!ctoken) {
|
||||
uni.redirectTo({
|
||||
url: "/pages/login/login",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.redirectTo({
|
||||
url: url,
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
// this.getFootnav();
|
||||
},
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// this.getFootnav();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./nav.css");
|
||||
@import url("./nav.css");
|
||||
</style>
|
||||
@ -1,14 +1,14 @@
|
||||
<template>
|
||||
<view class="search">
|
||||
<view class="locat" catchtap="goPagesLink">
|
||||
<image class="local_left_icon" src="https://static.hshuishang.com/User/_assets/location.png"
|
||||
<image class="local_left_icon" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/User/_assets/location.png"
|
||||
mode="" />
|
||||
<text class="local_city">{{address}}</text>
|
||||
<van-icon name="arrow-down" color="#FF512A " />
|
||||
</view>
|
||||
<view class='search_bar'>
|
||||
<image class="search_icon"
|
||||
src="https://static.hshuishang.com/community/_assets/Group_36.png" mode="" />
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/_assets/Group_36.png" mode="" />
|
||||
<input class="search_input" placeholder='输入搜索的社区名称' confirm-type='search' @input="searchInput"
|
||||
@confirm="searchInput" :value=" selectKeyWord" />
|
||||
</view>
|
||||
@ -39,26 +39,23 @@
|
||||
this.address = uni.getStorageSync('city');
|
||||
return;
|
||||
}
|
||||
this.qqmap_key = '55NBZ-MUQYW-EAJRL-YIWPA-ZXCR6-4NBPP';
|
||||
this.getUserLocation()
|
||||
uni.request({
|
||||
url: apiArr.get_host_info,
|
||||
method: 'post',
|
||||
header: {
|
||||
'Content-type': 'application/x-www-form-urlencoded'
|
||||
},
|
||||
dataType: 'json',
|
||||
success: (result) => {
|
||||
console.log(result, 'result');
|
||||
let wxapp = result.data.all.wxapp;
|
||||
|
||||
// uni.request({
|
||||
// url: apiArr.get_host_info,
|
||||
// method: 'post',
|
||||
// header: {
|
||||
// 'Content-type': 'application/x-www-form-urlencoded'
|
||||
// },
|
||||
// dataType: 'json',
|
||||
// success: (result) => {
|
||||
// console.log(result, 'result');
|
||||
// let wxapp = result.data.all.wxapp;
|
||||
|
||||
// if (wxapp) {
|
||||
// this.qqmap_key = wxapp.qqmap_key;
|
||||
// this.getUserLocation()
|
||||
// }
|
||||
// },
|
||||
// })
|
||||
if (wxapp) {
|
||||
this.qqmap_key = wxapp.qqmap_key;
|
||||
this.getUserLocation()
|
||||
}
|
||||
},
|
||||
})
|
||||
},
|
||||
|
||||
getUserLocation() {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="container" @click="headerEnterClick" :data-id="item.community_id" :data-name="item.name" >
|
||||
<view class="container" @click="headerEnterClick" :data-id="item.community_id":data-name="item.name" >
|
||||
<image class="left_logo" :src="item.pic" mode="aspectFill" />
|
||||
<view :class="['right', isLast && 'no_bottom']">
|
||||
<view class="header">
|
||||
@ -9,7 +9,7 @@
|
||||
<view class="center">物业公司：{{item.shop && item.shop.shop_name || item.property}}</view>
|
||||
<view class="address">
|
||||
<image class="address_icon"
|
||||
src="https://static.hshuishang.com/community/_assets/Group_50.png" mode="" />
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/_assets/Group_50.png" mode="" />
|
||||
<view class="text-container">
|
||||
<text>{{item.addr}}</text>
|
||||
</view>
|
||||
@ -17,13 +17,13 @@
|
||||
<view class="bottom">
|
||||
<view class="bottom_left">
|
||||
<view class="btn" @click.stop="handleOptionClick">
|
||||
<image class="btn_icon" src="https://static.hshuishang.com/community/_assets/Send.png"
|
||||
<image class="btn_icon" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/_assets/Send.png"
|
||||
mode="aspectFill" />
|
||||
导航
|
||||
</view>
|
||||
<view class="btn mobile" @click.stop="headlePhoneClick">
|
||||
<image class="btn_icon"
|
||||
src="https://static.hshuishang.com/community/_assets/Phone-telephone.png" mode="" />
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/_assets/Phone-telephone.png" mode="" />
|
||||
电话
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -1,279 +0,0 @@
|
||||
<template>
|
||||
<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
|
||||
@click="change">
|
||||
<slot></slot>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// #ifdef APP-NVUE
|
||||
const animation = uni.requireNativePlugin('animation');
|
||||
// #endif
|
||||
/**
|
||||
* Transition 过渡动画
|
||||
* @description 简单过渡动画组件
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=985
|
||||
* @property {Boolean} show = [false|true] 控制组件显示或隐藏
|
||||
* @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
|
||||
* @value fade 渐隐渐出过渡
|
||||
* @value slide-top 由上至下过渡
|
||||
* @value slide-right 由右至左过渡
|
||||
* @value slide-bottom 由下至上过渡
|
||||
* @value slide-left 由左至右过渡
|
||||
* @value zoom-in 由小到大过渡
|
||||
* @value zoom-out 由大到小过渡
|
||||
* @property {Number} duration 过渡动画持续时间
|
||||
* @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
|
||||
*/
|
||||
export default {
|
||||
name: 'uniTransition',
|
||||
props: {
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
modeClass: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
},
|
||||
duration: {
|
||||
type: Number,
|
||||
default: 300
|
||||
},
|
||||
styles: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isShow: false,
|
||||
transform: '',
|
||||
ani: { in: '',
|
||||
active: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
show: {
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.open()
|
||||
} else {
|
||||
this.close()
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
stylesObject() {
|
||||
let styles = {
|
||||
...this.styles,
|
||||
'transition-duration': this.duration / 1000 + 's'
|
||||
}
|
||||
let transfrom = ''
|
||||
for (let i in styles) {
|
||||
let line = this.toLine(i)
|
||||
transfrom += line + ':' + styles[i] + ';'
|
||||
}
|
||||
return transfrom
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.timer = null
|
||||
// this.nextTick = (time = 50) => new Promise(resolve => {
|
||||
// clearTimeout(this.timer)
|
||||
// this.timer = setTimeout(resolve, time)
|
||||
// return this.timer
|
||||
// });
|
||||
},
|
||||
methods: {
|
||||
change() {
|
||||
this.$emit('click', {
|
||||
detail: this.isShow
|
||||
})
|
||||
},
|
||||
open() {
|
||||
clearTimeout(this.timer)
|
||||
this.isShow = true
|
||||
this.transform = ''
|
||||
this.ani.in = ''
|
||||
for (let i in this.getTranfrom(false)) {
|
||||
if (i === 'opacity') {
|
||||
this.ani.in = 'fade-in'
|
||||
} else {
|
||||
this.transform += `${this.getTranfrom(false)[i]} `
|
||||
}
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this._animation(true)
|
||||
}, 50)
|
||||
})
|
||||
|
||||
},
|
||||
close(type) {
|
||||
clearTimeout(this.timer)
|
||||
this._animation(false)
|
||||
},
|
||||
_animation(type) {
|
||||
let styles = this.getTranfrom(type)
|
||||
// #ifdef APP-NVUE
|
||||
if(!this.$refs['ani']) return
|
||||
animation.transition(this.$refs['ani'].ref, {
|
||||
styles,
|
||||
duration: this.duration, //ms
|
||||
timingFunction: 'ease',
|
||||
needLayout: false,
|
||||
delay: 0 //ms
|
||||
}, () => {
|
||||
if (!type) {
|
||||
this.isShow = false
|
||||
}
|
||||
this.$emit('change', {
|
||||
detail: this.isShow
|
||||
})
|
||||
})
|
||||
// #endif
|
||||
// #ifndef APP-NVUE
|
||||
this.transform = ''
|
||||
for (let i in styles) {
|
||||
if (i === 'opacity') {
|
||||
this.ani.in = `fade-${type?'out':'in'}`
|
||||
} else {
|
||||
this.transform += `${styles[i]} `
|
||||
}
|
||||
}
|
||||
this.timer = setTimeout(() => {
|
||||
if (!type) {
|
||||
this.isShow = false
|
||||
}
|
||||
this.$emit('change', {
|
||||
detail: this.isShow
|
||||
})
|
||||
|
||||
}, this.duration)
|
||||
// #endif
|
||||
|
||||
},
|
||||
getTranfrom(type) {
|
||||
let styles = {
|
||||
transform: ''
|
||||
}
|
||||
this.modeClass.forEach((mode) => {
|
||||
switch (mode) {
|
||||
case 'fade':
|
||||
styles.opacity = type ? 1 : 0
|
||||
break;
|
||||
case 'slide-top':
|
||||
styles.transform += `translateY(${type?'0':'-100%'}) `
|
||||
break;
|
||||
case 'slide-right':
|
||||
styles.transform += `translateX(${type?'0':'100%'}) `
|
||||
break;
|
||||
case 'slide-bottom':
|
||||
styles.transform += `translateY(${type?'0':'100%'}) `
|
||||
break;
|
||||
case 'slide-left':
|
||||
styles.transform += `translateX(${type?'0':'-100%'}) `
|
||||
break;
|
||||
case 'zoom-in':
|
||||
styles.transform += `scale(${type?1:0.8}) `
|
||||
break;
|
||||
case 'zoom-out':
|
||||
styles.transform += `scale(${type?1:1.2}) `
|
||||
break;
|
||||
}
|
||||
})
|
||||
return styles
|
||||
},
|
||||
_modeClassArr(type) {
|
||||
let mode = this.modeClass
|
||||
if (typeof(mode) !== "string") {
|
||||
let modestr = ''
|
||||
mode.forEach((item) => {
|
||||
modestr += (item + '-' + type + ',')
|
||||
})
|
||||
return modestr.substr(0, modestr.length - 1)
|
||||
} else {
|
||||
return mode + '-' + type
|
||||
}
|
||||
},
|
||||
// getEl(el) {
|
||||
// console.log(el || el.ref || null);
|
||||
// return el || el.ref || null
|
||||
// },
|
||||
toLine(name) {
|
||||
return name.replace(/([A-Z])/g, "-$1").toLowerCase();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.uni-transition {
|
||||
transition-timing-function: ease;
|
||||
transition-duration: 0.3s;
|
||||
transition-property: transform, opacity;
|
||||
}
|
||||
|
||||
.fade-in {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fade-active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.slide-top-in {
|
||||
/* transition-property: transform, opacity; */
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
|
||||
.slide-top-active {
|
||||
transform: translateY(0);
|
||||
/* opacity: 1; */
|
||||
}
|
||||
|
||||
.slide-right-in {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
|
||||
.slide-right-active {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.slide-bottom-in {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.slide-bottom-active {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.slide-left-in {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.slide-left-active {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.zoom-in-in {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
|
||||
.zoom-out-active {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.zoom-out-in {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
</style>
|
||||
@ -1,11 +0,0 @@
|
||||
{
|
||||
"ios": {
|
||||
"name": "湖畔生活家"
|
||||
},
|
||||
"android": {
|
||||
"name": "湖畔生活家"
|
||||
},
|
||||
"common": {
|
||||
"name": "湖畔生活家"
|
||||
}
|
||||
}
|
||||
@ -10,22 +10,22 @@
|
||||
<view class="msg">
|
||||
<view class="msg_left">
|
||||
<view class="msg_left_1">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_time.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_time.png" mode="widthFix" />
|
||||
{{shopInfo.opening_time}}-{{shopInfo.closing_time}}
|
||||
<view>营业</view>
|
||||
</view>
|
||||
<view class="msg_left_2">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_add.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_add.png" mode="widthFix" />
|
||||
{{shopInfo.addrInfo}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="msg_right">
|
||||
<view class="msg_right1" @click="haderTelClick">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_phone.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_phone.png" mode="widthFix" />
|
||||
电话
|
||||
</view>
|
||||
<view class="msg_right2" @click="handleOptionClick">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_add.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_add.png" mode="widthFix" />
|
||||
导航
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -1,14 +1,14 @@
|
||||
.box {
|
||||
width: 750rpx;
|
||||
height: 1343rpx;
|
||||
background: url(https://static.hshuishang.com/kitchen/recharge_bg.png) no-repeat;
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/recharge_bg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.msg {
|
||||
width: 710rpx;
|
||||
height: 308rpx;
|
||||
background: url(https://static.hshuishang.com/kitchen/recharge_tit.png) no-repeat;
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/recharge_tit.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto;
|
||||
margin-top: 30rpx;
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
<view class="msg">
|
||||
账户余额(元)
|
||||
<view>{{money}}</view>
|
||||
<image src="https://static.hshuishang.com/kitchen/recharge_img.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/recharge_img.png" mode="widthFix" />
|
||||
</view>
|
||||
|
||||
<view class="recharge">
|
||||
|
||||
25
main.js
25
main.js
@ -7,22 +7,9 @@ import './uni.promisify.adaptor'
|
||||
App.mpType = 'app'
|
||||
Vue.config.productionTip = false
|
||||
|
||||
import uView from 'uni_modules/uview-ui';
|
||||
import uView from 'uview-ui';
|
||||
Vue.use(uView);
|
||||
|
||||
// 导入工具函数
|
||||
import { processImageUrl } from './utils/index.js'
|
||||
|
||||
// 添加全局方法 - Vue 2
|
||||
Vue.prototype.$processImage = (url) => {
|
||||
return processImageUrl(url)
|
||||
}
|
||||
|
||||
// 添加全局过滤器 - Vue 2
|
||||
Vue.filter('processImage', function(url) {
|
||||
return processImageUrl(url)
|
||||
})
|
||||
|
||||
|
||||
const app = new Vue({
|
||||
...App
|
||||
@ -34,19 +21,11 @@ app.$mount()
|
||||
// #ifdef VUE3
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
import uView from 'uni_modules/uview-ui';
|
||||
import uView from 'uview-ui';
|
||||
const app = createApp(App)
|
||||
// 安装 uView
|
||||
app.use(uView)
|
||||
|
||||
// 导入工具函数
|
||||
import { processImageUrl } from './utils/index.js'
|
||||
|
||||
// 添加全局方法 - Vue 3
|
||||
app.config.globalProperties.$processImage = (url) => {
|
||||
return processImageUrl(url)
|
||||
}
|
||||
|
||||
// 挂载多个全局方法
|
||||
app.config.globalProperties.$toast = $toast
|
||||
app.config.globalProperties.$modal = $modal
|
||||
|
||||
@ -57,7 +57,7 @@
|
||||
},
|
||||
"oauth" : {
|
||||
"weixin" : {
|
||||
"appid" : "wx1addb25675dd8e70",
|
||||
"appid" : "wxb4018c78fa143450",
|
||||
"UniversalLinks" : ""
|
||||
}
|
||||
}
|
||||
@ -68,7 +68,7 @@
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx1addb25675dd8e70",
|
||||
"appid" : "wxb4018c78fa143450",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
|
||||
4201
package-lock.json
generated
4201
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
30
package.json
30
package.json
@ -1,25 +1,9 @@
|
||||
{
|
||||
"id": "cu-keyboard",
|
||||
"name": "支付键盘、数字键盘、付款键盘、密码键盘",
|
||||
"displayName": "支付键盘、数字键盘、付款键盘、密码键盘",
|
||||
"version": "1.0.1",
|
||||
"description": "仿微信支付付款键盘，多端通用，简易方便",
|
||||
"keywords": [
|
||||
"数字键盘",
|
||||
"支付键盘",
|
||||
"付款键盘",
|
||||
"密码键盘"
|
||||
],
|
||||
"dcloudext": {
|
||||
"category": [
|
||||
"前端组件",
|
||||
"通用组件"
|
||||
]
|
||||
},
|
||||
"dependencies": {
|
||||
"abort-controller": "^3.0.0",
|
||||
"buffer": "^6.0.3",
|
||||
"mqtt": "^3.0.0",
|
||||
"vue": "^3.5.21"
|
||||
}
|
||||
"devDependencies": {
|
||||
"sass-loader": "^16.0.5"
|
||||
},
|
||||
"dependencies": {
|
||||
"sass": "^1.89.2",
|
||||
"uview-ui": "^2.0.38"
|
||||
}
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,833 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="header">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_left" @click="back">
|
||||
<u-icon name="arrow-left" size="20px" color="#000"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swiper">
|
||||
<view class="tag2 tag-img" v-if="
|
||||
currentGG.is_same_day
|
||||
">当日达</view>
|
||||
<swiper :indicator-dots="false" :autoplay="true" :interval="3000" :duration="1000" @change="changeIndex">
|
||||
<swiper-item v-for="(item, index) in currentGG.commodity_pic" :key="index">
|
||||
<image :src="picUrl + item"></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<view class="NumDot" v-if="currentGG.goods_carousel && currentGG.goods_carousel.length > 0">
|
||||
{{ currentIndex }} /{{ currentGG.goods_carousel.length }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="Money">
|
||||
<view class="MoneyMark">￥</view>
|
||||
{{ currentGG.sales_price }}
|
||||
<view class="MoneyUnit">/{{ currentGG.goods_unit }}</view>
|
||||
<view class="num">已售{{ soldOutNum }} | 剩余{{ currentGG.stock_quantity }}</view>
|
||||
</view>
|
||||
|
||||
<!-- 规格 -->
|
||||
<!-- @click="changeGG2(item, index)" :class="index == currentGGIndex ? 'active' : ''"> -->
|
||||
<view class="GGBox">
|
||||
<view class="GG_left">
|
||||
<view class="GG_Item" v-for="(item, index) in info.commodity_goods_info_list" :key="item.id"
|
||||
@click="changeGG(item, index)" :class="index == currentGGIndex ? 'active' : ''">
|
||||
{{ item.goods_spec }} / {{ item.goods_unit }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="GG_rigth" v-if="info.commodity_goods_info_list && info.commodity_goods_info_list.length > 0">
|
||||
共{{ info.commodity_goods_info_list.length }}款
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="Tit">
|
||||
<view class="tag tag-text" v-if="
|
||||
currentGG.is_same_day
|
||||
">当日达</view>
|
||||
{{ currentGG.goods_name }}
|
||||
</view>
|
||||
<view class="Msg">{{ currentGG.commodity_brief }}</view>
|
||||
|
||||
<view class="fenge"></view>
|
||||
|
||||
<!-- 已购买区域 -->
|
||||
<view>
|
||||
<view class="purchase-area">
|
||||
<view class="purchase-count">{{ totalCount }}人已购买</view>
|
||||
<view class="view-more" @click="showPurchaseRecords">查看更多 ></view>
|
||||
</view>
|
||||
<view class="record-list">
|
||||
<view class="record-item" v-for="(record, index) in purchaseRecords" :key="index">
|
||||
<view class="record-user">
|
||||
<image :src="record.avatar" class="user-avatar"></image>
|
||||
<view class="user-name">{{ record.nick_name }}</view>
|
||||
</view>
|
||||
<view class="record-amount">
|
||||
{{ formatDate(record.buy_time) }}买了{{ record.count }}件
|
||||
</view>
|
||||
<view class="record-time">
|
||||
<button class="buy-btn" @click="goSubmit">去下单</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fenge"></view>
|
||||
|
||||
<h3 class="GoodsMsg">商品详情</h3>
|
||||
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">货号</view>
|
||||
<view class="Msg_ItemCon" @click="copys(currentGG.goods_no)">
|
||||
{{ currentGG.goods_no }}
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_copy.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">规格说明</view>
|
||||
<view class="Msg_ItemCon">{{ currentGG.goods_spec }}</view>
|
||||
</view>
|
||||
<view class="Msg_Item">
|
||||
<view class="Msg_ItemTit">售卖单位</view>
|
||||
<view class="Msg_ItemCon">{{ currentGG.goods_unit }}</view>
|
||||
</view>
|
||||
|
||||
<view class="GoosMsg">
|
||||
<image v-for="item in currentGG.goods_detail_pic" :src="picUrl + item" :key="item" mode="widthFix"></image>
|
||||
</view>
|
||||
|
||||
<view class="priceInfo">
|
||||
<h3 class="priceInfo-title">价格说明</h3>
|
||||
<view class="priceInfo-content">
|
||||
<view>
|
||||
<text class="priceInfo-content-title">划线价格：</text>
|
||||
指商品的厂商指导价、正品零售价、市面常见价或该商品曾经展示过的销售价等，并非原价。仅供参考。
|
||||
</view>
|
||||
<view>
|
||||
<text class="priceInfo-content-title">未划线价格：</text>
|
||||
指商品的实时价格，不因表述的差异改变性质，具体成交价格根据商品参加活动，或使用优惠券等发生变化最终以订单结算价格为准。
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部购物车 -->
|
||||
<view class="Car">
|
||||
<view class="car_left">
|
||||
<view class="share" @click="share">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_share.png"
|
||||
mode="widthFix"></image>
|
||||
分享
|
||||
</view>
|
||||
<view class="cars" @click="car">
|
||||
<u-badge numberType="limit" :type="type" max="99" :value="carNum"></u-badge>
|
||||
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_car.png"
|
||||
mode="widthFix"></image>
|
||||
购物车
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="car_right2" v-if="info.commodity_goods_info_list[currentGGIndex].stock_quantity < 1">
|
||||
已售罄
|
||||
</view>
|
||||
|
||||
<view class="car_right" v-if="
|
||||
info.commodity_goods_info_list[currentGGIndex].stock_quantity > 0 &&
|
||||
(!info.commodity_goods_info_list[currentGGIndex].cart_count ||
|
||||
info.commodity_goods_info_list[currentGGIndex].cart_count.count == 0)
|
||||
" @click="addCar">
|
||||
加入购物车
|
||||
</view>
|
||||
|
||||
<view class="car_right" @click="changeCar" v-if="
|
||||
info.commodity_goods_info_list[currentGGIndex].cart_count.count > 0
|
||||
&& info.commodity_goods_info_list[currentGGIndex].stock_quantity > 0
|
||||
">
|
||||
加入购物车
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 分享 -->
|
||||
<view class="shadow" @click.stop="changeShadow" v-if="boxshadow1">
|
||||
<view class="shadowBox1">
|
||||
<view class="shadowBox1Item" @click="shareFriend">
|
||||
<button class="shadowBox1Item_btn" open-type="share" bindtap="onShareButtonClick">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_WX.png"
|
||||
mode="aspectFill"></image>
|
||||
微信好友
|
||||
</button>
|
||||
</view>
|
||||
<view class="shadowBox1Item" @click="openSave">
|
||||
<button class="shadowBox1Item_btn">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_saveImg.png"
|
||||
mode="aspectFill"></image>
|
||||
生成海报
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 海报 -->
|
||||
<view class="shadow" @click="changeShadow2" v-if="boxshadow2">
|
||||
<view class="shadowBox2">
|
||||
<view class="shadowBox_img">
|
||||
<view class="boxshadow_tit">今日商品推荐</view>
|
||||
<view class="boxshadow_img">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_share_img.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="shadowBoxInfo">
|
||||
<view class="shadowboxInfo_left">二维码</view>
|
||||
<view class="shadowboxInfo_right">
|
||||
<view class="shadowboxInfo_right_1">正鲜生</view>
|
||||
<view class="shadowboxInfo_right_2">
|
||||
长按识别小程序 <br />
|
||||
数量有限马上抢购
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="shadowBox_btn" @click.stop="saveImg">保存海报</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 评价 查看详情 -->
|
||||
<!-- <u-popup :show="show" round="20rpx" mode="bottom" @close="close" @open="open" :z-index="10070">
|
||||
<view class="reviews-section">
|
||||
<view class="popup-header">
|
||||
<h3 class="popup-header-h3">评价</h3>
|
||||
<view class="popup-header-view" @click="close">取消</view>
|
||||
</view>
|
||||
<view class="temp">
|
||||
<view class="temp1">
|
||||
<img class="temp_img" src="https://static.hshuishang.com/pingjia.png" />
|
||||
为你展示真实评价
|
||||
</view>
|
||||
<view class="temp1" @click="showSizePopup">
|
||||
款式
|
||||
<img class="temp_img1" src="https://static.hshuishang.com/kuanshi.png" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="reviews-list" v-if="comments.length > 0">
|
||||
<view class="review-item" v-for="(comment, index) in comments" :key="index">
|
||||
<view class="review-user">
|
||||
<image :src="comment.avatar" class="user-avatar"></image>
|
||||
<view class="user-info">
|
||||
<view class="user-name">{{ comment.username }}</view>
|
||||
</view>
|
||||
<view class="review-time">{{ comment.time }}</view>
|
||||
</view>
|
||||
<view class="user-purchase">已购 {{ comment.product }}</view>
|
||||
<view class="review-content">{{ comment.content }}</view>
|
||||
<view class="review-images" v-if="comment.images.length > 0">
|
||||
<image :src="img" class="review-img" v-for="(img, idx) in comment.images" :key="idx"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup> -->
|
||||
|
||||
<!-- 团购记录弹窗 -->
|
||||
<u-popup :show="showPurchase" round="20rpx" mode="bottom" @close="closePurchase">
|
||||
<view class="purchase-popup">
|
||||
<view class="popup-header">
|
||||
<h3 class="popup-header-h3">团购记录</h3>
|
||||
<view class="popup-header-view" @click="closePurchase">取消</view>
|
||||
</view>
|
||||
<view class="purchase-records">
|
||||
<view class="record-header">
|
||||
<view class="record-header-item">买家</view>
|
||||
<view class="record-header-item">数量</view>
|
||||
<view class="record-header-item">购买时间</view>
|
||||
</view>
|
||||
<view class="record-list">
|
||||
<view class="record-item" v-for="(record, index) in purchaseRecords" :key="index">
|
||||
<view class="record-user">
|
||||
<image :src="record.avatar" class="user-avatar"></image>
|
||||
<view class="user-name">{{ record.nick_name }}</view>
|
||||
</view>
|
||||
<view class="record-amount">+{{ record.count }}</view>
|
||||
<view class="record-time">{{ record.buy_time }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 选择款式 -->
|
||||
<u-popup :show="showSize" round="20rpx" mode="bottom" @close="closeSize">
|
||||
<view class="popup-header">
|
||||
<h3 class="popup-header-h3">选择款式</h3>
|
||||
<view class="popup-header-view" @click="closeSize">取消</view>
|
||||
</view>
|
||||
<view class="itemSize_top">
|
||||
<image :src="changeImg" class="itemSize-img"></image>
|
||||
<view class="itemSize_info">
|
||||
<view class="itemSize_name">{{ changeName }}</view>
|
||||
<view class="itemSize_price">￥{{ changePrice }}/袋</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="itemSize" v-for="(item, index) in info.commodity_goods_info_list" :key="item.id"
|
||||
@click="changeGG(item, index)" :class="index == currentGGIndex ? 'itemSize_active' : ''">
|
||||
{{ item.goods_name }} {{ item.goods_spec }} / {{ item.goods_unit }}
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiArr } from "../../../api/shop";
|
||||
import { apiArr as apiArr2 } from "../../../api/groupPurchase";
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo } from "../../../utils";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
itemObj: {},
|
||||
|
||||
picUrl,
|
||||
top: "",
|
||||
localHeight: "",
|
||||
carNum: "",
|
||||
prevCarNum: "",
|
||||
currentNum: "0", //当前商品的数量
|
||||
type: "error",
|
||||
boxshadow1: false,
|
||||
boxshadow2: false,
|
||||
id: "",
|
||||
adver_id: "",//活动id
|
||||
groupById: "",
|
||||
promotional_price: "", //活动价
|
||||
info: "",
|
||||
currentIndex: "1", //当前轮播图
|
||||
|
||||
currentGG: "", //当前选中规格
|
||||
currentGGIndex: "", //当前规格index
|
||||
|
||||
carOrderList: [],
|
||||
// 新增评论数据
|
||||
showReviewPopup: false,
|
||||
soldOutNum: 0,
|
||||
|
||||
show: false,
|
||||
showSize: false,
|
||||
showPurchase: false,
|
||||
purchaseRecords: [],
|
||||
totalCount: 0,
|
||||
changeImg: "",
|
||||
changeName: "",
|
||||
changePrice: "",
|
||||
|
||||
endTime: "",
|
||||
endTheCountdownDay: '',
|
||||
endTheCountdownHour: '',
|
||||
endTheCountdownMinute: '',
|
||||
endTheCountdownSecond: '',
|
||||
timer: null, // 定时器ID
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 显示团购记录
|
||||
showPurchaseRecords() {
|
||||
if (this.purchaseRecords.length > 0) {
|
||||
this.showPurchase = true;
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '没有更多数据',
|
||||
icon: 'none'
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
// 关闭团购记录
|
||||
closePurchase() {
|
||||
this.showPurchase = false;
|
||||
},
|
||||
|
||||
//去下单
|
||||
goSubmit() {
|
||||
NavgateTo('/packages/shop/groupPurchaseSubmit/index')
|
||||
},
|
||||
|
||||
changeIndex(e) {
|
||||
this.currentIndex = e.detail.current + 1;
|
||||
},
|
||||
|
||||
back() {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
},
|
||||
// 分享给微信好友方法 - 触发分享给好友的聊天框
|
||||
shareFriend() {
|
||||
this.boxshadow1 = false; // 关闭分享弹窗
|
||||
|
||||
// 获取当前商品的分享信息
|
||||
const shareInfo = {
|
||||
title: this.currentGG.goods_name || '商品分享', // 分享标题
|
||||
desc: this.currentGG.commodity_brief || '快来看看这款商品吧', // 分享描述
|
||||
link: `${window.location.origin}/pages/goodsDetail/index?id=${this.id}`, // 商品详情页链接
|
||||
imageUrl: this.picUrl + (this.currentGG.goods_carousel && this.currentGG.goods_carousel[0] || '') // 分享图片
|
||||
};
|
||||
|
||||
// 判断环境是否支持微信分享
|
||||
if (typeof WeixinJSBridge === 'undefined') {
|
||||
// 尝试使用uni的分享API作为备选方案
|
||||
if (typeof uni.share !== 'undefined') {
|
||||
uni.share({
|
||||
provider: 'weixin',
|
||||
scene: 'WXSceneSession',
|
||||
type: 0,
|
||||
title: shareInfo.title,
|
||||
summary: shareInfo.desc,
|
||||
href: shareInfo.link,
|
||||
imageUrl: shareInfo.imageUrl,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '分享成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('分享失败', err);
|
||||
uni.showToast({
|
||||
title: '分享失败，请重试',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请在微信客户端打开',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
// 主动触发微信分享给好友聊天框
|
||||
WeixinJSBridge.invoke('sendAppMessage', {
|
||||
title: shareInfo.title,
|
||||
desc: shareInfo.desc,
|
||||
link: shareInfo.link,
|
||||
img_url: shareInfo.imageUrl,
|
||||
img_width: '120',
|
||||
img_height: '120',
|
||||
type: 'link',
|
||||
data_url: ''
|
||||
}, (res) => {
|
||||
if (res.err_msg === 'sendAppMessage:ok') {
|
||||
uni.showToast({
|
||||
title: '分享成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
} else if (res.err_msg === 'sendAppMessage:cancel') {
|
||||
uni.showToast({
|
||||
title: '已取消分享',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
} else {
|
||||
console.error('分享失败', res);
|
||||
uni.showToast({
|
||||
title: '分享失败，请重试',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('调用微信分享接口失败', error);
|
||||
// 降级处理：使用wx.ready方式作为备选
|
||||
if (typeof wx !== 'undefined') {
|
||||
wx.ready(() => {
|
||||
// 设置分享给微信好友的回调
|
||||
wx.onMenuShareAppMessage({
|
||||
title: shareInfo.title,
|
||||
desc: shareInfo.desc,
|
||||
link: shareInfo.link,
|
||||
imgUrl: shareInfo.imageUrl,
|
||||
type: 'link',
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '分享成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
cancel: () => {
|
||||
uni.showToast({
|
||||
title: '已取消分享',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('分享失败', err);
|
||||
uni.showToast({
|
||||
title: '分享失败，请重试',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
});
|
||||
// 提示用户点击右上角分享
|
||||
uni.showToast({
|
||||
title: '请点击右上角分享按钮',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
|
||||
wx.error((err) => {
|
||||
console.error('微信JS-SDK初始化失败', err);
|
||||
uni.showToast({
|
||||
title: '分享功能加载失败',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
changeShadow() {
|
||||
this.boxshadow1 = false;
|
||||
},
|
||||
openSave() {
|
||||
this.boxshadow1 = false;
|
||||
this.boxshadow2 = true;
|
||||
},
|
||||
// 保存海报
|
||||
saveImg() {
|
||||
this.boxshadow2 = false;
|
||||
// 微信小程序保存图片
|
||||
uni.downloadFile({
|
||||
url: "https://static.hshuishang.com/property-img-file/shop_share_img.png",
|
||||
success: (res) => {
|
||||
if (res.statusCode === 200) {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: res.tempFilePath,
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log("保存失败", err);
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log("下载失败", err);
|
||||
},
|
||||
});
|
||||
},
|
||||
changeShadow2() {
|
||||
this.boxshadow2 = false;
|
||||
},
|
||||
|
||||
// 点分享按钮
|
||||
share() {
|
||||
this.boxshadow1 = true;
|
||||
},
|
||||
//商品详情
|
||||
getGoodsInfo() {
|
||||
const params = {
|
||||
id: this.id,
|
||||
adver_id: this.adver_id,
|
||||
}
|
||||
request(apiArr.getGoodsInfo, "POST", params).then((res) => {
|
||||
// 分割图片
|
||||
res.commodity_goods_info_list.forEach((item) => {
|
||||
item.goods_detail_pic = item.goods_detail_pic ? item.goods_detail_pic.split(",") : [];
|
||||
item.goods_carousel = item.goods_carousel ? item.goods_carousel.split(",") : [];
|
||||
item.commodity_pic = item.commodity_pic ? item.commodity_pic.split(",") : [];
|
||||
});
|
||||
|
||||
//根据购物车列表 和 当前商品列表 来更新当前商品列表在购物车中的数量
|
||||
if (this.carOrderList) {
|
||||
this.carOrderList.forEach((items) => {
|
||||
res.commodity_goods_info_list.forEach((item) => {
|
||||
if (items.goods_id == item.id) {
|
||||
item.cart_count = { count: 0 };
|
||||
item.cart_count.count = items.count;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
const currentTime = new Date().getTime();
|
||||
|
||||
this.info = res;
|
||||
|
||||
// 确保商品列表不为空
|
||||
if (this.info && this.info.commodity_goods_info_list && this.info.commodity_goods_info_list.length > 0) {
|
||||
// 根据itemObj在商品列表中找到对应的索引
|
||||
this.currentGGIndex = this.itemObj && this.info.commodity_goods_info_list
|
||||
? this.info.commodity_goods_info_list.findIndex(item => item.id === this.itemObj.id)
|
||||
: 0;
|
||||
|
||||
// 如果没找到匹配项，默认为0
|
||||
if (this.currentGGIndex === -1) {
|
||||
this.currentGGIndex = 0;
|
||||
}
|
||||
|
||||
// 使用完整的商品数据对象，而不是itemObj
|
||||
this.currentGG = this.info.commodity_goods_info_list[this.currentGGIndex];
|
||||
// 将promotional_price赋值给sales_price
|
||||
this.currentGG.sales_price = this.promotional_price;
|
||||
|
||||
// 设置相关属性
|
||||
this.changeImg = this.currentGG.commodity_pic[0];
|
||||
this.changeName = this.currentGG.goods_alias;
|
||||
this.changePrice = this.currentGG.sales_price;
|
||||
} else {
|
||||
// 商品列表为空时的处理
|
||||
this.currentGG = null;
|
||||
this.currentGGIndex = 0;
|
||||
this.changeImg = '';
|
||||
this.changeName = '';
|
||||
this.changePrice = '';
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
copys(e) {
|
||||
uni.setClipboardData({
|
||||
data: e,
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "复制成功",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
// 切换规格
|
||||
changeGG(item, index) {
|
||||
this.currentGG = item;
|
||||
// 将promotional_price赋值给sales_price
|
||||
this.currentGG.sales_price = this.promotional_price;
|
||||
this.currentGGIndex = index;
|
||||
if (this.currentGG.cart_count) {
|
||||
this.currentNum = this.currentGG.cart_count.count;
|
||||
} else {
|
||||
this.currentGG.cart_count = { count: 0 };
|
||||
}
|
||||
this.changeImg = item.commodity_pic[0]
|
||||
this.changeName = item.goods_alias
|
||||
this.changePrice = this.currentGG.sales_price
|
||||
},
|
||||
car() {
|
||||
const item = {
|
||||
is_adver: 1,
|
||||
}
|
||||
NavgateTo("../shopCar/index?item=" + JSON.stringify(item));
|
||||
},
|
||||
|
||||
getShopCarList() {
|
||||
const params = {
|
||||
is_adver: 1,
|
||||
}
|
||||
return request(apiArr.getCar, "POST", params).then((res) => {
|
||||
// 合并当日达和普通商品数据
|
||||
this.carOrderList = [].concat(res.same_day_cart_list, res.normal_cart_list)
|
||||
.flatMap(supplier => supplier.commodity_cart_and_goods_model);
|
||||
this.carNum = res.total;
|
||||
return res;
|
||||
});
|
||||
},
|
||||
|
||||
addCar() {
|
||||
let that = this;
|
||||
this.info.commodity_goods_info_list[this.currentGGIndex].cart_count = {
|
||||
count: this.itemObj.one_one === 1 ? 2 : 1,
|
||||
};
|
||||
// this.info.commodity_goods_info_list.forEach((item) => {
|
||||
// console.log(item.cart_count);
|
||||
// goods_id_and_count.push({
|
||||
// goods_id: item.id,
|
||||
// count: item.cart_count ? item.cart_count.count : 0,
|
||||
// });
|
||||
// });
|
||||
|
||||
let countVal = this.itemObj.one_one === 1 ? 2 : 1;
|
||||
|
||||
const params = {
|
||||
goods_id_and_count: [
|
||||
{
|
||||
goods_id:
|
||||
this.info.commodity_goods_info_list[this.currentGGIndex].id,
|
||||
count: countVal,
|
||||
price: this.changePrice
|
||||
},
|
||||
],
|
||||
adver_id: this.itemObj.adver_id,
|
||||
}
|
||||
request(apiArr.updateCar, "POST", params).then((res) => {
|
||||
// that.getShopCar();
|
||||
that.getShopCarList();
|
||||
});
|
||||
},
|
||||
|
||||
// 购物车更改
|
||||
changeCar() {
|
||||
// 获取当前商品的购物车数量，如果不存在则设为0
|
||||
const currentCount = this.info.commodity_goods_info_list[this.currentGGIndex].cart_count?.count;
|
||||
// 新的数量为当前数量加一
|
||||
const newCount = this.itemObj.one_one === 1 ? currentCount + 2 : currentCount + 1;
|
||||
|
||||
const params = {
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
goods_id_and_count: [
|
||||
{
|
||||
goods_id: this.info.commodity_goods_info_list[this.currentGGIndex].id,
|
||||
count: newCount,
|
||||
price: this.changePrice
|
||||
},
|
||||
],
|
||||
adver_id: this.itemObj.adver_id,
|
||||
};
|
||||
|
||||
request(apiArr.updateCar, "POST", params).then((res) => {
|
||||
return this.getShopCarList();
|
||||
}).then(() => {
|
||||
uni.showToast({
|
||||
title: "操作成功！",
|
||||
success() { },
|
||||
});
|
||||
this.getGoodsInfo();
|
||||
});
|
||||
},
|
||||
|
||||
showPopup() {
|
||||
this.show = true;
|
||||
},
|
||||
|
||||
showSizePopup() {
|
||||
this.showSize = true;
|
||||
},
|
||||
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
closeSize() {
|
||||
this.showSize = false;
|
||||
},
|
||||
|
||||
// 购买记录
|
||||
getBuyRecord() {
|
||||
const params = {
|
||||
activity_id: this.groupById,
|
||||
goods_id: this.itemObj.id,
|
||||
}
|
||||
request(apiArr2.groupBuyRecord, 'POST', params).then(res => {
|
||||
const record = res.group_buy_record.map(item => {
|
||||
return {
|
||||
...item,
|
||||
avatar: picUrl + item.avatar
|
||||
}
|
||||
})
|
||||
this.purchaseRecords = record
|
||||
this.totalCount = res.total_count
|
||||
// 计算所有item.count的总和并赋值给soldOutNum
|
||||
this.soldOutNum = record.reduce((total, item) => total + (item.count || 0), 0)
|
||||
})
|
||||
},
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return '';
|
||||
const date = new Date(dateStr);
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(date.getDate()).padStart(2, '0');
|
||||
return `${month}月${day}日`;
|
||||
},
|
||||
|
||||
// 计算距离结束日期的剩余时间
|
||||
getEndTheCountdown(endTime) {
|
||||
// 获取当前时间和结束时间的时间戳
|
||||
const now = new Date().getTime();
|
||||
const end = new Date(endTime).getTime();
|
||||
|
||||
// 计算时间差（毫秒）
|
||||
let diff = end - now;
|
||||
|
||||
// 如果已经结束，返回提示
|
||||
if (diff <= 0) {
|
||||
return '团购已结束';
|
||||
}
|
||||
|
||||
// 计算距离结束时间
|
||||
this.endTheCountdownDay = Math.floor(diff / (1000 * 60 * 60 * 24));
|
||||
diff -= this.endTheCountdownDay * (1000 * 60 * 60 * 24);
|
||||
this.endTheCountdownHour = Math.floor(diff / (1000 * 60 * 60));
|
||||
diff -= this.endTheCountdownHour * (1000 * 60 * 60);
|
||||
this.endTheCountdownMinute = Math.floor(diff / (1000 * 60));
|
||||
diff -= this.endTheCountdownMinute * (1000 * 60);
|
||||
this.endTheCountdownSecond = Math.floor(diff / (1000));
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.itemObj = JSON.parse(decodeURIComponent(options.item));
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.id = this.itemObj.commodity_id ? this.itemObj.commodity_id : this.itemObj.id;
|
||||
this.adver_id = this.itemObj.adver_id
|
||||
this.groupById = this.itemObj.groupById
|
||||
this.promotional_price = this.itemObj.promotional_price
|
||||
this.getBuyRecord()
|
||||
this.getEndTheCountdown(this.endTime)
|
||||
|
||||
// 启动定时器，每秒更新一次倒计时
|
||||
this.timer = setInterval(() => {
|
||||
this.getEndTheCountdown(this.endTime)
|
||||
}, 1000)
|
||||
},
|
||||
onReachBottom() { },
|
||||
onShow() {
|
||||
// 确保getShopCarList完成后再执行getGoodsInfo
|
||||
this.getShopCarList().then(() => {
|
||||
this.getGoodsInfo();
|
||||
});
|
||||
},
|
||||
|
||||
//离开页面的时候直接更新购物车数量(目前接口是 传入商品id 数量。如果有当前商品就更新数量。如果没有就增加商品。如果删除某个商品 count 为0 就删除)
|
||||
onHide() {
|
||||
// 清除定时器
|
||||
if (this.timer) {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
}
|
||||
|
||||
let goods_id_and_count = [];
|
||||
this.info.commodity_goods_info_list.forEach((item) => {
|
||||
goods_id_and_count.push({
|
||||
goods_id: item.id,
|
||||
count: item.cart_count ? item.cart_count.count : 0,
|
||||
});
|
||||
});
|
||||
|
||||
// request(apiArr.updateCar, "POST", {
|
||||
// goods_id_and_count,
|
||||
// }).then((res) => {
|
||||
// console.log("Cart updated on hide");
|
||||
// });
|
||||
return;
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,608 +0,0 @@
|
||||
page {
|
||||
background-color: #f5f7fb;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* 顶部切换栏 */
|
||||
.tab-bar {
|
||||
display: flex;
|
||||
background-color: #fff;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.tab-item {
|
||||
width: 180rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
text-align: center;
|
||||
border-radius: 15rpx;
|
||||
margin: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1rpx solid #ddd;
|
||||
}
|
||||
|
||||
.tab-item.active {
|
||||
background-color: #ff370b;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 分隔线 */
|
||||
.divider {
|
||||
height: 20rpx;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
/* 公共标题样式 */
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
padding: 20rpx 30rpx;
|
||||
}
|
||||
|
||||
/* 收货地址区域 */
|
||||
.info-section {
|
||||
background: repeating-linear-gradient(to right,
|
||||
#fe5355,
|
||||
#fe5355 20px,
|
||||
#549aff 20px,
|
||||
#549aff 40px);
|
||||
padding: 10rpx 0;
|
||||
}
|
||||
|
||||
.address-section {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.address-info {
|
||||
padding: 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.address-main {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.address-name-phone {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.phone {
|
||||
font-size: 30rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.address-detail {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
line-height: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.address-arrow {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.addNewAddress {
|
||||
font-size: 32rpx;
|
||||
color: #999999;
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* 商品信息区域 */
|
||||
.goods-section {
|
||||
background-color: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.goods-item {
|
||||
border-radius: 10rpx;
|
||||
padding: 15rpx;
|
||||
display: flex;
|
||||
background-color: #fff;
|
||||
|
||||
}
|
||||
|
||||
.goods-image {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 15rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.goods-image image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.goods-name {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 8rpx;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.goods-desc {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.price-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.group-price {
|
||||
font-size: 28rpx;
|
||||
color: #e63946;
|
||||
margin-right: 10rpx;
|
||||
border-radius: 4rpx;
|
||||
/* display: flex; */
|
||||
}
|
||||
|
||||
.group-price-box {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.group-price1 {
|
||||
width: 100rpx;
|
||||
padding: 10rpx 15rpx;
|
||||
color: #ffffff;
|
||||
background-color: #fc5d15;
|
||||
border-radius: 15rpx 0 0 15rpx;
|
||||
}
|
||||
|
||||
.group-price2 {
|
||||
width: auto;
|
||||
padding: 10rpx 15rpx;
|
||||
background: linear-gradient(to bottom, #fef6d6, #fee8a9);
|
||||
border-radius: 0 15rpx 15rpx 0;
|
||||
|
||||
}
|
||||
|
||||
.original-price {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.countdown {
|
||||
width: 250rpx;
|
||||
font-size: 22rpx;
|
||||
padding: 10rpx 15rpx;
|
||||
color: #ffffff;
|
||||
margin-bottom: 15rpx;
|
||||
border-radius: 50rpx;
|
||||
background-color: #fe2f01;
|
||||
position: absolute;
|
||||
top: 150rpx;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.quantity-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.decrease-btn {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background-color: #f5f5f5;
|
||||
border: 1rpx solid #ccc;
|
||||
border-radius: 50%;
|
||||
line-height: 33rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.increase-btn {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background-color: #ff502a;
|
||||
border-radius: 50%;
|
||||
line-height: 33rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.quantity {
|
||||
margin: 0 15rpx;
|
||||
font-size: 24rpx;
|
||||
width: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 运费和总金额区域 */
|
||||
.fee-section,
|
||||
.total-section {
|
||||
background-color: #fff;
|
||||
padding: 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.fee-name,
|
||||
.total-name {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.fee-value,
|
||||
.total-value {
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.total-value {
|
||||
font-weight: bold;
|
||||
color: #FF7658;
|
||||
}
|
||||
|
||||
/* 复制 */
|
||||
.copy-icon {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
background-image: url('https://static.hshuishang.com/myOrder/copy.png');
|
||||
background-size: cover;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
/* 支付方式区域 */
|
||||
.payment-section {
|
||||
background-color: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.payment-item {
|
||||
padding: 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.payment-icon {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.payment-icon image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.payment-content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.payment-name {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
|
||||
.payment-desc {
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.payment-select {
|
||||
color: #FF7658;
|
||||
}
|
||||
|
||||
/* 立即支付按钮 */
|
||||
.pay-button {
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
color: #fff;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
border-radius: 50rpx;
|
||||
position: fixed;
|
||||
bottom: 50rpx;
|
||||
left: 15%;
|
||||
width: 70%;
|
||||
/* z-index: 99; */
|
||||
}
|
||||
|
||||
/* 自提样式 */
|
||||
.pickup-info {
|
||||
padding: 30rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.pickup-address {
|
||||
font-size: 30rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.pickup-time {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 弹窗 */
|
||||
.shadow {
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.shadowBox2 {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.shadowBox_img {
|
||||
width: 600rpx;
|
||||
height: 800rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.boxshadow_tit {
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
padding-top: 40rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.boxshadow_tit_img {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.boxshadow_img {
|
||||
/* width: 300rpx;
|
||||
height: 300rpx; */
|
||||
margin: 0 auto;
|
||||
margin-top: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.wealBoxTit {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
margin-top: 30rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.wealBoxTit1 {
|
||||
color: #fe1535;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.wealBoxTit2 {
|
||||
color: #fe1535;
|
||||
font-size: 26rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
.wealBox {
|
||||
width: 93%;
|
||||
height: 170rpx;
|
||||
margin: 15rpx auto;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.wealBoxItem {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
margin: 0 10rpx;
|
||||
border-radius: 15rpx;
|
||||
padding: 20rpx 10rpx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
/* 添加 flex 布局 */
|
||||
flex-direction: column;
|
||||
/* 设置主轴为垂直方向 */
|
||||
justify-content: space-between;
|
||||
/* 垂直方向上平均分布 */
|
||||
align-items: center;
|
||||
/* 水平方向居中 */
|
||||
}
|
||||
|
||||
|
||||
.wealBoxItem1 {
|
||||
background-color: #fff4f1;
|
||||
}
|
||||
|
||||
.wealBoxItem2 {
|
||||
background-color: #fff7f1;
|
||||
}
|
||||
|
||||
.wealBoxItem3 {
|
||||
background-color: #fffaf0;
|
||||
}
|
||||
|
||||
.wealBoxItemTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.wealBoxItemTop image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.wealBoxItemBottom {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 30rpx;
|
||||
}
|
||||
|
||||
.boxbottom1 {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.boxbottom {
|
||||
width: 100%;
|
||||
margin-bottom: 50rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.line1 {
|
||||
width: 80rpx;
|
||||
height: 1rpx;
|
||||
margin: 0 10rpx;
|
||||
background: linear-gradient(to left, #333, #fff);
|
||||
}
|
||||
|
||||
.line2 {
|
||||
width: 80rpx;
|
||||
height: 1rpx;
|
||||
margin: 0 10rpx;
|
||||
background: linear-gradient(to right, #333, #fff);
|
||||
}
|
||||
|
||||
.shadowBox1 {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.shadowBox1Item_btn {
|
||||
width: 110rpx;
|
||||
height: 150rpx;
|
||||
border: 1rpx solid red;
|
||||
position: absolute;
|
||||
left: 100rpx;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.shadowBox2Item_btn {
|
||||
width: 110rpx;
|
||||
height: 150rpx;
|
||||
border: 1rpx solid red;
|
||||
position: absolute;
|
||||
right: 100rpx;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.shadowBox1Item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 26rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.shadowBox1Item image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-bottom: 26rpx;
|
||||
}
|
||||
|
||||
.shadowBoxInfo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 62rpx;
|
||||
margin-top: 11rpx;
|
||||
}
|
||||
|
||||
.shadowboxInfo_left {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
background: #EFEFEF;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 36rpx;
|
||||
}
|
||||
|
||||
.shadowboxInfo_right_1 {
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.shadowboxInfo_right_2 {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.shadowBox_btn {
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
width: 600rpx;
|
||||
height: 90rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
|
||||
.empty-tip {
|
||||
height: 200rpx;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
text-align: center;
|
||||
line-height: 200rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
@ -1,827 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- 顶部切换栏 -->
|
||||
<view class="tab-bar">
|
||||
<!-- <view :class="{ active: activeTab === 'delivery' }" class="tab-item" @click="switchTab('delivery')">配送
|
||||
</view> -->
|
||||
<view :class="{ active: activeTab === 'pickup' }" class="tab-item" @click="switchTab('pickup')">自提</view>
|
||||
</view>
|
||||
<!-- 分隔线 -->
|
||||
<view class="divider"></view>
|
||||
<!-- 配送/自提信息 -->
|
||||
<view class="info-section" v-if="activeTab === 'delivery'">
|
||||
<view class="address-section">
|
||||
<view class="section-title">收货地址</view>
|
||||
<view class="address-info" @click="chooseAddress" v-if="defAddress">
|
||||
<view class="address-main">
|
||||
<view class="address-name-phone">
|
||||
<text class="name">{{ defAddress.name }}</text>
|
||||
<text class="phone">{{ defAddress.phone }}</text>
|
||||
</view>
|
||||
<view class="address-detail">
|
||||
{{ defAddress.address }}{{ defAddress.house_number }}
|
||||
<view class="copy-icon" @click.stop="copyAddress" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-arrow"><u-icon name="arrow-right" size="25"></u-icon></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 分隔线 -->
|
||||
<view class="divider"></view>
|
||||
<!-- 商品信息 -->
|
||||
<view v-if="activeTab === 'delivery' && orderList1.length > 0">
|
||||
<view class="goods-list">
|
||||
<view class="goods-item" v-for="(item, index) in orderList1" :key="index">
|
||||
<view class="goods-image">
|
||||
<image :src="item.commodity_goods_info.commodity_pic" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="goods-name">{{ item.commodity_goods_info.goods_name }}</view>
|
||||
<view class="goods-desc">{{ item.commodity_goods_info.goods_spec }}</view>
|
||||
<view class="price-container">
|
||||
<view class="group-price">
|
||||
<view>￥{{ item.commodity_goods_info.sales_price }}/{{
|
||||
item.commodity_goods_info.goods_unit
|
||||
}}</view>
|
||||
<!-- 运费 -->
|
||||
<view class="goods-desc" style="margin-top: 10rpx;">运费 ￥{{
|
||||
item.commodity_goods_info.freight }}</view>
|
||||
</view>
|
||||
<view class="quantity-control">
|
||||
<view class="decrease-btn" @tap.stop="decreaseQuantity(item)">-</view>
|
||||
<view class="quantity">{{ item.count }}</view>
|
||||
<view class="increase-btn" @tap.stop="increaseQuantity(item)">+</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 运费 -->
|
||||
<!-- <view class="fee-section">
|
||||
<view class="fee-name">运费</view>
|
||||
<view class="fee-value">￥{{ item.commodity_goods_info.freight }}</view>
|
||||
</view> -->
|
||||
<!-- 总金额 -->
|
||||
<view class="total-section">
|
||||
<view class="total-name">总金额</view>
|
||||
<view class="total-value">￥{{ calculateTotal('order1') }}</view>
|
||||
</view>
|
||||
<!-- 支付方式 -->
|
||||
<view class="payment-section">
|
||||
<view class="payment-item" @click="selectPayment('wechat')">
|
||||
<view class="payment-icon">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_wechat.png"
|
||||
mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="payment-content">
|
||||
<view class="payment-name">微信支付</view>
|
||||
<view class="payment-desc"><text
|
||||
style="color: #f03d0e;margin-right: 15rpx;">可用优惠券</text>单笔支付限额:¥10000.00</view>
|
||||
</view>
|
||||
<view class="payment-select" v-if="selectedPayment === 'wechat'">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png"
|
||||
mode="aspectFit" style="width: 40rpx; height: 40rpx;"></image>
|
||||
</view>
|
||||
<view class="payment-select" v-else>
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png"
|
||||
mode="aspectFit" style="width: 40rpx; height: 40rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="activeTab === 'delivery' && orderList1.length == 0" class="empty-tip">
|
||||
暂无商品数据
|
||||
</view>
|
||||
<view v-if="activeTab === 'pickup' && orderList2.length > 0">
|
||||
<!-- 按供应商分组 -->
|
||||
<view v-for="(group, supplierId) in supplierGroups" :key="supplierId">
|
||||
<view class="goods-list">
|
||||
<view class="info-section">
|
||||
<view class="address-section">
|
||||
<view class="section-title">自提点</view>
|
||||
<view @click="editAddress(group[0])">
|
||||
<view v-if="defZTAddress.length > 0">
|
||||
<view v-for="(adItem, adIndex) in defZTAddress" :key="adIndex">
|
||||
<view class="address-info" v-if="adItem.id == supplierId">
|
||||
<view class="address-main">
|
||||
<view class="address-name-phone">
|
||||
<text class="name">{{ adItem.name }}</text>
|
||||
<text class="phone">{{ adItem.phone }}</text>
|
||||
</view>
|
||||
<view class="address-detail">
|
||||
{{ adItem.address }}
|
||||
<view class="copy-icon" @click.stop="copyZTAddress" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-arrow"><u-icon name="arrow-right" size="25"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-info"
|
||||
v-if="!defZTAddress.some(adItem => adItem.id == supplierId)">
|
||||
<view class="address-main">
|
||||
<view class="address-name-phone">
|
||||
<text class="name">请选择自提点</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-arrow"><u-icon name="arrow-right" size="25"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-info" v-else>
|
||||
<view class="address-main">
|
||||
<view class="address-name-phone">
|
||||
<text class="name">请选择自提点</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-arrow"><u-icon name="arrow-right" size="25"></u-icon></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 该供应商下的所有商品 -->
|
||||
<view class="goods-item" v-for="(item, index) in group" :key="index">
|
||||
<view class="goods-image">
|
||||
<image :src="item.commodity_goods_info.commodity_pic" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="goods-name">{{ item.commodity_goods_info.goods_name }}</view>
|
||||
<view class="goods-desc">{{ item.commodity_goods_info.goods_spec }}</view>
|
||||
<view class="price-container">
|
||||
<view class="group-price">
|
||||
<view>
|
||||
<view v-if="isWithinActivityTime(item)" class="group-price-box">
|
||||
<view class="group-price1">团购价</view>
|
||||
<view class="group-price2">
|
||||
{{ '￥' + item.commodity_goods_info.group_buy_price }}
|
||||
/{{ item.commodity_goods_info.goods_unit }}
|
||||
</view>
|
||||
</view>
|
||||
<view v-else>
|
||||
{{ '￥' + item.price }}
|
||||
/{{ item.commodity_goods_info.goods_unit }}
|
||||
</view>
|
||||
</view>
|
||||
<!-- 运费 -->
|
||||
<!-- <view class="goods-desc" style="margin-top: 10rpx;">运费 ￥{{
|
||||
item.commodity_goods_info.freight }}</view> -->
|
||||
</view>
|
||||
<view class="quantity-control">
|
||||
<view class="decrease-btn" @tap.stop="decreaseQuantity(item)">-</view>
|
||||
<view class="quantity">{{ item.count }}</view>
|
||||
<view class="increase-btn" @tap.stop="increaseQuantity(item)">+</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 运费 -->
|
||||
<!-- <view class="fee-section">
|
||||
<view class="fee-name">运费</view>
|
||||
<view class="fee-value">￥{{ item.commodity_goods_info.freight }}</view>
|
||||
</view> -->
|
||||
<!-- 总金额 -->
|
||||
<view class="total-section">
|
||||
<view class="total-name">总金额</view>
|
||||
<view class="total-value">￥{{ calculateTotal('order2') }}</view>
|
||||
</view>
|
||||
<!-- 支付方式 -->
|
||||
<view class="payment-section">
|
||||
<view class="payment-item" @click="selectPayment('wechat')">
|
||||
<view class="payment-icon">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_wechat.png"
|
||||
mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="payment-content">
|
||||
<view class="payment-name">微信支付</view>
|
||||
<view class="payment-desc"><text
|
||||
style="color: #f03d0e;margin-right: 15rpx;">可用优惠券</text>单笔支付限额:¥10000.00</view>
|
||||
</view>
|
||||
<view class="payment-select" v-if="selectedPayment === 'wechat'">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png"
|
||||
mode="aspectFit" style="width: 40rpx; height: 40rpx;"></image>
|
||||
</view>
|
||||
<view class="payment-select" v-else>
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png"
|
||||
mode="aspectFit" style="width: 40rpx; height: 40rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="activeTab === 'pickup' && orderList2.length == 0" class="empty-tip">
|
||||
暂无商品数据
|
||||
</view>
|
||||
<!-- 立即支付按钮 -->
|
||||
<view class="pay-button" @click="submitPayment">立即支付</view>
|
||||
|
||||
<!-- 弹窗 - 支付成功 -->
|
||||
<view class="shadow" @click="changeShadow" v-if="boxshadow1">
|
||||
<view class="shadowBox2">
|
||||
<view class="shadowBox_img">
|
||||
<view class="boxshadow_tit">
|
||||
<image src="https://static.hshuishang.com/af_√.png"
|
||||
class="boxshadow_tit_img">
|
||||
</image>
|
||||
已支付成功
|
||||
</view>
|
||||
<view class="boxshadow_img">
|
||||
<view v-if="verifyCode">核销码：{{ verifyCode }}</view>
|
||||
<!-- <image
|
||||
src="https://static.hshuishang.com/property-img-file/shop_share_img.png">
|
||||
</image> -->
|
||||
</view>
|
||||
<view>
|
||||
<view class="wealBoxTit">
|
||||
<view class="wealBoxTit1">下单福利</view>
|
||||
<view class="wealBoxTit2">已获得</view>
|
||||
</view>
|
||||
<view class="wealBox">
|
||||
<view class="wealBoxItem wealBoxItem1">
|
||||
<view class="wealBoxItemTop">
|
||||
<image src="https://static.hshuishang.com/activity_fen.png"
|
||||
mode="aspectFit">
|
||||
</image>
|
||||
<view>石榴分</view>
|
||||
</view>
|
||||
<view>
|
||||
{{ slFen }}
|
||||
</view>
|
||||
<view class="wealBoxItemBottom">
|
||||
可抵扣 ￥{{ slFen }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="wealBoxItem wealBoxItem2">
|
||||
<view class="wealBoxItemTop">
|
||||
<image src="https://static.hshuishang.com/activity_zi.png"
|
||||
mode="aspectFit">
|
||||
</image>
|
||||
<view>石榴籽</view>
|
||||
</view>
|
||||
<view>
|
||||
{{ slZi }}
|
||||
</view>
|
||||
<view class="wealBoxItemBottom">
|
||||
可抵扣 ￥{{ slZi }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="wealBoxItem wealBoxItem3">
|
||||
<view class="wealBoxItemTop">
|
||||
<image src="https://static.hshuishang.com/activity_jin.png"
|
||||
mode="aspectFit" />
|
||||
<view>石榴金</view>
|
||||
</view>
|
||||
<view>
|
||||
{{ slJin }}
|
||||
</view>
|
||||
<view class="wealBoxItemBottom">
|
||||
可抵扣 ￥{{ slJin }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="boxbottom1">
|
||||
<view class="boxbottom">
|
||||
<view class="line1"></view>
|
||||
赶快邀请好友来下单吧
|
||||
<view class="line2"></view>
|
||||
</view>
|
||||
<view @click.stop="changeShadow">
|
||||
<view class="shadowBox1">
|
||||
<button class="shadowBox1Item_btn" open-type="share" bindtap="onShareButtonClick" />
|
||||
<view class="shadowBox1Item">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/shop_WX.png"
|
||||
mode="aspectFill"></image>
|
||||
微信好友
|
||||
</view>
|
||||
<button class="shadowBox2Item_btn" open-type="share" bindtap="onShareButtonClick" />
|
||||
<view class="shadowBox1Item" @click="shareFriend">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/shop_WX.png"
|
||||
mode="aspectFill"></image>
|
||||
小程序链接
|
||||
</view>
|
||||
<!-- <view class="shadowBox1Item" @click="openSave">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/shop_saveImg.png"
|
||||
mode="aspectFill"></image>
|
||||
二维码海报
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 海报 -->
|
||||
<view class="shadow" @click="changeShadow2" v-if="boxshadow2">
|
||||
<view class="shadowBox2">
|
||||
<view class="shadowBox_img">
|
||||
<view class="boxshadow_tit">今日商品推荐</view>
|
||||
<view class="boxshadow_img">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/shop_share_img.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="shadowBoxInfo">
|
||||
<view class="shadowboxInfo_left">二维码</view>
|
||||
<view class="shadowboxInfo_right">
|
||||
<view class="shadowboxInfo_right_1">正鲜生</view>
|
||||
<view class="shadowboxInfo_right_2">
|
||||
长按识别小程序 <br />
|
||||
数量有限马上抢购
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="shadowBox_btn" @click.stop="saveImg">保存海报</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo } from "../../../utils";
|
||||
import { apiArr } from "../../../api/shop";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
activeTab: 'pickup', // 默认选中自提
|
||||
quantity: 1, // 商品数量
|
||||
selectedPayment: 'wechat',
|
||||
boxshadow1: false,
|
||||
boxshadow2: false,
|
||||
defAddress: {},
|
||||
defZTAddress: [],
|
||||
orderList1: [],
|
||||
orderList2: [],
|
||||
carList: [],
|
||||
|
||||
slJin: 0,
|
||||
slFen: 0,
|
||||
slZi: 0,
|
||||
|
||||
// 团购活动id
|
||||
group_buy_activity_id: 0,
|
||||
|
||||
// 核销码
|
||||
verifyCode: '',
|
||||
totalPrice: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
// 按供应商id分组商品
|
||||
supplierGroups() {
|
||||
const groups = {};
|
||||
this.orderList2.forEach(item => {
|
||||
const supplierId = item.supplier_id || 'default';
|
||||
if (!groups[supplierId]) {
|
||||
groups[supplierId] = [];
|
||||
}
|
||||
groups[supplierId].push(item);
|
||||
});
|
||||
return groups;
|
||||
},
|
||||
},
|
||||
onLoad(options) {
|
||||
this.carList = JSON.parse(options.shopCarList)
|
||||
},
|
||||
onShow() {
|
||||
this.getUserAddress()
|
||||
this.getZTAddress()
|
||||
this.getGoodsList()
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync('changeZTAddress')
|
||||
},
|
||||
methods: {
|
||||
switchTab(tab) {
|
||||
this.activeTab = tab;
|
||||
},
|
||||
//用户收货地址
|
||||
getUserAddress() {
|
||||
request(apiArr.getUserDefAddress, "POST", {}).then(res => {
|
||||
this.defAddress = res.default_address
|
||||
})
|
||||
},
|
||||
// 商品列表
|
||||
getGoodsList() {
|
||||
this.orderList1 = []
|
||||
this.orderList2 = []
|
||||
|
||||
this.carList.forEach(item => {
|
||||
// 如果图片URL不是以https开头，则拼接picUrl
|
||||
if (item.commodity_goods_info.commodity_pic && item.commodity_goods_info.commodity_pic.indexOf('https') !== 0) {
|
||||
item.commodity_goods_info.commodity_pic = picUrl + item.commodity_goods_info.commodity_pic
|
||||
}
|
||||
|
||||
// const list = item.commodity_goods_info.group_buy_activity_info
|
||||
const list = true
|
||||
if (list) {
|
||||
this.orderList2.push(item)
|
||||
} else {
|
||||
this.orderList1.push(item)
|
||||
}
|
||||
})
|
||||
},
|
||||
getZTAddress() {
|
||||
setTimeout(() => {
|
||||
let changeAddress = uni.getStorageSync('changeZTAddress')
|
||||
if (changeAddress) {
|
||||
this.defZTAddress = changeAddress
|
||||
}
|
||||
}, 100)
|
||||
},
|
||||
chooseAddress() {
|
||||
NavgateTo('../address/index')
|
||||
},
|
||||
editAddress(item) {
|
||||
NavgateTo('/packages/shop/ztLocation/index?item=' + JSON.stringify(item));
|
||||
},
|
||||
decreaseQuantity(item) {
|
||||
const currentTime = new Date().getTime();
|
||||
const startTime = new Date(item.commodity_goods_info.group_buy_activity_info?.start_time).getTime();
|
||||
const endTime = new Date(item.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
if (item.count > 0) {
|
||||
if (currentTime >= startTime && currentTime <= endTime) {
|
||||
if (item.count == item.commodity_goods_info.min_order_quantity) {
|
||||
uni.showToast({
|
||||
title: '最少购买' + item.commodity_goods_info.min_order_quantity + '件',
|
||||
icon: 'none'
|
||||
});
|
||||
item.count = 0
|
||||
} else {
|
||||
item.count -= item.is_one_one === 1 ? 2 : 1;
|
||||
}
|
||||
} else {
|
||||
item.count -= item.is_one_one === 1 ? 2 : 1;
|
||||
}
|
||||
|
||||
// 当数量减到0时，从carList中删除该商品
|
||||
if (item.count === 0) {
|
||||
const index = this.carList.findIndex(carItem => carItem.goods_id === item.goods_id);
|
||||
if (index > -1) {
|
||||
this.carList.splice(index, 1);
|
||||
// 重新加载商品列表以更新页面显示
|
||||
this.getGoodsList();
|
||||
}
|
||||
}
|
||||
|
||||
this.changeCart(item)
|
||||
}
|
||||
},
|
||||
increaseQuantity(item) {
|
||||
const currentTime = new Date().getTime();
|
||||
const startTime = new Date(item.commodity_goods_info.group_buy_activity_info?.start_time).getTime();
|
||||
const endTime = new Date(item.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
|
||||
if (item.count >= item.commodity_goods_info.stock_quantity) {
|
||||
uni.showToast({
|
||||
title: '库存不足',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
|
||||
if (currentTime >= startTime && currentTime <= endTime) {
|
||||
if (item.count == 0) {
|
||||
item.count += item.is_one_one === 1 ? 2 : 1;
|
||||
} else {
|
||||
if (item.count >= item.purchase_limit) {
|
||||
uni.showToast({
|
||||
title: '您选择的数量已达到最大限购量',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
if (item.count == item.commodity_goods_info.max_limit_quantity) {
|
||||
uni.showToast({
|
||||
title: '一次最多购买' + item.commodity_goods_info.max_limit_quantity + '件',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
item.count += item.is_one_one === 1 ? 2 : 1;
|
||||
this.changeCart(item);
|
||||
},
|
||||
// 更改购物车
|
||||
changeCart(item) {
|
||||
const params = {
|
||||
goods_id_and_count: [
|
||||
{
|
||||
goods_id: item.goods_id,
|
||||
count: item.count,
|
||||
price: item.price,
|
||||
},
|
||||
],
|
||||
adver_id: item.adver_id,
|
||||
}
|
||||
request(apiArr.updateCar, "POST", params).then(res => {
|
||||
uni.showToast({
|
||||
title: "操作成功！",
|
||||
success() { },
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
// 计算总金额
|
||||
calculateTotal(order) {
|
||||
if (order === 'order1') {
|
||||
let total = 0;
|
||||
this.orderList1.forEach(goods => {
|
||||
// 直接使用item.price进行计算
|
||||
total += goods.price * (goods.is_one_one === 1 ? goods.count / 2 : goods.count);
|
||||
});
|
||||
// 加运费
|
||||
return total.toFixed(2);
|
||||
} else {
|
||||
let total = 0;
|
||||
this.orderList2.forEach(goods => {
|
||||
// 直接使用item.price进行计算
|
||||
total += goods.price * (goods.is_one_one === 1 ? goods.count / 2 : goods.count);
|
||||
this.totalPrice = total.toFixed(2);
|
||||
});
|
||||
// 加运费
|
||||
return total.toFixed(2);
|
||||
}
|
||||
},
|
||||
selectPayment(payment) {
|
||||
this.selectedPayment = payment;
|
||||
},
|
||||
submitPayment() {
|
||||
// 检查所有供应商是否都选择了自提点
|
||||
const supplierIds = [...new Set(this.orderList2.map(item =>
|
||||
item.supplier_id || 'default'
|
||||
))];
|
||||
|
||||
const allHaveZTAddress = supplierIds.every(supplierId => {
|
||||
const ztAddress = this.defZTAddress.find(adItem => adItem.id == supplierId);
|
||||
return !!ztAddress;
|
||||
});
|
||||
|
||||
if (!allHaveZTAddress) {
|
||||
uni.showToast({
|
||||
title: '请选择所有货品的自提点',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 团购活动时间判断
|
||||
const currentTime = new Date().getTime();
|
||||
let isGroupBuyValid = true;
|
||||
|
||||
// 检查所有商品是否在团购活动时间内
|
||||
for (let supplierId in this.supplierGroups) {
|
||||
const group = this.supplierGroups[supplierId];
|
||||
for (let item of group) {
|
||||
const activityInfo = item.commodity_goods_info.group_buy_activity_info;
|
||||
// 如果没有团购活动信息，或者不在活动时间内，则isGroupBuyValid设为false
|
||||
if (!activityInfo) {
|
||||
isGroupBuyValid = false;
|
||||
break;
|
||||
}
|
||||
|
||||
const startTime = new Date(activityInfo.start_time).getTime();
|
||||
const endTime = new Date(activityInfo.end_time).getTime();
|
||||
if (!(currentTime >= startTime && currentTime <= endTime)) {
|
||||
isGroupBuyValid = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (!isGroupBuyValid) break;
|
||||
}
|
||||
|
||||
// 检查是否存在isafterSale属性且值为true
|
||||
const hasAfterSaleItem = this.carList.some(item => item.isafterSale === true);
|
||||
const orderIdFromAfterSale = hasAfterSaleItem ? this.carList.find(item => item.isafterSale === true)?.orderId : null;
|
||||
|
||||
// 根据平台设置不同的trans_type值
|
||||
// 小程序: 71, App: 51
|
||||
const systemInfo = uni.getSystemInfoSync();
|
||||
let trans_type = 51; // 默认App环境
|
||||
|
||||
// 运行时判断是否为小程序环境
|
||||
if (systemInfo.platform === 'devtools' || systemInfo.platform === 'unknown') {
|
||||
trans_type = 71; // 开发工具或未知环境默认为小程序
|
||||
}
|
||||
|
||||
// 条件编译：针对不同平台设置不同值
|
||||
// #ifdef MP
|
||||
trans_type = 71; // 所有小程序平台
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
trans_type = 51; // App平台
|
||||
// #endif
|
||||
|
||||
// 如果存在isafterSale属性且为true，则跳过createOrder接口调用
|
||||
if (hasAfterSaleItem && orderIdFromAfterSale) {
|
||||
const param = {
|
||||
order_id: orderIdFromAfterSale,
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
trans_type: trans_type
|
||||
}
|
||||
request(apiArr.mergePreorder, "POST", param).then(res => {
|
||||
this.handleMergePreorderResponse(res, orderIdFromAfterSale);
|
||||
})
|
||||
} else {
|
||||
// 原始逻辑：创建订单后再进行支付
|
||||
const params = {
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
// 先判断shopCarList数据中是否包含isAdver且为true
|
||||
order_cate: this.carList.some(item => item.isAdver === true) ? 3 : (isGroupBuyValid ? 2 : 1),
|
||||
goods_list: Object.keys(this.supplierGroups).map(supplierId => {
|
||||
const group = this.supplierGroups[supplierId];
|
||||
const firstItem = group[0];
|
||||
|
||||
// 团购活动id
|
||||
this.group_buy_activity_id = firstItem.commodity_goods_info.group_buy_activity_id;
|
||||
|
||||
// 根据供应商id获取自提点信息
|
||||
const ztAddress = this.defZTAddress.find(adItem => adItem.id == supplierId) || {};
|
||||
|
||||
return {
|
||||
supplier_id: firstItem.supplier_id,
|
||||
supplier_name: firstItem.supplier_name || '',
|
||||
is_same_day: firstItem.commodity_goods_info.is_same_day,
|
||||
receiving_name: ztAddress.name || '',
|
||||
receiving_phone: ztAddress.phone || '',
|
||||
receiving_address: ztAddress.address || '',
|
||||
merchant_id: ztAddress.address_id,
|
||||
group_buy_activity_id: firstItem.commodity_goods_info.group_buy_activity_id,
|
||||
goods_and_count: group.map(item => {
|
||||
return {
|
||||
goods_id: item.goods_id,
|
||||
count: item.is_one_one === 1 ? item.count / 2 : item.count,
|
||||
price: item.price,
|
||||
freight: item.commodity_goods_info.freight,
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
request(apiArr.createOrder, "POST", params).then(resVal => {
|
||||
const param = {
|
||||
order_id: resVal.order_id,
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
trans_type: trans_type
|
||||
}
|
||||
request(apiArr.mergePreorder, "POST", param).then(res => {
|
||||
this.handleMergePreorderResponse(res, resVal.order_id);
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
// 处理mergePreorder接口的响应
|
||||
handleMergePreorderResponse(res, orderId) {
|
||||
if (res && res.timeStamp && res.nonceStr && res.package && res.signType && res.paySign) {
|
||||
// 调用微信支付
|
||||
uni.requestPayment({
|
||||
timeStamp: res.timeStamp,
|
||||
nonceStr: res.nonceStr,
|
||||
package: res.package,
|
||||
signType: res.signType,
|
||||
paySign: res.paySign,
|
||||
success: (payRes) => {
|
||||
const params = {
|
||||
order_id: orderId,
|
||||
from: this.carList.some(item => item.isAdver === true) ? 3 : (isGroupBuyValid ? 2 : 1),
|
||||
group_buy_activity_id: this.group_buy_activity_id,
|
||||
adver_id: this.carList.some(item => item.isAdver === true) ? this.carList.find(item => item.isAdver === true).adver_id : ''
|
||||
}
|
||||
request(apiArr.queryOrder, "POST", params).then(res => {
|
||||
this.verifyCode = res.verification_code
|
||||
this.slJin = res.shiliu_money
|
||||
this.boxshadow1 = true
|
||||
})
|
||||
},
|
||||
fail: (payErr) => {
|
||||
uni.showToast({
|
||||
title: payErr.errMsg == 'requestPayment:fail cancel' ? '已取消支付' : '支付失败',
|
||||
icon: 'none'
|
||||
})
|
||||
const params = {
|
||||
order_ids: orderId,
|
||||
}
|
||||
request(apiArr.cancelPay, "POST", params).then(res => {
|
||||
})
|
||||
},
|
||||
complete: () => {
|
||||
// 支付完成后的回调，无论成功失败都会执行
|
||||
}
|
||||
})
|
||||
} else {
|
||||
console.error("获取支付参数失败，缺少必要参数")
|
||||
uni.showToast({
|
||||
title: '获取支付信息失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
// 复制收货地址
|
||||
copyAddress() {
|
||||
// 使用uni-app的复制API
|
||||
uni.setClipboardData({
|
||||
data: this.defAddress.address + this.defAddress.house_number,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
title: '复制失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
copyZTAddress() {
|
||||
// 使用uni-app的复制API
|
||||
uni.setClipboardData({
|
||||
data: this.defZTAddress.address,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: () => {
|
||||
uni.showToast({
|
||||
title: '复制失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
openSave() {
|
||||
this.boxshadow1 = false;
|
||||
this.boxshadow2 = true;
|
||||
},
|
||||
changeShadow() {
|
||||
this.boxshadow1 = false;
|
||||
},
|
||||
changeShadow2() {
|
||||
this.boxshadow2 = false;
|
||||
},
|
||||
// 保存海报
|
||||
saveImg() {
|
||||
this.boxshadow2 = false;
|
||||
// 微信小程序保存图片
|
||||
uni.downloadFile({
|
||||
url: "https://static.hshuishang.com/property-img-file/shop_share_img.png",
|
||||
success: (res) => {
|
||||
if (res.statusCode === 200) {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: res.tempFilePath,
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "保存成功",
|
||||
icon: "success",
|
||||
duration: 2000,
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log("保存失败", err);
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log("下载失败", err);
|
||||
},
|
||||
});
|
||||
},
|
||||
// 判断当前日期是否在团购活动时间范围内
|
||||
isWithinActivityTime(item) {
|
||||
if (!item || !item.commodity_goods_info || !item.commodity_goods_info.group_buy_activity_info) {
|
||||
return false;
|
||||
}
|
||||
const now = new Date();
|
||||
const startTime = new Date(item.commodity_goods_info.group_buy_activity_info?.start_time);
|
||||
const endTime = new Date(item.commodity_goods_info.group_buy_activity_info?.end_time);
|
||||
return now >= startTime && now <= endTime;
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import url('./index.css');
|
||||
</style>
|
||||
@ -1,301 +0,0 @@
|
||||
.group-purchase-container {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
max-width: 750rpx;
|
||||
margin: 0 auto;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/* 顶部横幅 */
|
||||
.banner-content {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.banner-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10rpx;
|
||||
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.banner-subtitle {
|
||||
font-size: 18rpx;
|
||||
background-color: rgba(255, 255, 255, 0.2);
|
||||
padding: 5rpx 10rpx;
|
||||
border-radius: 4rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
.goods-list {
|
||||
background-color: #ffffff;
|
||||
padding: 30rpx 20rpx;
|
||||
height: 80vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.goods-item {
|
||||
border-radius: 10rpx;
|
||||
padding: 15rpx;
|
||||
margin-bottom: 25rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.goods-item2 {
|
||||
border-radius: 10rpx;
|
||||
padding: 15rpx;
|
||||
margin-bottom: 25rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.goods-image {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 15rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.goods-image image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.goods-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.goods-name {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 8rpx;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.goods-desc {
|
||||
font-size: 22rpx;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.goods-price {
|
||||
font-size: 28rpx;
|
||||
color: #e63946;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.price-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.group-price {
|
||||
font-size: 28rpx;
|
||||
color: #e63946;
|
||||
margin-right: 10rpx;
|
||||
border-radius: 4rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.group-price1{
|
||||
width: 100rpx;
|
||||
padding: 10rpx 15rpx;
|
||||
color: #ffffff;
|
||||
background-color: #fc5d15;
|
||||
border-radius: 15rpx 0 0 15rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.group-price2{
|
||||
width: auto;
|
||||
padding: 10rpx 15rpx;
|
||||
background: linear-gradient(to bottom, #fef6d6, #fee8a9);
|
||||
border-radius: 0 15rpx 15rpx 0;
|
||||
}
|
||||
|
||||
.original-price {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.countdown {
|
||||
width: auto;
|
||||
font-size: 22rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
color: #ffffff;
|
||||
margin-bottom: 15rpx;
|
||||
border-radius: 50rpx;
|
||||
background-color: #fe2f01;
|
||||
position: absolute;
|
||||
/* top: 120rpx; */
|
||||
bottom: -30rpx;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.quantity-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.decrease-btn {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background-color: #f5f5f5;
|
||||
border: 1rpx solid #ccc;
|
||||
border-radius: 50%;
|
||||
line-height: 33rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.increase-btn {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background-color: #ff502a;
|
||||
border-radius: 50%;
|
||||
line-height: 33rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.quantity {
|
||||
margin: 0 15rpx;
|
||||
font-size: 24rpx;
|
||||
width: 40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 购物车按钮 */
|
||||
.shop_car {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
position: absolute;
|
||||
bottom: 150rpx;
|
||||
right: 30rpx;
|
||||
z-index: 10;
|
||||
border-radius: 50%;
|
||||
background-color: #ffffff;
|
||||
padding: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.shop_car image {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.u-badge {
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
top: -6rpx;
|
||||
z-index: 11;
|
||||
}
|
||||
|
||||
/* 规格标签样式 */
|
||||
.specification-tag {
|
||||
width: 130rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #feeceb;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 40rpx;
|
||||
margin: 15rpx 0;
|
||||
font-size: 26rpx;
|
||||
color: #dd4020;
|
||||
}
|
||||
|
||||
.specification-tag text {
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
/* 货品列表样式 */
|
||||
.sku-list {
|
||||
margin-top: 10rpx;
|
||||
padding: 15rpx;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.sku-item{
|
||||
position: relative;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.sku-info{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.sku-image{
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 15rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.sku-price {
|
||||
font-size: 26rpx;
|
||||
color: #e63946;
|
||||
margin-right: 10rpx;
|
||||
border-radius: 4rpx;
|
||||
display: flex;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.sku-price1{
|
||||
width: auto;
|
||||
padding: 10rpx 15rpx;
|
||||
color: #ffffff;
|
||||
background-color: #fc5d15;
|
||||
border-radius: 15rpx 0 0 15rpx;
|
||||
}
|
||||
|
||||
.sku-price2{
|
||||
width: auto;
|
||||
padding: 10rpx 15rpx;
|
||||
background: linear-gradient(to bottom, #fef6d6, #fee8a9);
|
||||
border-radius: 0 15rpx 15rpx 0;
|
||||
}
|
||||
|
||||
.sku-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.sku-countdown {
|
||||
width: auto;
|
||||
font-size: 22rpx;
|
||||
padding: 5rpx 20rpx;
|
||||
color: #ffffff;
|
||||
margin-bottom: 15rpx;
|
||||
border-radius: 50rpx;
|
||||
background-color: #fe2f01;
|
||||
position: absolute;
|
||||
top: 170rpx;
|
||||
right: 0;
|
||||
}
|
||||
@ -1,271 +0,0 @@
|
||||
<template>
|
||||
<view class="group-purchase-container">
|
||||
<!-- 商品列表 -->
|
||||
<view class="goods-list">
|
||||
<!-- 商品项 -->
|
||||
<view v-for="(item, index) in goodsList" :key="index">
|
||||
<view>
|
||||
<view class="goods-item2" @click="toDetail(item)">
|
||||
<view class="goods-image">
|
||||
<image :src="item.commodity_pic" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="goods-name">{{ item.goods_name }}</view>
|
||||
<view class="goods-desc">{{ item.goods_spec }}</view>
|
||||
<view class="price-container">
|
||||
<view class="group-price">
|
||||
<view class="group-price1">活动价</view>
|
||||
<view class="group-price2">￥{{ item.promotional_price }}/{{ item.goods_unit }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="quantity-control">
|
||||
<view class="decrease-btn" @tap.stop="decreaseQuantity(index)">-</view>
|
||||
<view class="quantity">{{ item.quantity }}</view>
|
||||
<view class="increase-btn" @tap.stop="increaseQuantity(index)">+</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="original-price">零售价 ￥{{ item.retail_price }}/{{ item.goods_unit }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 购物车按钮 -->
|
||||
<view class="shop_car" @click="shopCar">
|
||||
<u-badge numberType="limit" type="error" max="99" :value="carNum"></u-badge>
|
||||
<image src="https://static.hshuishang.com/property-img-file/page_user_Group_1564.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo } from "../../../utils";
|
||||
import { apiArr } from '@/api/groupPurchase.js'
|
||||
import { apiArr as shopApi } from "../../../api/shop.js";
|
||||
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
goodsList: [],
|
||||
carNum: 0,
|
||||
quantity: 0,
|
||||
timer: null, // 定时器ID
|
||||
endTime: '', // 初始化结束时间
|
||||
updateTime: Date.now(), // 用于触发倒计时更新的时间戳
|
||||
goodsDetail: [],
|
||||
idVal: '',
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
this.idVal = Number(options.id)
|
||||
// this.getGoodsList()
|
||||
},
|
||||
onShow() {
|
||||
// 在页面显示时启动定时器
|
||||
if (!this.timer) {
|
||||
this.timer = setInterval(() => {
|
||||
// 更新时间戳，触发页面重新渲染
|
||||
this.updateTime = Date.now();
|
||||
}, 1000);
|
||||
}
|
||||
|
||||
// 确保getGoodsList和getShopdetail都执行完毕后再执行getGoodsNum
|
||||
Promise.all([
|
||||
// 确保getGoodsList已完成
|
||||
this.goodsList.length > 0 ? Promise.resolve() : this.getGoodsList(),
|
||||
// 调用getShopdetail并等待其完成
|
||||
this.getShopdetail()
|
||||
]).then(() => {
|
||||
this.getGoodsNum();//获取货品在购物车中的数量
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
getGoodsList() {
|
||||
if (!uni.getStorageSync('userId')) {
|
||||
uni.showToast({
|
||||
title: '请先登录',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
const params = {
|
||||
adver_id: this.idVal,
|
||||
}
|
||||
return request(shopApi.adverGoodsList, 'POST', params).then(res => {
|
||||
const list = res.adver_goods_list.map(item => {
|
||||
// 为每个商品初始化quantity
|
||||
return {
|
||||
...item,
|
||||
commodity_pic: picUrl + item.goods_pic,
|
||||
quantity: 0
|
||||
}
|
||||
})
|
||||
this.goodsList = list
|
||||
return res;
|
||||
})
|
||||
},
|
||||
getShopdetail() {
|
||||
const params = {
|
||||
is_adver: 1,
|
||||
}
|
||||
return request(shopApi.getCar, "POST", params).then((res) => {
|
||||
this.carNum = res.total;
|
||||
// 合并当日达和普通商品数据
|
||||
this.goodsDetail = [].concat(res.same_day_cart_list, res.normal_cart_list)
|
||||
.flatMap(supplier => supplier.commodity_cart_and_goods_model);
|
||||
return res;
|
||||
});
|
||||
},
|
||||
getGoodsNum() {
|
||||
if (!this.goodsDetail || !this.goodsList || this.goodsList.length === 0) {
|
||||
return;
|
||||
}
|
||||
// 遍历所有商品，直接对item进行处理
|
||||
this.goodsList.forEach(goods => {
|
||||
// 在购物车数据中查找对应的商品
|
||||
const matchedItem = this.goodsDetail.find(item => item.goods_id === goods.goods_id);
|
||||
|
||||
// 如果找到匹配项，更新quantity
|
||||
if (matchedItem) {
|
||||
goods.quantity = matchedItem.count;
|
||||
} else {
|
||||
// 如果没有找到，设置为0
|
||||
goods.quantity = 0;
|
||||
}
|
||||
});
|
||||
},
|
||||
toDetail(itemObj) {
|
||||
const item = {
|
||||
...itemObj,
|
||||
groupById: itemObj.group_buy_activity_info ? itemObj.group_buy_activity_info.id : ''
|
||||
};
|
||||
NavgateTo(`/packages/advertising/goodsDetail/index?item=${JSON.stringify(item)}`)
|
||||
},
|
||||
// 增加商品数量
|
||||
increaseQuantity(index) {
|
||||
const item = this.goodsList[index]
|
||||
if (item.quantity == 0) {
|
||||
if (item.one_one === 1) {
|
||||
item.quantity += 2
|
||||
this.carNum += 2
|
||||
} else {
|
||||
item.quantity += 1
|
||||
this.carNum += 1
|
||||
}
|
||||
} else {
|
||||
if (item.quantity == (item.one_one === 1 ? item.purchase_limit * 2 : item.purchase_limit)) {
|
||||
uni.showToast({
|
||||
title: '您选择的数量已达到最大限购量',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
item.quantity = item.one_one === 1 ? item.quantity + 2 : item.quantity + 1;
|
||||
this.carNum = item.one_one === 1 ? this.carNum + 2 : this.carNum + 1;
|
||||
}
|
||||
const params = {
|
||||
goods_id_and_count: [
|
||||
{
|
||||
goods_id: item.goods_id,
|
||||
count: item.quantity,
|
||||
price: item.promotional_price,
|
||||
is_one_one: item.one_one,
|
||||
purchase_limit: item.purchase_limit,
|
||||
},
|
||||
],
|
||||
adver_id: item.adver_id
|
||||
}
|
||||
this.updateCar(params);
|
||||
},
|
||||
// 减少商品数量
|
||||
decreaseQuantity(index) {
|
||||
const item = this.goodsList[index]
|
||||
if (item.quantity > 0) {
|
||||
if (item.one_one === 1) {
|
||||
item.quantity = item.quantity - 2
|
||||
this.carNum = this.carNum - 2
|
||||
} else {
|
||||
item.quantity--;
|
||||
this.carNum--;
|
||||
}
|
||||
|
||||
const params = {
|
||||
goods_id_and_count: [
|
||||
{
|
||||
goods_id: item.goods_id,
|
||||
count: item.quantity,
|
||||
price: item.promotional_price,
|
||||
is_one_one: item.one_one,
|
||||
purchase_limit: item.purchase_limit,
|
||||
},
|
||||
],
|
||||
adver_id: item.adver_id
|
||||
}
|
||||
this.updateCar(params);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '已经没有了...',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
// 请求更改购物车接口
|
||||
async updateCar(params) {
|
||||
return request(shopApi.updateCar, "POST", params).then((res) => {
|
||||
this.getShopdetail();
|
||||
uni.showToast({
|
||||
title: "操作成功！",
|
||||
success() { },
|
||||
});
|
||||
});
|
||||
},
|
||||
// 跳转到购物车
|
||||
shopCar() {
|
||||
const item = {
|
||||
is_adver: 1,
|
||||
}
|
||||
NavgateTo("/packages/advertising/shopCar/index?item=" + JSON.stringify(item));
|
||||
},
|
||||
// 计算距离结束日期的剩余时间
|
||||
getEndTheCountdown(endTime) {
|
||||
// 获取当前时间和结束时间的时间戳
|
||||
const now = new Date().getTime();
|
||||
const end = new Date(endTime).getTime();
|
||||
|
||||
// 计算时间差（毫秒）
|
||||
let diff = end - now;
|
||||
|
||||
// 如果已经结束，返回提示
|
||||
if (diff <= 0) {
|
||||
return '团购已结束';
|
||||
}
|
||||
|
||||
// 计算天、小时、分钟
|
||||
const days = Math.floor(diff / (1000 * 60 * 60 * 24));
|
||||
diff -= days * (1000 * 60 * 60 * 24);
|
||||
|
||||
const hours = Math.floor(diff / (1000 * 60 * 60));
|
||||
diff -= hours * (1000 * 60 * 60);
|
||||
|
||||
const minutes = Math.floor(diff / (1000 * 60));
|
||||
diff -= minutes * (1000 * 60);
|
||||
|
||||
// 返回格式化的字符串
|
||||
return `${days}天${hours}小时${minutes}分钟后结束`;
|
||||
}
|
||||
},
|
||||
onHide() {
|
||||
// 清除定时器
|
||||
if (this.timer) {
|
||||
clearInterval(this.timer)
|
||||
this.timer = null
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,258 +0,0 @@
|
||||
.main {
|
||||
height: 77vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.searchBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
z-index: 2;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.searchBox_mid {
|
||||
font-size: 40rpx;
|
||||
color: #222222;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.searchBox_left {
|
||||
box-sizing: border-box;
|
||||
padding-left: 20rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.searchBox_right {
|
||||
opacity: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.isDay {
|
||||
position: absolute;
|
||||
|
||||
}
|
||||
|
||||
.tag {
|
||||
background-color: #ff7d00;
|
||||
color: white;
|
||||
font-size: 22rpx;
|
||||
padding: 5rpx 10rpx;
|
||||
border-radius: 20rpx 0 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.tag-img {
|
||||
position: absolute;
|
||||
/* top: 1; */
|
||||
bottom: 1;
|
||||
left: 10;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.is_day {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.empty {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
margin-top: 160rpx;
|
||||
}
|
||||
|
||||
.empty image {
|
||||
width: 500rpx;
|
||||
height: 500rpx;
|
||||
}
|
||||
|
||||
.empty div {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
margin-top: -40rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.deleteIcon {
|
||||
margin: 0 40rpx;
|
||||
box-sizing: border-box;
|
||||
margin-top: 36rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.goodsItem_supplier {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 20rpx;
|
||||
}
|
||||
|
||||
.goodsItem_tit {
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.goodsItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 20rpx;
|
||||
padding: 30rpx 0;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
}
|
||||
|
||||
.goodsItem_left {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 32rpx;
|
||||
}
|
||||
|
||||
.goodsItem_right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.goodsItem_msg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.goodsItem_msg_img {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right_msg_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 34rpx;
|
||||
color: #FF370B;
|
||||
margin-top: 26rpx;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right_tit {
|
||||
font-size: 30rpx;
|
||||
color: #000000;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right_subTit {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right_msg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.goodsItem_msg_right_msg_left span {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
|
||||
.goodsItem_msg_right_msg_right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.minus {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-width: 1px;
|
||||
border-color: #E6E6E6;
|
||||
border-style: solid;
|
||||
border-top-left-radius: 100px;
|
||||
border-top-right-radius: 100px;
|
||||
border-bottom-left-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.input {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.plus {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background-color: #FF0000;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.footer {
|
||||
width: 750rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 3rpx -3rpx 15rpx 0rpx rgba(255, 27, 27, 0.05);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding: 40rpx 20rpx;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.footer_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer_all {
|
||||
font-size: 28rpx;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer_all image {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.footer_total {
|
||||
font-weight: bold;
|
||||
font-size: 40rpx;
|
||||
color: #FF370B;
|
||||
margin-left: 90rpx;
|
||||
}
|
||||
|
||||
.footer_total span {
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.footer_right {
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
font-weight: 700;
|
||||
width: 230rpx;
|
||||
height: 70rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@ -1,778 +0,0 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="header">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_left" @click="back">
|
||||
<u-icon name="arrow-left" size="20px" color="#000"></u-icon>
|
||||
</view>
|
||||
<view class="searchBox_mid">购物车({{ shopCarTotal }})</view>
|
||||
<view class="searchBox_right">
|
||||
<u-icon name="arrow-left" size="20px" color="#000"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="empty" v-if="shopCarTotal == 0">
|
||||
<image src="https://static.hshuishang.com/shopCar_no.png"></image>
|
||||
</view>
|
||||
<view class="main" v-else>
|
||||
<view class="deleteIcon" @click="deleteItem">
|
||||
<u-icon name="trash" size="50rpx"></u-icon>
|
||||
</view>
|
||||
<view class="is_day " v-if="isDayshow">
|
||||
<view class="footer_all" @click="is_day_checked"
|
||||
style="color: orange; font-size: 35rpx; font-weight: bolder;">
|
||||
<image v-if="!isDaychecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="isDaychecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
当日达
|
||||
</view>
|
||||
<view class="goodsList">
|
||||
<view v-for="(carItem, carIndex) in isDayCarList" :key="carItem.id" :index="carIndex">
|
||||
<view class="goodsItem_supplier">
|
||||
<view class="goodsItem_left" @click="supplierCheck(carItem, true)">
|
||||
<image v-if="!carItem.supplierChecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="carItem.supplierChecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goodsItem_tit">
|
||||
{{ carItem.supplier_name }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="goodsItem" v-for="(item, index) in carItem.commodity_cart_and_goods_model"
|
||||
:key="item.id">
|
||||
<view class="goodsItem_left" @click="DayChecked(item)">
|
||||
<image v-if="!item.checked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="item.checked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goodsItem_right">
|
||||
<view class="goodsItem_msg">
|
||||
<view class="goodsItem_msg_img">
|
||||
<view class="tag tag-img">当日达</view>
|
||||
<image :src="picUrl + item.commodity_goods_info.commodity_pic">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goodsItem_msg_right">
|
||||
<view class="goodsItem_msg_right_tit">
|
||||
{{ item.commodity_goods_info.goods_name }}
|
||||
</view>
|
||||
<view class="goodsItem_msg_right_subTit">
|
||||
{{ item.commodity_goods_info.goods_intro }}
|
||||
</view>
|
||||
<view class="goodsItem_msg_right_msg">
|
||||
<view class="goodsItem_msg_right_msg_left">
|
||||
<span>￥</span>{{ item.price }}
|
||||
<!-- {{ item.commodity_goods_info.group_buy_price ?
|
||||
item.commodity_goods_info.group_buy_price :
|
||||
item.commodity_goods_info.sales_price }} -->
|
||||
<span>/{{ item.commodity_goods_info.goods_unit }}</span>
|
||||
</view>
|
||||
<view class="goodsItem_msg_right_msg_right">
|
||||
<u-number-box v-model="item.count" :asyncChange="true" min="0">
|
||||
<template #minus>
|
||||
<view class="minus"
|
||||
@click="minus(carItem, index, carItem.commodity_cart_and_goods_model)">
|
||||
<u-icon name="minus" size="32" bold></u-icon>
|
||||
</view>
|
||||
</template>
|
||||
<template #input><text style="width: 80rpx; text-align: center"
|
||||
class="input">{{ item.count }}</text>
|
||||
</template>
|
||||
<template #plus>
|
||||
<view class="plus" @click="add(carItem, index)">
|
||||
<u-icon name="plus" color="#FFFFFF" size="32" bold></u-icon>
|
||||
</view>
|
||||
</template>
|
||||
</u-number-box>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="is_day" v-if="parcelPostshow" style="margin-top: 20rpx;">
|
||||
<view class="footer_all" @click="parcel_post_checked"
|
||||
style="color: orange; font-size: 35rpx; font-weight: bolder;">
|
||||
<image v-if="!isParcelPostchecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="isParcelPostchecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
包邮
|
||||
</view>
|
||||
<view class="goodsList">
|
||||
<view v-for="(carItem, carIndex) in shopCarList" :key="carItem.id" :index="carIndex">
|
||||
<view class="goodsItem_supplier">
|
||||
<view class="goodsItem_left" @click="supplierCheck(carItem, false)">
|
||||
<image v-if="!carItem.supplierChecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="carItem.supplierChecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goodsItem_tit">
|
||||
{{ carItem.supplier_name }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="goodsItem" v-for="(item, index) in carItem.commodity_cart_and_goods_model"
|
||||
:key="item.id">
|
||||
<view class="goodsItem_left" @click="changeChecked(item)">
|
||||
<image v-if="!item.checked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="item.checked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goodsItem_right">
|
||||
<view class="goodsItem_msg">
|
||||
<view class="goodsItem_msg_img">
|
||||
<image :src="picUrl + item.commodity_goods_info.commodity_pic">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goodsItem_msg_right">
|
||||
<view class="goodsItem_msg_right_tit">
|
||||
{{ item.commodity_goods_info.goods_name }}
|
||||
</view>
|
||||
<view class="goodsItem_msg_right_subTit">
|
||||
{{ item.commodity_goods_info.goods_intro }}
|
||||
</view>
|
||||
<view class="goodsItem_msg_right_msg">
|
||||
<view class="goodsItem_msg_right_msg_left">
|
||||
<span>￥</span>{{ item.price }}
|
||||
<!-- {{ item.commodity_goods_info.group_buy_price ?
|
||||
item.commodity_goods_info.group_buy_price :
|
||||
item.commodity_goods_info.sales_price }} -->
|
||||
<span>/{{ item.commodity_goods_info.goods_unit }}</span>
|
||||
</view>
|
||||
<view class="goodsItem_msg_right_msg_right">
|
||||
<u-number-box v-model="item.count" :asyncChange="true" min="0">
|
||||
<template #minus>
|
||||
<view class="minus"
|
||||
@click="minus(item, index, carItem.commodity_cart_and_goods_model)">
|
||||
<u-icon name="minus" size="32" bold></u-icon>
|
||||
</view>
|
||||
</template>
|
||||
<template #input>
|
||||
<text style="width: 80rpx; text-align: center" class="input">{{
|
||||
item.count }}</text>
|
||||
</template>
|
||||
<template #plus>
|
||||
<view class="plus" @click="add(item, index)">
|
||||
<u-icon name="plus" color="#FFFFFF" size="32" bold></u-icon>
|
||||
</view>
|
||||
</template>
|
||||
</u-number-box>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="footer">
|
||||
<view class="footer_left">
|
||||
<view class="footer_all" @click="allChecked">
|
||||
<image v-if="!isAllchecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png">
|
||||
</image>
|
||||
<image v-if="isAllchecked"
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png">
|
||||
</image>
|
||||
全选
|
||||
</view>
|
||||
<view class="footer_total">
|
||||
<span>合计</span>
|
||||
￥{{ shopMoney }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer_right" @click="submitOrder">结算</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
apiArr
|
||||
} from "../../../api/shop";
|
||||
import {
|
||||
picUrl,
|
||||
menuButtonInfo,
|
||||
request,
|
||||
NavgateTo
|
||||
} from "../../../utils";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
picUrl,
|
||||
top: "",
|
||||
localHeight: "",
|
||||
value: 3,
|
||||
type: "error",
|
||||
shopCarList: [],
|
||||
isDayCarList: [],
|
||||
shopCarTotal: 0,
|
||||
shopMoney: 0,
|
||||
isAllchecked: false, // 全选
|
||||
isDaychecked: false, // 当日达
|
||||
isDayshow: false,
|
||||
isParcelPostchecked: false,
|
||||
parcelPostshow: false,
|
||||
is_group_buy: '',
|
||||
is_adver: ''
|
||||
};
|
||||
},
|
||||
// watch: {
|
||||
// // console.log(this.isDaychecked);
|
||||
// isDaychecked(e) {
|
||||
// console.log('当日达状态', e);
|
||||
// },
|
||||
// isParcelPostchecked(e) {
|
||||
// console.log('包邮状态', e);
|
||||
// }
|
||||
// isAllchecked(e) {
|
||||
// console.log('全选状态', e);
|
||||
// }
|
||||
// },
|
||||
methods: {
|
||||
back() {
|
||||
NavgateTo("1");
|
||||
},
|
||||
|
||||
// 商家单选框全选/取消全选
|
||||
supplierCheck(carItem, isDay) {
|
||||
carItem.supplierChecked = !carItem.supplierChecked;
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
goods.checked = carItem.supplierChecked;
|
||||
});
|
||||
this.calcTotal();
|
||||
|
||||
// 更新当日达或包邮全选状态
|
||||
if (isDay) {
|
||||
this.isDaychecked = this.isDayCarList.every(item =>
|
||||
item.commodity_cart_and_goods_model.every(goods => goods.checked)
|
||||
);
|
||||
} else {
|
||||
this.isParcelPostchecked = this.shopCarList.every(item =>
|
||||
item.commodity_cart_and_goods_model.every(goods => goods.checked)
|
||||
);
|
||||
}
|
||||
|
||||
// 更新全选状态
|
||||
this.isAllchecked = this.isDaychecked && this.isParcelPostchecked;
|
||||
},
|
||||
|
||||
// 结算
|
||||
submitOrder() {
|
||||
let arr = [];
|
||||
// 收集包邮购物车中选中的商品
|
||||
this.shopCarList.forEach((item) => {
|
||||
item.commodity_cart_and_goods_model.forEach((ite) => {
|
||||
if (ite.checked) {
|
||||
ite.supplier_name = item.supplier_name;
|
||||
arr.push(ite);
|
||||
}
|
||||
})
|
||||
});
|
||||
// 收集当日达购物车中选中的商品
|
||||
this.isDayCarList.forEach((item) => {
|
||||
item.commodity_cart_and_goods_model.forEach((ite) => {
|
||||
if (ite.checked) {
|
||||
ite.supplier_name = item.supplier_name;
|
||||
arr.push(ite);
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
if (arr.length == 0) {
|
||||
this.$u.toast("请选择商品");
|
||||
return;
|
||||
}
|
||||
// 给每个商品添加isAdver=true参数
|
||||
const updatedArr = arr.map(item => ({
|
||||
...item,
|
||||
isAdver: item.adver_id ? true : ''
|
||||
}));
|
||||
// NavgateTo(`../submitOrder/index?shopCarList=${JSON.stringify(arr)}`);
|
||||
NavgateTo(`../goodsSubmit/index?shopCarList=${JSON.stringify(updatedArr)}`);
|
||||
},
|
||||
|
||||
// 获取购物车列表
|
||||
getShopCar() {
|
||||
const params = {
|
||||
is_group_buy: this.is_group_buy,
|
||||
is_adver: this.is_adver
|
||||
}
|
||||
request(apiArr.getCar, "POST", params).then((res) => {
|
||||
if (res.normal_cart_list.length > 0) {
|
||||
res.normal_cart_list.forEach((item) => {
|
||||
item.checked = false;
|
||||
item.supplierChecked = false;
|
||||
})
|
||||
this.parcelPostshow = true;
|
||||
this.shopCarList = res.normal_cart_list
|
||||
} else {
|
||||
res.normal_cart_list.forEach((item) => {
|
||||
item.checked = false;
|
||||
item.supplierChecked = false;
|
||||
})
|
||||
this.parcelPostshow = false;
|
||||
this.shopCarList = []
|
||||
}
|
||||
|
||||
if (res.same_day_cart_list.length > 0) {
|
||||
res.same_day_cart_list.forEach((item) => {
|
||||
item.checked = false;
|
||||
item.supplierChecked = false;
|
||||
})
|
||||
this.isDayshow = true;
|
||||
this.isDayCarList = res.same_day_cart_list
|
||||
} else {
|
||||
res.normal_cart_list.forEach((item) => {
|
||||
item.checked = false;
|
||||
item.supplierChecked = false;
|
||||
})
|
||||
this.isDayshow = false;
|
||||
this.isDayCarList = []
|
||||
}
|
||||
|
||||
// res.normal_cart_list.forEach((item) => {
|
||||
// if (item.is_support_same_day == false) {
|
||||
// this.isDayshow = false;
|
||||
// this.parcelPostshow = true;
|
||||
// this.shopCarList = item.commodity_cart_and_goods_model;
|
||||
// item.checked = false;
|
||||
// } else {
|
||||
// this.isDayshow = true;
|
||||
// this.parcelPostshow = false;
|
||||
// this.isDayCarList = item.commodity_cart_and_goods_model;
|
||||
// item.checked = false;
|
||||
// }
|
||||
// });
|
||||
|
||||
this.shopCarTotal = res.total;
|
||||
});
|
||||
},
|
||||
|
||||
// 单个修改
|
||||
changeChecked(item) {
|
||||
item.checked = !item.checked;
|
||||
this.calcTotal();
|
||||
|
||||
// 找到对应的商家并更新商家选中状态
|
||||
this.shopCarList.forEach(carItem => {
|
||||
if (carItem.commodity_cart_and_goods_model.includes(item)) {
|
||||
carItem.supplierChecked = carItem.commodity_cart_and_goods_model.every(goods => goods.checked);
|
||||
}
|
||||
});
|
||||
|
||||
// 检查当日达是否全选
|
||||
this.isDaychecked = this.isDayCarList.every(carItem =>
|
||||
carItem.commodity_cart_and_goods_model.every(goods => goods.checked)
|
||||
);
|
||||
// 检查包邮是否全选
|
||||
this.isParcelPostchecked = this.shopCarList.every(carItem =>
|
||||
carItem.commodity_cart_and_goods_model.every(goods => goods.checked)
|
||||
);
|
||||
// 检查全选状态
|
||||
this.isAllchecked = this.isDaychecked && this.isParcelPostchecked;
|
||||
},
|
||||
DayChecked(item) {
|
||||
item.checked = !item.checked;
|
||||
this.calcTotal();
|
||||
|
||||
// 找到对应的商家并更新商家选中状态
|
||||
this.isDayCarList.forEach(carItem => {
|
||||
if (carItem.commodity_cart_and_goods_model.includes(item)) {
|
||||
carItem.supplierChecked = carItem.commodity_cart_and_goods_model.every(goods => goods.checked);
|
||||
}
|
||||
});
|
||||
|
||||
// 检查当日达是否全选
|
||||
this.isDaychecked = this.isDayCarList.every(carItem =>
|
||||
carItem.commodity_cart_and_goods_model.every(goods => goods.checked)
|
||||
);
|
||||
// 检查包邮是否全选
|
||||
this.isParcelPostchecked = this.shopCarList.every(carItem =>
|
||||
carItem.commodity_cart_and_goods_model.every(goods => goods.checked)
|
||||
);
|
||||
// 检查全选状态
|
||||
this.isAllchecked = this.isDaychecked && this.isParcelPostchecked;
|
||||
},
|
||||
// 全选
|
||||
allChecked() {
|
||||
this.isAllchecked = !this.isAllchecked;
|
||||
this.isDaychecked = this.isAllchecked;
|
||||
this.isParcelPostchecked = this.isAllchecked;
|
||||
|
||||
// 设置当日达购物车商品和商家选中状态
|
||||
this.isDayCarList.forEach(carItem => {
|
||||
carItem.supplierChecked = this.isAllchecked;
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
goods.checked = this.isAllchecked;
|
||||
});
|
||||
});
|
||||
|
||||
// 设置包邮购物车商品和商家选中状态
|
||||
this.shopCarList.forEach(carItem => {
|
||||
carItem.supplierChecked = this.isAllchecked;
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
goods.checked = this.isAllchecked;
|
||||
});
|
||||
});
|
||||
|
||||
this.calcTotal();
|
||||
},
|
||||
|
||||
// 全选当日达
|
||||
is_day_checked() {
|
||||
this.isDaychecked = !this.isDaychecked;
|
||||
|
||||
// 设置当日达购物车商品和商家选中状态
|
||||
this.isDayCarList.forEach(carItem => {
|
||||
carItem.supplierChecked = this.isDaychecked;
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
goods.checked = this.isDaychecked;
|
||||
});
|
||||
});
|
||||
|
||||
// 更新全选状态
|
||||
this.isAllchecked = this.isDaychecked && this.isParcelPostchecked;
|
||||
|
||||
this.calcTotal();
|
||||
},
|
||||
|
||||
// 全选包邮
|
||||
parcel_post_checked() {
|
||||
this.isParcelPostchecked = !this.isParcelPostchecked;
|
||||
|
||||
// 设置包邮购物车商品和商家选中状态
|
||||
this.shopCarList.forEach(carItem => {
|
||||
carItem.supplierChecked = this.isParcelPostchecked;
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
goods.checked = this.isParcelPostchecked;
|
||||
});
|
||||
});
|
||||
|
||||
// 更新全选状态
|
||||
this.isAllchecked = this.isDaychecked && this.isParcelPostchecked;
|
||||
|
||||
this.calcTotal();
|
||||
},
|
||||
|
||||
// 计算金额
|
||||
calcTotal() {
|
||||
let total = 0;
|
||||
const currentTime = new Date().getTime();
|
||||
|
||||
// 计算当日达购物车金额
|
||||
this.isDayCarList.forEach(carItem => {
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
if (goods.checked) {
|
||||
// // 团购活动时间判断
|
||||
// const startTime = new Date(goods.commodity_goods_info.group_buy_activity_info?.start_time).getTime();
|
||||
// const endTime = new Date(goods.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
// if (currentTime >= startTime && currentTime <= endTime) {
|
||||
// total += goods.commodity_goods_info.group_buy_price * goods.count;
|
||||
// } else {
|
||||
// total += goods.commodity_goods_info.sales_price * goods.count;
|
||||
// }
|
||||
total += goods.price * goods.count
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 计算包邮购物车金额
|
||||
this.shopCarList.forEach(carItem => {
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
if (goods.checked) {
|
||||
// // 团购活动时间判断
|
||||
// const startTime = new Date(goods.commodity_goods_info.group_buy_activity_info?.start_time).getTime();
|
||||
// const endTime = new Date(goods.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
// if (currentTime >= startTime && currentTime <= endTime) {
|
||||
// total += goods.commodity_goods_info.group_buy_price * goods.count;
|
||||
// } else {
|
||||
// total += goods.commodity_goods_info.sales_price * goods.count;
|
||||
// }
|
||||
|
||||
if (goods.is_one_one === 1) {
|
||||
total += goods.price * (goods.count / 2)
|
||||
} else {
|
||||
total += goods.price * goods.count
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.shopMoney = total.toFixed(2);
|
||||
},
|
||||
|
||||
// 减少数量
|
||||
// 删除商品的通用方法
|
||||
deleteCarItem(carItem, goodsIndex, item) {
|
||||
const that = this;
|
||||
request(apiArr.deleteCar, "POST", {
|
||||
ids: [carItem.id],
|
||||
goods_cate: 3,
|
||||
}).then((res) => {
|
||||
// 从商品列表中移除该商品
|
||||
item.splice(goodsIndex, 1);
|
||||
|
||||
// 如果商家没有商品了，移除该商家
|
||||
if (item.length === 0) {
|
||||
// 分别检查并移除当日达和普通购物车中的商家
|
||||
const dayCarIndex = that.isDayCarList.findIndex(dayItem =>
|
||||
dayItem.commodity_cart_and_goods_model === item
|
||||
);
|
||||
const normalCarIndex = that.shopCarList.findIndex(normalItem =>
|
||||
normalItem.commodity_cart_and_goods_model === item
|
||||
);
|
||||
|
||||
if (dayCarIndex !== -1) {
|
||||
that.isDayCarList.splice(dayCarIndex, 1);
|
||||
// 如果当日达购物车为空，更新显示状态
|
||||
if (that.isDayCarList.length === 0) {
|
||||
that.isDayshow = false;
|
||||
}
|
||||
}
|
||||
if (normalCarIndex !== -1) {
|
||||
that.shopCarList.splice(normalCarIndex, 1);
|
||||
// 如果普通购物车为空，更新显示状态
|
||||
if (that.shopCarList.length === 0) {
|
||||
that.parcelPostshow = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
that.calcTotal();
|
||||
}).catch(error => {
|
||||
console.error('删除商品失败:', error);
|
||||
uni.showToast({
|
||||
title: '删除失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
// 减少商品数量
|
||||
minus(carItem, goodsIndex, item) {
|
||||
const that = this;
|
||||
const currentTime = new Date().getTime();
|
||||
|
||||
// 检查商品是否有团购活动且在活动时间内
|
||||
const isGroupBuyActive = carItem.commodity_goods_info.group_buy_activity_info &&
|
||||
currentTime >= new Date(carItem.commodity_goods_info.group_buy_activity_info?.start_time).getTime() &&
|
||||
currentTime <= new Date(carItem.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
|
||||
if (carItem.count > 0) {
|
||||
if (isGroupBuyActive && carItem.count === carItem.commodity_goods_info.min_order_quantity) {
|
||||
// 团购商品达到最小购买数量，提示用户并删除商品
|
||||
uni.showToast({
|
||||
title: '最少购买' + carItem.commodity_goods_info.min_order_quantity + '件',
|
||||
icon: 'none'
|
||||
});
|
||||
// 更新购物车总数
|
||||
that.shopCarTotal = Math.max(0, that.shopCarTotal - carItem.commodity_goods_info.min_order_quantity);
|
||||
// 删除商品
|
||||
that.deleteCarItem(carItem, goodsIndex, item);
|
||||
} else {
|
||||
// 正常减少数量
|
||||
this.shopCarTotal = carItem.is_one_one === 1 ? Math.max(0, that.shopCarTotal - 2) : Math.max(0, that.shopCarTotal - 1);
|
||||
carItem.count = carItem.is_one_one === 1 ? carItem.count - 2 : carItem.count - 1;
|
||||
this.handleQuantityChange(carItem.count, carItem);
|
||||
|
||||
// 如果数量减为0，删除商品
|
||||
if (carItem.count === 0) {
|
||||
that.deleteCarItem(carItem, goodsIndex, item);
|
||||
} else {
|
||||
// 只在数量不为0时计算总价
|
||||
this.calcTotal();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 添加数量
|
||||
add(carItem, goodsIndex) {
|
||||
const currentTime = new Date().getTime();
|
||||
|
||||
const isGroupBuyActive = carItem.commodity_goods_info.group_buy_activity_info &&
|
||||
currentTime >= new Date(carItem.commodity_goods_info.group_buy_activity_info?.start_time).getTime() &&
|
||||
currentTime <= new Date(carItem.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
if (isGroupBuyActive) {
|
||||
if (carItem.count == 0) {
|
||||
carItem.count = carItem.is_one_one === 1 ? 2 : 1
|
||||
this.shopCarTotal += carItem.is_one_one === 1 ? 2 : 1;
|
||||
} else {
|
||||
if (carItem.count == carItem.purchase_limit) {
|
||||
uni.showToast({
|
||||
title: '您选择的数量已达到最大限购量',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
if (carItem.count == carItem.commodity_goods_info.max_limit_quantity) {
|
||||
uni.showToast({
|
||||
title: '一次最多购买' + carItem.commodity_goods_info.max_limit_quantity + '件',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
carItem.count += carItem.is_one_one === 1 ? 2 : 1;
|
||||
this.shopCarTotal += carItem.is_one_one === 1 ? 2 : 1;
|
||||
}
|
||||
} else {
|
||||
if (carItem.count >= carItem.purchase_limit) {
|
||||
uni.showToast({
|
||||
title: '您选择的数量已达到最大限购量',
|
||||
icon: 'none'
|
||||
});
|
||||
return
|
||||
}
|
||||
carItem.count += carItem.is_one_one === 1 ? 2 : 1;
|
||||
this.shopCarTotal += carItem.is_one_one === 1 ? 2 : 1;
|
||||
}
|
||||
|
||||
const item = carItem.commodity_cart_and_goods_model;
|
||||
this.handleQuantityChange(carItem.count, carItem);
|
||||
this.calcTotal();
|
||||
},
|
||||
|
||||
// 删除
|
||||
deleteItem() {
|
||||
let that = this;
|
||||
uni.showModal({
|
||||
title: "提示",
|
||||
content: "确定删除所选商品吗",
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
let ids = [];
|
||||
|
||||
// 收集当日达购物车中选中的商品ID
|
||||
that.isDayCarList.forEach(carItem => {
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
if (goods.checked) {
|
||||
ids.push(goods.id);
|
||||
goods.checked = false;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 收集包邮购物车中选中的商品ID
|
||||
that.shopCarList.forEach(carItem => {
|
||||
carItem.commodity_cart_and_goods_model.forEach(goods => {
|
||||
if (goods.checked) {
|
||||
ids.push(goods.id);
|
||||
goods.checked = false;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (ids.length === 0) {
|
||||
uni.showToast({
|
||||
title: "请选择要删除的商品",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
request(apiArr.deleteCar, "POST", {
|
||||
ids,
|
||||
goods_cate: 3,
|
||||
})
|
||||
.then((res) => {
|
||||
uni.showToast({
|
||||
title: "删除成功",
|
||||
duration: 2000,
|
||||
});
|
||||
that.getShopCar();
|
||||
that.calcTotal();
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
} else if (res.cancel) {
|
||||
console.log("用户点击取消");
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
//商品数量变化
|
||||
handleQuantityChange(val, item) {
|
||||
const params = {
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
goods_id_and_count: [{
|
||||
goods_id: item.goods_id,
|
||||
count: val,
|
||||
price: item.price,
|
||||
},],
|
||||
};
|
||||
request(apiArr.updateCar, "POST", params).then((res) => {
|
||||
console.log(res);
|
||||
uni.showToast({
|
||||
title: "操作成功！",
|
||||
success() { },
|
||||
});
|
||||
return Promise.resolve();
|
||||
});
|
||||
},
|
||||
//获取价格 - 该显示团购价还是正常价
|
||||
getPrice(item) {
|
||||
const currentTime = new Date().getTime();
|
||||
const startTime = new Date(item.commodity_goods_info.group_buy_activity_info?.start_time).getTime();
|
||||
const endTime = new Date(item.commodity_goods_info.group_buy_activity_info?.end_time).getTime();
|
||||
if (currentTime >= startTime && currentTime <= endTime) {
|
||||
return item.commodity_goods_info.group_buy_price;
|
||||
} else {
|
||||
return item.commodity_goods_info.sales_price;
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.is_group_buy = options.item ? JSON.parse(options.item).is_group_buy : ''
|
||||
this.is_adver = options.item ? JSON.parse(options.item).is_adver : ''
|
||||
this.getShopCar();
|
||||
},
|
||||
onShow() {
|
||||
this.getShopCar();
|
||||
// 取消所有选中状态并重置金额
|
||||
this.isAllchecked = false;
|
||||
this.isDaychecked = false;
|
||||
this.isParcelPostchecked = false;
|
||||
this.shopMoney = 0.00;
|
||||
},
|
||||
onReachBottom() { },
|
||||
|
||||
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -307,7 +307,7 @@ page {
|
||||
content: '';
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_active.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png);
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
|
||||
<div class="myRealEstate">
|
||||
<div class="myRealEstates">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_communityNav.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityNav.png" mode="aspectFill"></image>
|
||||
<div class="name">滏阳锦苑</div>
|
||||
<div class="Visitor">访客身份 点击立即入驻本社区</div>
|
||||
</div>
|
||||
@ -25,7 +25,7 @@
|
||||
<div class="ConList">
|
||||
<div class="ConItem" v-for="item in 3" @click="desc">
|
||||
<div class="ConItem_left">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_act2Img.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="ConItem_right">
|
||||
<div class="ConItem_right_tit">关于小区停车场治理通告</div>
|
||||
|
||||
@ -1,169 +1,153 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<div class="line"></div>
|
||||
<view class="main">
|
||||
<view class="table">
|
||||
<view class="label">房产</view>
|
||||
<view class="flexBox" @click="choseCommunity">
|
||||
<input
|
||||
type="text"
|
||||
v-model="changeComm"
|
||||
disabled
|
||||
placeholder="请选择房产"
|
||||
/>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">姓名</view>
|
||||
<input type="text" v-model="nameVal" placeholder="请输入姓名" />
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">手机</view>
|
||||
<input type="text" v-model="phoneVal" placeholder="请输入手机号" />
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">身份</view>
|
||||
<view class="container">
|
||||
<div class="line"></div>
|
||||
<view class="main">
|
||||
<view class="table">
|
||||
<view class="label">房产</view>
|
||||
<view class="flexBox" @click="choseCommunity">
|
||||
<input type="text" v-model="changeComm" disabled placeholder="请选择房产">
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">姓名</view>
|
||||
<input type="text" v-model="nameVal" placeholder="请输入姓名">
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">手机</view>
|
||||
<input type="text" v-model="phoneVal" placeholder="请输入手机号">
|
||||
</view>
|
||||
<view class="table">
|
||||
<view class="label">身份</view>
|
||||
|
||||
<view class="flexBox" @click="chooseIdentity">
|
||||
<input
|
||||
type="number"
|
||||
v-model="selectedLabel"
|
||||
disabled
|
||||
placeholder="请选择身份"
|
||||
/>
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="tip">
|
||||
<view class="flexBox" @click="chooseIdentity">
|
||||
<input type="number" v-model="selectedLabel" disabled placeholder="请选择身份">
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- <view class="tip">
|
||||
注意：业主为在物业登记在册的人员，需经过物业审 核确认后，即可成为该房产的业主。如需帮助可与物 业或平台联系。
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="btn" @click="headerSubmitClick">确定</view>
|
||||
</view>
|
||||
<view class="btn" @click="headerSubmitClick">确定</view>
|
||||
|
||||
<u-popup
|
||||
:show="show"
|
||||
@close="close"
|
||||
mode="bottom"
|
||||
customStyle="width: 500rpx;"
|
||||
round="20rpx"
|
||||
>
|
||||
<u-picker
|
||||
:show="show"
|
||||
:columns="columns"
|
||||
keyName="label"
|
||||
@cancel="close"
|
||||
@confirm="confirm"
|
||||
></u-picker>
|
||||
</u-popup>
|
||||
</view>
|
||||
<u-popup :show="show" @close="close" mode="bottom" customStyle="width: 500rpx;" round="20rpx">
|
||||
<u-picker :show="show" :columns="columns" keyName="label" @cancel="close" @confirm="confirm"></u-picker>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { request, NavgateTo, isPhone } from "../../../utils";
|
||||
import { apiArr } from "../../../api/community";
|
||||
export default {
|
||||
onBackPress(options) {
|
||||
console.log("from:" + options.from);
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
communityId: "",
|
||||
roomId: "",
|
||||
managementMobile: "",
|
||||
show: false,
|
||||
changeComm: "",
|
||||
columns: [
|
||||
[
|
||||
{
|
||||
label: "业主",
|
||||
value: "1",
|
||||
},
|
||||
{
|
||||
label: "家属",
|
||||
value: "2",
|
||||
},
|
||||
{
|
||||
label: "租客",
|
||||
value: "3",
|
||||
},
|
||||
{
|
||||
label: "访客",
|
||||
value: "4",
|
||||
},
|
||||
],
|
||||
],
|
||||
selectedValue: "",
|
||||
selectedLabel: "",
|
||||
nameVal: "",
|
||||
phoneVal: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
chooseIdentity() {
|
||||
this.show = true;
|
||||
console.log();
|
||||
},
|
||||
confirm(selected) {
|
||||
console.log(selected.value[0].value);
|
||||
this.selectedValue = selected.value[0].value;
|
||||
this.selectedLabel = selected.value[0].label;
|
||||
this.show = false;
|
||||
},
|
||||
headerCloseClick() {
|
||||
this.show = false;
|
||||
},
|
||||
import {
|
||||
request,
|
||||
NavgateTo,
|
||||
isPhone
|
||||
} from '../../../utils';
|
||||
import {
|
||||
apiArr
|
||||
} from '../../../api/community';
|
||||
export default {
|
||||
onBackPress(options) {
|
||||
console.log('from:' + options.from)
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
communityId: '',
|
||||
roomId: '',
|
||||
managementMobile: '',
|
||||
show: false,
|
||||
changeComm: '',
|
||||
columns: [
|
||||
[{
|
||||
label: "业主",
|
||||
value: "1"
|
||||
},
|
||||
{
|
||||
label: "家属",
|
||||
value: "2"
|
||||
},
|
||||
{
|
||||
label: "租客",
|
||||
value: "3"
|
||||
},
|
||||
{
|
||||
label: "访客",
|
||||
value: "4"
|
||||
},
|
||||
]
|
||||
],
|
||||
selectedValue: '',
|
||||
selectedLabel: '',
|
||||
nameVal: '',
|
||||
phoneVal: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
close() {
|
||||
this.show = false
|
||||
},
|
||||
chooseIdentity() {
|
||||
this.show = true
|
||||
console.log()
|
||||
},
|
||||
confirm(selected) {
|
||||
console.log(selected.value[0].value)
|
||||
this.selectedValue = selected.value[0].value
|
||||
this.selectedLabel = selected.value[0].label
|
||||
this.show = false
|
||||
},
|
||||
headerCloseClick() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
headerInputClick(e) {
|
||||
const { name } = e.currentTarget.dataset;
|
||||
const { value } = e.detail;
|
||||
this[name] = value;
|
||||
},
|
||||
async headerSubmitClick() {
|
||||
await request(apiArr.create, "POST", {
|
||||
community_id: parseInt(this.communityId),
|
||||
room_id: parseInt(this.roomId),
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
name: this.nameVal, // 姓名
|
||||
mobile: this.phoneVal, // 手机号
|
||||
type: parseInt(this.selectedValue), // 身份
|
||||
id_type: 1,
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
uni.showToast({
|
||||
title: "提交成功请等待物业审核！",
|
||||
icon: "none",
|
||||
duration: 1500,
|
||||
});
|
||||
// 提示显示后延迟跳转
|
||||
setTimeout(() => {
|
||||
NavgateTo("/packages/community/myCommunity/index");
|
||||
}, 1500);
|
||||
});
|
||||
},
|
||||
choseCommunity() {
|
||||
NavgateTo("/packages/community/choseCommunity/index");
|
||||
},
|
||||
},
|
||||
headerInputClick(e) {
|
||||
const {
|
||||
name
|
||||
} = e.currentTarget.dataset;
|
||||
const {
|
||||
value
|
||||
} = e.detail;
|
||||
this[name] = value;
|
||||
},
|
||||
async headerSubmitClick() {
|
||||
await request(apiArr.create, "POST", {
|
||||
community_id: parseInt(this.communityId),
|
||||
room_id: parseInt(this.roomId),
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
name: this.nameVal, // 姓名
|
||||
mobile: this.phoneVal, // 手机号
|
||||
type: parseInt(this.selectedValue), // 身份
|
||||
id_type: 1
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
uni.showToast({
|
||||
title: '创建成功',
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
NavgateTo("/packages/community/myCommunity/index")
|
||||
})
|
||||
},
|
||||
choseCommunity() {
|
||||
NavgateTo("/packages/community/choseCommunity/index")
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
console.log("接收到的参数:", options);
|
||||
this.communityId = options.community_id
|
||||
? decodeURIComponent(options.community_id)
|
||||
: "";
|
||||
this.roomId = options.room_id ? decodeURIComponent(options.room_id) : "";
|
||||
this.changeComm = options.changeVal
|
||||
? decodeURIComponent(options.changeVal)
|
||||
: "";
|
||||
},
|
||||
},
|
||||
|
||||
onReachBottom() {},
|
||||
};
|
||||
onLoad(options) {
|
||||
console.log("接收到的参数:", options);
|
||||
this.communityId = options.community_id ? decodeURIComponent(options.community_id) : ''
|
||||
this.roomId = options.room_id ? decodeURIComponent(options.room_id) : ''
|
||||
this.changeComm = options.changeVal ? decodeURIComponent(options.changeVal) : ''
|
||||
},
|
||||
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -3,7 +3,7 @@
|
||||
<view class="container">
|
||||
|
||||
<div class="userAva">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_MsgImg1.png" alt="" mode="aspectFill" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png" alt="" mode="aspectFill" />
|
||||
</div>
|
||||
<div class="Name">MarrekoZhang</div>
|
||||
|
||||
|
||||
@ -1,14 +1,14 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<div class="searchBox">
|
||||
<img src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png" alt="" />
|
||||
<img src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png" alt="" />
|
||||
<input placeholder="请输入小区名称" type="text">
|
||||
</div>
|
||||
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="(item, index) in 5" :key="index" @click="chooseCommunityInfo">
|
||||
<div class="communityItem_img">
|
||||
<img src="https://static.hshuishang.com/property-img-file/com_act2Img.png" alt="" />
|
||||
<img src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" alt="" />
|
||||
</div>
|
||||
|
||||
<div class="communityItem_msg">
|
||||
@ -21,8 +21,8 @@
|
||||
</div>
|
||||
|
||||
<div class="communityItem_msg_more">
|
||||
<img src="https://static.hshuishang.com/property-img-file/com_check1.png" alt="" />
|
||||
<!-- <img src="https://static.hshuishang.com/property-img-file/com_check2.png" alt="" /> -->
|
||||
<img src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check1.png" alt="" />
|
||||
<!-- <img src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check2.png" alt="" /> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<div class="communityList">
|
||||
<div class="communityItem">
|
||||
<div class="communityItem_img">
|
||||
<image mode="aspectFill" src="https://static.hshuishang.com/property-img-file/com_act2Img.png" alt="" />
|
||||
<image mode="aspectFill" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" alt="" />
|
||||
</div>
|
||||
|
||||
<div class="communityItem_msg">
|
||||
@ -20,7 +20,7 @@
|
||||
</div>
|
||||
|
||||
<div class="communityItem_msg_more">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_communityMore.png" alt="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityMore.png" alt="" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@ -98,7 +98,7 @@ image {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
/* background-color: #fff; */
|
||||
background-color: #fff;
|
||||
padding-bottom: 200rpx;
|
||||
margin-top: 20rpx;
|
||||
padding-top: 111rpx;
|
||||
@ -167,7 +167,7 @@ image {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_activeIcon.png) no-repeat;
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_activeIcon.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
@ -206,7 +206,7 @@ image {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_activeIcon.png) no-repeat;
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_activeIcon.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
@ -1,45 +1,42 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="currentAdd">
|
||||
<div class="currentAdd_left">{{ city.region }}</div>
|
||||
<div class="currentAdd_right" @click="changeAddress">
|
||||
切换城市
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_choseAddress.png"></image>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="currentAdd">
|
||||
<div class="currentAdd_left">{{city.region}}</div>
|
||||
<div class="currentAdd_right" @click="changeAddress">
|
||||
切换城市
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_choseAddress.png"></image>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="communityBox" v-if="step == 1">
|
||||
<div class="search">
|
||||
<input type="text" placeholder="请输入小区名称" v-model="communityName" />
|
||||
<image @click="searchByName"
|
||||
src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 1">
|
||||
<div class="search">
|
||||
<input type="text" placeholder="请输入小区名称" v-model="communityName">
|
||||
<image @click="searchByName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
|
||||
<!-- @click="chooseCommunity(item)" -->
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="item in communityList" :key="item.community_id" @click="nextStep(item)">
|
||||
<div class="communityItem_left">
|
||||
<div class="communityItem_tit">{{ item.name }}</div>
|
||||
<div class="communityItem_address">{{ item.addr }}</div>
|
||||
</div>
|
||||
<div class="communityItem_right">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_communityMore.png">
|
||||
</image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- @click="chooseCommunity(item)" -->
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="item in communityList" :key="item.community_id" @click="nextStep(item)">
|
||||
<div class="communityItem_left">
|
||||
<div class="communityItem_tit">{{item.name}}</div>
|
||||
<div class="communityItem_address">{{item.addr}}</div>
|
||||
</div>
|
||||
<div class="communityItem_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityMore.png"></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="communityList.length == 0">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的小区</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="!communityList">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的小区</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="communityBox" v-if="step == 2">
|
||||
<!-- <div class="communityBox" v-if="step == 2">
|
||||
<div class="search">
|
||||
<input type="text" placeholder="请输入楼栋名称">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
|
||||
<div class="floorList">
|
||||
@ -49,288 +46,240 @@
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="!foloorList">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_noSearch.png"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼栋</span>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="communityBox" v-if="step == 2">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼栋名称" />
|
||||
<image @click="searchName"
|
||||
src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 2">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼栋名称">
|
||||
<image @click="searchName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
|
||||
<div class="floorList">
|
||||
<div @click="nextStep(item, index)" :class="{ active: index === selectedFloorIndex }" class="floorItem"
|
||||
v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="floorList">
|
||||
<div @click="nextStep(item)" class="floorItem" v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼栋</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼栋</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="communityBox" v-if="step == 3">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼层名称" />
|
||||
<image @click="searchName"
|
||||
src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 3">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入楼层名称">
|
||||
<image @click="searchName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item, index, 'room')" :class="{ active2: index === selectedRoomIndex }" class="roomItem"
|
||||
v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item)" class="roomItem" v-for="(item,index) in filteredFloorsList" :key="index">
|
||||
{{item.label}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼层</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的楼层</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="communityBox" v-if="step == 4">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入房间名称" />
|
||||
<image @click="searchName"
|
||||
src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png">
|
||||
</image>
|
||||
</div>
|
||||
<div class="communityBox" v-if="step == 4">
|
||||
<div class="search">
|
||||
<input v-model="searchQuery" type="text" placeholder="请输入房间名称">
|
||||
<image @click="searchName" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"></image>
|
||||
</div>
|
||||
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item, index, 'room')" :class="{ active2: index === selectedFinalRoomIndex }" class="roomItem"
|
||||
v-for="(item, index) in filteredFloorsList" :key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="roomList">
|
||||
<!-- <div class="roomItem" v-for="(item,index) in 5" :class="index == 1?'active2':''"> -->
|
||||
<div @click="nextStep(item)" class="roomItem" v-for="(item,index) in filteredFloorsList" :key="index">
|
||||
{{item.label}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的房间</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="empty" v-if="filteredFloorsList.length === 0">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_noSearch.png"></image>
|
||||
<span>未找到相关信息的房间</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<areaPopup :show="show" @selectArea="selectArea" @close="close"></areaPopup>
|
||||
|
||||
<div class="dialogBox" v-if="dialogBoxShow">
|
||||
<div class="dialogBoxCon">
|
||||
<div class="dialogBoxCon1">确认选择</div>
|
||||
<div class="dialogBoxCon2">{{ cName }}</div>
|
||||
<div class="dialogBoxCon3">{{ facilityName + fName + rName }}</div>
|
||||
<div class="dialogBoxConBtnList">
|
||||
<div class="dialogBoxConBtnItem1" @click="dialogBoxShow = false">
|
||||
取消
|
||||
</div>
|
||||
<div class="dialogBoxConBtnItem2" @click="confirmComm">确定</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<areaPopup :show="show" @selectArea="selectArea" @close="close"></areaPopup>
|
||||
|
||||
<div class="dialogBox" v-if="dialogBoxShow">
|
||||
<div class="dialogBoxCon">
|
||||
<div class="dialogBoxCon1">确认选择</div>
|
||||
<div class="dialogBoxCon2">{{cName}}</div>
|
||||
<div class="dialogBoxCon3">{{facilityName + fName + rName}}</div>
|
||||
<div class="dialogBoxConBtnList">
|
||||
<div class="dialogBoxConBtnItem1" @click="dialogBoxShow = false">取消</div>
|
||||
<div class="dialogBoxConBtnItem2" @click="confirmComm">确定</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { apiArr } from "../../../api/community";
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo,
|
||||
} from "../../../utils";
|
||||
import {
|
||||
apiArr
|
||||
} from '../../../api/community';
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo
|
||||
} from '../../../utils';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectedFloorIndex: -1,
|
||||
selectedRoomIndex: -1,
|
||||
selectedFinalRoomIndex: -1, // 添加新的选中索引变量
|
||||
show: false,
|
||||
step: "1",
|
||||
communityName: "",
|
||||
cName: "",
|
||||
fName: "",
|
||||
communityId: "",
|
||||
communityList: [],
|
||||
facilityName: "",
|
||||
// foloorList: [],
|
||||
// floorsList: [],
|
||||
rName: "",
|
||||
roomId: "",
|
||||
// roomList: [],
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
dialogBoxShow: false,
|
||||
searchQuery: "",
|
||||
filteredFloorsList: [],
|
||||
searchList: [],
|
||||
city: uni.getStorageSync("location"),
|
||||
currentCommunity: "",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
changeAddress() {
|
||||
this.show = true;
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
selectArea(val) {
|
||||
console.log(val);
|
||||
this.city = {
|
||||
region: val.confirmDist.ad_name.split(",").join(""),
|
||||
...val.confirmDist,
|
||||
};
|
||||
// 切换城市后重置step为1
|
||||
this.step = "1";
|
||||
// 重置选中状态
|
||||
this.selectedFloorIndex = -1;
|
||||
this.selectedRoomIndex = -1;
|
||||
this.selectedFinalRoomIndex = -1;
|
||||
// 调用搜索方法加载对应城市的数据
|
||||
this.searchByName();
|
||||
this.show = false;
|
||||
},
|
||||
async searchByName() {
|
||||
console.log(this.communityName, "zzz");
|
||||
await request(apiArr.getAllList, "POST", {
|
||||
community_id: "",
|
||||
name: this.communityName,
|
||||
comm_code: "",
|
||||
ad_code: this.city.ad_code
|
||||
? this.city.ad_code
|
||||
: uni.getStorageSync("ad_code"),
|
||||
page_num: this.page_num,
|
||||
page_size: 9999,
|
||||
}).then((res) => {
|
||||
console.log(res.rows);
|
||||
this.communityList = res.rows;
|
||||
});
|
||||
},
|
||||
async nextStep(item, index, type = "") {
|
||||
if (type === "room") {
|
||||
// 根据当前步骤设置不同的选中索引
|
||||
if (this.step == 3) {
|
||||
this.selectedRoomIndex = index;
|
||||
} else if (this.step == 4) {
|
||||
this.selectedFinalRoomIndex = index;
|
||||
}
|
||||
} else {
|
||||
this.selectedFloorIndex = index;
|
||||
}
|
||||
this.communityId = item.community_id
|
||||
? item.community_id
|
||||
: this.communityId;
|
||||
this.facilityName = this.facilityName ? this.facilityName : item.label;
|
||||
this.fName =
|
||||
this.step == 4 ? this.fName : this.facilityName ? item.label : "";
|
||||
await request(apiArr.commRoomSelect, "POST", {
|
||||
community_ids: [item.community_id ? item.community_id : this.communityId],
|
||||
facility_names: this.facilityName ? [this.facilityName] : [],
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
step: "1",
|
||||
communityName: '',
|
||||
cName: '',
|
||||
fName: '',
|
||||
communityId: '',
|
||||
communityList: [],
|
||||
facilityName: '',
|
||||
// foloorList: [],
|
||||
// floorsList: [],
|
||||
rName: '',
|
||||
roomId: '',
|
||||
// roomList: [],
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
dialogBoxShow: false,
|
||||
searchQuery: '',
|
||||
filteredFloorsList: [],
|
||||
searchList: [],
|
||||
city: uni.getStorageSync('location'),
|
||||
currentCommunity:""
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeAddress() {
|
||||
this.show = true
|
||||
},
|
||||
close() {
|
||||
this.show = false
|
||||
},
|
||||
selectArea(val) {
|
||||
console.log(val);
|
||||
this.city = {
|
||||
region: val.confirmDist.ad_name.split(',').join(''),
|
||||
...val.confirmDist
|
||||
}
|
||||
this.searchByName();
|
||||
this.show = false
|
||||
},
|
||||
async searchByName() {
|
||||
console.log(this.communityName,'zzz')
|
||||
await request(apiArr.getAllList, "POST", {
|
||||
community_id: '',
|
||||
name: this.communityName,
|
||||
comm_code: '',
|
||||
ad_code: this.city.ad_code ? this.city.ad_code : uni.getStorageSync('ad_code'),
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size
|
||||
}).then(res => {
|
||||
console.log(res.rows)
|
||||
this.communityList = res.rows
|
||||
})
|
||||
},
|
||||
async nextStep(item) {
|
||||
this.communityId = item.community_id ? item.community_id : this.communityId;
|
||||
this.facilityName = this.facilityName ? this.facilityName : item.label;
|
||||
this.fName = this.step == 4 ? this.fName : (this.facilityName ? item.label : '')
|
||||
await request(apiArr.commRoomSelect, "POST", {
|
||||
community_ids: item.community_id ? item.community_id : this.communityId,
|
||||
facility_names: this.facilityName,
|
||||
floors: this.facilityName ? (this.facilityName == this.fName ? '' : item.label) : '',
|
||||
}).then(res => {
|
||||
this.filteredFloorsList = this.step == 4 ? this.filteredFloorsList : res.rows
|
||||
this.searchList = res.rows
|
||||
this.searchQuery = ''
|
||||
if (this.step == '1') {
|
||||
this.step = '2';
|
||||
this.cName = item.name;
|
||||
// this.foloorList = res.rows
|
||||
} else if (this.step == '2') {
|
||||
this.step = '3';
|
||||
// this.floorsList = res.rows
|
||||
} else if (this.step == '3') {
|
||||
console.log(item.label);
|
||||
this.fName = item.label;
|
||||
// this.roomList = res.rows
|
||||
this.step = '4';
|
||||
} else {
|
||||
this.dialogBoxShow = true;
|
||||
this.rName = item.label
|
||||
this.romId = item.value
|
||||
}
|
||||
})
|
||||
},
|
||||
searchName() {
|
||||
// 根据输入框内容进行模糊查询
|
||||
this.filteredFloorsList = this.searchList.filter(item =>
|
||||
item.label.includes(this.searchQuery)
|
||||
);
|
||||
},
|
||||
confirmComm() {
|
||||
const params = {
|
||||
changeVal: `${this.cName}${this.facilityName}${this.fName}${this.rName}`,
|
||||
community_id: this.communityId,
|
||||
room_id: this.romId
|
||||
};
|
||||
console.log(params)
|
||||
// 手动创建查询字符串
|
||||
function createQueryString(params) {
|
||||
return Object.keys(params)
|
||||
.map(key => `${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`)
|
||||
.join('&');
|
||||
}
|
||||
|
||||
floors: this.facilityName
|
||||
? this.facilityName == this.fName
|
||||
? ""
|
||||
: [item.label]
|
||||
: "",
|
||||
}).then((res) => {
|
||||
// 对楼层数据进行从大到小排序
|
||||
if (this.step != 4) {
|
||||
res.rows.sort((a, b) => {
|
||||
// 提取楼层数字
|
||||
const floorA = parseInt(a.label.replace(/[^\d]/g, ''));
|
||||
const floorB = parseInt(b.label.replace(/[^\d]/g, ''));
|
||||
return floorA - floorB;
|
||||
});
|
||||
}
|
||||
this.filteredFloorsList = this.step == 4 ? this.filteredFloorsList : res.rows;
|
||||
this.searchList = res.rows;
|
||||
this.searchQuery = "";
|
||||
if (this.step == "1") {
|
||||
this.step = "2";
|
||||
this.cName = item.name;
|
||||
// this.foloorList = res.rows
|
||||
} else if (this.step == "2") {
|
||||
this.step = "3";
|
||||
// this.floorsList = res.rows
|
||||
} else if (this.step == "3") {
|
||||
console.log(item.label);
|
||||
this.fName = item.label.includes("层") ? item.label : item.label + "层";
|
||||
// this.roomList = res.rows
|
||||
this.step = "4";
|
||||
} else {
|
||||
this.dialogBoxShow = true;
|
||||
this.rName = item.label;
|
||||
this.romId = item.value;
|
||||
}
|
||||
});
|
||||
},
|
||||
searchName() {
|
||||
// 根据输入框内容进行模糊查询
|
||||
this.filteredFloorsList = this.searchList.filter((item) =>
|
||||
item.label.includes(this.searchQuery)
|
||||
);
|
||||
},
|
||||
confirmComm() {
|
||||
const params = {
|
||||
changeVal: `${this.cName}${this.facilityName}${this.fName}${this.rName}`,
|
||||
community_id: this.communityId,
|
||||
room_id: this.romId,
|
||||
};
|
||||
console.log(params);
|
||||
// 手动创建查询字符串
|
||||
function createQueryString(params) {
|
||||
return Object.keys(params)
|
||||
.map(
|
||||
(key) =>
|
||||
`${encodeURIComponent(key)}=${encodeURIComponent(params[key])}`
|
||||
)
|
||||
.join("&");
|
||||
}
|
||||
// 拼接路径和参数
|
||||
const targetPath = "/packages/community/addCommunity/index";
|
||||
const queryString = createQueryString(params);
|
||||
const fullPath = `${targetPath}?${queryString}`;
|
||||
|
||||
// 拼接路径和参数
|
||||
const targetPath = "/packages/community/addCommunity/index";
|
||||
const queryString = createQueryString(params);
|
||||
const fullPath = `${targetPath}?${queryString}`;
|
||||
// 调用导航方法
|
||||
NavgateTo(fullPath);
|
||||
},
|
||||
|
||||
// 调用导航方法
|
||||
NavgateTo(fullPath);
|
||||
},
|
||||
//选择小区
|
||||
chooseCommunity(e){
|
||||
this.currentCommunity = e
|
||||
|
||||
this.getRoomSelect()
|
||||
},
|
||||
//选择楼栋
|
||||
getRoomSelect(){
|
||||
request(apiArr.commRoomSelect,"POST",{
|
||||
community_ids:this.currentCommunity.community_id,
|
||||
}).then(res=>{
|
||||
console.log(res);
|
||||
this.step = 2
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
//选择小区
|
||||
chooseCommunity(e) {
|
||||
this.currentCommunity = e;
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.searchByName()
|
||||
},
|
||||
|
||||
this.getRoomSelect();
|
||||
},
|
||||
//选择楼栋
|
||||
getRoomSelect() {
|
||||
request(apiArr.commRoomSelect, "POST", {
|
||||
community_ids: [this.currentCommunity.community_id],
|
||||
}).then((res) => {
|
||||
console.log(res);
|
||||
this.step = 2;
|
||||
});
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.searchByName();
|
||||
},
|
||||
|
||||
onReachBottom() { },
|
||||
};
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
|
||||
@ -378,17 +378,17 @@ page {
|
||||
}
|
||||
|
||||
.tabItem1 {
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_tabBg1.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_tabBg1.png);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.tabItem2 {
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_tabBg2.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_tabBg2.png);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.tabItem3 {
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_tabBg3.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_tabBg3.png);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
@ -470,7 +470,7 @@ page {
|
||||
content: '';
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_active.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png);
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
|
||||
@ -2,57 +2,57 @@
|
||||
<view class="container">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<img src="https://static.hshuishang.com/property-img-file/com_communityIcon.png" alt="" />
|
||||
<img src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityIcon.png" alt="" />
|
||||
我的房产
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<div class="myRealEstate">
|
||||
<div class="myRealEstates">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_communityNav.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityNav.png" mode="aspectFill"></image>
|
||||
<div class="name">滏阳锦苑</div>
|
||||
<div class="Visitor">访客身份 点击立即入驻本社区</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="Announcement">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_Announcement.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_Announcement.png" mode="aspectFill"></image>
|
||||
<div class="line"></div>
|
||||
<div class="msg" @click="notice">
|
||||
<div>asdasdasd</div>
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_more.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_more.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="navList">
|
||||
<div class="navItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_NavIcon1.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_NavIcon1.png" mode="aspectFill"></image>
|
||||
物业服务
|
||||
</div>
|
||||
|
||||
<div class="navItem" @click="repair">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_NavIcon2.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_NavIcon2.png" mode="aspectFill"></image>
|
||||
在线报修
|
||||
</div>
|
||||
|
||||
<div class="navItem" @click="propertyPayment">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_NavIcon3.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_NavIcon3.png" mode="aspectFill"></image>
|
||||
物业缴费
|
||||
</div>
|
||||
|
||||
<div class="navItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_NavIcon4.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_NavIcon4.png" mode="aspectFill"></image>
|
||||
物业公积
|
||||
</div>
|
||||
|
||||
<div class="navItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_NavIcon5.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_NavIcon5.png" mode="aspectFill"></image>
|
||||
社区管家
|
||||
</div>
|
||||
|
||||
<div class="navItem" @click="mores">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_NavIconMore.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_NavIconMore.png" mode="aspectFill"></image>
|
||||
更多
|
||||
</div>
|
||||
</div>
|
||||
@ -78,7 +78,7 @@
|
||||
|
||||
<div class="nearbyList">
|
||||
<div class="emptys" v-if="false">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyList_empty.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyList_empty.png" mode="aspectFill"></image>
|
||||
周边暂无补贴公积金商家
|
||||
|
||||
<div class="emptysBtn">
|
||||
@ -88,21 +88,21 @@
|
||||
|
||||
<div class="nearbyList_left">
|
||||
<div class="nearbyList_leftItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyImg1.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyImg1.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="nearbyList_leftItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyImg1.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyImg1.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
</div>
|
||||
<div class="nearbyList_right">
|
||||
<div class="nearbyList_rightItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyImg2.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyImg2.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="nearbyList_rightItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyImg2.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyImg2.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="nearbyList_rightItem">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyImg2.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyImg2.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -124,7 +124,7 @@
|
||||
|
||||
<div v-if="active == 0" class="act1">
|
||||
<div class="empty" >
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_empty.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_empty.png" mode="aspectFill"></image>
|
||||
暂无信息
|
||||
|
||||
<div class="emptyAdd">发布社区互动信息</div>
|
||||
@ -133,20 +133,20 @@
|
||||
<div class="MsgList_left" v-if="false">
|
||||
<div class="MsgList_leftItem">
|
||||
<div class="MsgList_leftItemImg">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_MsgImg1.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png" mode="widthFix"></image>
|
||||
</div>
|
||||
<div class="MsgList_leftItemName">我家的小猫丢了，谁看见了请联系我~</div>
|
||||
<div class="MsgList_leftItemMsg">
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_likeIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_comIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_comIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_shareIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shareIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
</div>
|
||||
@ -156,7 +156,7 @@
|
||||
<div class="MsgList_right" v-if="false">
|
||||
<div class="MsgList_rightItem">
|
||||
<div class="MsgList_rightItemImg">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_MsgImg2.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg2.png" mode="widthFix"></image>
|
||||
</div>
|
||||
|
||||
<div class="MsgList_rightItemName">
|
||||
@ -165,15 +165,15 @@
|
||||
|
||||
<div class="MsgList_leftItemMsg">
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_likeIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_comIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_comIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_shareIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shareIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
</div>
|
||||
@ -187,15 +187,15 @@
|
||||
|
||||
<div class="MsgList_leftItemMsg">
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_likeIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_likeIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_comIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_comIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
<div class="MsgList_leftItemMsg_like">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_shareIcon.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shareIcon.png" mode="aspectFill"></image>
|
||||
134
|
||||
</div>
|
||||
</div>
|
||||
@ -206,7 +206,7 @@
|
||||
<div v-if="active == 1" class="act2">
|
||||
|
||||
<div class="empty" >
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_empty.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_empty.png" mode="aspectFill"></image>
|
||||
暂无信息
|
||||
|
||||
<div class="emptyAdd">发布社区互动信息</div>
|
||||
@ -214,7 +214,7 @@
|
||||
|
||||
<div class="act2Item" v-for="itme in 3">
|
||||
<div class="act2Item_left">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_act2Img.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" mode="widthFix"></image>
|
||||
</div>
|
||||
<div class="act2Item_right">
|
||||
<div class="act2Item_right_Name">约1.7~2.3斤/份 【软糯甜香】新鲜水果 玉米</div>
|
||||
@ -224,7 +224,7 @@
|
||||
|
||||
<div class="act2Item_right_Btn">
|
||||
<div class="act2Item_right_Btn_left">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_act2Ms.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Ms.png" mode="widthFix"></image>
|
||||
￥
|
||||
<span>5.58</span>
|
||||
</div>
|
||||
@ -242,7 +242,7 @@
|
||||
<div v-if="active == 2" class="act2">
|
||||
|
||||
<div class="empty" >
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_empty.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_empty.png" mode="aspectFill"></image>
|
||||
暂无信息
|
||||
|
||||
<div class="emptyAdd">发布社区互动信息</div>
|
||||
@ -250,7 +250,7 @@
|
||||
|
||||
<div class="act2Item" v-for="itme in 3">
|
||||
<div class="act2Item_left">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_act2Img.png" mode="widthFix"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" mode="widthFix"></image>
|
||||
</div>
|
||||
<div class="act2Item_right">
|
||||
<div class="act2Item_right_Name">约1.7~2.3斤/份 【软糯甜香】新鲜水果 玉米</div>
|
||||
@ -278,7 +278,7 @@
|
||||
<div v-if="active == 3" class="act4">
|
||||
<div class="act4Item" v-for="itme in 4">
|
||||
<div class="act4Img">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_act2Img.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="act4Name">
|
||||
舒克小苏打牙膏（洁白细护）120G
|
||||
|
||||
@ -1,307 +0,0 @@
|
||||
page {
|
||||
background-color: #F6F6FA;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: calc(100vh - 120rpx);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.searchBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
/* margin-top: 35rpx; */
|
||||
justify-content: space-between;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.searchBox_add {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 400;
|
||||
font-size: 30rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.searchBox_add image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.myRealEstate {
|
||||
font-weight: 700;
|
||||
padding-top: 36rpx;
|
||||
font-weight: normal;
|
||||
font-size: 36rpx;
|
||||
color: #222222;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
padding-bottom: 27rpx;
|
||||
}
|
||||
|
||||
|
||||
.myRealEstate .btn {
|
||||
width: 600rpx;
|
||||
height: 90rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-weight: normal;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
font-weight: 700;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.nearby {
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
background-color: #fff;
|
||||
padding-top: 20rpx;
|
||||
box-sizing: border-box;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.nearbyTit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nearbyTit_left {
|
||||
font-size: 36rpx;
|
||||
color: #222222;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.nearbyTit_right {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nearbyTit_right image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
|
||||
.empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
margin-top: 110rpx;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.empty image {
|
||||
width: 366rpx;
|
||||
height: 226rpx;
|
||||
margin-bottom: 27rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.communityItem {
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
margin-top: 32rpx;
|
||||
}
|
||||
|
||||
.communityItem_msg {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.communityItem_Box {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.communityItem_Box_left {
|
||||
width: 180rpx;
|
||||
overflow: hidden;
|
||||
height: 180rpx;
|
||||
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.communityItem_Box_left image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.communityItem_Box_right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_tit {
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
|
||||
.communityItem_Box_right_com {
|
||||
font-size: 26rpx;
|
||||
color: #555555;
|
||||
margin-top: 8rpx;
|
||||
height: 72rpx;
|
||||
line-height: 36rpx;
|
||||
-webkit-line-clamp: 2;
|
||||
/* 限制显示 2 行 */
|
||||
-webkit-box-orient: vertical;
|
||||
/* 垂直排列 */
|
||||
overflow: hidden;
|
||||
/* 超出部分隐藏 */
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.communityItem_Box_right_msg {
|
||||
margin-top: 14rpx;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg_right {
|
||||
width: 140rpx;
|
||||
height: 40rpx;
|
||||
background: #FF370B;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg_left1 {
|
||||
width: 110rpx;
|
||||
height: 40rpx;
|
||||
background: rgba(255, 81, 42, 0.1);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 22rpx;
|
||||
color: #555555;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg_left1 image {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg_left2 {
|
||||
width: 110rpx;
|
||||
height: 40rpx;
|
||||
background: #FFF2DA;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 22rpx;
|
||||
color: #555555;
|
||||
}
|
||||
|
||||
.communityItem_Box_right_msg_left2 image {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.myRealEstateEmpty {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.myRealEstates {
|
||||
width: 710rpx;
|
||||
height: 200rpx;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.myRealEstates image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 50rpx;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.6);
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
padding-top: 24rpx;
|
||||
}
|
||||
|
||||
.Visitor {
|
||||
font-weight: normal;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
width: 380rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 52rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 30rpx;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||||
}
|
||||
|
||||
|
||||
.Tit {
|
||||
font-size: 40rpx;
|
||||
color: #222222;
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
|
||||
.subTit {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
text-align: center;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.Con{
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
line-height: 1.8;
|
||||
}
|
||||
@ -1,83 +0,0 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="Tit">{{ Info.title }}</view>
|
||||
<!-- <view class="subTit" v-if="Info.author || Info.publish_time">{{ Info.author }} {{ Info.publish_time }}</view>
|
||||
<view class="subTit" v-else>
|
||||
<text>发布时间：{{ new Date().toLocaleDateString() }}</text>
|
||||
</view> -->
|
||||
<view class="Con">
|
||||
<rich-text :nodes="Info.content"></rich-text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo
|
||||
} from '../../../utils';
|
||||
|
||||
// 引入数据文件
|
||||
import dataJson from '../index/data.json';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top: "",
|
||||
localHeight: "",
|
||||
id: "",
|
||||
Info: {},
|
||||
defaultNoticeList: dataJson.defaultNoticeList
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
// this.top = meun.height + meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.id = options.id;
|
||||
this.getInfo();
|
||||
},
|
||||
|
||||
|
||||
methods: {
|
||||
// 获取公告详情
|
||||
getInfo() {
|
||||
console.log("🚀 ~ getInfo ~ this.defaultNoticeList:", this.defaultNoticeList)
|
||||
// 从本地数据中查找对应ID的内容
|
||||
const detailData = this.defaultNoticeList.find(item => item.id === Number(this.id));
|
||||
console.log("🚀 ~ getInfo ~ detailData:", detailData)
|
||||
if (detailData) {
|
||||
// 复制数据以避免修改原始数据
|
||||
const info = { ...detailData };
|
||||
// 将换行符转换为HTML的<br>标签，确保rich-text正确渲染换行
|
||||
if (info.content) {
|
||||
info.content = info.content.replace(/\n/g, '<br>');
|
||||
}
|
||||
this.Info = info;
|
||||
}
|
||||
},
|
||||
back() {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,64 +0,0 @@
|
||||
{
|
||||
"defaultCategoryList": [
|
||||
{
|
||||
"id": 1,
|
||||
"category_name": "物业介绍"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"category_name": "物业缴费"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"category_name": "物业费"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"category_name": "报事报修"
|
||||
}
|
||||
],
|
||||
"defaultInfoList": [
|
||||
{
|
||||
"id": 1,
|
||||
"title": "物业介绍",
|
||||
"pic": "https://static.hshuishang.com/Group_3677.png"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"title": "物业缴费",
|
||||
"pic": "https://static.hshuishang.com/Group_3680.png"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"title": "物业费",
|
||||
"pic": "https://static.hshuishang.com/Group_3679.png"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"title": "报事报修",
|
||||
"pic": "https://static.hshuishang.com/Group_3678.png"
|
||||
}
|
||||
],
|
||||
"defaultNoticeList": [
|
||||
{
|
||||
"id": 1,
|
||||
"title": "物业介绍",
|
||||
"content": "您好！\n 物业服务中心是小区专属服务团队，核心服务包括：物业费收缴、公共区域清洁维护、设施设备(电梯/水电/绿化)检修、秩序安全管理，及应急事件响应、活动组织等日常事务。\n 我们始终以\"用心服务、共建美好\"为宗旨，欢迎大家监督并提出改进建议。感谢您的理解与配合，让我们携手维护舒心的园区环境！"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"title": "物业缴费",
|
||||
"content": "各位业主：\n 为简化缴费流程，提升服务效率，物业已上线\"线上+线下\"一体化缴费功能，支持物业费、车位费、公共能耗费等各类费用便捷缴纳，具体使用说明如下：\n一、线上缴费（推荐）\n 1. 小程序端操作：打开物业专属小程序，进入\"我的-物业缴费\"页面，系统将自动展示您需缴纳的费用账单（含费用类型、金额、缴费周期等明细）；确认账单无误后，选择微信支付，点击\"确认缴费\"即可完成。\n 2. 账单查询：在缴费页面点击\"缴费记录\"，可查看缴费明细（含缴费时间、金额、凭证号）。\n二、线下缴费（备用）\n若您偏好线下办理，可前往物业前台，通过现金、银行卡、移动支付（微信/支付宝扫码）完成缴费。"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"title": "物业费",
|
||||
"content": "各位业主：\n 上线\"物业费\"功能，其核心规则与使用方式如下，覆盖所有房产通用场景：\n一、物业费的获取方式\n 通过周边合作门店消费，即可获得物业费；\n二、跨房产通用：一份公积金，多房产可用\n 您的个人物业费不绑定单一房产，可通用至您已加入的所有房产。例如：您的个人公积金，既可抵扣A小区的物业费，也可抵扣您加入的B小区的水电费、C小区的燃气费，无需额外转移或申请。\n三、查询与透明化\n 在物业平台\"我的-物业费\"页面，可实时查看：个人公积金余额、所属房产的总额、抵扣记录（含抵扣房产、金额、个人扣除份额），确保每笔使用清晰可溯。"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"title": "报事报修",
|
||||
"content": "各位业主：\n 小程序\"报事报修\"功能，覆盖全物业类型通用场景，操作简单、响应高效，具体介绍如下：\n一、报修流程\n1、进入功能：打开物业小程序，点击\"报事报修\"图标，选择报修页面；\n2、填写信息：选择\"详细地址\"、\"报修类型\"（水电故障/家电维修/公共设施损坏等），补充问题描述（如\"厨房水龙头漏水\"\"办公室空调不制冷\"），可上传现场照片（便于维修人员预判问题）；\n3、提交确认：核对信息后点击\"提交报修\"，系统自动生成报修单号，同步推送至物业维修部。\n二、报修范围：室内水电、家电、门窗、厨卫设施维修等；\n三、进度追踪\n1、实时查进度：在\"我的报修\"页面，可查看报修单状态，维修人员接单后会主动联系确认上门时间；\n2、紧急情况（如水管爆裂、断电）可先拨打物业24小时热线，再补填在线报修单，确保问题快速解决！"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -1,41 +1,6 @@
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
padding: 0;
|
||||
padding-bottom: 120rpx;
|
||||
}
|
||||
|
||||
.empty {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 400rpx;
|
||||
}
|
||||
|
||||
.empty image {
|
||||
width: 340rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
|
||||
.emptyBtn {
|
||||
width: 400rpx;
|
||||
height: 80rpx;
|
||||
background-color: #ea030d;
|
||||
color: white;
|
||||
align-items: center;
|
||||
margin-top: 400rpx;
|
||||
}
|
||||
|
||||
.emptyBtn2 {
|
||||
width: 400rpx;
|
||||
height: 80rpx;
|
||||
background-color: white;
|
||||
color: #333;
|
||||
align-items: center;
|
||||
margin-top: 50rpx;
|
||||
border: 1rpx solid #333;
|
||||
}
|
||||
|
||||
swiper {
|
||||
@ -70,9 +35,8 @@ image {
|
||||
.emptyCommunity {
|
||||
font-size: 28rpx;
|
||||
color: #222222;
|
||||
width: auto;
|
||||
width: 200rpx;
|
||||
height: 44rpx;
|
||||
padding: 5rpx 15rpx;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
@ -107,18 +71,6 @@ image {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.swiperBox_no1 {
|
||||
height: 300rpx;
|
||||
width: 710rpx;
|
||||
position: relative;
|
||||
margin-top: 170rpx;
|
||||
margin: 170rpx auto 0;
|
||||
}
|
||||
|
||||
.swiperBox_no_img{
|
||||
border-radius: 15rpx;
|
||||
}
|
||||
|
||||
.swiperBox1 swiper {
|
||||
height: 100%;
|
||||
}
|
||||
@ -152,10 +104,6 @@ image {
|
||||
margin: 0 5rpx;
|
||||
}
|
||||
|
||||
.swiperBox2_img {
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
|
||||
.active {
|
||||
width: 26rpx;
|
||||
}
|
||||
@ -167,12 +115,6 @@ image {
|
||||
margin-top: -96rpx;
|
||||
}
|
||||
|
||||
.swiperBox_no2 {
|
||||
height: 150rpx;
|
||||
width: 710rpx;
|
||||
margin: 0 auto;;
|
||||
}
|
||||
|
||||
.funcList {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -202,8 +144,7 @@ image {
|
||||
margin: 0 auto;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.ads_first {
|
||||
.ads_first{
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
@ -215,15 +156,13 @@ image {
|
||||
height: 100rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tabItem {
|
||||
font-size: 30rpx;
|
||||
color: #222222;
|
||||
margin-right: 60rpx;
|
||||
white-space: nowrap;
|
||||
height: 42rpx;
|
||||
}
|
||||
|
||||
.active2 {
|
||||
@ -234,7 +173,7 @@ image {
|
||||
|
||||
.active2::after {
|
||||
content: '';
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_active.png) no-repeat;
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
@ -244,10 +183,6 @@ image {
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.newsList {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.newsItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -258,10 +193,6 @@ image {
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
}
|
||||
|
||||
.newsItem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.newsItem_left {
|
||||
flex: 1;
|
||||
}
|
||||
@ -289,7 +220,7 @@ image {
|
||||
color: #999999;
|
||||
text-align: center;
|
||||
background-color: #f6f6fa;
|
||||
/* padding: 40rpx; */
|
||||
padding: 40rpx;
|
||||
}
|
||||
|
||||
.bigAds {
|
||||
@ -374,8 +305,4 @@ image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.grid_Text {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
@ -1,208 +1,164 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- <view class="empty" v-if="communityList.length == 0">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_newEmpty.png" alt="" />
|
||||
<text>当前账户未绑定任何项目房源信息</text>
|
||||
<button class="emptyBtn" @click="addCommunity">新增房产绑定</button>
|
||||
</view> -->
|
||||
<div class="container">
|
||||
<div
|
||||
class="searchBox"
|
||||
:style="{ height: localHeight + 'px', paddingTop: top + 'px' }"
|
||||
>
|
||||
<div class="searchBox_add">
|
||||
<div class="emptyCommunity" @click="addCommunity">
|
||||
{{ communityVal }}
|
||||
</div>
|
||||
<!-- <div class="MyCommunity" v-if="false">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/community/community_mycommunity.png"
|
||||
mode="aspectFill"></image>
|
||||
<span>惠生活</span>
|
||||
<u-icon name="arrow-down" color="#999999" size="28"></u-icon>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view v-if="communityList.length == 0">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="emptyCommunity" @click="addCommunity">
|
||||
{{ communityVal }}
|
||||
</view>
|
||||
<div class="swiperBox1">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in bannerList"
|
||||
:key="index"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<view class="dot">
|
||||
<view
|
||||
:class="['dotItem', currentIdx == index ? 'active' : '']"
|
||||
v-for="(item, index) in bannerList"
|
||||
:key="index"
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="swiperBox_no1">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<image src="https://static.hshuishang.com/community_no_image1.png" mode="aspectFill"
|
||||
class="swiperBox_no_img" @click="addCommunity" />
|
||||
</swiper>
|
||||
<!-- <div class="dot">
|
||||
<div class="dotItem"></div>
|
||||
<div class="dotItem active"></div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<view class="dot">
|
||||
<view :class="['dotItem', currentIdx == index ? 'active' : '']" v-for="(item, index) in bannerList"
|
||||
:key="index">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="swiperBox2">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in streamerList"
|
||||
:key="index"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
|
||||
<view class="swiperBox_no2">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<image src="https://static.hshuishang.com/community_no_image2.png" mode="aspectFill"
|
||||
class="swiperBox_no_img" @click="addCommunity" />
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
<view class="funcList">
|
||||
<u-grid :col="5" :border="false">
|
||||
<u-grid-item v-for="(item, index) in noValFunctionList" @click="addCommunity" :key="index">
|
||||
<image class="grid_Pic" :src="item.nav_icon" mode=""></image>
|
||||
<text class="grid_Text">{{ item.nav_name }}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<view class="tabs" v-if="defaultCategoryList.length > 0">
|
||||
<view v-for="(item, index) in defaultCategoryList" :key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']" @click="selectTab(index, item)">
|
||||
{{ item.category_name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="newsList" v-if="defaultCategoryList.length > 0">
|
||||
<view class="newsItem" v-for="item in defaultInfoList" @click="defaultDetail(item)" :key="item.id">
|
||||
<view class="newsItem_left">
|
||||
<view class="newsItem_left_tit">{{ item.title }}</view>
|
||||
<view class="newsItem_left_sub">{{ item.author }}</view>
|
||||
</view>
|
||||
<view class="newsItem_right">
|
||||
<image :src="item.pic" mode="aspectFill" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <div class="funcList">
|
||||
<div class="funcItem" v-for="item in functionList" @click="jump(item.mini_program_url)">
|
||||
<image :src="item.nav_icon"></image>
|
||||
{{ item.nav_name }}
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<view class="funcList">
|
||||
<u-grid :col="rowNum" :border="false">
|
||||
<u-grid-item
|
||||
v-for="(item, index) in functionList"
|
||||
@click="jump(item.mini_program_url)"
|
||||
:key="index"
|
||||
>
|
||||
<image class="grid_Pic" :src="item.nav_icon" mode=""></image>
|
||||
<text>{{ item.nav_name }}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
<view v-else>
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="emptyCommunity" @click="addCommunity">
|
||||
{{ communityVal }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="swiperBox1" v-if="bannerList.length > 0">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in bannerList" :key="index" @click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<div
|
||||
v-for="(item, index) in tileList"
|
||||
:key="index"
|
||||
:class="['ads', index == 0 ? 'ads_first' : '']"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</div>
|
||||
|
||||
<view class="dot">
|
||||
<view :class="['dotItem', currentIdx == index ? 'active' : '']" v-for="(item, index) in bannerList"
|
||||
:key="index">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="tabs">
|
||||
<div
|
||||
v-for="(item, index) in categoryList"
|
||||
:key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']"
|
||||
@click="selectTab(index, item)"
|
||||
>
|
||||
{{ item.category_name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="swiperBox_no1" v-else>
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<image src="https://static.hshuishang.com/community_no_image1.png" mode="aspectFill"
|
||||
class="swiperBox_no_img" />
|
||||
</swiper>
|
||||
<div class="newsList">
|
||||
<div
|
||||
class="newsItem"
|
||||
v-for="item in infoList"
|
||||
@click="detail(item)"
|
||||
:key="item.id"
|
||||
>
|
||||
<div class="newsItem_left">
|
||||
<div class="newsItem_left_tit">{{ item.title }}</div>
|
||||
<div class="newsItem_left_sub">{{ item.author }}</div>
|
||||
</div>
|
||||
<div class="newsItem_right">
|
||||
<image :src="item.list_image" mode="aspectFill" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="dot">
|
||||
<view :class="['dotItem', currentIdx == index ? 'active' : '']" v-for="(item, index) in bannerList"
|
||||
:key="index">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="tips">下拉加载后续10条，共计30条</div>
|
||||
|
||||
<view class="swiperBox2" v-if="streamerList.length > 0">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in streamerList" :key="index" @click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" class="swiperBox2_img" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<div class="bigAds" v-if="ads1Show">
|
||||
<div class="bigAdsCon">
|
||||
<div class="bigAdsCon_img">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item
|
||||
v-for="(item, index) in largePopList"
|
||||
:key="index"
|
||||
@click="headerServerClick(item)"
|
||||
>
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
<div class="close" @click="closeAds">
|
||||
<image
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_close.png"
|
||||
>
|
||||
</image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="swiperBox_no2" v-else>
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<image src="https://static.hshuishang.com/community_no_image2.png" mode="aspectFill"
|
||||
class="swiperBox_no_img" />
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
<view class="funcList">
|
||||
<u-grid :col="rowNum" :border="false">
|
||||
<u-grid-item v-for="(item, index) in functionList" @click="jump(item.mini_program_url)" :key="index">
|
||||
<image class="grid_Pic" :src="item.nav_icon" mode=""></image>
|
||||
<text class="grid_Text">{{ item.nav_name }}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
|
||||
<view v-for="(item, index) in tileList" :key="index" :class="['ads', index == 0 ? 'ads_first' : '']"
|
||||
@click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</view>
|
||||
|
||||
<view class="tabs" v-if="categoryList.length > 0">
|
||||
<view v-for="(item, index) in categoryList" :key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']" @click="selectTab(index, item)">
|
||||
{{ item.category_name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="tabs" v-else>
|
||||
<view v-for="(item, index) in defaultCategoryList" :key="index"
|
||||
:class="['tabItem', selectedTab === index ? 'active2' : '']" @click="selectTab(index, item)">
|
||||
{{ item.category_name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="newsList" v-if="categoryList.length > 0">
|
||||
<view class="newsItem" v-for="item in infoList" @click="detail(item)" :key="item.id">
|
||||
<view class="newsItem_left">
|
||||
<view class="newsItem_left_tit">{{ item.title }}</view>
|
||||
<view class="newsItem_left_sub">{{ item.author }}</view>
|
||||
</view>
|
||||
<view class="newsItem_right">
|
||||
<image :src="item.list_image" mode="aspectFill" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="newsList" v-else>
|
||||
<view class="newsItem" v-for="item in defaultInfoList" @click="defaultDetail(item)" :key="item.id">
|
||||
<view class="newsItem_left">
|
||||
<view class="newsItem_left_tit">{{ item.title }}</view>
|
||||
<view class="newsItem_left_sub">{{ item.author }}</view>
|
||||
</view>
|
||||
<view class="newsItem_right">
|
||||
<image :src="item.pic" mode="aspectFill" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="tips">{{ loadMoreText }}</view>
|
||||
|
||||
<view class="bigAds" v-if="ads1Show">
|
||||
<view class="bigAdsCon">
|
||||
<view class="bigAdsCon_img">
|
||||
<swiper @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in largePopList" :key="index" @click="headerServerClick(item)">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="close" @click="closeAds">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_close.png">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bigAds" v-if="ads2Show">
|
||||
<view class="bigAdsCon2">
|
||||
<view class="bigAdsCon2_img">
|
||||
<swiper :current="currentSwiperIndex" @change="onSwiperChange" @animationfinish="swipers" autoplay circular>
|
||||
<swiper-item v-for="(item, index) in popList" :key="index">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="AdsBtnList">
|
||||
<view class="AdsBtnItem1" @click="closeAds2">取消</view>
|
||||
<view class="AdsBtnItem2" @click="onDetailClick">了解详情</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<nav-footer :current="3" />
|
||||
</view>
|
||||
<div class="bigAds" v-if="ads2Show">
|
||||
<div class="bigAdsCon2">
|
||||
<div class="bigAdsCon2_img">
|
||||
<swiper
|
||||
:current="currentSwiperIndex"
|
||||
@change="onSwiperChange"
|
||||
@animationfinish="swipers"
|
||||
autoplay
|
||||
circular
|
||||
>
|
||||
<swiper-item v-for="(item, index) in popList" :key="index">
|
||||
<image :src="item.ad_picture" mode="aspectFill" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</div>
|
||||
<div class="AdsBtnList">
|
||||
<div class="AdsBtnItem1" @click="closeAds2">取消</div>
|
||||
<div class="AdsBtnItem2" @click="onDetailClick">了解详情</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav-footer :current="1" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -215,10 +171,6 @@ import {
|
||||
} from "../../../utils";
|
||||
|
||||
import { apiArr } from "../../../api/v2Community";
|
||||
import { apiArr as apiArr2 } from "../../../api/community";
|
||||
|
||||
// 引入数据文件
|
||||
import dataJson from './data.json';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -234,50 +186,7 @@ export default {
|
||||
communityList: [],
|
||||
flag: false,
|
||||
|
||||
defaultFunctionList: [],
|
||||
functionList: [],
|
||||
noValFunctionList: [
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction1.png',
|
||||
nav_name: "物业介绍",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction2.png',
|
||||
nav_name: "物业缴费",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction3.png',
|
||||
nav_name: "物业费",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction1.png',
|
||||
nav_name: "物业报修",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction4.png',
|
||||
nav_name: "便民电话",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction5.png',
|
||||
nav_name: "人脸门禁",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction6.png',
|
||||
nav_name: "手机开门",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction7.png',
|
||||
nav_name: "物业活动",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction8.png',
|
||||
nav_name: "访客邀请",
|
||||
},
|
||||
{
|
||||
nav_icon: 'https://static.hshuishang.com/noValFunction10.png',
|
||||
nav_name: "场地预约",
|
||||
},
|
||||
],
|
||||
|
||||
ads1Show: false,
|
||||
ads2Show: false,
|
||||
@ -299,102 +208,22 @@ export default {
|
||||
page_size: 10,
|
||||
page_num: 1,
|
||||
flag: false,
|
||||
loadMoreText: "",
|
||||
|
||||
isShowBill: false,
|
||||
|
||||
houseVal: "",
|
||||
|
||||
// 从JSON文件中获取默认数据
|
||||
defaultCategoryList: dataJson.defaultCategoryList,
|
||||
defaultInfoList: dataJson.defaultInfoList,
|
||||
// 用于存储原始的defaultInfoList数据
|
||||
originalDefaultInfoList: null
|
||||
};
|
||||
},
|
||||
async onLoad(options) {
|
||||
if (options.item) {
|
||||
this.checkComm(JSON.parse(options.item));
|
||||
}
|
||||
},
|
||||
|
||||
onHide() {
|
||||
uni.removeStorageSync("is_me");
|
||||
},
|
||||
onUnload() {
|
||||
uni.removeStorageSync("is_me");
|
||||
},
|
||||
|
||||
async onShow() {
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.top;
|
||||
// this.top = meun.height + meun.top;
|
||||
this.localHeight = meun.height;
|
||||
this.defaultFunctionList = [
|
||||
{
|
||||
create_time: "",
|
||||
id: 4,
|
||||
is_published: 1,
|
||||
jump_target: 1,
|
||||
mini_program_url: "/packages/community/repairList/index",
|
||||
nav_icon: "https://static.hshuishang.com/noValFunction1.png",
|
||||
nav_name: "报事报修",
|
||||
other_appid: "",
|
||||
other_path: "",
|
||||
sort: 5,
|
||||
update_time: "",
|
||||
visible_communities: ""
|
||||
},
|
||||
{
|
||||
create_time: "",
|
||||
id: 5,
|
||||
is_published: 1,
|
||||
jump_target: 1,
|
||||
mini_program_url: "/packages/community/propertyPayment/index",
|
||||
nav_icon: "https://static.hshuishang.com/noValFunction2.png",
|
||||
nav_name: "物业缴费",
|
||||
other_appid: "",
|
||||
other_path: "",
|
||||
sort: 4,
|
||||
update_time: "",
|
||||
visible_communities: "",
|
||||
},
|
||||
{
|
||||
create_time: "",
|
||||
id: 7,
|
||||
is_published: 1,
|
||||
jump_target: 1,
|
||||
mini_program_url: "/packages/community/providentFund/index",
|
||||
nav_icon: "https://static.hshuishang.com/noValFunction3.png",
|
||||
nav_name: "物业费",
|
||||
other_appid: "",
|
||||
other_path: "",
|
||||
sort: 2,
|
||||
update_time: "",
|
||||
visible_communities: ""
|
||||
}
|
||||
|
||||
]
|
||||
const isMe = uni.getStorageSync("is_me");
|
||||
// 当is_me不存在或为true时执行，存在且为false时不执行
|
||||
if (isMe === true || isMe === undefined || isMe === null || isMe === '') {
|
||||
await this.getCommunityList();
|
||||
// this.getCommunityList()
|
||||
if (!uni.getStorageSync("changeCommData").id) {
|
||||
uni.setStorageSync("changeCommData", { name: "森呼吸二期", id: 14 });
|
||||
}
|
||||
|
||||
this.communityVal = uni.getStorageSync("changeCommData").name;
|
||||
this.getfunctionNum();
|
||||
this.getAdvertising();
|
||||
this.getCategoryList();
|
||||
|
||||
// 初始化默认数据，确保在没有绑定社区时选中第一个分类
|
||||
setTimeout(() => {
|
||||
if (this.categoryList.length === 0 && this.defaultCategoryList.length > 0) {
|
||||
this.selectedTab = 0;
|
||||
if (!this.originalDefaultInfoList) {
|
||||
this.originalDefaultInfoList = JSON.parse(JSON.stringify(dataJson.defaultInfoList));
|
||||
}
|
||||
// 默认选中第一个分类并展示对应数据
|
||||
this.defaultInfoList = this.originalDefaultInfoList.filter(info => info.id === this.defaultCategoryList[0].id);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
|
||||
//上拉刷新
|
||||
@ -419,10 +248,7 @@ export default {
|
||||
onReachBottom() {
|
||||
if (this.flag) {
|
||||
this.page_num++;
|
||||
const currentItem = this.categoryList[this.selectedTab];
|
||||
if (currentItem) {
|
||||
this.selectTab(this.selectedTab, currentItem);
|
||||
}
|
||||
this.getCategoryList();
|
||||
}
|
||||
},
|
||||
|
||||
@ -430,84 +256,20 @@ export default {
|
||||
// desc() {
|
||||
// NavgateTo("../communityDetail/index")
|
||||
// },
|
||||
checkComm(item) {
|
||||
if (uni.getStorageSync("is_me")) {
|
||||
uni.setStorageSync("changeCommData", { name: item.name, id: item.community_id })
|
||||
} else {
|
||||
this.communityList = []
|
||||
this.communityVal = item.name;
|
||||
}
|
||||
},
|
||||
async getCommunityList() {
|
||||
await request(apiArr2.commInfo, "POST", {
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
longitude: uni.getStorageSync("location").lng,
|
||||
latitude: uni.getStorageSync("location").lat,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
}).then((res) => {
|
||||
if (res.rows.length == 0) {
|
||||
uni.removeStorageSync("changeCommData");
|
||||
return;
|
||||
}
|
||||
|
||||
const targetItem = res.rows.find((item) => {
|
||||
return item.community_id == uni.getStorageSync("changeCommData").id;
|
||||
});
|
||||
|
||||
if (targetItem) {
|
||||
//是否跳转物业缴费
|
||||
this.isShowBill = targetItem.bill_front_end_display == 1;
|
||||
//小区是否隐藏
|
||||
if (targetItem.front_end_display == 1) {
|
||||
uni.removeStorageSync("changeCommData");
|
||||
}
|
||||
} else {
|
||||
uni.removeStorageSync("changeCommData");
|
||||
}
|
||||
|
||||
res.rows = res.rows.filter((item) => {
|
||||
return item.front_end_display != 1;
|
||||
});
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
uni.setStorageSync("changeCommData", { name: res.rows[0].name, id: res.rows[0].community_id })
|
||||
}
|
||||
this.communityList = res.rows;
|
||||
});
|
||||
if (this.communityList.length == 0) {
|
||||
this.communityVal = "添加我的房产";
|
||||
} else {
|
||||
this.communityVal = uni.getStorageSync("changeCommData").name;
|
||||
}
|
||||
},
|
||||
apply() {
|
||||
NavgateTo("../applyOwer/index");
|
||||
},
|
||||
closeAds() {
|
||||
this.ads1Show = false;
|
||||
// 记录用户已关闭过弹窗1
|
||||
uni.setStorageSync('ads1Showed', true);
|
||||
},
|
||||
closeAds2() {
|
||||
this.ads2Show = false;
|
||||
// 记录用户已关闭过弹窗2
|
||||
uni.setStorageSync('ads2Showed', true);
|
||||
},
|
||||
jump(e) {
|
||||
if (!e) {
|
||||
this.NotOpen();
|
||||
return;
|
||||
}
|
||||
if (
|
||||
e == "/packages/community/propertyPayment/index" &&
|
||||
!this.isShowBill
|
||||
) {
|
||||
uni.showToast({
|
||||
title: "请配置账单",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
NavgateTo(e);
|
||||
},
|
||||
|
||||
@ -521,7 +283,6 @@ export default {
|
||||
},
|
||||
|
||||
async getfunctionNum() {
|
||||
this.functionList = this.defaultFunctionList;
|
||||
const res = await request(
|
||||
apiArr.commInfo,
|
||||
"POST",
|
||||
@ -536,9 +297,6 @@ export default {
|
||||
},
|
||||
|
||||
async getfunctionList() {
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
return;
|
||||
}
|
||||
const res = await request(apiArr.navPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
page_num: 1,
|
||||
@ -547,30 +305,19 @@ export default {
|
||||
console.log(res, "xx");
|
||||
|
||||
// 获取 rowNum 和 colNum 的乘积
|
||||
const totalItems = this.rowNum * this.colNum - 3;
|
||||
// 截取前 totalItems 个元素
|
||||
const newItems = res.rows.slice(0, totalItems).map((item) => {
|
||||
const totalItems = this.rowNum * this.colNum;
|
||||
// 使用 slice 方法截取前 totalItems 个元素
|
||||
this.functionList = res.rows.slice(0, totalItems).map((item) => {
|
||||
return {
|
||||
...item,
|
||||
nav_icon: picUrl + item.nav_icon,
|
||||
};
|
||||
});
|
||||
|
||||
// 根据nav_name判断是否已存在，不存在则添加
|
||||
newItems.forEach(newItem => {
|
||||
const exists = this.functionList.some(existingItem =>
|
||||
existingItem.nav_name === newItem.nav_name
|
||||
);
|
||||
if (!exists) {
|
||||
this.functionList.push(newItem);
|
||||
}
|
||||
});
|
||||
console.log("functionList", this.functionList);
|
||||
},
|
||||
|
||||
async getAdvertising() {
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
return;
|
||||
}
|
||||
const res = await request(apiArr.advPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
ad_position: 1,
|
||||
@ -622,9 +369,7 @@ export default {
|
||||
ad_picture: picUrl + item.ad_picture,
|
||||
};
|
||||
});
|
||||
// 检查用户是否已关闭过弹窗1，只有当没有关闭过且有广告数据时才显示
|
||||
const ads1Showed = uni.getStorageSync('ads1Showed');
|
||||
this.ads1Show = !ads1Showed && res4.rows.length !== 0 ? true : false;
|
||||
this.ads1Show = res4.rows.length !== 0 ? true : false;
|
||||
|
||||
const res5 = await request(apiArr.advPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
@ -638,34 +383,31 @@ export default {
|
||||
ad_picture: picUrl + item.ad_picture,
|
||||
};
|
||||
});
|
||||
// 检查用户是否已关闭过弹窗2，只有当没有关闭过且有广告数据时才显示
|
||||
const ads2Showed = uni.getStorageSync('ads2Showed');
|
||||
this.ads2Show = !ads2Showed && res5.rows.length !== 0 ? true : false;
|
||||
this.ads2Show = res5.rows.length !== 0 ? true : false;
|
||||
},
|
||||
|
||||
headerServerClick(e) {
|
||||
console.log("当前点击内容", e);
|
||||
if (!e.target_page) {
|
||||
if (!e.link_url) {
|
||||
this.NotOpen();
|
||||
return;
|
||||
}
|
||||
if (e.target_page) {
|
||||
if (e.link_url) {
|
||||
// #ifdef APP-PLUS
|
||||
uni.navigateTo({
|
||||
url:
|
||||
"/pages/webview/webview?url=" + encodeURIComponent(e.target_page),
|
||||
url: "/pages/webview/webview?url=" + encodeURIComponent(e.link_url),
|
||||
});
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
window.open(e.target_page, "_blank");
|
||||
window.open(e.link_url, "_blank");
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN || MP-ALIPAY || MP-BAIDU
|
||||
if (e.appid) {
|
||||
uni.navigateToMiniProgram({
|
||||
appId: e.appid,
|
||||
path: e.target_page,
|
||||
path: e.link_url,
|
||||
//需要传递给目标小程序的数据
|
||||
extraData: {
|
||||
data1: "test",
|
||||
@ -675,23 +417,18 @@ export default {
|
||||
},
|
||||
});
|
||||
} else {
|
||||
// 确保路径是绝对路径
|
||||
let targetPage = e.target_page;
|
||||
if (!targetPage.startsWith("/")) {
|
||||
targetPage = "/" + targetPage;
|
||||
}
|
||||
NavgateTo(targetPage);
|
||||
NavgateTo(e.link_url);
|
||||
// NavgateTo('/packages/localLife/index/index')
|
||||
}
|
||||
// 小程序中可能需要用户手动复制链接或使用web-view
|
||||
// uni.showModal({
|
||||
// title: '提示',
|
||||
// content: '即将打开外部链接，请复制后在浏览器中打开: ' + e.target_page,
|
||||
// content: '即将打开外部链接，请复制后在浏览器中打开: ' + e.link_url,
|
||||
// confirmText: '复制链接',
|
||||
// success(res) {
|
||||
// if (res.confirm) {
|
||||
// uni.setClipboardData({
|
||||
// data: e.target_page,
|
||||
// data: e.link_url,
|
||||
// success() {
|
||||
// uni.showToast({
|
||||
// title: '复制成功',
|
||||
@ -732,9 +469,6 @@ export default {
|
||||
},
|
||||
|
||||
async getCategoryList() {
|
||||
if (!uni.getStorageSync("changeCommData")) {
|
||||
return;
|
||||
}
|
||||
const res = await request(apiArr.categoryPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
category_code: "",
|
||||
@ -747,85 +481,36 @@ export default {
|
||||
},
|
||||
|
||||
async selectTab(index, item) {
|
||||
// 检查是否使用的是默认数据（没有绑定社区时）
|
||||
if (this.categoryList.length === 0) {
|
||||
this.selectedTab = index;
|
||||
if (!this.originalDefaultInfoList) {
|
||||
this.originalDefaultInfoList = JSON.parse(JSON.stringify(dataJson.defaultInfoList));
|
||||
}
|
||||
|
||||
// 根据选中的分类ID筛选数据
|
||||
this.defaultInfoList = this.originalDefaultInfoList.filter(info => info?.id === item?.id);
|
||||
return;
|
||||
}
|
||||
|
||||
// 原有逻辑（有绑定社区时）
|
||||
const isTabChange = this.selectedTab !== index;
|
||||
if (isTabChange) {
|
||||
this.page_num = 1;
|
||||
this.infoList = [];
|
||||
}
|
||||
this.selectedTab = index;
|
||||
|
||||
// 如果不是切换tab，且已经没有更多数据，且已有数据，则不发送请求
|
||||
if (!isTabChange && !this.flag && this.infoList.length > 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("选中的tab:", index);
|
||||
const res = await request(apiArr.infoPage, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
announcement_category_id: item?.id,
|
||||
announcement_category_id: item.id,
|
||||
title: "",
|
||||
category_name: "",
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
|
||||
// 处理数据
|
||||
const newData = res.rows.map((item) => ({
|
||||
...item,
|
||||
list_image: picUrl + item.list_image,
|
||||
}));
|
||||
|
||||
// 判断是否还有更多数据
|
||||
const hasMore = res.rows.length === this.page_size;
|
||||
// 限制最多3页
|
||||
this.flag = hasMore;
|
||||
|
||||
// 检查数据是否重复
|
||||
const isDataDuplicate =
|
||||
!isTabChange &&
|
||||
this.infoList.length > 0 &&
|
||||
newData.length > 0 &&
|
||||
this.infoList[this.infoList.length - 1].id === newData[0].id;
|
||||
|
||||
// 更新数据
|
||||
if (isTabChange) {
|
||||
this.infoList = newData;
|
||||
} else if (!isDataDuplicate) {
|
||||
this.infoList = this.infoList.concat(newData);
|
||||
}
|
||||
|
||||
// 更新提示文本
|
||||
if (this.infoList.length > 10 && !hasMore) {
|
||||
uni.showToast({
|
||||
title: "没有更多了",
|
||||
icon: "none",
|
||||
});
|
||||
if (res.rows && res.rows.length == this.page_size) {
|
||||
this.flag = true;
|
||||
} else {
|
||||
// this.loadMoreText = `下拉加载后续10条`;
|
||||
this.flag = false;
|
||||
}
|
||||
res.rows = res.rows.map((item) => {
|
||||
return {
|
||||
...item,
|
||||
list_image: picUrl + item.list_image,
|
||||
};
|
||||
});
|
||||
this.infoList.splice(0, this.infoList.length);
|
||||
|
||||
this.infoList = this.infoList.concat(res.rows);
|
||||
},
|
||||
|
||||
detail(e) {
|
||||
console.log(e);
|
||||
NavgateTo("../noticeDesc/index?id=" + e.id);
|
||||
},
|
||||
|
||||
defaultDetail(e) {
|
||||
console.log(e);
|
||||
NavgateTo("../defaultNotice/index?id=" + e.id);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1,150 +0,0 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
page {
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
.top{
|
||||
height: 300rpx;
|
||||
width: 100%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.top image {
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.community-list-container {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.community-list {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.community-item-box {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.community-item {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.community-image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
margin-right: 30rpx;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.community-image image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.community-info {
|
||||
min-height: 200rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.community-name {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
|
||||
.community-property {
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
line-height: 40rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.community-distance {
|
||||
display: inline-block;
|
||||
border: 1rpx solid #5ba6ec;
|
||||
color: #5ba6ec;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
padding: 5rpx 15rpx;
|
||||
border-radius: 15rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.community-buttons {
|
||||
display: flex;
|
||||
gap: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.community-action-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #f0f2f5;
|
||||
border-radius: 24rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.btn-icon {
|
||||
margin-right: 6rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
|
||||
.btn-text {
|
||||
font-size: 24rpx;
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
#local {
|
||||
height: 30rpx;
|
||||
width: 28.08rpx;
|
||||
margin-right: 17rpx;
|
||||
}
|
||||
|
||||
.community-address {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
line-height: 36rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.community-address-text {
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.enter-btn {
|
||||
width: 120rpx;
|
||||
height: 40rpx;
|
||||
background: #7bc327;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
border-radius: 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
bottom: 5rpx;
|
||||
right: 0rpx;
|
||||
}
|
||||
@ -1,401 +0,0 @@
|
||||
<template>
|
||||
<view class="community-list-container">
|
||||
<view class="top">
|
||||
<image src="https://static.hshuishang.com/communityTopImg.png" mode=""></image>
|
||||
</view>
|
||||
<view class="community-list">
|
||||
<view class="community-item-box" v-for="(item, index) in communityList" :key="index">
|
||||
<view class="community-item">
|
||||
<view class="community-image" @tap="enterCommunity(item)">
|
||||
<!-- 使用默认图片作为 fallback -->
|
||||
<image :src="item.pic || defaultCommunityImage" mode="aspectFill"
|
||||
@error="handleImageError(item)"></image>
|
||||
</view>
|
||||
<view class="community-info">
|
||||
<view class="community-name" @tap="enterCommunity(item)">{{ item.name }}</view>
|
||||
<view class="community-property">物业公司：{{ item.property || '-' }}</view>
|
||||
<view class="community-distance">距我当前：{{ item.distance || '未知' }}</view>
|
||||
<view class="community-buttons">
|
||||
<view class="community-action-btn" @tap="navigate(item)">
|
||||
<uni-icons type="paperplane-filled" size="18"></uni-icons>
|
||||
<text class="btn-text">导航</text>
|
||||
</view>
|
||||
<view class="community-action-btn" @tap="callPhone(item)" v-if="item.property_server_phone">
|
||||
<uni-icons type="phone-filled" size="18"></uni-icons>
|
||||
<view class="btn-text">电话</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="item.isShow" class="enter-btn" @tap="enterCommunity(item)">进入小区</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="community-address">
|
||||
<image id="local"
|
||||
src="https://static.hshuishang.com/property-img-file/local_localIcon.png"
|
||||
mode="aspectFill"></image>
|
||||
<view class="community-address-text">{{ item.addr }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<nav-footer :current="0" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo,
|
||||
calculateDistance
|
||||
} from "../../../utils";
|
||||
import { apiArr } from "../../../api/community";
|
||||
|
||||
export default {
|
||||
name: 'CommunityList',
|
||||
data() {
|
||||
return {
|
||||
communityList: [], // 用于显示的列表
|
||||
allCommunityList: [], // 存储所有数据的列表
|
||||
currentPage: 1,
|
||||
pageSize: 16,
|
||||
hasMoreData: true,
|
||||
isLoading: false,
|
||||
tencentMapKey: '55NBZ-MUQYW-EAJRL-YIWPA-ZXCR6-4NBPP', // 腾讯地图API Key
|
||||
defaultCommunityImage: 'https://static.hshuishang.com/community_no_image3.png' // 默认小区图片
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
async getCommunityList() {
|
||||
// 如果正在加载中，则不再请求
|
||||
if (this.isLoading) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 显示加载中提示
|
||||
uni.showLoading({
|
||||
title: '加载中...'
|
||||
});
|
||||
|
||||
this.isLoading = true;
|
||||
|
||||
try {
|
||||
// 获取用户当前位置
|
||||
const locationData = await this.getUserLocation();
|
||||
if (!locationData) {
|
||||
throw new Error('无法获取用户位置');
|
||||
}
|
||||
|
||||
const userLat = parseFloat(locationData.lat);
|
||||
const userLng = parseFloat(locationData.lng);
|
||||
|
||||
// 获取现有小区列表
|
||||
const res = await request(apiArr.getAllList, "POST", {
|
||||
page_num: 1,
|
||||
page_size: 9999
|
||||
});
|
||||
|
||||
if (res && res.rows) {
|
||||
// 处理现有数据，只保留距离1km以内的小区
|
||||
let processedList = res.rows.map(item => {
|
||||
// 处理图片路径
|
||||
if (item.pic) {
|
||||
item.pic = picUrl + item.pic;
|
||||
}
|
||||
|
||||
try {
|
||||
// 只有当经纬度都有效时才计算距离
|
||||
if (userLat && userLng && item.lat && item.lng) {
|
||||
const parkLat = parseFloat(item.lat);
|
||||
const parkLng = parseFloat(item.lng);
|
||||
|
||||
// 使用Haversine公式计算距离（单位：千米）
|
||||
const distance = calculateDistance(userLat, userLng, parkLat, parkLng);
|
||||
item.distance = distance.toFixed(2) + 'km';
|
||||
item.distanceValue = distance; // 保存数值型距离用于排序
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('计算距离失败:', error);
|
||||
item.distanceValue = Infinity;
|
||||
}
|
||||
// 初始化isShow属性
|
||||
item.isShow = true;
|
||||
|
||||
return item;
|
||||
});
|
||||
|
||||
// 过滤出距离1km以内的数据，确保距离为0的值也能被正确保留
|
||||
processedList = processedList.filter(item =>
|
||||
item.distanceValue !== undefined && item.distanceValue !== null && item.distanceValue <= 1
|
||||
);
|
||||
|
||||
// 调用腾讯地图API获取附近1km的小区（包含图片信息）
|
||||
const nearbyCommunities = await this.getNearbyCommunities(userLat, userLng);
|
||||
|
||||
// 合并现有数据和腾讯地图API返回的数据
|
||||
let mergedList = [...processedList];
|
||||
|
||||
if (nearbyCommunities && nearbyCommunities.length > 0) {
|
||||
// 处理腾讯地图返回的数据，提取图片信息
|
||||
const tencentCommunities = nearbyCommunities.map(item => {
|
||||
// 计算距离
|
||||
const distance = calculateDistance(userLat, userLng, item.lat, item.lng);
|
||||
|
||||
// 提取图片（腾讯地图POI可能包含多张图片）
|
||||
let communityImage = '';
|
||||
if (item.photos && item.photos.length > 0) {
|
||||
// 取第一张图片
|
||||
communityImage = item.photos[0].url;
|
||||
}
|
||||
|
||||
return {
|
||||
name: item.title,
|
||||
addr: item.address,
|
||||
lat: item.lat,
|
||||
lng: item.lng,
|
||||
distance: distance.toFixed(2) + 'km',
|
||||
distanceValue: distance,
|
||||
// 补充其他必要字段
|
||||
pic: communityImage || this.defaultCommunityImage, // 使用腾讯地图图片或默认图片
|
||||
property: item.extension && item.extension.property_company ? item.extension.property_company : '-',
|
||||
property_server_phone: item.tel || '',
|
||||
community_id: `tencent_${item.id}` // 为腾讯地图数据设置唯一ID
|
||||
};
|
||||
});
|
||||
|
||||
// 过滤腾讯地图数据，只保留那些name不在接口返回数据中的小区
|
||||
// 创建一个包含接口返回数据所有name的Set
|
||||
const processedNames = new Set(processedList.map(item => item.name));
|
||||
|
||||
// 过滤腾讯地图数据
|
||||
const filteredTencentCommunities = tencentCommunities.filter(item =>
|
||||
!processedNames.has(item.name)
|
||||
);
|
||||
|
||||
// 合并数据
|
||||
mergedList = [...processedList, ...filteredTencentCommunities];
|
||||
|
||||
// 根据community_id去重
|
||||
mergedList = uniqueByField(mergedList, 'community_id');
|
||||
}
|
||||
|
||||
// 根据距离排序，确保距离为0的值也能正确排序
|
||||
mergedList.sort((a, b) => {
|
||||
const distanceA = a.distanceValue !== undefined && a.distanceValue !== null ? a.distanceValue : Infinity;
|
||||
const distanceB = b.distanceValue !== undefined && b.distanceValue !== null ? b.distanceValue : Infinity;
|
||||
|
||||
return distanceA - distanceB;
|
||||
});
|
||||
|
||||
// 保存所有数据到allCommunityList
|
||||
this.allCommunityList = mergedList;
|
||||
|
||||
this.currentPage = 1;
|
||||
this.updateDisplayList();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取社区列表失败:', error);
|
||||
uni.showToast({
|
||||
title: '获取数据失败',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
});
|
||||
} finally {
|
||||
this.isLoading = false;
|
||||
// 隐藏加载中提示
|
||||
uni.hideLoading();
|
||||
}
|
||||
},
|
||||
|
||||
// 获取用户当前位置
|
||||
getUserLocation() {
|
||||
return new Promise((resolve, reject) => {
|
||||
try {
|
||||
let locationData = uni.getStorageSync('location');
|
||||
if (locationData) {
|
||||
// 确保locationData是对象而不是字符串
|
||||
const location = typeof locationData === 'string' ? JSON.parse(locationData) : locationData;
|
||||
if (location.lat && location.lng) {
|
||||
resolve(location);
|
||||
return;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('从缓存获取位置失败:', error);
|
||||
}
|
||||
|
||||
// 如果缓存中没有有效位置，则请求新的位置
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
altitude: true,
|
||||
success: (res) => {
|
||||
const location = {
|
||||
lat: res.latitude,
|
||||
lng: res.longitude
|
||||
};
|
||||
// 保存到缓存
|
||||
uni.setStorageSync('location', location);
|
||||
resolve(location);
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('获取位置失败:', err);
|
||||
reject(err);
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
// 调用腾讯地图API获取附近1km的小区（包含图片信息）
|
||||
async getNearbyCommunities(lat, lng) {
|
||||
try {
|
||||
const keyword = '小区';
|
||||
const radius = 1000; // 1km范围
|
||||
const pageSize = 20;
|
||||
|
||||
// 使用uni.request调用腾讯地图API，增加extensions=all参数获取更多信息
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
url: 'https://apis.map.qq.com/ws/place/v1/search',
|
||||
method: 'GET',
|
||||
data: {
|
||||
keyword: keyword,
|
||||
boundary: `nearby(${lat},${lng},${radius})`,
|
||||
key: this.tencentMapKey,
|
||||
page_size: pageSize,
|
||||
extensions: 'all' // 获取详细信息，包括图片
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.statusCode === 200 && res.data.status === 0) {
|
||||
// 提取需要的数据，包括图片信息
|
||||
const results = res.data.data.map(item => ({
|
||||
id: item.id,
|
||||
title: item.title,
|
||||
address: item.address,
|
||||
lat: item.location.lat,
|
||||
lng: item.location.lng,
|
||||
tel: item.tel || '',
|
||||
photos: item.photos || [], // 提取图片数组
|
||||
extension: item.extension || {}, // 提取扩展信息，可能包含物业公司
|
||||
isShow: false
|
||||
}));
|
||||
resolve(results);
|
||||
} else {
|
||||
console.error('腾讯地图API请求失败:', res.data);
|
||||
resolve([]);
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('腾讯地图API请求错误:', err);
|
||||
resolve([]);
|
||||
}
|
||||
});
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('获取附近小区失败:', error);
|
||||
return [];
|
||||
}
|
||||
},
|
||||
|
||||
// 图片加载失败时使用默认图片
|
||||
handleImageError(item) {
|
||||
item.pic = this.defaultCommunityImage;
|
||||
},
|
||||
|
||||
// 更新显示的列表数据
|
||||
updateDisplayList() {
|
||||
const startIndex = 0;
|
||||
const endIndex = this.currentPage * this.pageSize;
|
||||
this.communityList = this.allCommunityList.slice(startIndex, endIndex);
|
||||
this.hasMoreData = endIndex < this.allCommunityList.length;
|
||||
},
|
||||
navigate(item) {
|
||||
// 实现导航功能
|
||||
if (item.lat && item.lng) {
|
||||
// 确保经纬度是有效的数字
|
||||
const latitude = parseFloat(item.lat);
|
||||
const longitude = parseFloat(item.lng);
|
||||
|
||||
if (!isNaN(latitude) && !isNaN(longitude)) {
|
||||
uni.openLocation({
|
||||
latitude: latitude,
|
||||
longitude: longitude,
|
||||
name: item.name || '未知小区',
|
||||
address: item.addr || '',
|
||||
scale: 18,
|
||||
success: () => {
|
||||
console.log('打开地图成功:', item.name);
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('打开地图失败:', error);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '位置信息无效',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
});
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '暂无位置信息',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
});
|
||||
}
|
||||
},
|
||||
callPhone(item) {
|
||||
if (item.property_server_phone) {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: item.property_server_phone,
|
||||
success: () => {
|
||||
},
|
||||
fail: (error) => {
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '暂无联系电话',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
});
|
||||
}
|
||||
},
|
||||
enterCommunity(item) {
|
||||
request(apiArr.checkComm, "POST", {
|
||||
community_id: item.community_id,
|
||||
user_id: uni.getStorageSync("userId"),
|
||||
}).then((res) => {
|
||||
uni.setStorageSync("is_me", res.is_me)
|
||||
NavgateTo("/packages/community/index/index?item=" + JSON.stringify(item));
|
||||
})
|
||||
},
|
||||
// 下拉加载更多
|
||||
loadMore() {
|
||||
if (this.hasMoreData && !this.isLoading) {
|
||||
this.currentPage += 1;
|
||||
this.updateDisplayList();
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getCommunityList();
|
||||
},
|
||||
// 监听页面滚动到底部
|
||||
onReachBottom() {
|
||||
this.loadMore();
|
||||
},
|
||||
// 下拉刷新
|
||||
onPullDownRefresh() {
|
||||
this.currentPage = 1;
|
||||
this.hasMoreData = true;
|
||||
this.getCommunityList().then(() => {
|
||||
uni.stopPullDownRefresh();
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,40 +1,6 @@
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
background-color: #f6f7fb;
|
||||
padding: 0;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.searchBox {
|
||||
padding-bottom: 24rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 105rpx;
|
||||
}
|
||||
|
||||
.searchBox_add {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.searchBox_left {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.searchBox_mid {
|
||||
flex: 1;
|
||||
font-size: 40rpx;
|
||||
color: #222222;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.searchBox_right {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.container {
|
||||
@ -56,22 +22,9 @@ image {
|
||||
margin-top: 180rpx;
|
||||
}
|
||||
|
||||
.emptyTitle {
|
||||
font-size: 36rpx;
|
||||
color: #222222;
|
||||
margin-top: 50rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.emptyMsg {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
margin: 30rpx;
|
||||
}
|
||||
|
||||
.empty image {
|
||||
width: 500rpx;
|
||||
height: 400rpx;
|
||||
width: 340rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
|
||||
.addBtn {
|
||||
@ -104,13 +57,11 @@ image {
|
||||
border-bottom: 1rpx solid #EBEBEB;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.communityItem_left {
|
||||
.communityItem_left{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.communityItem_left_img {
|
||||
width: 160rpx;
|
||||
height: 140rpx;
|
||||
@ -118,11 +69,9 @@ image {
|
||||
overflow: hidden;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.communityItem_left_msg {
|
||||
.communityItem_left_msg{
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.communityItem_left_msg_tit {
|
||||
font-size: 30rpx;
|
||||
color: #222222;
|
||||
@ -137,7 +86,7 @@ image {
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.communityItem_right {
|
||||
.communityItem_right{
|
||||
width: 34rpx;
|
||||
height: 34rpx;
|
||||
margin-left: 80rpx;
|
||||
@ -146,4 +95,4 @@ image {
|
||||
/* 最后一个 communityItem */
|
||||
.communityItem:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,44 +1,35 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- <view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="searchBox_left">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
|
||||
</view>
|
||||
<view class="searchBox_mid">我的房产</view>
|
||||
<view class="searchBox_right"></view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="empty" v-if="communityList.length == 0">
|
||||
<view class="emptyTitle">绑定房源</view>
|
||||
<view class="emptyMsg">请绑定房源信息 以便使用其他功能</view>
|
||||
<image src="https://static.hshuishang.com/community_no_image3.png" alt="" />
|
||||
<view class="empty" v-if="false">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_newEmpty.png"
|
||||
alt="" />
|
||||
没有添加任何房产
|
||||
|
||||
</view>
|
||||
|
||||
<view class="communityList">
|
||||
<view class="communityItem" v-for="item in communityList" :key="item.community_id"
|
||||
<div class="communityList">
|
||||
<div class="communityItem" v-for="item in communityList" :key="item.community_id"
|
||||
@click="choseCommunity(item)">
|
||||
<view class="communityItem_left">
|
||||
<view class="communityItem_left_img">
|
||||
<div class="communityItem_left">
|
||||
<div class="communityItem_left_img">
|
||||
<image :src="item.pic" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="communityItem_left_msg">
|
||||
<view class="communityItem_left_msg_tit">{{ item.name }}<span>（ {{ item.room_owner_list.length
|
||||
}}
|
||||
）</span></view>
|
||||
<view class="communityItem_left_msg_msg">{{ item.addr }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="communityItem_right">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_check1.png"
|
||||
</div>
|
||||
<div class="communityItem_left_msg">
|
||||
<div class="communityItem_left_msg_tit">{{ item.name }}<span>（ {{ item.room_owner_list.length }}
|
||||
）</span></div>
|
||||
<div class="communityItem_left_msg_msg">{{ item.addr }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="communityItem_right">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check1.png"
|
||||
v-if="item.community_id != currentCommunity.id"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_check2.png"
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_check2.png"
|
||||
v-if="item.community_id == currentCommunity.id"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="addBtn" @click="addCommunity">去绑定房源</view>
|
||||
<div class="addBtn" @click="addCommunity">添加我的房产</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -62,9 +53,6 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
back() {
|
||||
NavgateTo("/packages/community/index/index")
|
||||
},
|
||||
addCommunity() {
|
||||
NavgateTo("/packages/community/addCommunity/index")
|
||||
},
|
||||
@ -79,7 +67,7 @@ export default {
|
||||
res.rows.forEach(item => {
|
||||
item.pic = item.pic.startsWith('http') ? item.pic : picUrl + item.pic
|
||||
});
|
||||
this.communityList = res.rows.filter(item => item.front_end_display !== 1)
|
||||
this.communityList = res.rows
|
||||
})
|
||||
},
|
||||
// toUpview(item) {
|
||||
@ -90,8 +78,8 @@ export default {
|
||||
choseCommunity(e) {
|
||||
this.currentCommunity = e
|
||||
uni.setStorageSync('changeCommData', { id: e.community_id, name: e.name });
|
||||
uni.setStorageSync('currentCommunityAddr', e.addr);
|
||||
NavgateTo("1")
|
||||
uni.setStorageSync('currentCommunityAddr',e.addr);
|
||||
NavgateTo("/packages/community/index/index")
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
</view>
|
||||
|
||||
<view class="add" @click="addCar">
|
||||
<image src="https://static.hshuishang.com/ConvenServer/addCar.png" mode="widthFix"/>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/ConvenServer/addCar.png" mode="widthFix"/>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -307,7 +307,7 @@ page {
|
||||
content: '';
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_active.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png);
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
|
||||
<div class="myRealEstate">
|
||||
<div class="myRealEstates">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_communityNav.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communityNav.png" mode="aspectFill"></image>
|
||||
<div class="name">滏阳锦苑</div>
|
||||
<div class="Visitor">访客身份 点击立即入驻本社区</div>
|
||||
</div>
|
||||
@ -25,7 +25,7 @@
|
||||
<div class="ConList">
|
||||
<div class="ConItem" v-for="item in 3" @click="desc">
|
||||
<div class="ConItem_left">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_act2Img.png" mode="aspectFill"></image>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_act2Img.png" mode="aspectFill"></image>
|
||||
</div>
|
||||
<div class="ConItem_right">
|
||||
<div class="ConItem_right_tit">关于小区停车场治理通告</div>
|
||||
|
||||
@ -59,10 +59,6 @@ page {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.red{
|
||||
color: #FF0000;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
@ -77,7 +73,7 @@ page {
|
||||
}
|
||||
|
||||
.roomItem {
|
||||
width: auto;
|
||||
width: 276rpx;
|
||||
height: 54rpx;
|
||||
background: #FFF5F5;
|
||||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||||
@ -89,7 +85,6 @@ page {
|
||||
color: #222222;
|
||||
margin-right: 30rpx;
|
||||
margin-bottom: 28rpx;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.roomItem:nth-child(2n) {
|
||||
@ -128,7 +123,7 @@ page {
|
||||
bottom: -2rpx;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_activeIcon.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_activeIcon.png);
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
|
||||
@ -1,97 +1,97 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="searchBox_left">
|
||||
<div class="container">
|
||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<div class="searchBox_add">
|
||||
<div class="searchBox_left">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
|
||||
</view>
|
||||
<view class="searchBox_mid">报修信息</view>
|
||||
<view class="searchBox_right"></view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<div class="searchBox_mid">报修信息</div>
|
||||
<div class="searchBox_right"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="repairMsg">
|
||||
<view class="repairTit">
|
||||
报修信息
|
||||
</view>
|
||||
<div class="repairMsg">
|
||||
<div class="repairTit">
|
||||
<span>*</span>报修信息
|
||||
</div>
|
||||
|
||||
<view class="label"><span class="red">*</span>选择房源信息</view>
|
||||
<view class="roomList">
|
||||
<view v-for="(item, index) in roomList" :key="index" :class="active == index ?'roomItem active':'roomItem'" @click="changeAct(index)">{{ item.name }}</view>
|
||||
</view>
|
||||
<div class="label">选择房源信息</div>
|
||||
<div class="roomList">
|
||||
<div v-for="(item, index) in roomList" :key="index" :class="active == index ?'roomItem active':'roomItem'" @click="changeAct(index)">{{ item.name }}</div>
|
||||
</div>
|
||||
|
||||
<view class="row">
|
||||
<view class="row_label"><span class="red">*</span>报修类型</view>
|
||||
<view class="row_con" @click="chose">
|
||||
<div class="row">
|
||||
<div class="row_label">报修类型</div>
|
||||
<div class="row_con" @click="chose">
|
||||
<input type="text" :value="category.category_name" placeholder="请选择报修类型" disabled>
|
||||
<u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="row">
|
||||
<view class="row_label"><span class="red">*</span>问题描述</view>
|
||||
<view class="row_con">
|
||||
<div class="row">
|
||||
<div class="row_label">问题描述</div>
|
||||
<div class="row_con">
|
||||
<input type="text" placeholder="请描述故障" :value="repairInfo" data-name="repairInfo" @input="handlerInputClick">
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="row">
|
||||
<view class="row_label"><span class="red">*</span>联系人</view>
|
||||
<view class="row_con">
|
||||
<div class="row">
|
||||
<div class="row_label">联系人</div>
|
||||
<div class="row_con">
|
||||
<input type="text" placeholder="请输入您的姓名" :value="contactName" data-name="contactName" @input="handlerInputClick">
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="row">
|
||||
<view class="row_label"><span class="red">*</span>联系电话</view>
|
||||
<view class="row_con">
|
||||
<div class="row">
|
||||
<div class="row_label">联系电话</div>
|
||||
<div class="row_con">
|
||||
<input type="number" maxlength="11" placeholder="请输入您的联系方式" :value="contactPhone" data-name="contactPhone" @input="handlerInputClick">
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="row noneBorder">
|
||||
<view class="row_label"><span class="red">*</span>上门时间</view>
|
||||
<view class="row_con" @click="choseTime">
|
||||
<div class="row noneBorder">
|
||||
<div class="row_label">上门时间</div>
|
||||
<div class="row_con" @click="choseTime">
|
||||
<input type="text" :value="time" placeholder="请选择上门时间" disabled>
|
||||
<u-icon bold color="#999999" size="30" name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="repairMedia">
|
||||
<view class="row df">
|
||||
<view class="row_label">上传图片</view>
|
||||
<view class="row_con2">
|
||||
<div class="repairMedia">
|
||||
<div class="row df">
|
||||
<div class="row_label">上传图片</div>
|
||||
<div class="row_con2">
|
||||
<u-upload :fileList="imgList" name="imgList" @afterRead="afterReadImg" @delete="deletePic" multiple
|
||||
:maxCount="5">
|
||||
<view class="imgCon">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_imageImg.png" mode="widthFix"></image>
|
||||
:maxCount="10">
|
||||
<div class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_imageImg.png" mode="widthFix"></image>
|
||||
上传图片
|
||||
</view>
|
||||
</div>
|
||||
</u-upload>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="row df">
|
||||
<view class="row_label">上传视频</view>
|
||||
<view class="row_con2">
|
||||
<div class="row df">
|
||||
<div class="row_label">上传视频</div>
|
||||
<div class="row_con2">
|
||||
<u-upload v-if="!videoList.url" :fileList="videoList" @afterRead="afterReadVideo" @delete="deleteVideo" name="videoList"
|
||||
:maxCount="1" accept="video">
|
||||
<view class="imgCon">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_videoImg.png" mode="widthFix"></image>
|
||||
<div class="imgCon">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_videoImg.png" mode="widthFix"></image>
|
||||
上传视频
|
||||
</view>
|
||||
</div>
|
||||
</u-upload>
|
||||
|
||||
<view v-if="videoList.url" class="videoBOX">
|
||||
<div v-if="videoList.url" class="videoBOX">
|
||||
<video id="myVideo" :src="videoList.url" playsinline webkit-playsinline></video>
|
||||
<view class="mask" @click="playFullScreenVideo">
|
||||
<view class="mask_cancel" @click="cancels">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="mask" @click="playFullScreenVideo">
|
||||
<div class="mask_cancel" @click="cancels">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<u-picker :show="show" :columns="[columns]" keyName="category_name" @confirm="confirm1" @cancel="cancel1" />
|
||||
<u-datetime-picker
|
||||
@ -105,9 +105,9 @@
|
||||
@close="cancel2"
|
||||
/>
|
||||
|
||||
<view class="btn" @click="handlerSubmitClick">确认报修</view>
|
||||
<div class="btn" @click="handlerSubmitClick">确认报修</div>
|
||||
|
||||
</view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -130,7 +130,7 @@ export default {
|
||||
localHeight: "",
|
||||
roomList: [],
|
||||
columns: [],
|
||||
category: {}, // 报修类型信息
|
||||
category: {}, // 保修类型信息
|
||||
repairInfo: '', // 问题描述
|
||||
contactName: '', // 联系人名称
|
||||
contactPhone: '', // 联系人电话
|
||||
@ -235,55 +235,6 @@ export default {
|
||||
this.active = e;
|
||||
},
|
||||
async handlerSubmitClick() {
|
||||
// 表单验证
|
||||
if (!this.roomList[this.active]) {
|
||||
uni.showToast({
|
||||
title: '请选择房源信息',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.category.id) {
|
||||
uni.showToast({
|
||||
title: '请选择报修类型',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.repairInfo.trim()) {
|
||||
uni.showToast({
|
||||
title: '请输入问题描述',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.contactName.trim()) {
|
||||
uni.showToast({
|
||||
title: '请输入联系人姓名',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.contactPhone.trim() || this.contactPhone.length !== 11) {
|
||||
uni.showToast({
|
||||
title: '请输入有效的联系电话',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.time) {
|
||||
uni.showToast({
|
||||
title: '请选择上门时间',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中'
|
||||
});
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<view class="searchIpt">
|
||||
<input type="text" placeholder="社区名称/业主姓名/业主手机" placeholder-style="color: #999999;font-size: 24rpx;"
|
||||
:value="search" @input="search" />
|
||||
<image class="sear_icon" src="https://static.hshuishang.com/water_filter/dervice/deriveSearch.png"
|
||||
<image class="sear_icon" src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/dervice/deriveSearch.png"
|
||||
mode="" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -131,7 +131,7 @@ image {
|
||||
position: absolute;
|
||||
right: 8rpx;
|
||||
top: 23rpx;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_jfImg.png) no-repeat;
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_jfImg.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
@ -212,11 +212,6 @@ image {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.payItem_money{
|
||||
width: auto;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 750rpx;
|
||||
background: #FFFFFF;
|
||||
@ -414,17 +409,6 @@ image {
|
||||
font-size: 28rpx;
|
||||
color: #000000;
|
||||
margin-top: 10rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.PayTypeItem_con_msg2{
|
||||
font-size: 26rpx;
|
||||
margin-left: 20rpx;
|
||||
border: 1rpx solid #f23f17;
|
||||
padding: 0 10rpx;
|
||||
background-color: #fde0dc;
|
||||
color: #f23f17;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.line3 {
|
||||
@ -437,9 +421,8 @@ image {
|
||||
font-weight: bold;
|
||||
font-size: 50rpx;
|
||||
color: #FF370B;
|
||||
/* text-align: center; */
|
||||
text-align: center;
|
||||
padding-bottom: 30rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.boxshadowCon_subTit span {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -3,7 +3,7 @@ page {
|
||||
}
|
||||
.container {
|
||||
.container_body {
|
||||
background: url("https://static.hshuishang.com/property-img-file/community_providentFund_Group_1523.png") no-repeat;
|
||||
background: url("https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Group_1523.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.title {
|
||||
|
||||
@ -1,230 +1,187 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<u-navbar
|
||||
title=" "
|
||||
leftIconSize="20px"
|
||||
leftIconColor="#FFFFFF"
|
||||
bgColor="transparent"
|
||||
:autoBack="true"
|
||||
/>
|
||||
<view class="container_body" :style="{ paddingTop: top + 'px' }">
|
||||
<view class="title">物业费</view>
|
||||
<view class="title_bottom">
|
||||
<view>￥{{ getTotal(list.owners) }}</view>
|
||||
<u-icon
|
||||
name="info-circle"
|
||||
size="30rpx"
|
||||
color="linear-gradient( 180deg, #FFFFFF 0%, #FFD7D7 100%);"
|
||||
/>
|
||||
</view>
|
||||
<view class="name" @click="headerSwitchClick">
|
||||
<text>{{ defaultName.name }}</text>
|
||||
<u-icon name="arrow-right" color="#FFFFFF" size="30rpx" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="main">
|
||||
<view
|
||||
class="person_info"
|
||||
v-for="(item, index) in list.owners"
|
||||
:key="index"
|
||||
>
|
||||
<view class="item">
|
||||
<view class="label">姓名</view>
|
||||
<view class="desc">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">身份</view>
|
||||
<view class="desc" v-if="item.type == 1">业主</view>
|
||||
<view class="desc" v-if="item.type == 2">家属</view>
|
||||
<view class="desc" v-if="item.type == 3">租户</view>
|
||||
<view class="desc" v-if="item.type == 4">访客</view>
|
||||
</view>
|
||||
<!-- <view class="item">
|
||||
<view class="container">
|
||||
<u-navbar title=" " leftIconSize="20px" leftIconColor="#FFFFFF" bgColor="transparent" :autoBack="true" />
|
||||
<view class="container_body" :style="{ paddingTop: top + 'px' }">
|
||||
<view class="title">物业公积金</view>
|
||||
<view class="title_bottom">
|
||||
<view>￥{{ moeny }}</view>
|
||||
<u-icon name="info-circle" size="30rpx" color="linear-gradient( 180deg, #FFFFFF 0%, #FFD7D7 100%);" />
|
||||
</view>
|
||||
<view class="name" @click="headerSwitchClick">
|
||||
<text>{{defaultName.name}}</text>
|
||||
<u-icon name="arrow-right" color="#FFFFFF" size="30rpx" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="main">
|
||||
<view class="person_info" v-for="(item,index) in list.owners" :key="index">
|
||||
<view class="item">
|
||||
<view class="label">姓名</view>
|
||||
<view class="desc">{{ item.name }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">身份</view>
|
||||
<view class="desc" v-if="item.type == 1">业主</view>
|
||||
<view class="desc" v-if="item.type == 2">家属</view>
|
||||
<view class="desc" v-if="item.type == 3">租户</view>
|
||||
<view class="desc" v-if="item.type == 4">访客</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">手机号</view>
|
||||
<view class="desc">{{item.mobile}}</view>
|
||||
</view> -->
|
||||
<view class="item">
|
||||
<view class="label">房产总数</view>
|
||||
<view class="desc">{{ item.count_of_rooms }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label fix">
|
||||
<text>物业费总余额</text>
|
||||
<u-icon
|
||||
name="info-circle-fill"
|
||||
size="30rpx"
|
||||
color="red"
|
||||
@click="headerIconClick(index)"
|
||||
/>
|
||||
<view
|
||||
class="popup"
|
||||
v-if="item.popupShow"
|
||||
@click="headerIconClick(index)"
|
||||
>
|
||||
{{ item.identity == "业主" ? ownerDesc : desc }}
|
||||
<view class="angle"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="desc">￥{{ item.property_fund_balance }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn" @click="goPay">去抵扣物业账单</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label">房产总数</view>
|
||||
<view class="desc">{{ item.count_of_rooms }}</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="label fix">
|
||||
<text>物业费公积金总余额</text>
|
||||
<u-icon name="info-circle-fill" size="30rpx" color="red" @click="headerIconClick(index)" />
|
||||
<view class="popup" v-if="item.popupShow" @click="headerIconClick(index)">
|
||||
{{ item.identity == '业主' ? ownerDesc : desc }}
|
||||
<view class="angle"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="desc">￥{{item.property_fund_balance}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn">去抵扣物业账单</view>
|
||||
|
||||
<u-popup :show="show" :round="50" @close="close">
|
||||
<view class="select_Popup">
|
||||
<view class="header">
|
||||
<view></view>
|
||||
<view class="title">选择房源</view>
|
||||
<view class="close" @click="close">取消</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="main">
|
||||
<view
|
||||
class="item"
|
||||
v-for="(item, index) in houseList"
|
||||
:key="index"
|
||||
@click="headerConfirmClick(item)"
|
||||
>
|
||||
<text>{{ item.name }}</text>
|
||||
<image
|
||||
v-if="item.checked"
|
||||
class="pic"
|
||||
src="https://static.hshuishang.com/property-img-file/community_providentFund_Group_1444.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<image
|
||||
v-else
|
||||
class="pic"
|
||||
src="https://static.hshuishang.com/property-img-file/community_providentFund_Ellipse_160.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
<u-popup :show="show" :round="50" @close="close">
|
||||
<view class="select_Popup">
|
||||
<view class="header">
|
||||
<view></view>
|
||||
<view class="title">选择房源</view>
|
||||
<view class="close" @click="close">取消</view>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
<view class="main">
|
||||
<view class="item" v-for="(item,index) in houseList" :key="index" @click="headerConfirmClick(item)">
|
||||
<text>{{ item.name }}</text>
|
||||
<image
|
||||
v-if="item.checked"
|
||||
class="pic"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Group_1444.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
<image
|
||||
v-else
|
||||
class="pic"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Ellipse_160.png"
|
||||
mode="scaleToFill"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
NavgateTo,
|
||||
} from "../../../utils";
|
||||
request,
|
||||
picUrl,
|
||||
uniqueByField,
|
||||
menuButtonInfo,
|
||||
} from '../../../utils';
|
||||
|
||||
import { apiArr } from '../../../api/v2Community';
|
||||
|
||||
import { apiArr } from "../../../api/v2Community";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
top: "",
|
||||
moeny: "0.00",
|
||||
show: false,
|
||||
ownerDesc:
|
||||
"本房产的物业费为该房产的所有成员物业费总和。无需经过成员同意便可用于本房产的物业费抵扣，一旦成功抵扣，成员所拥有的物业费将自动进行扣除。",
|
||||
desc: "物业费可通用至您加入的所有房产，任一房产的物业相关费用均可用该物业费抵扣。",
|
||||
defaultName: "",
|
||||
list: [],
|
||||
houseList: [],
|
||||
roomList: [],
|
||||
data() {
|
||||
return {
|
||||
top: '',
|
||||
moeny: '0.00',
|
||||
show: false,
|
||||
ownerDesc: '本房产的物业公积金为该房产的所有成员物业公积金总和。无需经过成员同意便可用于本房产的物业费抵扣，一旦成功抵扣，成员所拥有的物业公积金将自动进行扣除。',
|
||||
desc: '物业公积金可通用至您加入的所有房产，任一房产的物业相关费用均可用该物业公积金抵扣。',
|
||||
defaultName: '',
|
||||
list: [
|
||||
|
||||
],
|
||||
houseList: [
|
||||
|
||||
],
|
||||
roomList:[]
|
||||
}
|
||||
},
|
||||
async onLoad(options) {
|
||||
this.defaultName = {
|
||||
...this.houseList[0],
|
||||
checked: true
|
||||
};
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.height + meun.top;
|
||||
await this.getRoomList()
|
||||
await this.getInfo()
|
||||
},
|
||||
|
||||
itemObj: '',
|
||||
};
|
||||
},
|
||||
async onLoad(options) {
|
||||
if (options.item) {
|
||||
this.itemObj = JSON.parse(decodeURIComponent(options.item));
|
||||
this.defaultName = {
|
||||
...this.itemObj,
|
||||
checked: true,
|
||||
};
|
||||
} else {
|
||||
this.defaultName = {
|
||||
...this.houseList[0],
|
||||
checked: true,
|
||||
};
|
||||
}
|
||||
console.log(this.itemObj)
|
||||
const meun = menuButtonInfo();
|
||||
this.top = meun.height + meun.top;
|
||||
await this.getRoomList();
|
||||
await this.getInfo();
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 计算总金额
|
||||
getTotal(owners) {
|
||||
return owners.reduce((total, owner) => total + owner.property_fund_balance, 0).toFixed(2);
|
||||
},
|
||||
headerConfirmClick(item) {
|
||||
this.defaultName = {
|
||||
...item,
|
||||
checked: true,
|
||||
};
|
||||
this.show = false;
|
||||
this.getInfo();
|
||||
},
|
||||
//选择房产
|
||||
headerSwitchClick() {
|
||||
this.show = true;
|
||||
const newRes = this.roomList.map((item) => {
|
||||
if (item.name === this.defaultName.name) {
|
||||
return {
|
||||
...item,
|
||||
checked: true,
|
||||
};
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
checked: false,
|
||||
};
|
||||
});
|
||||
console.log("newResnewRes", newRes);
|
||||
this.houseList = newRes;
|
||||
},
|
||||
// 业主点击弹出层
|
||||
headerIconClick(ind) {
|
||||
this.list.owners[ind].popupShow = !this.list.owners[ind].popupShow;
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
methods: {
|
||||
headerConfirmClick(item) {
|
||||
this.defaultName = {
|
||||
...item,
|
||||
checked: true
|
||||
};
|
||||
this.show = false;
|
||||
this.getInfo()
|
||||
},
|
||||
//选择房产
|
||||
headerSwitchClick() {
|
||||
this.show = true;
|
||||
const newRes = this.roomList.map(item => {
|
||||
if (item.name === this.defaultName.name) {
|
||||
return {
|
||||
...item,
|
||||
checked: true
|
||||
}
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
checked: false
|
||||
}
|
||||
});
|
||||
console.log('newResnewRes', newRes);
|
||||
this.houseList = newRes;
|
||||
},
|
||||
// 业主点击弹出层
|
||||
headerIconClick(ind) {
|
||||
this.list.owners[ind].popupShow = !this.list.owners[ind].popupShow
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
},
|
||||
|
||||
async getRoomList() {
|
||||
await request(apiArr.getCommunityList, "POST", {
|
||||
page_num: 1,
|
||||
page_size: 50,
|
||||
community_id: uni.getStorageSync("changeCommData").id,
|
||||
}).then((res) => {
|
||||
res.rows.forEach((item) => {
|
||||
item.checked = false;
|
||||
});
|
||||
this.roomList = res.rows;
|
||||
if (!this.itemObj) {
|
||||
this.defaultName = res.rows[0];
|
||||
}
|
||||
});
|
||||
},
|
||||
async getInfo() {
|
||||
await request(apiArr.getGovernmentByRoom, "POST", {
|
||||
room_id: this.defaultName.room_id,
|
||||
}).then((res) => {
|
||||
res.owners.forEach((item) => {
|
||||
item.popupShow = false;
|
||||
});
|
||||
this.list = res;
|
||||
});
|
||||
},
|
||||
goPay() {
|
||||
NavgateTo("../propertyPayment/index?item=" + encodeURIComponent(JSON.stringify(this.defaultName)));
|
||||
},
|
||||
},
|
||||
};
|
||||
async getRoomList(){
|
||||
await request(apiArr.getCommunityList,"POST",{
|
||||
page_num:1,
|
||||
page_size:50,
|
||||
community_id:uni.getStorageSync("changeCommData").id
|
||||
}).then(res=>{
|
||||
res.rows.forEach(item=>{
|
||||
item.checked = false
|
||||
})
|
||||
this.roomList = res.rows
|
||||
this.defaultName = res.rows[0]
|
||||
})
|
||||
},
|
||||
async getInfo(){
|
||||
await request(apiArr.getGovernmentByRoom,"POST",{
|
||||
room_id:this.defaultName.room_id
|
||||
}).then(res=>{
|
||||
res.owners.forEach(item => {
|
||||
item.popupShow = false
|
||||
});
|
||||
this.list = res
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import "./index.scss";
|
||||
@import './index.scss';
|
||||
|
||||
</style>
|
||||
@ -1,7 +1,3 @@
|
||||
/* .box{
|
||||
padding-bottom: 100rpx;
|
||||
} */
|
||||
|
||||
.searchBox {
|
||||
padding-bottom: 24rpx;
|
||||
background-color: #fff;
|
||||
@ -61,7 +57,7 @@
|
||||
content: '';
|
||||
width: 52rpx;
|
||||
height: 22rpx;
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_active.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_active.png);
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
@ -69,10 +65,6 @@
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.orderListBox{
|
||||
padding-bottom: 220rpx;
|
||||
}
|
||||
|
||||
|
||||
.orderList {
|
||||
margin-top: 20rpx;
|
||||
@ -146,7 +138,6 @@ page {
|
||||
font-size: 28rpx;
|
||||
color: #FFA600;
|
||||
font-weight: 600;
|
||||
width: 95rpx;
|
||||
}
|
||||
.orderItem_row_state2 {
|
||||
color: #FF4800;
|
||||
@ -175,11 +166,7 @@ page {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
position: fixed;
|
||||
bottom: 100rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 99;
|
||||
margin-top: 200rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,82 +1,81 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<view class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<view class="searchBox_add">
|
||||
<view class="searchBox_left">
|
||||
<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
|
||||
<div class="searchBox_add">
|
||||
<div class="searchBox_left">
|
||||
<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
|
||||
</view>
|
||||
<view class="searchBox_mid">我的报修</view>
|
||||
<view class="searchBox_right"></view>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
<div class="searchBox_mid">我的报修</div>
|
||||
<div class="searchBox_right"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="tabList">
|
||||
<view :class="active == 1 ? 'tab active' : 'tab'" @click="headerTabsClick(1)">
|
||||
<div class="tabList">
|
||||
<div :class="active == 1 ? 'tab active' : 'tab'" @click="headerTabsClick(1)">
|
||||
待指派 <span>({{ awaitingNumb }})</span>
|
||||
</view>
|
||||
<view :class="active == 2 ? 'tab active' : 'tab'" @click="headerTabsClick(2)">
|
||||
</div>
|
||||
<div :class="active == 2 ? 'tab active' : 'tab'" @click="headerTabsClick(2)">
|
||||
进行中 <span>({{ underwayNum }})</span>
|
||||
</view>
|
||||
<view :class="active == 4 ? 'tab active' : 'tab'" @click="headerTabsClick(4)">
|
||||
</div>
|
||||
<div :class="active == 4 ? 'tab active' : 'tab'" @click="headerTabsClick(4)">
|
||||
已作废 <span>({{ discardNum }})</span>
|
||||
</view>
|
||||
<view :class="active == 3 ? 'tab active' : 'tab'" @click="headerTabsClick(3)">
|
||||
</div>
|
||||
<div :class="active == 3 ? 'tab active' : 'tab'" @click="headerTabsClick(3)">
|
||||
已完成 <span>({{ doneNum }})</span>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view v-if="list.length !== 0" class="orderListBox">
|
||||
<view class="orderList" v-for="(item, index) in list" :key="index">
|
||||
<view class="orderItem" @click="handlerDetailClick(item.id)">
|
||||
<view :class="['orderItemTit', statusType[item.status].style]">
|
||||
<view class="orderItemTit_left">工单编号：{{ item.order_code }}</view>
|
||||
<view class="orderItemTit_right">{{ item.create_time }}</view>
|
||||
</view>
|
||||
<view class="orderItem_row">
|
||||
<view class="df">
|
||||
<view class="orderItem_row_label">小区房源名称</view>
|
||||
<view class="orderItem_row_con">{{ item.room.name }}</view>
|
||||
<view :class="['orderItem_row_state', statusType[item.status].color]">
|
||||
{{ statusType[item.status].desc }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div v-if="list.length !== 0" class="orderList" v-for="(item, index) in list" :key="index">
|
||||
<div class="orderItem" @click="handlerDetailClick(item.id)">
|
||||
<div :class="['orderItemTit', statusType[item.status].style]">
|
||||
<div class="orderItemTit_left">工单编号：{{ item.order_code }}</div>
|
||||
<div class="orderItemTit_right">{{ item.create_time }}</div>
|
||||
</div>
|
||||
<div class="orderItem_row">
|
||||
<div class="df">
|
||||
<div class="orderItem_row_label">小区房源名称</div>
|
||||
<div class="orderItem_row_con">{{ item.room.name }}</div>
|
||||
</div>
|
||||
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">报修类型</view>
|
||||
<view class="orderItem_row_con">{{ item.ac.category_name }}</view>
|
||||
</view>
|
||||
<div :class="['orderItem_row_state', statusType[item.status].color]">
|
||||
{{ statusType[item.status].desc }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">问题描述</view>
|
||||
<view class="orderItem_row_con">{{ item.problem_description }}</view>
|
||||
</view>
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">报修类型</div>
|
||||
<div class="orderItem_row_con">{{ item.ac.category_name }}</div>
|
||||
</div>
|
||||
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">上门时间</view>
|
||||
<view class="orderItem_row_con">{{ item.service_time }}</view>
|
||||
</view>
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">问题描述</div>
|
||||
<div class="orderItem_row_con">{{ item.problem_description }}</div>
|
||||
</div>
|
||||
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">联系人</view>
|
||||
<view class="orderItem_row_con">{{ item.contact_name }}</view>
|
||||
</view>
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">上门时间</div>
|
||||
<div class="orderItem_row_con">{{ item.service_time }}</div>
|
||||
</div>
|
||||
|
||||
<view class="orderItem_row">
|
||||
<view class="orderItem_row_label">联系人手机号</view>
|
||||
<view class="orderItem_row_con">{{ item.contact_phone }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">联系人</div>
|
||||
<div class="orderItem_row_con">{{ item.contact_name }}</div>
|
||||
</div>
|
||||
|
||||
<view v-if="list.length == 0" class="empty">
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_nearbyList_empty.png"
|
||||
<div class="orderItem_row">
|
||||
<div class="orderItem_row_label">联系人手机号</div>
|
||||
<div class="orderItem_row_con">{{ item.contact_phone }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="list.length == 0" class="empty">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_nearbyList_empty.png"
|
||||
mode="aspectFill"></image>
|
||||
暂无数据
|
||||
</view>
|
||||
</div>
|
||||
|
||||
<view class="addBtn" @click="oneRepair">在线报修</view>
|
||||
<div class="addBtn" @click="oneRepair">在线报修</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -93,31 +92,31 @@ export default {
|
||||
page_size: 10,
|
||||
flag: false, // 是否下拉请求接口
|
||||
list: [], // 列表数组
|
||||
awaitingNumb: "", // 待维修工单数量
|
||||
underwayNum: "", // 进行中工单数量
|
||||
doneNum: "", // 已完成工单数量
|
||||
discardNum: "", // 已废弃工单数量
|
||||
awaitingNumb: '', // 待维修工单数量
|
||||
underwayNum: '', // 进行中工单数量
|
||||
doneNum: '', // 已完成工单数量
|
||||
discardNum: '', // 已废弃工单数量
|
||||
// 状态枚举类型
|
||||
statusType: {
|
||||
1: {
|
||||
desc: "待指派",
|
||||
style: "orderItemTit_state1",
|
||||
color: "orderItem_row_state1",
|
||||
color: "orderItem_row_state1"
|
||||
},
|
||||
2: {
|
||||
desc: "进行中",
|
||||
style: "orderItemTit_state2",
|
||||
color: "orderItem_row_state2",
|
||||
color: "orderItem_row_state2"
|
||||
},
|
||||
3: {
|
||||
desc: "已完成",
|
||||
style: "orderItemTit_state3",
|
||||
color: "orderItem_row_state3",
|
||||
color: "orderItem_row_state3"
|
||||
},
|
||||
4: {
|
||||
desc: "已作废",
|
||||
style: "orderItemTit_state4",
|
||||
color: "orderItem_row_state4",
|
||||
color: "orderItem_row_state4"
|
||||
},
|
||||
},
|
||||
};
|
||||
@ -138,13 +137,12 @@ export default {
|
||||
this.getTabsList();
|
||||
},
|
||||
async init() {
|
||||
const [awaitingNumb, underwayNum, doneNum, discardNum] =
|
||||
await Promise.all([
|
||||
this.awaitingRes(1),
|
||||
this.awaitingRes(2),
|
||||
this.awaitingRes(3),
|
||||
this.awaitingRes(4),
|
||||
]);
|
||||
const [awaitingNumb, underwayNum, doneNum, discardNum] = await Promise.all([
|
||||
this.awaitingRes(),
|
||||
this.underwayRes(),
|
||||
this.doneRes(),
|
||||
this.discardRes(),
|
||||
]);
|
||||
this.awaitingNumb = awaitingNumb;
|
||||
this.underwayNum = underwayNum;
|
||||
this.discardNum = discardNum;
|
||||
@ -152,7 +150,6 @@ export default {
|
||||
},
|
||||
async getTabsList() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
status: this.active,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
@ -171,10 +168,36 @@ export default {
|
||||
}
|
||||
},
|
||||
// 待维修工单数量
|
||||
async awaitingRes(status) {
|
||||
async awaitingRes() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
community_id: Number(uni.getStorageSync("changeCommData").id),
|
||||
status: status,
|
||||
status: 1,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
return res.total;
|
||||
},
|
||||
// 进行中工单数量
|
||||
async underwayRes() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
status: 2,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
return res.total;
|
||||
},
|
||||
// 已废弃工单数量
|
||||
async discardRes() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
status: 3,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
return res.total;
|
||||
},
|
||||
// 已完成工单数量
|
||||
async doneRes() {
|
||||
const res = await request(apiArr.getWorkOrderCrudList, "POST", {
|
||||
status: 4,
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size,
|
||||
});
|
||||
@ -183,14 +206,9 @@ export default {
|
||||
|
||||
back() {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
onShow() {
|
||||
this.init();
|
||||
this.getTabsList();
|
||||
delta: 1
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
|
||||
@ -88,17 +88,17 @@
|
||||
}
|
||||
|
||||
.tabItem1 {
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_tabBg1.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_tabBg1.png);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.tabItem2 {
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_tabBg2.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_tabBg2.png);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.tabItem3 {
|
||||
background: url(https://static.hshuishang.com/property-img-file/com_tabBg3.png);
|
||||
background: url(https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_tabBg3.png);
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
|
||||
@ -75,128 +75,128 @@ export default {
|
||||
return {
|
||||
functionList: [
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon1.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon1.png",
|
||||
name: "业主入驻",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon2.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon2.png",
|
||||
name: "我的房产",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon3.png",
|
||||
name: "生活缴费",
|
||||
url: "weixin://dl/business/?t=WvQ1ZJv0J5Z"
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon4.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon4.png",
|
||||
name: "便民服务",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon5.png",
|
||||
name: "物业费",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon5.png",
|
||||
name: "物业公积金",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon6.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon6.png",
|
||||
name: "社区互动",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon7.png",
|
||||
name: "物业费",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon7.png",
|
||||
name: "物业公积金",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon8.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon8.png",
|
||||
name: "物业服务",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon9.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon9.png",
|
||||
name: "报事报修",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon10.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon10.png",
|
||||
name: "物业缴费",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon11.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon11.png",
|
||||
name: "纠纷调解",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_serverIcon12.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_serverIcon12.png",
|
||||
name: "社区管家",
|
||||
url: ""
|
||||
},
|
||||
],
|
||||
localList: [
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_localIcon1.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_localIcon1.png",
|
||||
name: "美食",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_localIcon2.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_localIcon2.png",
|
||||
name: "家教",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_localIcon3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_localIcon3.png",
|
||||
name: "超市",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_localIcon4.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_localIcon4.png",
|
||||
name: "健身",
|
||||
url: ""
|
||||
},
|
||||
],
|
||||
shopList: [
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_shopIcon1.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shopIcon1.png",
|
||||
name: "电商购物",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_shopIcon2.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shopIcon2.png",
|
||||
name: "社区团购",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_shopIcon3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shopIcon3.png",
|
||||
name: "本地优选",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_shopIcon4.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_shopIcon4.png",
|
||||
name: "社区拼团",
|
||||
url: ""
|
||||
},
|
||||
],
|
||||
cardList: [
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_cardIcon1.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_cardIcon1.png",
|
||||
name: "我的积分",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_cardIcon2.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_cardIcon2.png",
|
||||
name: "积分兑换",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_cardIcon3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_cardIcon3.png",
|
||||
name: "我的优惠卡",
|
||||
url: ""
|
||||
},
|
||||
{
|
||||
icon: "https://static.hshuishang.com/property-img-file/com_cardIcon4.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_cardIcon4.png",
|
||||
name: "我的会员卡",
|
||||
url: ""
|
||||
},
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<view class="swiper">
|
||||
<swiper>
|
||||
<swiper-item>
|
||||
<image src="https://static.hshuishang.com/doorToDoor/door_img.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_img.png" mode="" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
@ -29,25 +29,25 @@
|
||||
<view class="serviceTagItem" @click="jump">
|
||||
<view class="serviceTagItem_name">家政保洁</view>
|
||||
<view class="serviceTagItem_img1">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/hot1.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/hot1.png" mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="serviceTagItem item2" @click="jump">
|
||||
<view class="serviceTagItem_name">专业保姆</view>
|
||||
<view class="serviceTagItem_img2">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/hot2.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/hot2.png" mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="serviceTagItem item3" @click="jump">
|
||||
<view class="serviceTagItem_name">家电维修</view>
|
||||
<view class="serviceTagItem_img3">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/hot3.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/hot3.png" mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="serviceTagItem item4" @click="jump">
|
||||
<view class="serviceTagItem_name">搬家拉货</view>
|
||||
<view class="serviceTagItem_img4">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/hot4.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/hot4.png" mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -65,7 +65,7 @@
|
||||
<view class="item_tit_left">{{item.cate_name}}</view>
|
||||
<view class="item_tit_right" @click="jump(item.cate_id)">
|
||||
更多
|
||||
<image src="https://static.hshuishang.com/water_filter/filter_more.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png" mode="" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="item_goodsList">
|
||||
@ -123,55 +123,55 @@
|
||||
return {
|
||||
tabList:[{
|
||||
name:"服务中心",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon1.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon1.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
{
|
||||
name:"家政保洁",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon2.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon2.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
{
|
||||
name:"衣物洗护",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon3.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon3.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
|
||||
},
|
||||
{
|
||||
name:"家电维修",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon4.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon4.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
|
||||
},
|
||||
{
|
||||
name:"跑腿服务",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon5.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon5.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
{
|
||||
name:"养车用车",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon6.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon6.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
{
|
||||
name:"保姆月嫂",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon7.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon7.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
{
|
||||
name:"家电清洗",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon8.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon8.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
|
||||
},
|
||||
{
|
||||
name:"搬家拉货",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon9.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon9.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
{
|
||||
name:"家装维修",
|
||||
img:'https://static.hshuishang.com/doorToDoor/door_icon10.png',
|
||||
img:'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/door_icon10.png',
|
||||
url:"../ServiceMore/ServiceMore",
|
||||
},
|
||||
],
|
||||
|
||||
@ -4,29 +4,29 @@
|
||||
<view class="tit">请填写预约信息</view>
|
||||
<view class="row none" v-if="isreal == 1">
|
||||
<view class="row_tit">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon1.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon1.png" mode="" />
|
||||
请选择上门时间
|
||||
</view>
|
||||
|
||||
<view class="row_con" @click="changeShow">
|
||||
{{time}}
|
||||
<image src="https://static.hshuishang.com/water_filter/filter_more.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png" mode="" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none" v-if="isreal == 2">
|
||||
<view class="row_tit">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon2.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon2.png" mode="" />
|
||||
请选择服务时间
|
||||
</view>
|
||||
<view class="row_con" @click="changeShow2">
|
||||
{{serTime}}
|
||||
<image src="https://static.hshuishang.com/water_filter/filter_more.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png" mode="" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="row">
|
||||
<view class="row_tit">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon3.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon3.png" mode="" />
|
||||
联系人姓名
|
||||
</view>
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon4.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon4.png" mode="" />
|
||||
联系人电话
|
||||
</view>
|
||||
|
||||
@ -62,18 +62,18 @@
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon5.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon5.png" mode="" />
|
||||
请选择服务地址
|
||||
</view>
|
||||
<view class="row_con" @click="changeArea">
|
||||
|
||||
{{citys}}
|
||||
<image src="https://static.hshuishang.com/water_filter/filter_more.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png" mode="" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon5.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon5.png" mode="" />
|
||||
详细地址
|
||||
</view>
|
||||
|
||||
@ -103,7 +103,7 @@
|
||||
<view class="gray"></view>
|
||||
<view class="row none">
|
||||
<view class="row_tit2">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/reser_icon6.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/reser_icon6.png" mode="" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="给商家捎句话"
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<view class="item_left_msg_tit">
|
||||
{{item.title}}
|
||||
<view class="phone" @click="call">
|
||||
<image src="https://static.hshuishang.com/doorToDoor/phone.png" mode="widthFix" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/doorToDoor/phone.png" mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="item_left_msg_time">服务时间：{{item.biz_time}}</view>
|
||||
|
||||
@ -8,22 +8,22 @@
|
||||
<view class="msg">
|
||||
<view class="msg_left">
|
||||
<view class="msg_left_1">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_time.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_time.png" mode="" />
|
||||
{{info.opening_time}}-{{info.closing_time}}
|
||||
<view>{{info.is_open === 1 ? '营业' :'停业'}}</view>
|
||||
</view>
|
||||
<view class="msg_left_2">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_add.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_add.png" mode="" />
|
||||
{{info.addr}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="msg_right">
|
||||
<view class="msg_right1" @click="call">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_phone.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_phone.png" mode="" />
|
||||
电话
|
||||
</view>
|
||||
<view class="msg_right2" @click="handleOptionClick">
|
||||
<image src="https://static.hshuishang.com/kitchen/kitchen_add.png" mode="" />
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/kitchen/kitchen_add.png" mode="" />
|
||||
导航
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -1,279 +0,0 @@
|
||||
/* addMer/index.css */
|
||||
page {
|
||||
padding-bottom: 0rpx;
|
||||
}
|
||||
|
||||
.establish-acceptor-container {
|
||||
padding: 0 30rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.acceptor-form {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin-bottom: 24rpx;
|
||||
padding-bottom: 12rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 32rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.form-label.required::after {
|
||||
content: '*';
|
||||
color: #e64340;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.form-input:focus {
|
||||
border-color: #007aff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.form-input::placeholder {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 弹窗样式 */
|
||||
.popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
width: 80%;
|
||||
max-height: 70vh;
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.popup-title {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
max-height: 50vh;
|
||||
}
|
||||
|
||||
.popup-item {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.popup-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
padding: 20rpx;
|
||||
border-top: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-cancel-btn {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
background-color: #fff;
|
||||
border: 1rpx solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
font-size: 32rpx;
|
||||
background-color: #007aff;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* 弹窗选择器样式 */
|
||||
.popup-select {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
background-color: #fff;
|
||||
height: 88rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
/* 附件上传样式 */
|
||||
.attachment-section {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.attachment-item {
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 8rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.upload-btn:active {
|
||||
background-color: #0051d5;
|
||||
}
|
||||
|
||||
.file-info {
|
||||
margin-top: 16rpx;
|
||||
padding: 16rpx;
|
||||
background-color: #e8f4ff;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
color: #007aff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
padding: 0rpx 20rpx;
|
||||
background-color: #e64340;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 10rpx;
|
||||
font-size: 24rpx;
|
||||
cursor: pointer;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
|
||||
.delete-btn:active {
|
||||
background-color: #c21f1c;
|
||||
}
|
||||
|
||||
.add-attachment-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #f0f0f0;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-attachment-btn:active {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
/* 提交按钮样式 */
|
||||
.submit-section {
|
||||
margin-top: 40rpx;
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.submit-btn,
|
||||
.submit-btn1 {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.3);
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background-color: #007aff;
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.submit-btn1 {
|
||||
background-color: #ff4016;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.submit-btn:active {
|
||||
background-color: #0051d5;
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
.submit-btn:disabled {
|
||||
background-color: #b8d5ff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* 输入框错误状态 */
|
||||
.form-input.error {
|
||||
border-color: #e64340;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
::-webkit-scrollbar {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #c1c1c1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #a8a8a8;
|
||||
}
|
||||
@ -1,749 +0,0 @@
|
||||
<template>
|
||||
<view class="establish-acceptor-container">
|
||||
<form class="acceptor-form" @submit.prevent="submitForm">
|
||||
<!-- 基本信息 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户ID</label>
|
||||
<input type="number" class="form-input" v-model.number="formData.mch_id" placeholder="请输入商户ID"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户注册名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.merRegName"
|
||||
placeholder="请输入商户注册名称，长度不小于4个汉字，8~40字符" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户地区代码</label>
|
||||
<view class="popup-select" @click="showAreaPopup = true">
|
||||
<span>{{ selectedAreaLabel || '请选择商户地区代码' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户详细地址</label>
|
||||
<input type="text" class="form-input" v-model="formData.merRegAddr"
|
||||
placeholder="请输入去除省、市、区后的详细地址，6-200字符" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户MCC编号</label>
|
||||
<view class="popup-select" @click="showMccPopup = true">
|
||||
<span>{{ selectedMccLabel || '请选择商户MCC编号' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">营业执照名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.merBlisName"
|
||||
placeholder="请输入营业执照名称，小微商户可不传">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">营业执照号</label>
|
||||
<input type="text" class="form-input" v-model="formData.merBlis" placeholder="请输入营业执照号，小微商户可不传">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">营业执照开始日期</label>
|
||||
<input type="date" class="form-input" v-model="formData.merBlisStDt" placeholder="请选择营业执照开始日期">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">营业执照有效期</label>
|
||||
<input type="date" class="form-input" v-model="formData.merBlisExpDt" placeholder="请选择营业执照有效期">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户经营内容</label>
|
||||
<view class="popup-select" @click="showBusiContentPopup = true">
|
||||
<span>{{ selectedBusiContentLabel || '请选择商户经营内容' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 法人信息 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户法人姓名</label>
|
||||
<input type="text" class="form-input" v-model="formData.larName" placeholder="请输入商户法人姓名" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">法人证件类型</label>
|
||||
<view class="popup-select" @click="showIdTypePopup = true">
|
||||
<span>{{ selectedIdTypeLabel || '请选择法人证件类型' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">法人身份证号码</label>
|
||||
<input type="text" class="form-input" v-model="formData.larIdcard" placeholder="请输入法人身份证号码"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">法人身份证开始日期</label>
|
||||
<input type="date" class="form-input" v-model="formData.larIdcardStDt" placeholder="请选择法人身份证开始日期"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">法人身份证有效期</label>
|
||||
<input type="date" class="form-input" v-model="formData.larIdcardExpDt" placeholder="请选择法人身份证有效期"
|
||||
required>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 联系人信息 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户联系人姓名</label>
|
||||
<input type="text" class="form-input" v-model="formData.merContactName" placeholder="请输入商户联系人姓名"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户联系人手机号码</label>
|
||||
<input type="number" class="form-input" v-model="formData.merContactMobile"
|
||||
placeholder="请输入商户联系人手机号码" required>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 结算账户信息 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">结算账户开户行号</label>
|
||||
<input type="text" class="form-input" v-model="formData.openningBankCode" placeholder="请输入结算账户开户行号"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">结算账户开户行名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.openningBankName" placeholder="请输入结算账户开户行名称"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">结算账户清算行号</label>
|
||||
<input type="text" class="form-input" v-model="formData.clearingBankCode" placeholder="请输入结算账户清算行号"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">结算账户账号</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctNo" placeholder="请输入结算账户账号" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">结算账户名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctName" placeholder="请输入结算账户名称" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">结算账户性质</label>
|
||||
<view class="popup-select" @click="showAcctTypePopup = true">
|
||||
<span>{{ selectedAcctTypeLabel || '请选择结算账户性质' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 附件上传 -->
|
||||
<view class="form-section">
|
||||
<h3 class="section-title">附件上传（可选）</h3>
|
||||
<view class="attachment-section">
|
||||
<view class="attachment-item" v-for="(file, index) in formData.fileData" :key="index">
|
||||
<view class="form-item">
|
||||
<label class="form-label">附件类型</label>
|
||||
<view class="popup-select" @click="showFileAttachTypePopup = index">
|
||||
<span>{{ getAttachTypeLabel(file.attType) || '请选择附件类型' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
<button class="upload-btn" @click="uploadFile(index)">上传文件</button>
|
||||
<view v-if="file.attFileId" class="file-info">
|
||||
<span>{{ file.attachName || '已上传文件' }}</span>
|
||||
<button class="delete-btn" @click="removeFile(index)">删除</button>
|
||||
</view>
|
||||
</view>
|
||||
<button class="add-attachment-btn" @click="addFile">添加附件</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 提交按钮 -->
|
||||
<view class="form-section submit-section">
|
||||
<button type="button" class="submit-btn1" @click="ecQuery">结果查询</button>
|
||||
<button type="submit" class="submit-btn" @click="submitForm">提交申请</button>
|
||||
</view>
|
||||
</form>
|
||||
|
||||
<!-- 地区代码弹窗 -->
|
||||
<view class="popup" v-if="showAreaPopup">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择商户地区代码</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="area in areaOptions" :key="area.value" @click="selectArea(area)">
|
||||
{{ area.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showAreaPopup = false">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- MCC编号弹窗 -->
|
||||
<view class="popup" v-if="showMccPopup">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择商户MCC编号</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="mcc in mccOptions" :key="mcc.value" @click="selectMcc(mcc)">
|
||||
{{ mcc.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showMccPopup = false">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 经营内容弹窗 -->
|
||||
<view class="popup" v-if="showBusiContentPopup">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择商户经营内容</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="content in busiContentOptions" :key="content.value"
|
||||
@click="selectBusiContent(content)">
|
||||
{{ content.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showBusiContentPopup = false">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 法人证件类型弹窗 -->
|
||||
<view class="popup" v-if="showIdTypePopup">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择法人证件类型</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in idTypeOptions" :key="type.value"
|
||||
@click="selectIdType(type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showIdTypePopup = false">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 结算账户性质弹窗 -->
|
||||
<view class="popup" v-if="showAcctTypePopup">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择结算账户性质</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in acctTypeOptions" :key="type.value"
|
||||
@click="selectAcctType(type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showAcctTypePopup = false">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 文件附件类型弹窗 -->
|
||||
<view class="popup" v-if="showFileAttachTypePopup >= 0">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择附件类型</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in fileAttachTypeOptions" :key="type.value"
|
||||
@click="selectFileAttachType(showFileAttachTypePopup, type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showFileAttachTypePopup = -1">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo, RequsetUrl } from "../../../utils";
|
||||
import { apiArr } from "../../../api/contract";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 表单数据
|
||||
formData: {
|
||||
mch_id: null, // 商户ID
|
||||
merRegName: '', // 商户注册名称
|
||||
merRegDistCode: '', // 商户地区代码
|
||||
merRegAddr: '', // 商户详细地址
|
||||
mccCode: '', // 商户MCC编号
|
||||
merBlisName: '', // 营业执照名称
|
||||
merBlis: '', // 营业执照号
|
||||
merBlisStDt: '', // 营业执照开始日期
|
||||
merBlisExpDt: '', // 营业执照有效期
|
||||
merBusiContent: '', // 商户经营内容
|
||||
larName: '', // 商户法人姓名
|
||||
larIdType: '', // 法人证件类型
|
||||
larIdcard: '', // 法人身份证号码
|
||||
larIdcardStDt: '', // 法人身份证开始日期
|
||||
larIdcardExpDt: '', // 法人身份证有效期
|
||||
merContactMobile: '', // 商户联系人手机号码
|
||||
merContactName: '', // 商户联系人姓名
|
||||
openningBankCode: '', // 结算账户开户行号
|
||||
openningBankName: '', // 结算账户开户行名称
|
||||
clearingBankCode: '', // 结算账户清算行号
|
||||
acctNo: '', // 结算账户账号
|
||||
acctName: '', // 结算账户名称
|
||||
acctTypeCode: '', // 结算账户性质
|
||||
feeData: [], // 费率数据（可选）
|
||||
fileData: [
|
||||
{
|
||||
attType: '',
|
||||
attFileId: '',
|
||||
attachName: ''
|
||||
}
|
||||
] // 文件数据（可选）
|
||||
},
|
||||
|
||||
// 弹窗控制
|
||||
showAreaPopup: false,
|
||||
showMccPopup: false,
|
||||
showBusiContentPopup: false,
|
||||
showIdTypePopup: false,
|
||||
showAcctTypePopup: false,
|
||||
showFileAttachTypePopup: -1,
|
||||
|
||||
// 选择项标签
|
||||
selectedAreaLabel: '',
|
||||
selectedMccLabel: '',
|
||||
selectedBusiContentLabel: '',
|
||||
selectedIdTypeLabel: '',
|
||||
selectedAcctTypeLabel: '',
|
||||
|
||||
// 选项数据（示例数据，实际应从API获取）
|
||||
areaOptions: [
|
||||
{ value: '110101', label: '北京市东城区' },
|
||||
{ value: '110102', label: '北京市西城区' },
|
||||
{ value: '310101', label: '上海市黄浦区' },
|
||||
{ value: '310102', label: '上海市黄浦区' }
|
||||
],
|
||||
|
||||
mccOptions: [
|
||||
{ value: '5411', label: '大型超市' },
|
||||
{ value: '5999', label: '其他零售商户' },
|
||||
{ value: '7011', label: '住宿服务' },
|
||||
{ value: '7221', label: '美容美发服务' }
|
||||
],
|
||||
|
||||
busiContentOptions: [
|
||||
{ value: 'GROCERY', label: '食品饮料' },
|
||||
{ value: 'CLOTHING', label: '服装鞋帽' },
|
||||
{ value: 'SERVICE', label: '生活服务' },
|
||||
{ value: 'ENTERTAINMENT', label: '娱乐休闲' }
|
||||
],
|
||||
|
||||
idTypeOptions: [
|
||||
{ value: 'IDCARD', label: '身份证' },
|
||||
{ value: 'PASSPORT', label: '护照' },
|
||||
{ value: 'MILITARY_ID', label: '军人证' },
|
||||
{ value: 'OTHER', label: '其他' }
|
||||
],
|
||||
|
||||
acctTypeOptions: [
|
||||
{ value: '57', label: '对公' },
|
||||
{ value: '58', label: '对私' }
|
||||
],
|
||||
|
||||
fileAttachTypeOptions: [
|
||||
{ value: 'FR_ID_CARD_FRONT', label: '法人身份证正面' },
|
||||
{ value: 'FR_ID_CARD_BEHIND', label: '法人身份证反面' },
|
||||
{ value: 'ID_CARD_FRONT', label: '结算人身份证正面' },
|
||||
{ value: 'ID_CARD_BEHIND', label: '结算人身份证反面' },
|
||||
{ value: 'BANK_CARD', label: '银行卡' },
|
||||
{ value: 'BUSINESS_LICENCE', label: '营业执照' },
|
||||
{ value: 'MERCHANT_PHOTO', label: '商户门头照' },
|
||||
{ value: 'SHOPINNER', label: '商铺内部照片' },
|
||||
{ value: 'XY', label: '线下纸质协议' },
|
||||
{ value: 'NETWORK_XY', label: '电子协议' },
|
||||
{ value: 'HT', label: '租赁合同' },
|
||||
{ value: 'COOPERATION_QUALIFICATION_PROOF', label: '合作资质证明' },
|
||||
{ value: 'FOOD_QUALIFICATION_PROOF', label: '食品经营相关资质' },
|
||||
{ value: 'NO_LEGAL_PERSON_SETT_AUTH_LETTER', label: '非法人结算授权书' },
|
||||
{ value: 'SPLIT_ENTRUST_FILE', label: '结算授权委托书' },
|
||||
{ value: 'RENTAL_AGREEMENT', label: '集市方与场地方间的租赁协议' },
|
||||
{ value: 'SPLIT_COOPERATION_FILE', label: '集市方与摊主间的合作协议' },
|
||||
{ value: 'OTHERS', label: '其他' }
|
||||
]
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 添加附件
|
||||
addFile() {
|
||||
this.formData.fileData.push({
|
||||
attType: '',
|
||||
attFileId: '',
|
||||
attachName: ''
|
||||
});
|
||||
},
|
||||
|
||||
// 选择商户地区代码
|
||||
selectArea(area) {
|
||||
this.formData.merRegDistCode = area.value;
|
||||
this.selectedAreaLabel = area.label;
|
||||
this.showAreaPopup = false;
|
||||
},
|
||||
|
||||
// 选择商户MCC编号
|
||||
selectMcc(mcc) {
|
||||
this.formData.mccCode = mcc.value;
|
||||
this.selectedMccLabel = mcc.label;
|
||||
this.showMccPopup = false;
|
||||
},
|
||||
|
||||
// 选择商户经营内容
|
||||
selectBusiContent(content) {
|
||||
this.formData.merBusiContent = content.value;
|
||||
this.selectedBusiContentLabel = content.label;
|
||||
this.showBusiContentPopup = false;
|
||||
},
|
||||
|
||||
// 选择法人证件类型
|
||||
selectIdType(type) {
|
||||
this.formData.larIdType = type.value;
|
||||
this.selectedIdTypeLabel = type.label;
|
||||
this.showIdTypePopup = false;
|
||||
},
|
||||
|
||||
// 选择结算账户性质
|
||||
selectAcctType(type) {
|
||||
this.formData.acctTypeCode = type.value;
|
||||
this.selectedAcctTypeLabel = type.label;
|
||||
this.showAcctTypePopup = false;
|
||||
},
|
||||
|
||||
// 选择文件附件类型
|
||||
selectFileAttachType(index, type) {
|
||||
this.formData.fileData[index].attType = type.value;
|
||||
this.showFileAttachTypePopup = -1;
|
||||
},
|
||||
|
||||
// 获取附件类型标签
|
||||
getAttachTypeLabel(typeValue) {
|
||||
if (!typeValue) return '';
|
||||
const option = this.fileAttachTypeOptions.find(type => type.value === typeValue);
|
||||
return option ? option.label : '';
|
||||
},
|
||||
|
||||
// 删除附件
|
||||
removeFile(index) {
|
||||
this.formData.fileData.splice(index, 1);
|
||||
},
|
||||
|
||||
// 上传文件
|
||||
uploadFile(index) {
|
||||
const fileData = this.formData.fileData[index];
|
||||
|
||||
// 检查是否选择了附件类型
|
||||
if (!fileData.attType) {
|
||||
uni.showToast({
|
||||
title: '请先选择附件类型',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 调用 uni.chooseMessageFile API 选择文件
|
||||
uni.chooseMessageFile({
|
||||
count: 1,
|
||||
type: 'file',
|
||||
extension: ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'], // 支持的文件类型
|
||||
success: (res) => {
|
||||
const tempFile = res.tempFiles[0];
|
||||
console.log("选择的文件:", tempFile);
|
||||
|
||||
// 设置文件名
|
||||
fileData.attachName = tempFile.name;
|
||||
|
||||
// 显示上传中提示
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 直接使用uni.uploadFile上传文件
|
||||
uni.uploadFile({
|
||||
url: RequsetUrl + apiArr.upload, // 完整的上传接口URL
|
||||
filePath: tempFile.path, // 文件路径
|
||||
name: 'file', // 文件对应的key，根据后端要求设置
|
||||
formData: {
|
||||
attType: fileData.attType // 附件类型
|
||||
},
|
||||
header: {
|
||||
Authorization: uni.getStorageSync("ctoken") // 添加认证信息
|
||||
},
|
||||
success: (uploadRes) => {
|
||||
// 解析响应数据
|
||||
const res = JSON.parse(uploadRes.data);
|
||||
|
||||
// 更新附件信息
|
||||
fileData.attFileId = res.data.respData.attFileId;
|
||||
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('文件上传失败:', error);
|
||||
uni.showToast({
|
||||
title: '上传失败',
|
||||
icon: 'none'
|
||||
});
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading(); // 隐藏加载提示
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('选择文件失败:', err);
|
||||
uni.showToast({
|
||||
title: '选择文件失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 表单验证
|
||||
validateForm() {
|
||||
const { formData } = this;
|
||||
|
||||
// 验证必需字段
|
||||
if (!formData.mch_id) {
|
||||
uni.showToast({ title: '请输入商户ID', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.merRegName) {
|
||||
uni.showToast({ title: '请输入商户注册名称', icon: 'none' });
|
||||
return false;
|
||||
} else if (formData.merRegName.length < 8 || formData.merRegName.length > 40) {
|
||||
uni.showToast({ title: '商户注册名称长度必须在8~40字符之间', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.merRegDistCode) {
|
||||
uni.showToast({ title: '请选择商户地区代码', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.merRegAddr) {
|
||||
uni.showToast({ title: '请输入商户详细地址', icon: 'none' });
|
||||
return false;
|
||||
} else if (formData.merRegAddr.length < 6 || formData.merRegAddr.length > 200) {
|
||||
uni.showToast({ title: '商户详细地址长度必须在6~200字符之间', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.mccCode) {
|
||||
uni.showToast({ title: '请选择商户MCC编号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.merBusiContent) {
|
||||
uni.showToast({ title: '请选择商户经营内容', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.larName) {
|
||||
uni.showToast({ title: '请输入商户法人姓名', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.larIdType) {
|
||||
uni.showToast({ title: '请选择法人证件类型', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.larIdcard) {
|
||||
uni.showToast({ title: '请输入法人身份证号码', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.larIdcardStDt) {
|
||||
uni.showToast({ title: '请选择法人身份证开始日期', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.larIdcardExpDt) {
|
||||
uni.showToast({ title: '请选择法人身份证有效期', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.merContactMobile) {
|
||||
uni.showToast({ title: '请输入商户联系人手机号码', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.merContactName) {
|
||||
uni.showToast({ title: '请输入商户联系人姓名', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.openningBankCode) {
|
||||
uni.showToast({ title: '请输入结算账户开户行号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.openningBankName) {
|
||||
uni.showToast({ title: '请输入结算账户开户行名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.clearingBankCode) {
|
||||
uni.showToast({ title: '请输入结算账户清算行号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctNo) {
|
||||
uni.showToast({ title: '请输入结算账户账号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctName) {
|
||||
uni.showToast({ title: '请输入结算账户名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctTypeCode) {
|
||||
uni.showToast({ title: '请选择结算账户性质', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
|
||||
ecQuery() {
|
||||
const storeValue = uni.getStorageSync('storeValue');
|
||||
if (!storeValue || !storeValue.contractId) {
|
||||
uni.showToast({
|
||||
title: '请先提交申请',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
const params = {
|
||||
contractId: storeValue.contractId
|
||||
}
|
||||
request(apiArr.queryMerchant, "POST", params).then(res => {
|
||||
if (res.respData.contractStatus === 'REVIEW_ING') {
|
||||
uni.showToast({
|
||||
title: '审核通过',
|
||||
icon: 'success'
|
||||
});
|
||||
uni.setStorageSync('storeValue', { merInnerNo: res.respData.merInnerNo });
|
||||
uni.setStorageSync('storeValue', { merCupNo: res.respData.merCupNo });
|
||||
} else if (res.respData.contractStatus === 'WAIT_FOR_CONTACT') {
|
||||
uni.showToast({
|
||||
title: '审核驳回',
|
||||
icon: 'none'
|
||||
});
|
||||
} else if (res.respData.contractStatus === 'MANUAL_AUDIT') {
|
||||
uni.showToast({
|
||||
title: '审核中',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 表单提交逻辑
|
||||
submitForm() {
|
||||
// 验证表单
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 准备请求参数
|
||||
const submitData = {
|
||||
mch_id: this.formData.mch_id,
|
||||
merRegName: this.formData.merRegName,
|
||||
merRegDistCode: this.formData.merRegDistCode,
|
||||
merRegAddr: this.formData.merRegAddr,
|
||||
mccCode: this.formData.mccCode,
|
||||
merBlisName: this.formData.merBlisName,
|
||||
merBlis: this.formData.merBlis,
|
||||
merBlisStDt: this.formData.merBlisStDt,
|
||||
merBlisExpDt: this.formData.merBlisExpDt,
|
||||
merBusiContent: this.formData.merBusiContent,
|
||||
larName: this.formData.larName,
|
||||
larIdType: this.formData.larIdType,
|
||||
larIdcard: this.formData.larIdcard,
|
||||
larIdcardStDt: this.formData.larIdcardStDt,
|
||||
larIdcardExpDt: this.formData.larIdcardExpDt,
|
||||
merContactMobile: this.formData.merContactMobile,
|
||||
merContactName: this.formData.merContactName,
|
||||
openningBankCode: this.formData.openningBankCode,
|
||||
openningBankName: this.formData.openningBankName,
|
||||
clearingBankCode: this.formData.clearingBankCode,
|
||||
acctNo: this.formData.acctNo,
|
||||
acctName: this.formData.acctName,
|
||||
acctTypeCode: this.formData.acctTypeCode,
|
||||
feeData: [],
|
||||
fileData: []
|
||||
};
|
||||
|
||||
// 只添加有attFileId的文件到fileData
|
||||
const validFiles = this.formData.fileData.filter(file => file.attFileId);
|
||||
if (validFiles.length > 0) {
|
||||
submitData.fileData = validFiles.map(file => ({
|
||||
attType: file.attType,
|
||||
attFileId: file.attFileId,
|
||||
attachName: file.attachName
|
||||
}));
|
||||
}
|
||||
|
||||
console.log('提交的数据:', submitData);
|
||||
|
||||
// 调用addMer接口提交数据
|
||||
request(apiArr.addMer, "POST", submitData).then(res => {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'success'
|
||||
});
|
||||
uni.setStorageSync('storeValue', { contractId: res.respData.contractId });
|
||||
}).catch(error => {
|
||||
uni.hideLoading();
|
||||
console.error('提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '提交失败',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,283 +0,0 @@
|
||||
/* 分账接收方创建页面样式 */
|
||||
.establish-acceptor-container {
|
||||
padding: 0 30rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
page{
|
||||
padding-bottom: 0rpx;
|
||||
}
|
||||
|
||||
/* 弹窗样式 */
|
||||
.popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
width: 80%;
|
||||
max-height: 70vh;
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.popup-title {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
max-height: 50vh;
|
||||
}
|
||||
|
||||
.popup-item {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.popup-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
padding: 20rpx;
|
||||
border-top: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-cancel-btn {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
background-color: #fff;
|
||||
border: 1rpx solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
font-size: 32rpx;
|
||||
background-color: #007aff;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* 弹窗选择器样式 */
|
||||
.popup-select {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
border: 1rpx solid #ddd;
|
||||
border-radius: 6rpx;
|
||||
background-color: #fff;
|
||||
min-height: 80rpx;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
margin: 30rpx 0 40rpx;
|
||||
}
|
||||
|
||||
.acceptor-form {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin-bottom: 24rpx;
|
||||
padding-bottom: 12rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 32rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.form-label.required::after {
|
||||
content: '*';
|
||||
color: #e64340;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.form-input:focus {
|
||||
border-color: #007aff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.form-input::placeholder {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 附件上传样式 */
|
||||
.attachment-section {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.attachment-item {
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 8rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.upload-btn:active {
|
||||
background-color: #0051d5;
|
||||
}
|
||||
|
||||
.file-info {
|
||||
margin-top: 16rpx;
|
||||
padding: 16rpx;
|
||||
background-color: #e8f4ff;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
color: #007aff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
padding: 0rpx 20rpx;
|
||||
background-color: #e64340;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 10rpx;
|
||||
font-size: 24rpx;
|
||||
cursor: pointer;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
|
||||
.delete-btn:active {
|
||||
background-color: #c21f1c;
|
||||
}
|
||||
|
||||
.add-attachment-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #f0f0f0;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-attachment-btn:active {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
/* 提交按钮样式 */
|
||||
.submit-section {
|
||||
margin-top: 40rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.3);
|
||||
}
|
||||
|
||||
.submit-btn:active {
|
||||
background-color: #0051d5;
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
.submit-btn:disabled {
|
||||
background-color: #b8d5ff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* 响应式调整 */
|
||||
@media (min-width: 768px) {
|
||||
.establish-acceptor-container {
|
||||
max-width: 800rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* 输入框错误状态 */
|
||||
.form-input.error {
|
||||
border-color: #e64340;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
::-webkit-scrollbar {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #c1c1c1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #a8a8a8;
|
||||
}
|
||||
@ -1,410 +0,0 @@
|
||||
<template>
|
||||
<view class="establish-acceptor-container">
|
||||
<form class="acceptor-form" @submit.prevent="submitForm">
|
||||
<!-- 基本信息 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label">分账商户内部商户号</label>
|
||||
<input type="text" class="form-input" v-model="formData.merInnerNo" placeholder="请输入分账商户内部商户号">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">分账商户银联商户号</label>
|
||||
<input type="text" class="form-input" v-model="formData.merCupNo" placeholder="请输入分账商户银联商户号">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">分账接收方编号</label>
|
||||
<input type="text" class="form-input" v-model="formData.receiverNo" placeholder="请输入分账接收方编号" required>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 合作协议附件 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">附件名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.entrustFileName" placeholder="请输入合作协议附件名称" required>
|
||||
</view>
|
||||
<button class="upload-btn" @click="uploadEntrustFile">上传合作协议</button>
|
||||
<view v-if="formData.entrustFilePath" class="file-info">
|
||||
<span>{{ formData.entrustFileName || '已上传文件' }}</span>
|
||||
<button class="delete-btn" @click="removeEntrustFile">删除</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 其他附件（可选） -->
|
||||
<view class="form-section">
|
||||
<h3 class="section-title">附件上传（可选）</h3>
|
||||
<view class="attachment-section">
|
||||
<view class="attachment-item" v-for="(attachment, index) in formData.attachments" :key="index">
|
||||
<view class="form-item">
|
||||
<label class="form-label">附件类型</label>
|
||||
<view class="popup-select" @click="showAttachTypePopup = index">
|
||||
<span>{{ getAttachTypeLabel(attachment.attachType) || '请选择附件类型' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<label class="form-label">附件名称</label>
|
||||
<input type="text" class="form-input" v-model="attachment.attachName" placeholder="请输入附件名称">
|
||||
</view>
|
||||
<button class="upload-btn" @click="uploadFile(index)">上传文件</button>
|
||||
<view v-if="attachment.attachStorePath" class="file-info">
|
||||
<span>{{ attachment.attachName || '已上传文件' }}</span>
|
||||
<button class="delete-btn" @click="removeAttachment(index)">删除</button>
|
||||
</view>
|
||||
</view>
|
||||
<button class="add-attachment-btn" @click="addAttachment">添加附件</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-section submit-section">
|
||||
<button type="submit" class="submit-btn" @click="submitForm">申请绑定</button>
|
||||
</view>
|
||||
</form>
|
||||
|
||||
<!-- 附件类型弹窗 -->
|
||||
<view class="popup" v-if="showAttachTypePopup >= 0">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择附件类型</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in attachTypeOptions" :key="type.value" @click="selectAttachType(showAttachTypePopup, type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showAttachTypePopup = -1">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo, RequsetUrl } from "../../../utils";
|
||||
import { apiArr } from "../../../api/contract";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 弹窗控制
|
||||
showAttachTypePopup: -1,
|
||||
|
||||
// 附件类型选项
|
||||
attachTypeOptions: [
|
||||
{ value: 'FR_ID_CARD_FRONT', label: '法人身份证正面' },
|
||||
{ value: 'FR_ID_CARD_BEHIND', label: '法人身份证反面' },
|
||||
{ value: 'ID_CARD_FRONT', label: '结算人身份证正面' },
|
||||
{ value: 'ID_CARD_BEHIND', label: '结算人身份证反面' },
|
||||
{ value: 'BANK_CARD', label: '银行卡' },
|
||||
{ value: 'BUSINESS_LICENCE', label: '营业执照' },
|
||||
{ value: 'MERCHANT_PHOTO', label: '商户门头照' },
|
||||
{ value: 'SHOPINNER', label: '商铺内部照片' },
|
||||
{ value: 'XY', label: '线下纸质协议' },
|
||||
{ value: 'NETWORK_XY', label: '电子协议' },
|
||||
{ value: 'HT', label: '租赁合同' },
|
||||
{ value: 'COOPERATION_QUALIFICATION_PROOF', label: '合作资质证明' },
|
||||
{ value: 'FOOD_QUALIFICATION_PROOF', label: '食品经营相关资质' },
|
||||
{ value: 'NO_LEGAL_PERSON_SETT_AUTH_LETTER', label: '非法人结算授权书' },
|
||||
{ value: 'SPLIT_ENTRUST_FILE', label: '结算授权委托书' },
|
||||
{ value: 'RENTAL_AGREEMENT', label: '集市方与场地方间的租赁协议' },
|
||||
{ value: 'SPLIT_COOPERATION_FILE', label: '集市方与摊主间的合作协议' },
|
||||
{ value: 'OTHERS', label: '其他' }
|
||||
],
|
||||
|
||||
// 表单数据
|
||||
formData: {
|
||||
// 可选字段
|
||||
merInnerNo: '',
|
||||
merCupNo: '',
|
||||
// 必需字段
|
||||
receiverNo: '',
|
||||
entrustFileName: '',
|
||||
entrustFilePath: '',
|
||||
// 可选附件列表
|
||||
attachments: []
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 添加附件
|
||||
addAttachment() {
|
||||
this.formData.attachments.push({
|
||||
attachType: '',
|
||||
attachName: '',
|
||||
attachStorePath: ''
|
||||
});
|
||||
},
|
||||
|
||||
// 选择附件类型
|
||||
selectAttachType(index, type) {
|
||||
this.formData.attachments[index].attachType = type.value;
|
||||
this.showAttachTypePopup = -1;
|
||||
},
|
||||
|
||||
// 获取附件类型标签
|
||||
getAttachTypeLabel(typeValue) {
|
||||
if (!typeValue) return '';
|
||||
const option = this.attachTypeOptions.find(type => type.value === typeValue);
|
||||
return option ? option.label : '';
|
||||
},
|
||||
|
||||
// 删除附件
|
||||
removeAttachment(index) {
|
||||
this.formData.attachments.splice(index, 1);
|
||||
},
|
||||
|
||||
// 上传合作协议文件
|
||||
uploadEntrustFile() {
|
||||
// 调用 uni.chooseMessageFile API 选择文件
|
||||
uni.chooseMessageFile({
|
||||
count: 1,
|
||||
type: 'file',
|
||||
extension: ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'], // 支持的文件类型
|
||||
success: (res) => {
|
||||
const tempFile = res.tempFiles[0];
|
||||
console.log("选择的文件:", tempFile);
|
||||
|
||||
// 如果用户没有填写附件名称，使用选择的文件名
|
||||
if (!this.formData.entrustFileName) {
|
||||
this.formData.entrustFileName = tempFile.name;
|
||||
}
|
||||
|
||||
// 显示上传中提示
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 直接使用uni.uploadFile上传文件
|
||||
uni.uploadFile({
|
||||
url: RequsetUrl + apiArr.upload, // 完整的上传接口URL
|
||||
filePath: tempFile.path, // 文件路径
|
||||
name: 'file', // 文件对应的key，根据后端要求设置
|
||||
formData: {
|
||||
attType: 'ENTRUST_FILE' // 合作协议附件类型
|
||||
},
|
||||
header: {
|
||||
Authorization: uni.getStorageSync("ctoken") // 添加认证信息
|
||||
},
|
||||
success: (uploadRes) => {
|
||||
// 解析响应数据
|
||||
const res = JSON.parse(uploadRes.data);
|
||||
|
||||
// 更新附件信息
|
||||
this.formData.entrustFilePath = res.data.respData.attFileId;
|
||||
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('文件上传失败:', error);
|
||||
uni.showToast({
|
||||
title: '上传失败',
|
||||
icon: 'none'
|
||||
});
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading(); // 隐藏加载提示
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('选择文件失败:', err);
|
||||
uni.showToast({
|
||||
title: '选择文件失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 删除合作协议文件
|
||||
removeEntrustFile() {
|
||||
this.formData.entrustFileName = '';
|
||||
this.formData.entrustFilePath = '';
|
||||
},
|
||||
|
||||
// 上传其他附件
|
||||
uploadFile(index) {
|
||||
const attachment = this.formData.attachments[index];
|
||||
|
||||
// 检查是否选择了附件类型
|
||||
if (!attachment.attachType) {
|
||||
uni.showToast({
|
||||
title: '请先选择附件类型',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 调用 uni.chooseMessageFile API 选择文件
|
||||
uni.chooseMessageFile({
|
||||
count: 1,
|
||||
type: 'file',
|
||||
extension: ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'], // 支持的文件类型
|
||||
success: (res) => {
|
||||
const tempFile = res.tempFiles[0];
|
||||
console.log("选择的文件:", tempFile);
|
||||
|
||||
// 如果用户没有填写附件名称，使用选择的文件名
|
||||
if (!attachment.attachName) {
|
||||
attachment.attachName = tempFile.name;
|
||||
}
|
||||
|
||||
// 显示上传中提示
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 直接使用uni.uploadFile上传文件
|
||||
uni.uploadFile({
|
||||
url: RequsetUrl + apiArr.upload, // 完整的上传接口URL
|
||||
filePath: tempFile.path, // 文件路径
|
||||
name: 'file', // 文件对应的key，根据后端要求设置
|
||||
formData: {
|
||||
attType: attachment.attachType // 其他表单参数
|
||||
},
|
||||
header: {
|
||||
Authorization: uni.getStorageSync("ctoken") // 添加认证信息
|
||||
},
|
||||
success: (uploadRes) => {
|
||||
// 解析响应数据
|
||||
const res = JSON.parse(uploadRes.data);
|
||||
|
||||
// 更新附件信息
|
||||
attachment.attachStorePath = res.data.respData.attFileId;
|
||||
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('文件上传失败:', error);
|
||||
uni.showToast({
|
||||
title: '上传失败',
|
||||
icon: 'none'
|
||||
});
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading(); // 隐藏加载提示
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('选择文件失败:', err);
|
||||
uni.showToast({
|
||||
title: '选择文件失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 表单验证
|
||||
validateForm() {
|
||||
const { formData } = this;
|
||||
|
||||
// 验证必需字段
|
||||
if (!formData.receiverNo) {
|
||||
uni.showToast({ title: '请输入分账接收方编号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.entrustFileName) {
|
||||
uni.showToast({ title: '请输入合作协议附件名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.entrustFilePath) {
|
||||
uni.showToast({ title: '请上传合作协议附件', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
|
||||
// 表单提交逻辑
|
||||
submitForm() {
|
||||
// 验证表单
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 准备请求参数
|
||||
const submitData = {
|
||||
merInnerNo: this.formData.merInnerNo, // 分账商户内部商户号（可选）
|
||||
merCupNo: this.formData.merCupNo, // 分账商户银联商户号（可选）
|
||||
receiverNo: this.formData.receiverNo, // 分账接收方编号（必需）
|
||||
entrustFileName: this.formData.entrustFileName, // 合作协议附件名称（必需）
|
||||
entrustFilePath: this.formData.entrustFilePath, // 合作协议附件路径（必需）
|
||||
attachments: [] // 分账关系绑定申请附件（可选）
|
||||
};
|
||||
|
||||
// 只添加有attachStorePath的附件到attachments
|
||||
const validAttachments = this.formData.attachments.filter(attach => attach.attachStorePath);
|
||||
if (validAttachments.length > 0) {
|
||||
submitData.attachments = validAttachments.map(attach => ({
|
||||
attachType: attach.attachType,
|
||||
attachName: attach.attachName,
|
||||
attachStorePath: attach.attachStorePath
|
||||
}));
|
||||
}
|
||||
|
||||
console.log('提交的数据:', submitData);
|
||||
|
||||
// 调用applyBind接口提交数据
|
||||
request(apiArr.applyBind, "POST", submitData).then(res => {
|
||||
uni.hideLoading();
|
||||
|
||||
if (res && res.cmdRetCode === 'SUCCESS') {
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'success'
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1500);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res?.retMsg || '提交失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading();
|
||||
console.error('提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '提交失败',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
// 重置表单
|
||||
resetForm() {
|
||||
this.formData = {
|
||||
merInnerNo: '',
|
||||
merCupNo: '',
|
||||
receiverNo: '',
|
||||
entrustFileName: '',
|
||||
entrustFilePath: '',
|
||||
attachments: []
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,279 +0,0 @@
|
||||
/* addMer/index.css */
|
||||
page {
|
||||
padding-bottom: 0rpx;
|
||||
}
|
||||
|
||||
.establish-acceptor-container {
|
||||
padding: 0 30rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.acceptor-form {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin-bottom: 24rpx;
|
||||
padding-bottom: 12rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 32rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.form-label.required::after {
|
||||
content: '*';
|
||||
color: #e64340;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.form-input:focus {
|
||||
border-color: #007aff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.form-input::placeholder {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 弹窗样式 */
|
||||
.popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
width: 80%;
|
||||
max-height: 70vh;
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.popup-title {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
max-height: 50vh;
|
||||
}
|
||||
|
||||
.popup-item {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.popup-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
padding: 20rpx;
|
||||
border-top: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-cancel-btn {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
background-color: #fff;
|
||||
border: 1rpx solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
font-size: 32rpx;
|
||||
background-color: #007aff;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* 弹窗选择器样式 */
|
||||
.popup-select {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
background-color: #fff;
|
||||
height: 88rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
/* 附件上传样式 */
|
||||
.attachment-section {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.attachment-item {
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 8rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.upload-btn:active {
|
||||
background-color: #0051d5;
|
||||
}
|
||||
|
||||
.file-info {
|
||||
margin-top: 16rpx;
|
||||
padding: 16rpx;
|
||||
background-color: #e8f4ff;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
color: #007aff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
padding: 0rpx 20rpx;
|
||||
background-color: #e64340;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 10rpx;
|
||||
font-size: 24rpx;
|
||||
cursor: pointer;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
|
||||
.delete-btn:active {
|
||||
background-color: #c21f1c;
|
||||
}
|
||||
|
||||
.add-attachment-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #f0f0f0;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-attachment-btn:active {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
/* 提交按钮样式 */
|
||||
.submit-section {
|
||||
margin-top: 40rpx;
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.submit-btn,
|
||||
.submit-btn1 {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.3);
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background-color: #007aff;
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.submit-btn1 {
|
||||
background-color: #ff4016;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.submit-btn:active {
|
||||
background-color: #0051d5;
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
.submit-btn:disabled {
|
||||
background-color: #b8d5ff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* 输入框错误状态 */
|
||||
.form-input.error {
|
||||
border-color: #e64340;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
::-webkit-scrollbar {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #c1c1c1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #a8a8a8;
|
||||
}
|
||||
@ -1,327 +0,0 @@
|
||||
<template>
|
||||
<view class="establish-acceptor-container">
|
||||
<form class="acceptor-form" @submit.prevent="submitForm">
|
||||
<!-- 基本信息 -->
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">商户号</label>
|
||||
<input type="number" class="form-input" v-model.number="formData.mch_id" placeholder="请输入商户号"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">拉卡拉内部商户号</label>
|
||||
<input type="text" class="form-input" v-model="formData.merInnerNo" placeholder="请输入拉卡拉内部商户号（可选）">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">银联商户号</label>
|
||||
<input type="text" class="form-input" v-model="formData.merCupNo" placeholder="请输入银联商户号（可选）">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">联系手机号</label>
|
||||
<input type="number" class="form-input" v-model="formData.contactMobile" placeholder="请输入联系手机号"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">电子分账协议号</label>
|
||||
<input type="text" class="form-input" v-model="formData.eleContractNo" placeholder="请输入电子分账协议号（可选）">
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 附件上传 -->
|
||||
<view class="form-section">
|
||||
<h3 class="section-title">附件上传（可选）</h3>
|
||||
<view class="attachment-section">
|
||||
<view class="attachment-item" v-for="(file, index) in formData.fileData" :key="index">
|
||||
<view class="form-item">
|
||||
<label class="form-label">附件类型</label>
|
||||
<view class="popup-select" @click="showFileAttachTypePopup = index">
|
||||
<span>{{ getAttachTypeLabel(file.attType) || '请选择附件类型' }}</span>
|
||||
</view>
|
||||
</view>
|
||||
<button class="upload-btn" @click="uploadFile(index)">上传文件</button>
|
||||
<view v-if="file.attFileId" class="file-info">
|
||||
<span>{{ file.attachName || '已上传文件' }}</span>
|
||||
<button class="delete-btn" @click="removeFile(index)">删除</button>
|
||||
</view>
|
||||
</view>
|
||||
<button class="add-attachment-btn" @click="addFile">添加附件</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 提交按钮 -->
|
||||
<view class="form-section submit-section">
|
||||
<button type="button" class="submit-btn1" @click="ecQuery">结果查询</button>
|
||||
<button type="submit" class="submit-btn" @click="submitForm">提交申请</button>
|
||||
</view>
|
||||
</form>
|
||||
|
||||
<!-- 文件附件类型弹窗 -->
|
||||
<view class="popup" v-if="showFileAttachTypePopup >= 0">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择附件类型</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in fileAttachTypeOptions" :key="type.value"
|
||||
@click="selectFileAttachType(showFileAttachTypePopup, type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showFileAttachTypePopup = -1">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo, RequsetUrl } from "../../../utils";
|
||||
import { apiArr } from "../../../api/contract";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 表单数据
|
||||
formData: {
|
||||
mch_id: null, // 商户号（必需）
|
||||
merInnerNo: '', // 拉卡拉内部商户号（可选）
|
||||
merCupNo: '', // 银联商户号（可选）
|
||||
contactMobile: '', // 联系手机号（必需）
|
||||
eleContractNo: '', // 电子分账协议号（可选）
|
||||
fileData: [
|
||||
{
|
||||
attType: '',
|
||||
attFileId: '',
|
||||
attachName: ''
|
||||
}
|
||||
] // 文件数据（可选）
|
||||
},
|
||||
|
||||
// 弹窗控制
|
||||
showFileAttachTypePopup: -1,
|
||||
|
||||
// 文件附件类型选项（示例数据，实际应从API获取）
|
||||
fileAttachTypeOptions: [
|
||||
{ value: 'BUSINESS_LICENSE', label: '营业执照' },
|
||||
{ value: 'ID_CARD_FRONT', label: '身份证正面' },
|
||||
{ value: 'ID_CARD_BACK', label: '身份证反面' },
|
||||
{ value: 'BANK_CARD', label: '银行卡' },
|
||||
{ value: 'CONTRACT', label: '合同文件' },
|
||||
{ value: 'OTHER', label: '其他' }
|
||||
]
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 添加附件
|
||||
addFile() {
|
||||
this.formData.fileData.push({
|
||||
attType: '',
|
||||
attFileId: '',
|
||||
attachName: ''
|
||||
});
|
||||
},
|
||||
|
||||
// 选择文件附件类型
|
||||
selectFileAttachType(index, type) {
|
||||
this.formData.fileData[index].attType = type.value;
|
||||
this.showFileAttachTypePopup = -1;
|
||||
},
|
||||
|
||||
// 获取附件类型标签
|
||||
getAttachTypeLabel(typeValue) {
|
||||
if (!typeValue) return '';
|
||||
const option = this.fileAttachTypeOptions.find(type => type.value === typeValue);
|
||||
return option ? option.label : '';
|
||||
},
|
||||
|
||||
// 删除附件
|
||||
removeFile(index) {
|
||||
this.formData.fileData.splice(index, 1);
|
||||
},
|
||||
|
||||
// 上传文件
|
||||
uploadFile(index) {
|
||||
const fileData = this.formData.fileData[index];
|
||||
|
||||
// 检查是否选择了附件类型
|
||||
if (!fileData.attType) {
|
||||
uni.showToast({
|
||||
title: '请先选择附件类型',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 调用 uni.chooseMessageFile API 选择文件
|
||||
uni.chooseMessageFile({
|
||||
count: 1,
|
||||
type: 'file',
|
||||
extension: ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'], // 支持的文件类型
|
||||
success: (res) => {
|
||||
const tempFile = res.tempFiles[0];
|
||||
console.log("选择的文件:", tempFile);
|
||||
|
||||
// 设置文件名
|
||||
fileData.attachName = tempFile.name;
|
||||
|
||||
// 显示上传中提示
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 直接使用uni.uploadFile上传文件
|
||||
uni.uploadFile({
|
||||
url: RequsetUrl + apiArr.upload, // 完整的上传接口URL
|
||||
filePath: tempFile.path, // 文件路径
|
||||
name: 'file', // 文件对应的key，根据后端要求设置
|
||||
formData: {
|
||||
attType: fileData.attType // 附件类型
|
||||
},
|
||||
header: {
|
||||
Authorization: uni.getStorageSync("ctoken") // 添加认证信息
|
||||
},
|
||||
success: (uploadRes) => {
|
||||
// 解析响应数据
|
||||
const res = JSON.parse(uploadRes.data);
|
||||
|
||||
// 更新附件信息
|
||||
fileData.attFileId = res.data.respData.attFileId;
|
||||
fileData.attachName = tempFile.name; // 文件名
|
||||
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('文件上传失败:', error);
|
||||
uni.showToast({
|
||||
title: '上传失败',
|
||||
icon: 'none'
|
||||
});
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading(); // 隐藏加载提示
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('选择文件失败:', err);
|
||||
uni.showToast({
|
||||
title: '选择文件失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 表单验证
|
||||
validateForm() {
|
||||
const { formData } = this;
|
||||
|
||||
// 验证必需字段
|
||||
if (!formData.mch_id) {
|
||||
uni.showToast({ title: '请输入商户号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.contactMobile) {
|
||||
uni.showToast({ title: '请输入联系手机号', icon: 'none' });
|
||||
return false;
|
||||
} else if (!/^1[3-9]\d{9}$/.test(formData.contactMobile)) {
|
||||
uni.showToast({ title: '请输入有效的手机号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
|
||||
ecQuery() {
|
||||
// const storeValue = uni.getStorageSync('storeValue');
|
||||
// if (!storeValue || !storeValue.contractId) {
|
||||
// uni.showToast({
|
||||
// title: '请先提交申请',
|
||||
// icon: 'none'
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
// const params = {
|
||||
// contractId: storeValue.contractId
|
||||
// }
|
||||
request(apiArr.queryLedgerMer, "POST", {}).then(res => {
|
||||
if (res.respData.splitStatus === 'VALID') {
|
||||
uni.showToast({
|
||||
title: '审核通过',
|
||||
icon: 'success'
|
||||
});
|
||||
} else if (res.respData.contractStatus === 'INVALID') {
|
||||
uni.showToast({
|
||||
title: '审核未通过',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 表单提交逻辑
|
||||
submitForm() {
|
||||
// 验证表单
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 准备请求参数
|
||||
const submitData = {
|
||||
mch_id: this.formData.mch_id,
|
||||
merInnerNo: this.formData.merInnerNo,
|
||||
merCupNo: this.formData.merCupNo,
|
||||
contactMobile: this.formData.contactMobile,
|
||||
eleContractNo: this.formData.eleContractNo,
|
||||
attachments: []
|
||||
};
|
||||
|
||||
// 只添加有attFileId的文件到attachments
|
||||
const validFiles = this.formData.fileData.filter(file => file.attFileId);
|
||||
if (validFiles.length > 0) {
|
||||
submitData.attachments = validFiles.map(file => ({
|
||||
attachType: file.attType,
|
||||
attachName: file.attachName,
|
||||
attachStorePath: file.attFileId
|
||||
}));
|
||||
}
|
||||
|
||||
console.log('提交的数据:', submitData);
|
||||
|
||||
request(apiArr.applyLedgerMer, "POST", submitData).then(res => {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'success'
|
||||
});
|
||||
uni.setStorageSync('storeValue', { fz_apply_id: res.resp_data.ec_apply_id });
|
||||
}).catch(error => {
|
||||
uni.hideLoading();
|
||||
console.error('提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '提交失败',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,160 +0,0 @@
|
||||
page{
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
/* 切换客服页面样式 */
|
||||
.change-service-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/* 头部 */
|
||||
.change-service-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 50px;
|
||||
padding: 0 15px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
padding-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.back-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.empty-header {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
/* 客服列表 */
|
||||
.service-list {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* 加载状态 */
|
||||
.loading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100px;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 空状态 */
|
||||
.empty-service {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 200px;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 客服项 */
|
||||
.service-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
margin-bottom: 10px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.service-item:active {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.service-item.selected {
|
||||
border: 2px solid #07c160;
|
||||
}
|
||||
|
||||
/* 客服头像 */
|
||||
.service-avatar {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 50%;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
/* 客服信息 */
|
||||
.service-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.service-name {
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.service-desc {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/* 选中图标 */
|
||||
.selected-icon {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
/* 确认按钮区域 */
|
||||
.confirm-section {
|
||||
padding: 15px;
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #eee;
|
||||
}
|
||||
|
||||
.confirm-btn {
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
background-color: #07c160;
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
border-radius: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.confirm-btn:disabled {
|
||||
background-color: #ccc;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
.service-list::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.service-list::-webkit-scrollbar-track {
|
||||
background-color: #f1f1f1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.service-list::-webkit-scrollbar-thumb {
|
||||
background-color: #c1c1c1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.service-list::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #a8a8a8;
|
||||
}
|
||||
@ -1,117 +0,0 @@
|
||||
<template>
|
||||
<view class="change-service-container">
|
||||
<view :style="{ paddingTop: top + 'px', height: localHeight + 'px' }" class="change-service-header">
|
||||
<view class="back-btn" @tap="goBack">
|
||||
<uni-icons color="#333" size="28" type="left"></uni-icons>
|
||||
</view>
|
||||
<view class="page-title">选择客服</view>
|
||||
<view class="empty-header"></view>
|
||||
</view>
|
||||
|
||||
<!-- 客服列表 -->
|
||||
<view class="service-list">
|
||||
<view v-if="isLoading" class="loading">加载中...</view>
|
||||
<view v-else-if="serviceList.length === 0" class="empty-service">暂无客服</view>
|
||||
<view v-else>
|
||||
<view v-for="service in serviceList" :key="service.id">
|
||||
<view class="service-item" @tap="confirmChange(service)">
|
||||
<image :src="service.employee_image" class="service-avatar" mode="aspectFill"></image>
|
||||
<view class="service-info">
|
||||
<text class="service-name">{{ service.employee_name }}</text>
|
||||
<text class="service-desc">{{ service.expertise || '专业客服为您服务' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { menuButtonInfo, picUrl, request } from '@/utils'
|
||||
import { apiArr } from '@/api/customerService'
|
||||
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
localHeight: '',
|
||||
top: '',
|
||||
// 客服列表
|
||||
serviceList: [],
|
||||
// 是否加载中
|
||||
isLoading: false,
|
||||
// 当前选中的客服ID
|
||||
selectedServiceId: ''
|
||||
}
|
||||
},
|
||||
onLoad(options){
|
||||
const meun = menuButtonInfo()
|
||||
this.top = meun.top
|
||||
this.localHeight = meun.height
|
||||
// 从选项中获取当前选中的客服ID（如果有）
|
||||
if (options.currentMchId) {
|
||||
this.selectedServiceId = options.currentMchId
|
||||
}
|
||||
|
||||
// 加载客服列表
|
||||
this.loadServiceList()
|
||||
},
|
||||
methods: {
|
||||
// 加载客服列表
|
||||
async loadServiceList(){
|
||||
try {
|
||||
this.isLoading = true
|
||||
|
||||
request(apiArr.csGetMchContactList, 'POST', {
|
||||
mch_id: uni.getStorageSync('merchantInfo').id
|
||||
}).then((res) => {
|
||||
if (res.rows && res.rows.length > 0) {
|
||||
res.rows.map(item => {
|
||||
item.employee_image = picUrl + item.employee_image
|
||||
})
|
||||
this.serviceList = res.rows
|
||||
} else {
|
||||
console.log('没有获取到客服列表数据')
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('加载客服列表失败', error)
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
// 选择客服
|
||||
selectService(service){
|
||||
this.selectedServiceId = service.mchId
|
||||
},
|
||||
|
||||
// 确认切换客服
|
||||
confirmChange(item){
|
||||
if (!item) {
|
||||
uni.showToast({
|
||||
title: '请选择客服',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
// 存储当前聊天对象的信息
|
||||
// uni.setStorageSync('currentChatTarget', item);
|
||||
item.type = 1
|
||||
// 跳转到聊天页面
|
||||
uni.navigateTo({
|
||||
url: '/packages/customerService/index/index?item=' + JSON.stringify(item)
|
||||
})
|
||||
},
|
||||
|
||||
// 返回上一页
|
||||
goBack(){
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,136 +0,0 @@
|
||||
/* 聊天记录页面样式 */
|
||||
page{
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
/* 聊天记录容器 */
|
||||
.chatting-records-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f6f7fb;
|
||||
}
|
||||
|
||||
/* 聊天记录头部 */
|
||||
.records-header {
|
||||
height: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* 聊天记录列表 */
|
||||
.records-list {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* 加载状态 */
|
||||
.loading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100px;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 空状态 */
|
||||
.empty-records {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 200px;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 聊天记录项 */
|
||||
.record-item {
|
||||
display: flex;
|
||||
padding: 12px;
|
||||
margin-bottom: 10px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.record-item:active {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
/* 头像 */
|
||||
.record-avatar {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
/* 记录信息 */
|
||||
.record-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
||||
/* 标题行 */
|
||||
.record-title-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
/* 标题 */
|
||||
.record-title {
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
/* 时间 */
|
||||
.record-time {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 最后一条消息 */
|
||||
.record-last-msg {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
.records-list::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.records-list::-webkit-scrollbar-track {
|
||||
background-color: #f1f1f1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.records-list::-webkit-scrollbar-thumb {
|
||||
background-color: #c1c1c1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.records-list::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #a8a8a8;
|
||||
}
|
||||
@ -1,123 +0,0 @@
|
||||
<template>
|
||||
<view class="chatting-records-container">
|
||||
|
||||
<!-- 聊天记录列表 -->
|
||||
<view class="records-list">
|
||||
<view v-if="isLoading" class="loading">加载中...</view>
|
||||
<view v-else-if="recordsList.length === 0" class="empty-records">暂无聊天记录</view>
|
||||
<view v-else>
|
||||
<view v-for="record in recordsList" :key="record.id">
|
||||
<view class="record-item" @tap="goToChatPage(record)">
|
||||
<image :src="getAvatarUrl(record)" class="record-avatar" mode="aspectFill"></image>
|
||||
<view class="record-info">
|
||||
<view class="record-title-row">
|
||||
<text class="record-title">{{ record.contact_name }}</text>
|
||||
<text class="record-time">{{ record.update_time }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { menuButtonInfo, picUrl, request } from '../../../utils'
|
||||
import { apiArr } from '../../../api/customerService'
|
||||
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
// 聊天记录列表
|
||||
recordsList: [],
|
||||
// 是否加载中
|
||||
isLoading: false,
|
||||
page_num: 1,
|
||||
page_size: 10,
|
||||
itemObj: {},
|
||||
merchantId: ''
|
||||
}
|
||||
},
|
||||
onLoad(options){
|
||||
this.merchantId = JSON.parse(options.merchant_id)
|
||||
},
|
||||
onShow(){
|
||||
// 页面显示时重新加载聊天记录
|
||||
this.loadChattingRecords()
|
||||
},
|
||||
methods: {
|
||||
// 加载聊天记录列表
|
||||
async loadChattingRecords(){
|
||||
try {
|
||||
this.isLoading = true
|
||||
|
||||
// 获取聊天记录列表
|
||||
request(apiArr.csGetMsgList, 'POST', {
|
||||
open_id: uni.getStorageSync('openId'),
|
||||
page_num: this.page_num,
|
||||
page_size: this.page_size
|
||||
}).then((res) => {
|
||||
this.recordsList = res.msg_list.filter(item => item.client_id_one !== item.client_id_two && item.mch_id == this.merchantId)
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('加载聊天记录失败', error)
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
getAvatarUrl(record){
|
||||
if(record.client_id_one == uni.getStorageSync('openId')){
|
||||
return record.two.avatar ? picUrl + record.two.avatar : 'https://static.hshuishang.com/defaultTx.png'
|
||||
}else{
|
||||
return record.one.avatar ? picUrl + record.one.avatar : 'https://static.hshuishang.com/defaultTx.png'
|
||||
}
|
||||
},
|
||||
// 格式化时间
|
||||
formatTime(time){
|
||||
const date = new Date(time)
|
||||
const now = new Date()
|
||||
const diff = now - date
|
||||
|
||||
// 小于1分钟显示"刚刚"
|
||||
if (diff < 60 * 1000) {
|
||||
return '刚刚'
|
||||
}
|
||||
|
||||
// 小于1小时显示"XX分钟前"
|
||||
if (diff < 60 * 60 * 1000) {
|
||||
return Math.floor(diff / (60 * 1000)) + '分钟前'
|
||||
}
|
||||
|
||||
// 小于24小时显示"XX小时前"
|
||||
if (diff < 24 * 60 * 60 * 1000) {
|
||||
return Math.floor(diff / (60 * 60 * 1000)) + '小时前'
|
||||
}
|
||||
|
||||
// 小于7天显示"XX天前"
|
||||
if (diff < 7 * 24 * 60 * 60 * 1000) {
|
||||
return Math.floor(diff / (24 * 60 * 60 * 1000)) + '天前'
|
||||
}
|
||||
|
||||
// 其他情况显示具体日期
|
||||
const month = date.getMonth() + 1
|
||||
const day = date.getDate()
|
||||
return month + '-' + day
|
||||
},
|
||||
|
||||
// 跳转到聊天页面
|
||||
goToChatPage(record){
|
||||
|
||||
this.$set(record, 'type', 2)
|
||||
// 跳转到聊天页面
|
||||
uni.navigateTo({
|
||||
url: '/packages/customerService/index/index?item=' + JSON.stringify(record)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,430 +0,0 @@
|
||||
/* 全局样式重置与基础设置 */
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "SimSun", "宋体", serif;
|
||||
}
|
||||
|
||||
page {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.contract-container {
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
word-break: break-word;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* 导航栏样式 */
|
||||
.nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20rpx 30rpx;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
.nav-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.save-btn {
|
||||
font-size: 26rpx;
|
||||
color: #0066cc;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* 滚动容器样式 */
|
||||
.contract-scroll {
|
||||
width: 100%;
|
||||
padding: 20rpx 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 合同内容区基础样式 */
|
||||
.contract-content {
|
||||
width: 100%;
|
||||
line-height: 1.8;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
/* 合同头部样式 */
|
||||
.header {
|
||||
margin-bottom: 40rpx;
|
||||
/* text-align: center; */
|
||||
}
|
||||
|
||||
.qrcode-tip {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.contract-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
margin: 20rpx 0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.party-info {
|
||||
text-align: left;
|
||||
margin: 30rpx 0;
|
||||
line-height: 2;
|
||||
}
|
||||
|
||||
.preamble {
|
||||
text-indent: 56rpx;
|
||||
/* 首行缩进2字符（28rpx*2） */
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
/* 条款通用样式 */
|
||||
.clauses {
|
||||
margin-bottom: 60rpx;
|
||||
}
|
||||
|
||||
.clause {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.clause-num {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
margin: 20rpx 0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.clause-content {
|
||||
margin-left: 40rpx;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* 服务项样式 */
|
||||
.service-item {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
margin: 20rpx 0 10rpx 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.service-desc {
|
||||
text-indent: 56rpx;
|
||||
margin: 10rpx 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.service-list {
|
||||
list-style: disc;
|
||||
margin-left: 50rpx;
|
||||
margin-bottom: 20rpx;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.service-list li {
|
||||
margin-bottom: 15rpx;
|
||||
line-height: 1.8;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 表格通用样式 */
|
||||
.fee-table,
|
||||
.info-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 20rpx 0;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.fee-table th,
|
||||
.fee-table td,
|
||||
.info-table th,
|
||||
.info-table td {
|
||||
border: 1px solid #333333;
|
||||
padding: 12rpx 8rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fee-table th,
|
||||
.info-table th,
|
||||
.info-table .table-label {
|
||||
background-color: #f5f5f5;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 填写项样式 */
|
||||
.fill-input {
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4rpx;
|
||||
padding: 0 8px;
|
||||
margin: 0 4rpx;
|
||||
font-size: 13px;
|
||||
color: #333333;
|
||||
background-color: #ffffff;
|
||||
flex-shrink: 0;
|
||||
height: 28px;
|
||||
width: 80px;
|
||||
box-sizing: border-box;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.fill-tiny {
|
||||
width: 60px;
|
||||
/* 小尺寸输入框（如百分比、台数） */
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fill-small {
|
||||
width: 140px;
|
||||
/* 中尺寸输入框（如银行名称、其他说明） */
|
||||
}
|
||||
|
||||
.fill-normal {
|
||||
width: 300rpx;
|
||||
/* 常规尺寸输入框（如商户名称、地址） */
|
||||
}
|
||||
|
||||
.fill-date {
|
||||
width: 220rpx;
|
||||
/* 日期输入框 */
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fill-table {
|
||||
width: 100%;
|
||||
/* 表格内输入框：填满单元格 */
|
||||
margin: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 单选/多选样式 */
|
||||
.radio-label,
|
||||
.checkbox-label {
|
||||
margin-right: 25rpx;
|
||||
margin-bottom: 15rpx;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
flex-wrap: wrap;
|
||||
gap: 8rpx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* 单选/多选组容器：控制整体间距 */
|
||||
.radio-group-container,
|
||||
.checkbox-group-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15rpx;
|
||||
margin: 15rpx 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 单个单选/多选选项：垂直居中对齐，统一高度 */
|
||||
.radio-label,
|
||||
.checkbox-label {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
word-break: break-word;
|
||||
max-width: 100%;
|
||||
flex-wrap: wrap;
|
||||
gap: 8rpx;
|
||||
/* radio/checkbox 与文本的间距 */
|
||||
font-size: 26rpx;
|
||||
color: #333;
|
||||
padding: 8rpx 0;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* 商户更名输入框：仅在选中时显示，与文本对齐 */
|
||||
#input-original-name {
|
||||
margin-left: 10rpx;
|
||||
/* 与“商户更名”文本的间距 */
|
||||
margin-top: 0;
|
||||
/* 清除默认margin，确保垂直居中 */
|
||||
}
|
||||
|
||||
/* 备注/说明文本样式 */
|
||||
.note,
|
||||
.mode-note,
|
||||
.risk-note,
|
||||
.deduct-note,
|
||||
.table-note,
|
||||
.appendix-footnote {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
margin: 10rpx 0;
|
||||
text-indent: 56rpx;
|
||||
}
|
||||
|
||||
/* 签字区域样式 */
|
||||
.sign-main,
|
||||
.sign-appendix {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 60rpx 0;
|
||||
padding: 0 40rpx;
|
||||
}
|
||||
|
||||
.sign-party {
|
||||
text-align: center;
|
||||
width: 45%;
|
||||
line-height: 2.2;
|
||||
}
|
||||
|
||||
/* 附件通用样式 */
|
||||
.appendix {
|
||||
margin: 80rpx 0;
|
||||
padding: 20rpx;
|
||||
border-top: 1px dashed #cccccc;
|
||||
}
|
||||
|
||||
.appendix-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin: 30rpx 0;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.appendix-subtitle {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
margin: 30rpx 0 15rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.appendix-note {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
text-align: right;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
/* 授权书内容样式 */
|
||||
.authorization-content {
|
||||
text-indent: 56rpx;
|
||||
margin: 15rpx 0;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* 提交按钮样式 */
|
||||
.submit-btn {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
background-color: #0066cc;
|
||||
color: #ffffff;
|
||||
font-size: 32rpx;
|
||||
padding: 18rpx 0;
|
||||
border-radius: 12rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* 适配小程序端滚动条样式（隐藏默认滚动条） */
|
||||
::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
/* 补充样式优化 */
|
||||
.radio-group-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 20rpx;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.radio-label,
|
||||
.checkbox-label {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
margin-right: 25rpx;
|
||||
margin-bottom: 10rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.checkbox-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 15rpx;
|
||||
}
|
||||
|
||||
.service-list li {
|
||||
margin-bottom: 15rpx;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.fee-label {
|
||||
display: block;
|
||||
margin: 8rpx 0;
|
||||
}
|
||||
|
||||
.mode-item {
|
||||
margin: 15rpx 0;
|
||||
text-indent: 56rpx;
|
||||
}
|
||||
|
||||
.mode-note {
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
margin: 10rpx 0;
|
||||
text-indent: 56rpx;
|
||||
}
|
||||
|
||||
.table-note {
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
margin: 10rpx 0 5rpx 0;
|
||||
}
|
||||
|
||||
.authorization-content {
|
||||
text-indent: 56rpx;
|
||||
margin: 15rpx 0;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.sign-appendix {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20rpx;
|
||||
margin: 40rpx 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.sign-appendix p {
|
||||
line-height: 2;
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10rpx;
|
||||
}
|
||||
|
||||
/* 优化表格内输入框 */
|
||||
.info-table .fill-input,
|
||||
.fee-table .fill-input {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #0066cc;
|
||||
margin: 2rpx;
|
||||
}
|
||||
|
||||
/* 优化单选/多选按钮对齐 */
|
||||
radio,
|
||||
checkbox {
|
||||
margin-right: 8rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,283 +0,0 @@
|
||||
/* 分账接收方创建页面样式 */
|
||||
.establish-acceptor-container {
|
||||
padding: 20rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
page{
|
||||
padding-bottom: 0rpx;
|
||||
}
|
||||
|
||||
/* 弹窗样式 */
|
||||
.popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
width: 80%;
|
||||
max-height: 70vh;
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.popup-title {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-list {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
max-height: 50vh;
|
||||
}
|
||||
|
||||
.popup-item {
|
||||
padding: 30rpx;
|
||||
text-align: center;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.popup-item:active {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.popup-footer {
|
||||
padding: 20rpx;
|
||||
border-top: 1rpx solid #eee;
|
||||
}
|
||||
|
||||
.popup-cancel-btn {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
background-color: #fff;
|
||||
border: 1rpx solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
font-size: 32rpx;
|
||||
background-color: #007aff;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* 弹窗选择器样式 */
|
||||
.popup-select {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
border: 1rpx solid #ddd;
|
||||
border-radius: 6rpx;
|
||||
background-color: #fff;
|
||||
min-height: 80rpx;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
margin: 30rpx 0 40rpx;
|
||||
}
|
||||
|
||||
.acceptor-form {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.form-section {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
margin-bottom: 24rpx;
|
||||
padding-bottom: 12rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 32rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.form-label.required::after {
|
||||
content: '*';
|
||||
color: #e64340;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.form-input {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.form-input:focus {
|
||||
border-color: #007aff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.form-input::placeholder {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 附件上传样式 */
|
||||
.attachment-section {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.attachment-item {
|
||||
background-color: #f9f9f9;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 8rpx;
|
||||
padding: 24rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.upload-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border: none;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.upload-btn:active {
|
||||
background-color: #0051d5;
|
||||
}
|
||||
|
||||
.file-info {
|
||||
margin-top: 16rpx;
|
||||
padding: 16rpx;
|
||||
background-color: #e8f4ff;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
color: #007aff;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
padding: 0rpx 20rpx;
|
||||
background-color: #e64340;
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 10rpx;
|
||||
font-size: 24rpx;
|
||||
cursor: pointer;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
|
||||
.delete-btn:active {
|
||||
background-color: #c21f1c;
|
||||
}
|
||||
|
||||
.add-attachment-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #f0f0f0;
|
||||
color: #666;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-attachment-btn:active {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
/* 提交按钮样式 */
|
||||
.submit-section {
|
||||
margin-top: 40rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
border-radius: 8rpx;
|
||||
margin-top: 16rpx;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.3);
|
||||
}
|
||||
|
||||
.submit-btn:active {
|
||||
background-color: #0051d5;
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
.submit-btn:disabled {
|
||||
background-color: #b8d5ff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* 响应式调整 */
|
||||
@media (min-width: 768px) {
|
||||
.establish-acceptor-container {
|
||||
max-width: 800rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* 输入框错误状态 */
|
||||
.form-input.error {
|
||||
border-color: #e64340;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
::-webkit-scrollbar {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f1f1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #c1c1c1;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #a8a8a8;
|
||||
}
|
||||
@ -1,512 +0,0 @@
|
||||
<template>
|
||||
<view class="establish-acceptor-container">
|
||||
<form class="acceptor-form" @submit.prevent="submitForm">
|
||||
<!-- 必需字段 -->
|
||||
<view class="form-section">
|
||||
<!-- <view class="form-item">
|
||||
<label class="form-label required">商户号</label>
|
||||
<input
|
||||
type="number"
|
||||
class="form-input"
|
||||
v-model="formData.mchId"
|
||||
placeholder="请输入商户号"
|
||||
required
|
||||
>
|
||||
</view> -->
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">分账接收方名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.receiverName" placeholder="请输入分账接收方名称"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">联系手机号</label>
|
||||
<input type="tel" class="form-input" v-model="formData.contactMobile" placeholder="请输入联系手机号"
|
||||
required>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label">营业执照号码</label>
|
||||
<input type="text" class="form-input" v-model="formData.licenseNo" placeholder="请输入营业执照号码">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">营业执照名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.licenseName" placeholder="请输入营业执照名称">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">法人姓名</label>
|
||||
<input type="text" class="form-input" v-model="formData.legalPersonName" placeholder="请输入法人姓名">
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label">法人证件号</label>
|
||||
<input type="text" class="form-input" v-model="formData.legalPersonCertificateNo"
|
||||
placeholder="请输入法人证件号">
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-section">
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户卡号</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctNo" placeholder="请输入收款账户卡号" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctName" placeholder="请输入收款账户名称" required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户类型</label>
|
||||
<view class="popup-select" @click="showAccountTypePopup = true">
|
||||
<span class="selected-value">{{ selectedAccountType || '请选择账户类型' }}</span>
|
||||
<uni-icons type="down" size="16"></uni-icons>
|
||||
</view>
|
||||
<!-- 账户类型弹窗 -->
|
||||
<view class="popup" v-if="showAccountTypePopup">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择账户类型</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in accountTypeOptions" :key="type.value"
|
||||
@click="selectAccountType(type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showAccountTypePopup = false">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户证件号</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctCertificateNo" placeholder="请输入收款账户证件号"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户开户行号</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctOpenBankCode" placeholder="请输入开户行号"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户开户行名称</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctOpenBankName" placeholder="请输入开户行名称"
|
||||
required>
|
||||
</view>
|
||||
|
||||
<view class="form-item">
|
||||
<label class="form-label required">收款账户清算行行号</label>
|
||||
<input type="text" class="form-input" v-model="formData.acctClearBankCode" placeholder="请输入清算行行号"
|
||||
required>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-section">
|
||||
<h3 class="section-title">附件上传（可选）</h3>
|
||||
|
||||
<view class="attachment-section">
|
||||
<view class="attachment-item" v-for="(attachment, index) in formData.attachList" :key="index">
|
||||
<view class="form-item">
|
||||
<label class="form-label">附件类型</label>
|
||||
<view class="popup-select" @click="showAttachTypePopup = index">
|
||||
<span class="selected-value">{{ getAttachTypeLabel(attachment.attachType) || '请选择附件类型'
|
||||
}}</span>
|
||||
<uni-icons type="down" size="16"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<label class="form-label">附件名称</label>
|
||||
<input type="text" class="form-input" v-model="attachment.attachName" placeholder="请输入附件名称">
|
||||
</view>
|
||||
<button class="upload-btn" @click="uploadFile(index)">上传文件</button>
|
||||
<view v-if="attachment.attachStorePath" class="file-info">
|
||||
<span>{{ attachment.attachName || '已上传文件' }}</span>
|
||||
<button class="delete-btn" @click="removeAttachment(index)">删除</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<button class="add-attachment-btn" @click="addAttachment">添加附件</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="form-section submit-section">
|
||||
<button type="submit" class="submit-btn" @click="submitForm">提交申请</button>
|
||||
</view>
|
||||
</form>
|
||||
|
||||
<!-- 附件类型弹窗 -->
|
||||
<view class="popup" v-if="showAttachTypePopup >= 0">
|
||||
<view class="popup-content">
|
||||
<view class="popup-title">选择附件类型</view>
|
||||
<view class="popup-list">
|
||||
<view class="popup-item" v-for="type in attachTypeOptions" :key="type.value"
|
||||
@click="selectAttachType(showAttachTypePopup, type)">
|
||||
{{ type.label }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-footer">
|
||||
<button class="popup-cancel-btn" @click="showAttachTypePopup = -1">取消</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo, RequsetUrl } from "../../../utils";
|
||||
import { apiArr } from "../../../api/contract";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 弹窗控制
|
||||
showAccountTypePopup: false,
|
||||
showAttachTypePopup: -1,
|
||||
|
||||
// 账户类型选项
|
||||
accountTypeOptions: [
|
||||
{ value: 'PERSONAL', label: '个人账户' },
|
||||
{ value: 'COMPANY', label: '企业账户' }
|
||||
],
|
||||
|
||||
// 附件类型选项
|
||||
attachTypeOptions: [
|
||||
{ value: 'FR_ID_CARD_FRONT', label: '法人身份证正面' },
|
||||
{ value: 'FR_ID_CARD_BEHIND', label: '法人身份证反面' },
|
||||
{ value: 'ID_CARD_FRONT', label: '结算人身份证正面' },
|
||||
{ value: 'ID_CARD_BEHIND', label: '结算人身份证反面' },
|
||||
{ value: 'BANK_CARD', label: '银行卡' },
|
||||
{ value: 'BUSINESS_LICENCE', label: '营业执照' },
|
||||
{ value: 'MERCHANT_PHOTO', label: '商户门头照' },
|
||||
{ value: 'SHOPINNER', label: '商铺内部照片' },
|
||||
{ value: 'XY', label: '线下纸质协议' },
|
||||
{ value: 'NETWORK_XY', label: '电子协议' },
|
||||
{ value: 'HT', label: '租赁合同' },
|
||||
{ value: 'COOPERATION_QUALIFICATION_PROOF', label: '合作资质证明' },
|
||||
{ value: 'FOOD_QUALIFICATION_PROOF', label: '食品经营相关资质' },
|
||||
{ value: 'NO_LEGAL_PERSON_SETT_AUTH_LETTER', label: '非法人结算授权书' },
|
||||
{ value: 'SPLIT_ENTRUST_FILE', label: '结算授权委托书' },
|
||||
{ value: 'RENTAL_AGREEMENT', label: '集市方与场地方间的租赁协议' },
|
||||
{ value: 'SPLIT_COOPERATION_FILE', label: '集市方与摊主间的合作协议' },
|
||||
{ value: 'OTHERS', label: '其他' }
|
||||
],
|
||||
|
||||
formData: {
|
||||
// 必需字段
|
||||
mchId: '',
|
||||
receiverName: '',
|
||||
contactMobile: '',
|
||||
acctNo: '',
|
||||
acctName: '',
|
||||
acctTypeCode: '',
|
||||
acctCertificateNo: '',
|
||||
acctOpenBankCode: '',
|
||||
acctOpenBankName: '',
|
||||
acctClearBankCode: '',
|
||||
// 可选字段
|
||||
licenseNo: '',
|
||||
licenseName: '',
|
||||
legalPersonName: '',
|
||||
legalPersonCertificateNo: '',
|
||||
// 附件列表（初始添加一个空附件）
|
||||
attachList: [{
|
||||
attachType: '',
|
||||
attachName: '',
|
||||
attachStorePath: ''
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 获取选中的账户类型标签
|
||||
selectedAccountType() {
|
||||
if (!this.formData.acctTypeCode) return '';
|
||||
const option = this.accountTypeOptions.find(type => type.value === this.formData.acctTypeCode);
|
||||
return option ? option.label : '';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 添加附件
|
||||
addAttachment() {
|
||||
this.formData.attachList.push({
|
||||
attachType: '',
|
||||
attachName: '',
|
||||
attachStorePath: ''
|
||||
});
|
||||
},
|
||||
|
||||
// 选择账户类型
|
||||
selectAccountType(type) {
|
||||
this.formData.acctTypeCode = type.value;
|
||||
this.showAccountTypePopup = false;
|
||||
},
|
||||
|
||||
// 选择附件类型
|
||||
selectAttachType(index, type) {
|
||||
this.formData.attachList[index].attachType = type.value;
|
||||
this.showAttachTypePopup = -1;
|
||||
},
|
||||
|
||||
// 获取附件类型标签
|
||||
getAttachTypeLabel(typeValue) {
|
||||
if (!typeValue) return '';
|
||||
const option = this.attachTypeOptions.find(type => type.value === typeValue);
|
||||
return option ? option.label : '';
|
||||
},
|
||||
|
||||
// 删除附件
|
||||
removeAttachment(index) {
|
||||
this.formData.attachList.splice(index, 1);
|
||||
// 如果列表为空，添加一个空附件以保持界面显示
|
||||
if (this.formData.attachList.length === 0) {
|
||||
this.formData.attachList.push({
|
||||
attachType: '',
|
||||
attachName: '',
|
||||
attachStorePath: ''
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// 上传文件
|
||||
uploadFile(index) {
|
||||
const attachment = this.formData.attachList[index];
|
||||
|
||||
// 检查是否选择了附件类型
|
||||
if (!attachment.attachType) {
|
||||
uni.showToast({
|
||||
title: '请先选择附件类型',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 调用 uni.chooseMessageFile API 选择文件（支持所有文件类型）
|
||||
uni.chooseMessageFile({
|
||||
count: 1,
|
||||
type: 'file',
|
||||
extension: ['pdf', 'doc', 'docx', 'jpg', 'jpeg', 'png'], // 支持的文件类型
|
||||
success: (res) => {
|
||||
const tempFile = res.tempFiles[0];
|
||||
console.log("选择的文件:", tempFile);
|
||||
|
||||
// 如果用户没有填写附件名称，使用选择的文件名
|
||||
if (!attachment.attachName) {
|
||||
attachment.attachName = tempFile.name;
|
||||
}
|
||||
|
||||
// 显示上传中提示
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 直接使用uni.uploadFile上传文件
|
||||
uni.uploadFile({
|
||||
url: RequsetUrl + apiArr.upload, // 完整的上传接口URL
|
||||
filePath: tempFile.path, // 文件路径
|
||||
name: 'file', // 文件对应的key，根据后端要求设置
|
||||
formData: {
|
||||
attType: attachment.attachType // 其他表单参数
|
||||
},
|
||||
header: {
|
||||
Authorization: uni.getStorageSync("ctoken") // 添加认证信息
|
||||
},
|
||||
success: (uploadRes) => {
|
||||
// 解析响应数据
|
||||
const res = JSON.parse(uploadRes.data);
|
||||
|
||||
// 更新附件信息
|
||||
attachment.attachStorePath = res.data.respData.attFileId;
|
||||
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('文件上传失败:', error);
|
||||
uni.showToast({
|
||||
title: '上传失败',
|
||||
icon: 'none'
|
||||
});
|
||||
},
|
||||
complete: () => {
|
||||
uni.hideLoading(); // 隐藏加载提示
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('选择文件失败:', err);
|
||||
uni.showToast({
|
||||
title: '选择文件失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 表单验证
|
||||
validateForm() {
|
||||
const { formData } = this;
|
||||
|
||||
// 验证必需字段
|
||||
// if (!formData.mchId) {
|
||||
// uni.showToast({ title: '请输入商户号', icon: 'none' });
|
||||
// return false;
|
||||
// }
|
||||
|
||||
if (!formData.receiverName) {
|
||||
uni.showToast({ title: '请输入分账接收方名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.contactMobile) {
|
||||
uni.showToast({ title: '请输入联系手机号', icon: 'none' });
|
||||
return false;
|
||||
} else if (!/^1[3-9]\d{9}$/.test(formData.contactMobile)) {
|
||||
uni.showToast({ title: '请输入正确的手机号格式', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctNo) {
|
||||
uni.showToast({ title: '请输入收款账户卡号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctName) {
|
||||
uni.showToast({ title: '请输入收款账户名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctTypeCode) {
|
||||
uni.showToast({ title: '请选择收款账户类型', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctCertificateNo) {
|
||||
uni.showToast({ title: '请输入收款账户证件号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctOpenBankCode) {
|
||||
uni.showToast({ title: '请输入收款账户开户行号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctOpenBankName) {
|
||||
uni.showToast({ title: '请输入收款账户开户行名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acctClearBankCode) {
|
||||
uni.showToast({ title: '请输入收款账户清算行行号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
},
|
||||
|
||||
// 表单提交逻辑
|
||||
submitForm() {
|
||||
// 验证表单
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 准备请求参数
|
||||
const submitData = {
|
||||
mchId: '000', // 商户号（必需）
|
||||
receiverName: this.formData.receiverName, // 分账接收方名称（必需）
|
||||
contactMobile: this.formData.contactMobile, // 联系手机号（必需）
|
||||
licenseNo: this.formData.licenseNo, // 营业执照号码（可选）
|
||||
licenseName: this.formData.licenseName, // 营业执照名称（可选）
|
||||
legalPersonName: this.formData.legalPersonName, // 法人姓名（可选）
|
||||
legalPersonCertificateNo: this.formData.legalPersonCertificateNo, // 法人证件号（可选）
|
||||
acctNo: this.formData.acctNo, // 收款账户卡号（必需）
|
||||
acctName: this.formData.acctName, // 收款账户名称（必需）
|
||||
acctTypeCode: this.formData.acctTypeCode, // 收款账户类型（必需）
|
||||
acctCertificateNo: this.formData.acctCertificateNo, // 收款账户证件号（必需）
|
||||
acctOpenBankCode: this.formData.acctOpenBankCode, // 收款账户开户行号（必需）
|
||||
acctOpenBankName: this.formData.acctOpenBankName, // 收款账户开户行名称（必需）
|
||||
acctClearBankCode: this.formData.acctClearBankCode // 收款账户清算行行号（必需）
|
||||
};
|
||||
|
||||
// 只添加有attachStorePath的附件到attachList
|
||||
const validAttachments = this.formData.attachList.filter(attach => attach.attachStorePath);
|
||||
if (validAttachments.length > 0) {
|
||||
submitData.attachList = validAttachments.map(attach => ({
|
||||
attachType: attach.attachType,
|
||||
attachName: attach.attachName,
|
||||
attachStorePath: attach.attachStorePath
|
||||
}));
|
||||
}
|
||||
|
||||
console.log('提交的数据:', submitData);
|
||||
|
||||
request(apiArr.applyLedgerReceiver, "POST", submitData).then(res => {
|
||||
uni.hideLoading();
|
||||
|
||||
if (res && res.cmdRetCode === 'SUCCESS') {
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'success'
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1500);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res?.retMsg || '提交失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}).catch(error => {
|
||||
uni.hideLoading();
|
||||
console.error('提交失败:', error);
|
||||
uni.showToast({
|
||||
title: '提交失败',
|
||||
icon: 'none'
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
// 重置表单
|
||||
resetForm() {
|
||||
this.formData = {
|
||||
// mchId: '',
|
||||
receiverName: '',
|
||||
contactMobile: '',
|
||||
acctNo: '',
|
||||
acctName: '',
|
||||
acctTypeCode: '',
|
||||
acctCertificateNo: '',
|
||||
acctOpenBankCode: '',
|
||||
acctOpenBankName: '',
|
||||
acctClearBankCode: '',
|
||||
licenseNo: '',
|
||||
licenseName: '',
|
||||
legalPersonName: '',
|
||||
legalPersonCertificateNo: '',
|
||||
attachList: []
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
@ -1,197 +0,0 @@
|
||||
/* 客服聊天页面样式 */
|
||||
page {
|
||||
background-color: #f6f7fb;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 聊天容器 */
|
||||
.chat-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
background-color: #f6f7fb;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* 聊天头部 */
|
||||
.chat-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 50px;
|
||||
padding: 0 15px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
padding-bottom: 15rpx;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.back-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.chat-title {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.empty-header {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
/* 切换客服按钮 */
|
||||
.change-service-btn {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* 连接状态提示 */
|
||||
.connecting-status {
|
||||
padding: 5px 15px;
|
||||
background-color: #fff3cd;
|
||||
color: #856404;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 聊天消息区域 */
|
||||
.chat-messages {
|
||||
width: 97%;
|
||||
margin: 0 auto;
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* 时间分割线 */
|
||||
.message-time {
|
||||
margin: 10px 0;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 消息项 */
|
||||
.message-item {
|
||||
display: flex;
|
||||
margin-bottom: 15px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.message-item.self {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
/* 头像 */
|
||||
.message-avatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
/* 消息内容 */
|
||||
.message-content {
|
||||
max-width: 70%;
|
||||
padding: 10px 15px;
|
||||
border-radius: 10px;
|
||||
word-break: break-word;
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.message-item.self .message-content {
|
||||
background-color: #91d5ff;
|
||||
color: #333;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
.message-item.other .message-content {
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
border-bottom-left-radius: 4px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* 加载状态 */
|
||||
.message-item.loading .message-content {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
/* 输入区域 */
|
||||
.chat-input-area {
|
||||
background-color: #fff;
|
||||
padding: 10px 15px;
|
||||
border-top: 1px solid #eee;
|
||||
margin-bottom: 20rpx;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.input-container {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.message-input {
|
||||
flex: 1;
|
||||
height: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 20px;
|
||||
font-size: 15px;
|
||||
line-height: 1.5;
|
||||
resize: none;
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
|
||||
.send-btn {
|
||||
margin-left: 10px;
|
||||
padding: 0 20px;
|
||||
height: 40px;
|
||||
background-color: #07c160;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
border-radius: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.send-btn:disabled {
|
||||
background-color: #ccc;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 滚动条样式 */
|
||||
.chat-messages::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
.chat-messages::-webkit-scrollbar-track {
|
||||
background-color: #f1f1f1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chat-messages::-webkit-scrollbar-thumb {
|
||||
background-color: #c1c1c1;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.chat-messages::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #a8a8a8;
|
||||
}
|
||||
@ -1,594 +0,0 @@
|
||||
<template>
|
||||
<view class="chat-container">
|
||||
<!-- 聊天头部 -->
|
||||
<view :style="{ paddingTop: top + 'px', height: localHeight + 'px' }" class="chat-header">
|
||||
<view class="back-btn" @tap="goBack">
|
||||
<uni-icons color="#333" size="28" type="left"></uni-icons>
|
||||
</view>
|
||||
<view class="chat-title">{{ chatTarget.title || '客服' }}</view>
|
||||
<view class="change-service-btn" @tap="goToChangeService">
|
||||
<uni-icons color="#333" size="22" type="switch"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 连接状态提示 -->
|
||||
<view v-if="connectingStatus" class="connecting-status">{{ connectingStatus }}</view>
|
||||
|
||||
<!-- 聊天消息区域 -->
|
||||
<scroll-view class="chat-messages" scroll-y="true"
|
||||
upper-threshold="50" @scrolltoupper="loadMoreHistory" @scroll="onScroll">
|
||||
<!-- 加载历史消息提示 -->
|
||||
<view v-if="isLoadingHistory" class="message-time">加载历史消息...</view>
|
||||
|
||||
<!-- 消息列表 -->
|
||||
<block v-for="(message, index) in messages" :key="index">
|
||||
<!-- 时间分割线 -->
|
||||
<view v-if="needShowTime(index)" class="message-time">{{ message.times }}</view>
|
||||
|
||||
<!-- 消息项 -->
|
||||
<view :id="'msg-' + index" :class="{
|
||||
'self': message.isSelf,
|
||||
'other': !message.isSelf,
|
||||
'loading': message.isLoading
|
||||
}" class="message-item">
|
||||
<image :src="message.isSelf ? userAvatar : getAvatarUrl(message)" class="message-avatar" mode="aspectFill">
|
||||
</image>
|
||||
<view class="message-content">
|
||||
{{ message.content }}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 输入区域 -->
|
||||
<view class="chat-input-area">
|
||||
<view class="input-container">
|
||||
<textarea v-model="inputMessage" :adjust-position="true" auto-height class="message-input" cursor-spacing="10"
|
||||
enable-keyboard-accessory-view="true" hold-keyboard="true" maxlength="500" placeholder="请输入消息..."
|
||||
@blur="onInputBlur" @confirm="sendMessage" @focus="onInputFocus" @input="handleInput"></textarea>
|
||||
<button :disabled="inputMessage.trim() === ''" class="send-btn" @tap="sendMessage">
|
||||
发送
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { menuButtonInfo, picUrl, request } from '@/utils'
|
||||
import mqttTool from '@/utils/mqtt'
|
||||
import { apiArr } from '../../../api/customerService'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
localHeight: '',
|
||||
top: '',
|
||||
// 聊天目标信息
|
||||
chatTarget: {
|
||||
mchId: '',
|
||||
bindId: 0,
|
||||
title: '',
|
||||
avatar: '',
|
||||
openId: '' // 接收方的open_id
|
||||
},
|
||||
// 用户头像
|
||||
userAvatar: '',
|
||||
// 消息列表
|
||||
messages: [],
|
||||
|
||||
// 输入的消息
|
||||
inputMessage: '',
|
||||
// 是否可以发送消息
|
||||
canSend: false,
|
||||
// 连接状态
|
||||
isConnected: false,
|
||||
// 连接状态文本
|
||||
connectingStatus: '',
|
||||
// 滚动到指定视图
|
||||
scrollToView: '',
|
||||
// 是否加载历史消息
|
||||
isLoadingHistory: false,
|
||||
// 心跳包定时器
|
||||
keepaliveTimer: null,
|
||||
selfClientId: uni.getStorageSync('openId'),
|
||||
// MQTT工具实例
|
||||
client: null,
|
||||
// 重连失败提示定时器
|
||||
reconnectFailedTimer: null,
|
||||
// 分页参数
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
// 是否还有更多历史消息
|
||||
hasMoreHistory: true,
|
||||
// 滚动到底部的标记
|
||||
scrollToBottomFlag: false
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
console.log('客服聊天页面onLoad触发')
|
||||
const meun = menuButtonInfo()
|
||||
this.top = meun.top
|
||||
this.localHeight = meun.height
|
||||
console.log('导航栏信息：top:', this.top, 'height:', this.localHeight)
|
||||
// 获取聊天对象信息
|
||||
if (options.item) {
|
||||
const item = JSON.parse(options.item)
|
||||
console.log('参数接收:', item)
|
||||
if (Number(item.type) === 1) {
|
||||
// 客户选择客服跳转进来
|
||||
this.chatTarget = item
|
||||
console.log('客户找客服跳转:', this.chatTarget)
|
||||
this.chatTarget.title = this.chatTarget.employee_name
|
||||
this.getMqttConfig().then(() => {
|
||||
// 获取配置后再初始化聊天
|
||||
console.log('获取MQTT配置成功，开始初始化聊天')
|
||||
this.initChat()
|
||||
}).catch(error => {
|
||||
console.error('获取MQTT配置失败:', error)
|
||||
})
|
||||
} else {
|
||||
// 客服选择聊天列表进来
|
||||
this.chatTarget = item
|
||||
console.log('客服找客户进来:', this.chatTarget)
|
||||
this.chatTarget.title = this.chatTarget.server_name
|
||||
this.chatTarget.bindId = this.chatTarget.id
|
||||
if (this.chatTarget.client_id_one === this.selfClientId) {
|
||||
this.chatTarget.openId = this.chatTarget.client_id_two
|
||||
} else {
|
||||
this.chatTarget.openId = this.chatTarget.client_id_one
|
||||
}
|
||||
// 初始化MQTT连接
|
||||
console.log('开始初始化聊天')
|
||||
this.initChat()
|
||||
}
|
||||
} else {
|
||||
console.log('没有接收到参数item')
|
||||
}
|
||||
// 初始化用户头像
|
||||
this.userAvatar = picUrl + uni.getStorageSync('headPhoto')
|
||||
console.log('用户头像:', this.userAvatar)
|
||||
},
|
||||
onShow() {
|
||||
},
|
||||
methods: {
|
||||
getAvatarUrl(record) {
|
||||
return this.chatTarget.employee_image ? this.chatTarget.employee_image : 'https://static.hshuishang.com/defaultTx.png'
|
||||
},
|
||||
async connect() {
|
||||
this.client = null
|
||||
const options = {
|
||||
clientId: this.selfClientId
|
||||
}
|
||||
|
||||
// 添加连接状态回调
|
||||
const callbacks = {
|
||||
onConnect: () => {
|
||||
console.log('客服连接成功')
|
||||
this.isConnected = true
|
||||
this.connectingStatus = ''
|
||||
},
|
||||
onDisconnect: this.onDisconnect.bind(this),
|
||||
onError: (error) => {
|
||||
console.error('客服连接错误:', error)
|
||||
this.isConnected = false
|
||||
this.connectingStatus = '连接错误，请重试'
|
||||
},
|
||||
onReconnect: () => {
|
||||
console.log('客服正在重连...')
|
||||
this.isConnected = false
|
||||
this.connectingStatus = '连接已断开，正在重连...'
|
||||
}
|
||||
}
|
||||
|
||||
this.client = mqttTool.connect(options, callbacks)
|
||||
this.isConnected = !!this.client
|
||||
|
||||
await this.subscribe()
|
||||
this.client.on('message', (topic, message) => {
|
||||
const msgStr = Buffer.from(message).toString('utf8') // 二进制转UTF-8字符串
|
||||
const msg = JSON.parse(msgStr) // 后续解析逻辑不变
|
||||
|
||||
let jsMsg = msg // 直接使用已解析的对象，无需再次解析
|
||||
console.log('收到消息', topic, msg)
|
||||
if (jsMsg.send_client === this.selfClientId || jsMsg.receive_client === this.selfClientId) {
|
||||
console.log('接收或发送人是我')
|
||||
if (jsMsg.send_client === this.chatTarget.openId || jsMsg.receive_client === this.chatTarget.openId) {
|
||||
console.log('接收或发送人是我的聊天对象')
|
||||
this.messages.push({
|
||||
content: jsMsg.content,
|
||||
time: Date.now(),
|
||||
isSelf: jsMsg.send_client === this.selfClientId,
|
||||
isLoading: false
|
||||
})
|
||||
console.log('收到我的消息', this.messages)
|
||||
this.scrollToView = 'msg-' + (this.messages.length - 1)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
async subscribe() {
|
||||
if (this.isConnected && this.client) {
|
||||
this.client.subscribe('contact/message/receive_msg', { qos: 0 }, (err) => {
|
||||
if (!err) {
|
||||
console.log('订阅成功', 'contact/message/receive_msg', { qos: 0 })
|
||||
this.connectingStatus = ''
|
||||
} else {
|
||||
console.log('订阅失败:', err)
|
||||
this.connectingStatus = '订阅失败，请重试'
|
||||
}
|
||||
})
|
||||
} else {
|
||||
console.log('连接失败', this.isConnected, this.client)
|
||||
this.connectingStatus = '连接失败，请重试'
|
||||
}
|
||||
},
|
||||
// 初始化聊天
|
||||
async initChat() {
|
||||
try {
|
||||
// 显示连接状态
|
||||
this.connectingStatus = '正在连接客服...'
|
||||
await this.connect()
|
||||
// 连接成功后启动心跳包
|
||||
this.startKeepalive()
|
||||
// 连接成功后立即加载历史消息
|
||||
console.log('连接成功，开始加载历史消息')
|
||||
await this.loadHistoryMessages()
|
||||
console.log('历史消息加载完成，消息数量：', this.messages.length)
|
||||
|
||||
|
||||
} catch (error) {
|
||||
console.error('初始化聊天失败', error)
|
||||
this.connectingStatus = '连接失败，请检查网络'
|
||||
|
||||
// 失败后尝试重新连接
|
||||
this.reconnectFailedTimer = setTimeout(() => {
|
||||
this.initChat()
|
||||
}, 3000)
|
||||
}
|
||||
},
|
||||
|
||||
// 获取MQTT连接配置
|
||||
async getMqttConfig() {
|
||||
console.log('🚀 ~ onLoad ~ this.chatTarget.open_id:', this.chatTarget.open_id)
|
||||
try {
|
||||
// 如果没有已创建的实例或clientId，则通过API获取
|
||||
return new Promise((resolve, reject) => {
|
||||
const params = {
|
||||
worker_id: this.chatTarget.id || '',
|
||||
open_id: this.selfClientId || ''
|
||||
}
|
||||
request(apiArr.csGetToClientId, 'POST', params).then((res) => {
|
||||
console.log('聊天列表:', res)
|
||||
// 检查响应数据格式是否正确
|
||||
if (res && res.client_bind && res.client_bind.client_id_one && res.client_bind.client_id_two) {
|
||||
if (res.client_bind.client_id_one === this.selfClientId) {
|
||||
this.chatTarget.openId = res.client_bind.client_id_two
|
||||
} else {
|
||||
this.chatTarget.openId = res.client_bind.client_id_one
|
||||
}
|
||||
this.chatTarget.bindId = res.client_bind.id
|
||||
resolve()
|
||||
} else {
|
||||
console.error('MQTT配置响应格式不正确:', res)
|
||||
reject(new Error('未获取到有效的MQTT配置'))
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('获取MQTT配置失败', error)
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('获取MQTT配置失败', error)
|
||||
throw error
|
||||
}
|
||||
},
|
||||
|
||||
// MQTT断开连接回调
|
||||
onDisconnect(packet) {
|
||||
console.log('MQTT连接断开', packet)
|
||||
this.isConnected = false
|
||||
this.client = null
|
||||
|
||||
// 根据断开原因设置不同的连接状态文本
|
||||
if (packet && packet.error) {
|
||||
// 连接失败的情况
|
||||
this.connectingStatus = '连接失败，请检查网络'
|
||||
} else {
|
||||
// 其他断开连接的情况
|
||||
this.connectingStatus = '连接已断开，正在重连...'
|
||||
}
|
||||
|
||||
// 停止心跳包
|
||||
this.stopKeepalive()
|
||||
},
|
||||
|
||||
// 加载历史消息
|
||||
async loadHistoryMessages() {
|
||||
console.log('loadHistoryMessages方法调用')
|
||||
console.log('加载条件检查：hasMoreHistory:', this.hasMoreHistory, 'isLoadingHistory:', this.isLoadingHistory)
|
||||
|
||||
if (!this.hasMoreHistory || this.isLoadingHistory) {
|
||||
console.log('不满足加载条件：hasMoreHistory:', this.hasMoreHistory, 'isLoadingHistory:', this.isLoadingHistory)
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
this.isLoadingHistory = true
|
||||
console.log('开始加载历史消息，当前页码：', this.pageNum)
|
||||
|
||||
// 确保已经获取了mqttConfig.bindId
|
||||
if (!this.chatTarget.bindId) {
|
||||
console.log('没有bindId，开始获取MQTT配置')
|
||||
await this.getMqttConfig()
|
||||
console.log('获取MQTT配置成功，bindId：', this.chatTarget.bindId)
|
||||
}
|
||||
|
||||
const params = {
|
||||
bindId: this.chatTarget.bindId,
|
||||
order: 'desc', // 按时间降序排列
|
||||
page_num: this.pageNum,
|
||||
page_size: this.pageSize
|
||||
}
|
||||
|
||||
console.log('请求历史消息参数:', params)
|
||||
const res = await request(apiArr.csGetMsgRecord, 'POST', params)
|
||||
|
||||
console.log('历史消息返回结果:', res)
|
||||
if (res && res.msg_record) {
|
||||
const historyMessages = res.msg_record
|
||||
|
||||
console.log('原始历史消息数量：', historyMessages.length)
|
||||
// 如果没有更多历史消息了
|
||||
if (historyMessages.length === 0) {
|
||||
console.log('没有更多历史消息了')
|
||||
this.hasMoreHistory = false
|
||||
return
|
||||
}
|
||||
|
||||
// 处理历史消息，转换为需要的格式
|
||||
const formattedMessages = historyMessages.map(msg => ({
|
||||
content: msg.content,
|
||||
time: new Date(msg.create_time).getTime(),
|
||||
times: msg.update_time,
|
||||
isSelf: msg.send_client === this.selfClientId, // 修正判断条件
|
||||
isLoading: false
|
||||
})).reverse(); // 反转消息顺序，确保最早的消息在最前面
|
||||
|
||||
console.log('格式化后的历史消息：', formattedMessages)
|
||||
// 将格式化后的历史消息添加到消息列表开头
|
||||
const previousMessageCount = this.messages.length;
|
||||
console.log('添加前消息数量：', previousMessageCount)
|
||||
this.messages = [...formattedMessages, ...this.messages];
|
||||
console.log('添加后消息数量：', this.messages.length)
|
||||
|
||||
// 增加页码
|
||||
this.pageNum++;
|
||||
console.log('下一页页码：', this.pageNum)
|
||||
|
||||
// 如果是首次加载，滚动到底部显示最新消息
|
||||
if (previousMessageCount === 0) {
|
||||
setTimeout(() => {
|
||||
console.log('首次加载，滚动到底部，消息数量：', this.messages.length)
|
||||
// 使用更可靠的滚动方式
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 999999,
|
||||
duration: 300
|
||||
});
|
||||
}, 100);
|
||||
} else {
|
||||
// 不是首次加载时，保持当前滚动位置，不自动滚动到底部
|
||||
// 确保新加载的历史消息在顶部可见
|
||||
console.log('非首次加载，新增消息数量：', formattedMessages.length)
|
||||
}
|
||||
} else {
|
||||
console.log('接口返回数据格式不正确或无消息记录')
|
||||
// 仅当不是第一页时才设置hasMoreHistory为false
|
||||
if (this.pageNum > 1) {
|
||||
this.hasMoreHistory = false
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载历史消息失败', error)
|
||||
} finally {
|
||||
this.isLoadingHistory = false
|
||||
console.log('加载历史消息结束')
|
||||
}
|
||||
},
|
||||
|
||||
// 滚动事件监听
|
||||
onScroll(e) {
|
||||
console.log('滚动事件触发，scrollTop：', e.detail.scrollTop)
|
||||
},
|
||||
|
||||
// 加载更多历史消息
|
||||
loadMoreHistory() {
|
||||
console.log('滚动到顶部事件触发')
|
||||
// 滚动到顶部时加载更多历史消息
|
||||
console.log('当前条件：isLoadingHistory:', this.isLoadingHistory, 'hasMoreHistory:', this.hasMoreHistory, 'pageNum:', this.pageNum)
|
||||
|
||||
// 重置hasMoreHistory为true，确保可以继续加载
|
||||
if (!this.hasMoreHistory && this.pageNum === 1) {
|
||||
console.log('重置hasMoreHistory为true')
|
||||
this.hasMoreHistory = true
|
||||
}
|
||||
|
||||
if (!this.isLoadingHistory && this.hasMoreHistory) {
|
||||
console.log('开始加载更多历史消息')
|
||||
this.loadHistoryMessages()
|
||||
} else {
|
||||
console.log('不满足加载更多条件：isLoadingHistory:', this.isLoadingHistory, 'hasMoreHistory:', this.hasMoreHistory)
|
||||
}
|
||||
},
|
||||
|
||||
// 发送消息
|
||||
sendMessage() {
|
||||
const content = this.inputMessage.trim()
|
||||
console.log('发送消息', content)
|
||||
if (!content || !this.client || !this.isConnected) return
|
||||
// 滚动到底部
|
||||
this.scrollToBottom()
|
||||
console.log('需要发送的对象', this.chatTarget)
|
||||
// 按照用户提供的格式构建发送消息
|
||||
const msgData = {
|
||||
bind_id: this.chatTarget.bindId, // 聊天列表的ID
|
||||
send_client: this.selfClientId, // 消息发送方open_id
|
||||
receive_client: this.chatTarget.openId, // 消息接收方open_id
|
||||
type: 1, // 消息类型，1表示文字消息
|
||||
content: content, // 消息内容
|
||||
receive_read_status: 2 // 接收方阅读状态
|
||||
}
|
||||
console.log('发送消息', msgData)
|
||||
this.client.publish(
|
||||
'contact/message/send_msg', // 使用指定的发送消息主题
|
||||
JSON.stringify(msgData),
|
||||
{ Qos: 0 },
|
||||
(err) => {
|
||||
if (err) {
|
||||
console.error('发送消息失败', err)
|
||||
// 可以在这里添加消息发送失败的处理逻辑
|
||||
} else {
|
||||
console.log('发送消息成功')
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
// 清空输入框
|
||||
this.inputMessage = ''
|
||||
},
|
||||
|
||||
// 处理输入事件
|
||||
handleInput() {
|
||||
this.canSend = this.inputMessage.trim().length > 0
|
||||
},
|
||||
|
||||
onInputFocus() {
|
||||
// 输入框获取焦点时，设置滚动到底部的标记
|
||||
this.scrollToBottomFlag = true
|
||||
setTimeout(() => {
|
||||
if (this.scrollToBottomFlag) {
|
||||
this.scrollToBottom()
|
||||
}
|
||||
}, 300)
|
||||
},
|
||||
|
||||
onInputBlur() {
|
||||
// 输入框失去焦点时，重置滚动标记
|
||||
this.scrollToBottomFlag = false
|
||||
},
|
||||
|
||||
// 是否需要显示时间分割线
|
||||
needShowTime(index) {
|
||||
if (index === 0) return true
|
||||
|
||||
const currentMsg = this.messages[index]
|
||||
const prevMsg = this.messages[index - 1]
|
||||
|
||||
// 如果两条消息间隔超过5分钟，则显示时间分割线
|
||||
return (currentMsg.time - prevMsg.time) > 5 * 60 * 1000
|
||||
},
|
||||
|
||||
// 格式化时间
|
||||
formatTime(time) {
|
||||
const date = new Date(time)
|
||||
const hours = date.getHours().toString().padStart(2, '0')
|
||||
const minutes = date.getMinutes().toString().padStart(2, '0')
|
||||
|
||||
return `${hours}:${minutes}`
|
||||
},
|
||||
|
||||
// 滚动到底部
|
||||
scrollToBottom() {
|
||||
setTimeout(() => {
|
||||
console.log('手动滚动到底部')
|
||||
uni.pageScrollTo({
|
||||
scrollTop: 999999,
|
||||
duration: 300
|
||||
});
|
||||
}, 100)
|
||||
},
|
||||
|
||||
// 返回上一页
|
||||
goBack() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
|
||||
// 启动心跳包 - 增强版：添加错误处理和状态检查
|
||||
startKeepalive() {
|
||||
// 停止之前的定时器
|
||||
this.stopKeepalive()
|
||||
|
||||
// 每30秒发送一次心跳包
|
||||
this.keepaliveTimer = setInterval(() => {
|
||||
if (this.client && this.isConnected) {
|
||||
const keepaliveData = {
|
||||
client_id: this.selfClientId // 自己的client_id
|
||||
}
|
||||
|
||||
this.client.publish(
|
||||
'contact/message/keep_time',
|
||||
JSON.stringify(keepaliveData),
|
||||
{},
|
||||
(err) => {
|
||||
if (err) {
|
||||
console.error('发送心跳包失败', err)
|
||||
// 心跳包发送失败可能表示连接有问题，可以考虑触发重连
|
||||
if (!this.isConnected) {
|
||||
return
|
||||
}
|
||||
console.log('心跳包发送失败，尝试检查连接状态')
|
||||
// 这里可以添加额外的连接检查逻辑
|
||||
}
|
||||
}
|
||||
)
|
||||
} else {
|
||||
console.warn('MQTT未连接，停止心跳包')
|
||||
this.stopKeepalive()
|
||||
}
|
||||
}, 30000)
|
||||
},
|
||||
|
||||
// 停止心跳包
|
||||
stopKeepalive() {
|
||||
if (this.keepaliveTimer) {
|
||||
clearInterval(this.keepaliveTimer)
|
||||
this.keepaliveTimer = null
|
||||
}
|
||||
},
|
||||
|
||||
// 跳转到切换客服页面
|
||||
goToChangeService() {
|
||||
uni.navigateTo({
|
||||
url: '/packages/customerService/changeService/index?currentMchId=' + this.chatTarget.mchId
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
// 页面卸载时停止心跳包
|
||||
onUnload() {
|
||||
// 断开MQTT连接
|
||||
if (this.client) {
|
||||
this.client.end()
|
||||
}
|
||||
|
||||
// 停止心跳包
|
||||
this.stopKeepalive()
|
||||
|
||||
// 清除重连失败提示定时器
|
||||
if (this.reconnectFailedTimer) {
|
||||
clearTimeout(this.reconnectFailedTimer)
|
||||
this.reconnectFailedTimer = null
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
<style scoped>
|
||||
:root {
|
||||
--header-height: 80px; /* 头部高度 */
|
||||
--input-height: 80px; /* 输入区域高度 */
|
||||
}
|
||||
</style>
|
||||
@ -1,246 +0,0 @@
|
||||
/* 合同申请表单样式 */
|
||||
.contract-apply-container {
|
||||
padding: 30rpx;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 15rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
page {
|
||||
padding-bottom: 0rpx;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.download-btn{
|
||||
height: 65rpx;
|
||||
border: none;
|
||||
border-radius: 10rpx;
|
||||
line-height: 65rpx;
|
||||
background-color: #409eff;
|
||||
color: #fff;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
|
||||
.page-header .subtitle {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.contract-form {
|
||||
background-color: #fff;
|
||||
border-radius: 10rpx;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-bottom: 10rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.form-label.required::after {
|
||||
content: '*';
|
||||
color: #e64340;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.form-input,
|
||||
.form-select {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
border: 1rpx solid #d9d9d9;
|
||||
border-radius: 8rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
box-sizing: border-box;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
|
||||
.form-input:focus,
|
||||
.form-select:focus {
|
||||
border-color: #409eff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.form-select {
|
||||
appearance: none;
|
||||
background: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024"><path fill="%23999" d="M840.4 300H183.6c-19.7 0-30.7 20.8-18.5 35l328.4 380.8c9.4 10.9 27.5 10.9 37 0L858.9 335c12.2-14.2 1.2-35-18.5-35z"></path></svg>') no-repeat right 20rpx center;
|
||||
background-size: 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.bottom-btn{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* 按钮样式 */
|
||||
.sign-btn,
|
||||
.submit-btn1,
|
||||
.submit-btn {
|
||||
width: 100%;
|
||||
height: 90rpx;
|
||||
border: none;
|
||||
border-radius: 45rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20rpx;
|
||||
transition: all 0.3s;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.sign-btn {
|
||||
background-color: #f0f0f0;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.sign-btn:active {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background-color: #409eff;
|
||||
color: #fff;
|
||||
margin-left: 5rpx;
|
||||
}
|
||||
|
||||
.submit-btn1 {
|
||||
background-color: #ff4016;
|
||||
color: #fff;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
|
||||
.submit-btn:active {
|
||||
background-color: #66b1ff;
|
||||
}
|
||||
|
||||
/* 响应式调整 */
|
||||
@media screen and (max-width: 768px) {
|
||||
.contract-apply-container {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.contract-form {
|
||||
padding: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/* 自定义弹窗样式 */
|
||||
.custom-modal-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.custom-modal {
|
||||
width: 100%;
|
||||
max-width: 650rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 30rpx;
|
||||
border-bottom: 2rpx solid #f0f0f0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modal-header h3 {
|
||||
margin: 0;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 40rpx;
|
||||
color: #999;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
padding: 40rpx 30rpx;
|
||||
}
|
||||
|
||||
.modal-content p {
|
||||
margin: 0 0 30rpx 0;
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.link-container {
|
||||
background-color: #f5f5f5;
|
||||
padding: 20rpx;
|
||||
border-radius: 8rpx;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.link-text {
|
||||
color: #007aff;
|
||||
font-size: 26rpx;
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
padding: 0 30rpx 30rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.confirm-btn {
|
||||
background-color: #007aff;
|
||||
color: #fff;
|
||||
border: none;
|
||||
line-height: 80rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 28rpx;
|
||||
cursor: pointer;
|
||||
min-width: 200rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
.confirm-btn2 {
|
||||
border: none;
|
||||
line-height: 80rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 28rpx;
|
||||
cursor: pointer;
|
||||
min-width: 200rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
@ -1,459 +0,0 @@
|
||||
<template>
|
||||
<view class="contract-apply-container">
|
||||
<view class="page-header">
|
||||
<h1>合同申请</h1>
|
||||
<button type="button" class="download-btn" @click="download">合同下载</button>
|
||||
</view>
|
||||
|
||||
<form class="contract-form">
|
||||
|
||||
<!-- 合同类别 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">合同类别</view>
|
||||
<view class="form-input-wrapper">
|
||||
<view class="form-select" @click="handleEcTypeClick">
|
||||
{{ getEcTypeLabel({ value: formData.ec_type_code }) || formData.ec_type_code || '请选择合同类别' }}
|
||||
</view>
|
||||
<u-picker :show="showEcTypePicker" :columns="[ecTypeOptions]" keyName="label" @confirm="onEcTypeConfirm"
|
||||
@cancel="showEcTypePicker = false" @close="showEcTypePicker = false" :closeOnClickOverlay="true"></u-picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 法人/经营者证件类型 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">法人/经营者证件类型</view>
|
||||
<view class="form-input-wrapper">
|
||||
<view class="form-select" @click="handleCertTypeClick">
|
||||
{{ getCertTypeLabel(formData.cert_type) || '请选择证件类型' }}
|
||||
</view>
|
||||
<u-picker :show="showCertTypePicker" :columns="[certTypeOptions]" keyName="label" @confirm="onCertTypeConfirm"
|
||||
@cancel="showCertTypePicker = false" @close="showCertTypePicker = false"
|
||||
:closeOnClickOverlay="true"></u-picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 法人/经营者姓名 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">法人/经营者姓名</view>
|
||||
<input type="text" class="form-input" v-model="formData.cert_name" placeholder="请输入姓名" />
|
||||
</view>
|
||||
|
||||
<!-- 法人/经营者证件号码 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">法人/经营者证件号码</view>
|
||||
<input type="text" class="form-input" v-model="formData.cert_no" placeholder="请输入证件号码" />
|
||||
</view>
|
||||
|
||||
<!-- 签约手机号 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">签约手机号</view>
|
||||
<input type="tel" class="form-input" v-model="formData.mobile" placeholder="请输入手机号" />
|
||||
</view>
|
||||
|
||||
<!-- 营业执照号 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label">营业执照号</view>
|
||||
<input type="text" class="form-input" v-model="formData.business_license_no" placeholder="请输入营业执照号（可选）" />
|
||||
</view>
|
||||
|
||||
<!-- 营业执照名称 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label">营业执照名称</view>
|
||||
<input type="text" class="form-input" v-model="formData.business_license_name" placeholder="请输入营业执照名称（可选）" />
|
||||
</view>
|
||||
|
||||
<!-- 企业/经营者结算开户行号 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">企业/经营者结算开户行号</view>
|
||||
<input type="text" class="form-input" v-model="formData.openning_bank_code" placeholder="请输入开户行号" />
|
||||
</view>
|
||||
|
||||
<!-- 企业/经营者结算开户行名称 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">企业/经营者结算开户行名称</view>
|
||||
<input type="text" class="form-input" v-model="formData.openning_bank_name" placeholder="请输入开户行名称" />
|
||||
</view>
|
||||
|
||||
<!-- 企业/经营者结算卡性质 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">企业/经营者结算卡性质</view>
|
||||
<view class="form-input-wrapper">
|
||||
<view class="form-select" @click="handleAcctTypeClick">
|
||||
{{ formData.acct_type_code ? (formData.acct_type_code === '57' ? '对公' : '对私') : '请选择结算卡性质' }}
|
||||
</view>
|
||||
<u-picker :show="showAcctTypePicker" :columns="[acctTypeOptions]" keyName="label" @confirm="onAcctTypeConfirm"
|
||||
@cancel="showAcctTypePicker = false" @close="showAcctTypePicker = false"
|
||||
:closeOnClickOverlay="true"></u-picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 企业/经营者结算卡号 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">企业/经营者结算卡号</view>
|
||||
<input type="text" class="form-input" v-model="formData.acct_no" placeholder="请输入结算卡号" />
|
||||
</view>
|
||||
|
||||
<!-- 企业/经营者结算卡名称 -->
|
||||
<view class="form-item">
|
||||
<view class="form-label required">企业/经营者结算卡名称</view>
|
||||
<input type="text" class="form-input" v-model="formData.acct_name" placeholder="请输入结算卡名称" />
|
||||
</view>
|
||||
|
||||
<!-- 签署协议按钮 -->
|
||||
<button type="button" class="sign-btn" @click="goToSignAgreement">签署协议</button>
|
||||
|
||||
<!-- 提交申请按钮 -->
|
||||
<view class="bottom-btn">
|
||||
<button type="button" class="submit-btn1" @click="ecQuery">结果查询</button>
|
||||
<button type="button" class="submit-btn" @click="submitApplication">提交申请</button>
|
||||
</view>
|
||||
</form>
|
||||
|
||||
<!-- 自定义弹窗 -->
|
||||
<view v-if="showCustomModal" class="custom-modal-overlay" @click="closeModal">
|
||||
<view class="custom-modal" @click.stop>
|
||||
<view class="modal-content">
|
||||
<p>查询结果前请先确认是否在以下页面中填写信息</p>
|
||||
<view class="link-container">
|
||||
<text class="link-text" @click="openApplyUrl">{{ applyUrl || '暂无链接' }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="modal-footer">
|
||||
<button type="button" class="confirm-btn2" @click="closeModal">取消</button>
|
||||
<button type="button" class="confirm-btn" @click="confirmQuery">确认</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { picUrl, menuButtonInfo, request, NavgateTo, RequsetUrl } from "../../../utils";
|
||||
import { apiArr } from "../../../api/contract";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
ec_type_code: 'Ec007',
|
||||
cert_type: '',
|
||||
cert_name: '',
|
||||
cert_no: '',
|
||||
mobile: '',
|
||||
business_license_no: '',
|
||||
business_license_name: '',
|
||||
openning_bank_code: '',
|
||||
openning_bank_name: '',
|
||||
acct_type_code: '',
|
||||
acct_no: '',
|
||||
acct_name: '',
|
||||
ec_content_parameters: '',
|
||||
},
|
||||
// picker显示状态
|
||||
showEcTypePicker: false,
|
||||
showCertTypePicker: false,
|
||||
showAcctTypePicker: false,
|
||||
// picker选项数据
|
||||
ecTypeOptions: [
|
||||
{ label: '特约商户支付服务合作协议V4.1 + 结算授权委托书', value: 'Ec007' }
|
||||
],
|
||||
certTypeOptions: [
|
||||
{ label: '身份证', value: 'RESIDENT_ID' },
|
||||
{ label: '护照', value: 'PASSPORT' },
|
||||
{ label: '港澳居民往来内地通行证', value: 'HK_MACAO_PASS' },
|
||||
{ label: '台湾居民来往大陆通行证', value: 'TAIWAN_PASS' }
|
||||
],
|
||||
acctTypeOptions: [
|
||||
{ label: '对公', value: '57' },
|
||||
{ label: '对私', value: '58' }
|
||||
],
|
||||
// 自定义弹窗状态
|
||||
showCustomModal: false,
|
||||
applyUrl: ''
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
// 如果从上一个页面返回并携带了ec_content参数，则设置
|
||||
if (options.ec_content) {
|
||||
this.formData.ec_content_parameters = options.ec_content;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//下载合同
|
||||
download() {
|
||||
const storeValue = uni.getStorageSync('storeValue');
|
||||
if (!storeValue || !storeValue.ec_apply_id) {
|
||||
uni.showToast({
|
||||
title: '请先提交申请',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
const params = {
|
||||
ec_apply_id: storeValue.ec_apply_id
|
||||
};
|
||||
|
||||
uni.showLoading({
|
||||
title: '下载中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 构建完整的下载URL
|
||||
const downloadUrl = `${RequsetUrl}${apiArr.ecDownload}?ec_apply_id=${storeValue.ec_apply_id}`;
|
||||
|
||||
// 调用uni.downloadFile进行文件下载
|
||||
uni.downloadFile({
|
||||
url: downloadUrl,
|
||||
header: {
|
||||
'Authorization': uni.getStorageSync('ctoken')
|
||||
},
|
||||
success: (res) => {
|
||||
uni.hideLoading();
|
||||
// 下载成功，保存文件到本地
|
||||
uni.saveFile({
|
||||
tempFilePath: res.tempFilePath,
|
||||
success: (saveRes) => {
|
||||
uni.showToast({
|
||||
title: '下载成功',
|
||||
icon: 'success'
|
||||
});
|
||||
// 提示用户打开文件
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '合同已下载完成，是否立即打开？',
|
||||
success: (modalRes) => {
|
||||
if (modalRes.confirm) {
|
||||
// 打开文件
|
||||
uni.openDocument({
|
||||
filePath: saveRes.savedFilePath,
|
||||
showMenu: true,
|
||||
success: (openRes) => {
|
||||
console.log('文件打开成功');
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('文件打开失败:', err);
|
||||
uni.showToast({
|
||||
title: '文件打开失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('文件保存失败:', err);
|
||||
uni.showToast({
|
||||
title: '文件保存失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
uni.hideLoading();
|
||||
console.error('下载请求失败:', err);
|
||||
uni.showToast({
|
||||
title: '下载失败，请稍后重试',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
// 合同查询
|
||||
ecQuery() {
|
||||
// 显示自定义弹窗
|
||||
this.applyUrl = uni.getStorageSync('applyUrl');
|
||||
this.showCustomModal = true;
|
||||
},
|
||||
|
||||
// 关闭自定义弹窗
|
||||
closeModal() {
|
||||
this.showCustomModal = false;
|
||||
},
|
||||
|
||||
// 打开申请链接
|
||||
openApplyUrl() {
|
||||
if (this.applyUrl) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/webview/webview?url=${encodeURIComponent(this.applyUrl)}`
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// 确认查询
|
||||
confirmQuery() {
|
||||
this.showCustomModal = false;
|
||||
|
||||
// 继续查询流程
|
||||
const storeValue = uni.getStorageSync('storeValue');
|
||||
if (!storeValue || !storeValue.ec_apply_id) {
|
||||
uni.showToast({
|
||||
title: '请先提交申请',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
const params = {
|
||||
ec_apply_id: storeValue.ec_apply_id
|
||||
}
|
||||
request(apiArr.ecQuery, "POST", params).then(res => {
|
||||
if (res.resp_data.ec_status === 'COMPLETED') {
|
||||
uni.showToast({
|
||||
title: '申请通过',
|
||||
icon: 'success'
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '申请未通过',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 获取合同类别显示文本
|
||||
getEcTypeLabel(code) {
|
||||
// 兼容直接传入value或者包含value属性的对象
|
||||
const targetValue = typeof code === 'string' ? code : (code && code.value ? code.value : code);
|
||||
const option = this.ecTypeOptions.find(item => item.value === targetValue);
|
||||
return option ? option.label : null;
|
||||
},
|
||||
// 获取证件类型显示文本
|
||||
getCertTypeLabel(type) {
|
||||
const option = this.certTypeOptions.find(item => item.value === type);
|
||||
return option ? option.label : null;
|
||||
},
|
||||
// 调试点击事件
|
||||
handleEcTypeClick() {
|
||||
this.showEcTypePicker = true;
|
||||
},
|
||||
handleCertTypeClick() {
|
||||
this.showCertTypePicker = true;
|
||||
},
|
||||
handleAcctTypeClick() {
|
||||
this.showAcctTypePicker = true;
|
||||
},
|
||||
// 合同类别选择确认
|
||||
onEcTypeConfirm(e) {
|
||||
const selectedValue = e.value[0];
|
||||
// 查找对应的选项对象
|
||||
const selectedOption = this.ecTypeOptions.find(item => item.value === selectedValue);
|
||||
this.formData.ec_type_code = selectedOption ? selectedOption.value : selectedValue;
|
||||
this.showEcTypePicker = false;
|
||||
},
|
||||
// 证件类型选择确认
|
||||
onCertTypeConfirm(e) {
|
||||
const selectedValue = e.value[0];
|
||||
const selectedOption = this.certTypeOptions.find(item => item.value === selectedValue.value);
|
||||
this.formData.cert_type = selectedOption ? selectedOption.value : selectedValue;
|
||||
this.showCertTypePicker = false;
|
||||
},
|
||||
// 结算卡性质选择确认
|
||||
onAcctTypeConfirm(e) {
|
||||
const selectedValue = e.value[0];
|
||||
const selectedOption = this.acctTypeOptions.find(item => item.value === selectedValue.value);
|
||||
this.formData.acct_type_code = selectedOption ? selectedOption.value : selectedValue;
|
||||
this.showAcctTypePicker = false;
|
||||
},
|
||||
goToSignAgreement() {
|
||||
NavgateTo('/packages/customerService/contract/index', {
|
||||
// 监听协议页面传递回来的数据
|
||||
onAgreementSigned: (data) => {
|
||||
if (data && data.ec_content) {
|
||||
this.formData.ec_content_parameters = data.ec_content;
|
||||
uni.showToast({
|
||||
title: '协议签署成功',
|
||||
icon: 'success'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
submitApplication() {
|
||||
// 表单验证
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
request(apiArr.ecApply, "POST", this.formData).then(res => {
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'success'
|
||||
});
|
||||
uni.setStorageSync('storeValue', { ec_apply_id: res.resp_data.ec_apply_id });
|
||||
uni.setStorageSync('applyUrl', res.resp_data.result_url);
|
||||
})
|
||||
},
|
||||
|
||||
// 表单验证方法
|
||||
validateForm() {
|
||||
const { formData } = this;
|
||||
|
||||
if (!formData.ec_type_code) {
|
||||
uni.showToast({ title: '请选择合同类别', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.cert_type) {
|
||||
uni.showToast({ title: '请选择法人/经营者证件类型', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.cert_name) {
|
||||
uni.showToast({ title: '请输入法人/经营者姓名', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.cert_no) {
|
||||
uni.showToast({ title: '请输入法人/经营者证件号码', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
// 验证手机号格式
|
||||
if (!formData.mobile) {
|
||||
uni.showToast({ title: '请输入签约手机号', icon: 'none' });
|
||||
return false;
|
||||
} else if (!/^1[3-9]\d{9}$/.test(formData.mobile)) {
|
||||
uni.showToast({ title: '手机号格式不正确', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.openning_bank_code) {
|
||||
uni.showToast({ title: '请输入企业/经营者结算开户行号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.openning_bank_name) {
|
||||
uni.showToast({ title: '请输入企业/经营者结算开户行名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acct_type_code) {
|
||||
uni.showToast({ title: '请选择企业/经营者结算卡性质', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acct_no) {
|
||||
uni.showToast({ title: '请输入企业/经营者结算卡号', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.acct_name) {
|
||||
uni.showToast({ title: '请输入企业/经营者结算卡名称', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!formData.ec_content_parameters) {
|
||||
uni.showToast({ title: '请先点击签署协议并完成协议签署', icon: 'none' });
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import url("./index.css");
|
||||
</style>
|
||||
667
packages/health/express/express.vue
Normal file
667
packages/health/express/express.vue
Normal file
@ -0,0 +1,667 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="express">
|
||||
<!-- Step Navigation -->
|
||||
<view class="strideList">
|
||||
<view class="strideItem" :class="{active: step == 1}" @tap="changeItem(1)">基础<br />信息</view>
|
||||
|
||||
<view class="icons">
|
||||
<image
|
||||
:src="step != 2 ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/play_1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/play_2.png'"
|
||||
mode="widthFix" />
|
||||
</view>
|
||||
|
||||
<view class="strideItem" :class="{active: step == 2}" @tap="changeItem(2)">病历<br />信息</view>
|
||||
|
||||
<view class="icons">
|
||||
<image
|
||||
:src="step != 3 ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/play_1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/play_2.png'"
|
||||
mode="widthFix" />
|
||||
</view>
|
||||
|
||||
<view class="strideItem" :class="{active: step == 3}" @tap="changeItem(3)">生活<br />方式</view>
|
||||
|
||||
<view class="icons">
|
||||
<image
|
||||
:src="step != 4 ? 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/play_1.png' : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/play_2.png'"
|
||||
mode="widthFix" />
|
||||
</view>
|
||||
|
||||
<view class="strideItem" :class="{active: step == 4}" @tap="changeItem(4)">授权<br />用户</view>
|
||||
</view>
|
||||
|
||||
<!-- Step 1: Basic Information -->
|
||||
<view class="basic" v-if="step == 1">
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">姓名</view>
|
||||
<view class="basic_row_con">
|
||||
<input v-model="name" placeholder="请填写您的姓名" placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">电话</view>
|
||||
<view class="basic_row_con">
|
||||
<input v-model="phone" type="number" maxlength="11" placeholder="请填写您的电话"
|
||||
placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">性别</view>
|
||||
<view class="basic_row_con">
|
||||
<view class="sex" :class="{active2: sex == 'man'}" @tap="changeSex('man')">
|
||||
<view class="cir"></view>男
|
||||
</view>
|
||||
|
||||
<view class="sex" :class="{active2: sex == 'woman'}" @tap="changeSex('woman')">
|
||||
<view class="cir"></view>女
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">出生日期</view>
|
||||
<view class="basic_row_con" @tap="changeShow">
|
||||
<input v-model="time" disabled placeholder="请选择您的出生日期"
|
||||
placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">身高</view>
|
||||
<view class="basic_row_con">
|
||||
<input v-model="height" placeholder="请填写身高(单位cm)" placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row none">
|
||||
<view class="basic_row_tit">体重</view>
|
||||
<view class="basic_row_con">
|
||||
<input v-model="weight" placeholder="请填写体重(单位Kg)" placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn" @click="headerStepClick">下一步</view>
|
||||
</view>
|
||||
|
||||
<!-- Step 2: Medical Information -->
|
||||
<view class="infomation" v-if="step == 2">
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">血值类型</view>
|
||||
<view class="basic_row_con" @tap="changeShow2('bloodType', '血脂类型')">
|
||||
<input v-model="bloodType" disabled placeholder="请选择您的血值类型"
|
||||
placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">糖尿病类型</view>
|
||||
<view class="basic_row_con" @tap="changeShow2('diabetesType', '糖尿病类型')">
|
||||
<input v-model="diabetesType" disabled placeholder="请选择您的糖尿病类型"
|
||||
placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row">
|
||||
<view class="basic_row_tit">血压类型</view>
|
||||
<view class="basic_row_con" @tap="changeShow2('bloodPressure', '血压类型')">
|
||||
<input v-model="bloodPressure" disabled placeholder="请选择您的血压类型"
|
||||
placeholder-style="color: #999999;font-size: 26rpx" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row2">
|
||||
<view class="basic_row_tit">既往病史</view>
|
||||
<view class="illnessList">
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'a'}" @tap="headerInputClick2('pastCase', 'a')">胸闷
|
||||
</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'b'}" @tap="headerInputClick2('pastCase', 'b')">心慌
|
||||
</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'c'}" @tap="headerInputClick2('pastCase', 'c')">头晕
|
||||
</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'd'}" @tap="headerInputClick2('pastCase', 'd')">痛风
|
||||
</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'e'}" @tap="headerInputClick2('pastCase', 'e')">
|
||||
脑血管疾病</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'f'}" @tap="headerInputClick2('pastCase', 'f')">
|
||||
急性并发症</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'g'}" @tap="headerInputClick2('pastCase', 'g')">
|
||||
心脏疾病</view>
|
||||
<view class="illnessItem" :class="{checked: pastCase === 'h'}" @tap="headerInputClick2('pastCase', 'h')">其他
|
||||
</view>
|
||||
<!-- 其他病史选项... -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row2">
|
||||
<view class="basic_row_tit">既往用药</view>
|
||||
<view class="drugList">
|
||||
<view class="drugItem" :class="{checked: pharmacy === 'a'}" @tap="headerInputClick2('pharmacy', 'a')">他汀类降脂药
|
||||
</view>
|
||||
<view class="drugItem" :class="{checked: pharmacy === 'b'}" @tap="headerInputClick2('pharmacy', 'b')">中药降脂
|
||||
</view>
|
||||
<view class="drugItem" :class="{checked: pharmacy === 'c'}" @tap="headerInputClick2('pharmacy', 'c')">中药降酸药
|
||||
</view>
|
||||
<view class="drugItem" :class="{checked: pharmacy === 'd'}" @tap="headerInputClick2('pharmacy', 'd')">其他
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="basic_row none">
|
||||
<view class="basic_row_tit">用药时间</view>
|
||||
<view class="basic_row_con">
|
||||
<view class="sex" :class="{active2: drugTime == '3'}" @tap="changeTime('3')">
|
||||
<view class="cir"></view>3年
|
||||
</view>
|
||||
<view class="sex" :class="{active2: drugTime == '1'}" @tap="changeTime('1')">
|
||||
<view class="cir"></view>一年以内
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="btn" @click="headerStepClick">下一步</view>
|
||||
</view>
|
||||
|
||||
<!-- Step 3: Lifestyle -->
|
||||
<view class="life" v-if="step == 3">
|
||||
<!-- 生活方式表单内容... -->
|
||||
|
||||
|
||||
<view class="basic_row3" style="margin-top: 20rpx;">
|
||||
<view class="basic_row_tit">吸烟情况</view>
|
||||
<view class="basic_row_con3">
|
||||
<view class="sex" :class="{ active2: smoke === 'no' }" @click="handleSelect('smoke', 'no')">
|
||||
<view class="cir"></view>从不
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: smoke === 'ring' }" @click="handleSelect('smoke', 'ring')">
|
||||
<view class="cir"></view>已戒烟
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: smoke === 'yes' }" @click="handleSelect('smoke', 'yes')">
|
||||
<view class="cir"></view>吸烟
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 饮酒情况 -->
|
||||
<view class="basic_row3">
|
||||
<view class="basic_row_tit">饮酒情况</view>
|
||||
<view class="basic_row_con3">
|
||||
<view class="sex" :class="{ active2: drink === 'no' }" @click="handleSelect('drink', 'no')">
|
||||
<view class="cir"></view>从不
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: drink === 'once' }" @click="handleSelect('drink', 'once')">
|
||||
<view class="cir"></view>偶尔
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: drink === 'yes' }" @click="handleSelect('drink', 'yes')">
|
||||
<view class="cir"></view>经常
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: drink === 'ring' }" @click="handleSelect('drink', 'ring')">
|
||||
<view class="cir"></view>戒酒
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 日常工作 -->
|
||||
<view class="basic_row3">
|
||||
<view class="basic_row_tit">日常工作</view>
|
||||
<view class="basic_row_con3">
|
||||
<view class="sex" :class="{ active2: dailyWork === 'easy' }" @click="handleSelect('dailyWork', 'easy')">
|
||||
<view class="cir"></view>轻体力劳动
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: dailyWork === 'in' }" @click="handleSelect('dailyWork', 'in')">
|
||||
<view class="cir"></view>中体力劳动
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: dailyWork === 'repeat' }" @click="handleSelect('dailyWork', 'repeat')">
|
||||
<view class="cir"></view>重体力劳动
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: dailyWork === 'rest' }" @click="handleSelect('dailyWork', 'rest')">
|
||||
<view class="cir"></view>休息
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 运动情况 -->
|
||||
<view class="basic_row3">
|
||||
<view class="basic_row_tit">运动情况</view>
|
||||
<view class="basic_row_con3">
|
||||
<view class="sex" :class="{ active2: motion === 'lack' }" @click="handleSelect('motion', 'lack')">
|
||||
<view class="cir"></view>≤2次
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: motion === 'once' }" @click="handleSelect('motion', 'once')">
|
||||
<view class="cir"></view>3-5次
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: motion === 'days' }" @click="handleSelect('motion', 'days')">
|
||||
<view class="cir"></view>每天
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: motion === 'no' }" @click="handleSelect('motion', 'no')">
|
||||
<view class="cir"></view>无运动
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 睡眠情况 -->
|
||||
<view class="basic_row3 none">
|
||||
<view class="basic_row_tit">睡眠情况</view>
|
||||
<view class="basic_row_con3">
|
||||
<view class="sex" :class="{ active2: sleep === 'law' }" @click="handleSelect('sleep', 'law')">
|
||||
<view class="cir"></view>规律
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: sleep === 'noLaw' }" @click="handleSelect('sleep', 'noLaw')">
|
||||
<view class="cir"></view>熬夜
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: sleep === 'overturn' }" @click="handleSelect('sleep', 'overturn')">
|
||||
<view class="cir"></view>黑白颠倒
|
||||
</view>
|
||||
<view class="sex" :class="{ active2: sleep === 'rest' }" @click="handleSelect('sleep', 'rest')">
|
||||
<view class="cir"></view>其他
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="btn" @click="headerStepClick">下一步</view>
|
||||
</view>
|
||||
|
||||
<!-- Step 4: Authorization -->
|
||||
<view class="user" v-if="step == 4">
|
||||
<!-- 授权表单内容... -->
|
||||
|
||||
<view class="basic_row3 none">
|
||||
<view class="basic_row_tit">档案授权</view>
|
||||
<view class="basic_row_con2">
|
||||
<view
|
||||
class="sex"
|
||||
:class="{ active2: accredit === 'owner' }"
|
||||
@click="handleSelect('accredit', 'owner')"
|
||||
>
|
||||
<view class="cir"></view>对所有人员开放
|
||||
</view>
|
||||
<view
|
||||
class="sex"
|
||||
:class="{ active2: accredit === 'family' }"
|
||||
@click="handleSelect('accredit', 'family')"
|
||||
>
|
||||
<view class="cir"></view>对家庭成员开放
|
||||
</view>
|
||||
<view
|
||||
class="sex"
|
||||
:class="{ active2: accredit === 'serve' }"
|
||||
@click="handleSelect('accredit', 'serve')"
|
||||
>
|
||||
<view class="cir"></view>对服务人员开放
|
||||
</view>
|
||||
<view
|
||||
class="sex"
|
||||
:class="{ active2: accredit === 'oneself' }"
|
||||
@click="handleSelect('accredit', 'oneself')"
|
||||
>
|
||||
<view class="cir"></view>只允许自己查看
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="btn" bind:tap="headerSubmitClick">提交</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Date Picker Popup -->
|
||||
<u-popup :show="show" mode="bottom" round close-on-click-overlay>
|
||||
<view style="width: 100%;">
|
||||
<u-datetime-picker mode="date" :show="show" :formatter="formatter" @cancel="onClose"
|
||||
@confirm="onInput"></u-datetime-picker>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
|
||||
<!-- Blood Type Picker Popup -->
|
||||
<u-popup :show="show2" mode="bottom" round close-on-click-overlay>
|
||||
<view style="width: 100%;">
|
||||
<u-picker :columns="columns" :show="show2" :title="PopupTitle" @confirm="onInput2" @cancel="onClose2"
|
||||
show-toolbar></u-picker>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
step: 1,
|
||||
name: '',
|
||||
phone: '',
|
||||
sex: '',
|
||||
time: '',
|
||||
height: '',
|
||||
weight: '',
|
||||
bloodType: '',
|
||||
diabetesType: '',
|
||||
bloodPressure: '',
|
||||
pastCase: '',
|
||||
pharmacy: '',
|
||||
drugTime: '',
|
||||
smoke: '',
|
||||
drink: '',
|
||||
dailyWork: '',
|
||||
motion: '',
|
||||
sleep: '',
|
||||
accredit: '',
|
||||
show: false,
|
||||
show2: false,
|
||||
currentDate: new Date().getTime(),
|
||||
popupType: '',
|
||||
PopupTitle: '',
|
||||
columns: [], // Your picker options
|
||||
formatter(type, value) {
|
||||
if (type === 'year') {
|
||||
return `${value}年`;
|
||||
}
|
||||
if (type === 'month') {
|
||||
return `${value}月`;
|
||||
}
|
||||
if (type === 'day') {
|
||||
return `${value}日`;
|
||||
}
|
||||
return value;
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeItem(step) {
|
||||
this.step = step;
|
||||
},
|
||||
changeSex(sex) {
|
||||
this.sex = sex;
|
||||
},
|
||||
changeTime(time) {
|
||||
this.drugTime = time;
|
||||
},
|
||||
changeShow() {
|
||||
this.show = true;
|
||||
console.log(this.show, 'asdasd');
|
||||
},
|
||||
changeShow2(type, title) {
|
||||
this.popupType = type;
|
||||
this.PopupTitle = title;
|
||||
this.show2 = true;
|
||||
},
|
||||
headerInputClick(e) {
|
||||
this[e.currentTarget.dataset.name] = e.detail.value;
|
||||
},
|
||||
headerInputClick2(name, val) {
|
||||
this[name] = val;
|
||||
},
|
||||
headerStepClick() {
|
||||
this.step++;
|
||||
},
|
||||
headerSubmitClick() {
|
||||
// Submit logic
|
||||
},
|
||||
onClose() {
|
||||
this.show = false;
|
||||
},
|
||||
onClose2() {
|
||||
this.show2 = false;
|
||||
},
|
||||
onInput(e) {
|
||||
this.time = this.$u.timeFormat(e.value, 'yyyy-mm-dd');
|
||||
this.show = false;
|
||||
},
|
||||
onInput2(e) {
|
||||
this[this.popupType] = e[0];
|
||||
this.show2 = false;
|
||||
},
|
||||
handleSelect(name,val) {
|
||||
console.log(name,val);
|
||||
this[name] = val;
|
||||
return;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.strideList {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 43rpx;
|
||||
}
|
||||
|
||||
.strideItem {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
background: #D9D9D9;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.icons {
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #FF512A;
|
||||
|
||||
}
|
||||
|
||||
.strideList {
|
||||
margin-top: 42rpx;
|
||||
}
|
||||
|
||||
|
||||
.basic {
|
||||
margin: 0 20rpx;
|
||||
margin-top: 62rpx;
|
||||
}
|
||||
|
||||
.basic_row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.basic_row_tit {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.basic_row_con {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.basic_row_con input {
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.sex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
|
||||
.cir {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
border-radius: 50%;
|
||||
border: 1rpx solid #555555;
|
||||
margin-right: 16rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.active2 .cir {
|
||||
background-color: #ff512a;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.none {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-weight: 400;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
width: 650rpx;
|
||||
height: 80rpx;
|
||||
background: #FF512A;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 64rpx;
|
||||
}
|
||||
|
||||
.infomation {
|
||||
margin: 0 20rpx;
|
||||
margin-top: 92rpx;
|
||||
padding-bottom: 60rpx;
|
||||
}
|
||||
|
||||
.basic_row2 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.illnessItem {
|
||||
width: 150rpx;
|
||||
height: 50rpx;
|
||||
background: #F0F0F0;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.illnessList {
|
||||
margin-top: 30rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.basic_row2 .ipts {
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.drugList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 25rpx;
|
||||
}
|
||||
|
||||
.drugItem {
|
||||
background: #F0F0F0;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
white-space: nowrap;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
padding: 10rpx;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.checked {
|
||||
background: #FF512A;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
|
||||
.life {
|
||||
margin: 0 52rpx;
|
||||
}
|
||||
|
||||
.life .basic_row {
|
||||
width: 100%;
|
||||
justify-content: flex-start;
|
||||
min-height: 90rpx;
|
||||
}
|
||||
|
||||
.life .basic_row_tit {
|
||||
white-space: nowrap;
|
||||
margin-right: 32rpx;
|
||||
}
|
||||
|
||||
.life .basic_row_con {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
|
||||
.life .sex {
|
||||
margin: 15rpx 0;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.basic_row_con3 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
}
|
||||
|
||||
.basic_row3 {
|
||||
min-height: 90rpx;
|
||||
display: flex;
|
||||
padding-top: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
align-items: flex-start;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
}
|
||||
|
||||
.basic_row_con3 .sex {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.life .none {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.user {
|
||||
margin: 0 52rpx;
|
||||
margin-top: 92rpx;
|
||||
}
|
||||
|
||||
.user .none {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.user .sex {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
</style>
|
||||
611
packages/health/index/index.vue
Normal file
611
packages/health/index/index.vue
Normal file
@ -0,0 +1,611 @@
|
||||
<template>
|
||||
<view class="headlth">
|
||||
<!-- Swiper Section -->
|
||||
<view class="swiper">
|
||||
<swiper :autoplay="true" :interval="3000" :duration="500">
|
||||
<swiper-item>
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_img.png" mode="widthFix" />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
|
||||
<!-- Tab List -->
|
||||
<view class="tabList">
|
||||
<view class="tabItem" v-for="(item, index) in tabList" :key="index" @tap="jump(item.url)">
|
||||
<view class="tabImg">
|
||||
<image :src="item.img" mode="heightFix" />
|
||||
</view>
|
||||
<view class="tabName">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="gray"></view>
|
||||
|
||||
<!-- Hot Services -->
|
||||
<view class="tit">
|
||||
热门服务
|
||||
</view>
|
||||
|
||||
<view class="serviceTag">
|
||||
<view class="serviceTagItem" v-for="(service, idx) in healthServices" :key="idx">
|
||||
<view class="serviceTagItem_name">{{service.name}}</view>
|
||||
<view class="serviceTagItem_msg">{{service.value}}</view>
|
||||
<view :class="'serviceTagItem_img' + (idx+1)">
|
||||
<image :src="service.icon" mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="gray"></view>
|
||||
|
||||
<!-- Tabs -->
|
||||
<view class="tabs">
|
||||
<view class="tab" :class="{active: tabIndex == 0}" @tap="changeTab(0)">服务列表</view>
|
||||
<view class="tab" :class="{active: tabIndex == 1}" @tap="changeTab(1)">商户列表</view>
|
||||
</view>
|
||||
|
||||
<!-- Service List -->
|
||||
<view class="list_item" v-if="tabIndex == 0" v-for="(item, index) in serverList" :key="index">
|
||||
<view class="item_tit">
|
||||
<view class="item_tit_left">{{item.cate_name}}</view>
|
||||
<view class="item_tit_right" @tap="ServerMore(item.cate_id)">
|
||||
更多
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png"
|
||||
mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="item_goodsList">
|
||||
<view class="item_goodsItem" v-for="(items, subIndex) in item.appoints" :key="subIndex"
|
||||
@tap="ServerDesc(items.appoint_id)">
|
||||
<view class="item_goodsItem_tit">
|
||||
<image :src="items.photo" mode="aspectFill" />
|
||||
</view>
|
||||
<view class="item_goodsItem_name">{{items.title}}</view>
|
||||
<view class="item_goodsItem_msg">
|
||||
￥
|
||||
<view>{{items.price}}</view>
|
||||
<text>/{{items.unit}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Merchant List -->
|
||||
<view class="merchantList" v-if="tabIndex == 1">
|
||||
<view class="merchantItem" v-for="(item, index) in 4" :key="index">
|
||||
<view class="merchantItem_left">
|
||||
<view class="merchantItem_left_img">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/gropBuy/goods.png" mode="widthFix" />
|
||||
</view>
|
||||
<view class="merchantItem_left_msg">
|
||||
<view class="merchantItem_left_msg_tit">永训医疗</view>
|
||||
<view class="merchantItem_left_msg_add">衡阳市石鼓区中山北路1号</view>
|
||||
<view class="merchantItem_left_msg_msg">中国领先的高科技医疗设备研...</view>
|
||||
<view class="merchantItem_left_msg_tag">健康 卫生 先进</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="merchantItem_right">
|
||||
电话询价
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tabList: [{
|
||||
name: "快速建档",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon1.png',
|
||||
url: "../express/express",
|
||||
},
|
||||
{
|
||||
name: "健康自测",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon2.png',
|
||||
url: "../SelfTest/SelfTest",
|
||||
},
|
||||
{
|
||||
name: "健康管理",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon3.png',
|
||||
url: "",
|
||||
},
|
||||
{
|
||||
name: "上门服务",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon4.png',
|
||||
url: "/packages/doorToDoor/pages/doorToDoor/doorToDoor",
|
||||
},
|
||||
{
|
||||
name: "自检报告",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon5.png',
|
||||
url: "../report/report",
|
||||
},
|
||||
{
|
||||
name: "健康饮食",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon6.png',
|
||||
url: "../food/food",
|
||||
},
|
||||
{
|
||||
name: "健康运动",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon7.png',
|
||||
url: "../sports/sports",
|
||||
},
|
||||
{
|
||||
name: "社区商城",
|
||||
img: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon8.png',
|
||||
url: "",
|
||||
},
|
||||
],
|
||||
healthServices: [{
|
||||
name: '体温',
|
||||
value: '37°C',
|
||||
icon: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon_1.png'
|
||||
},
|
||||
{
|
||||
name: '血压',
|
||||
value: '37mmHg',
|
||||
icon: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon_2.png'
|
||||
},
|
||||
{
|
||||
name: '血糖',
|
||||
value: '37mmol/L',
|
||||
icon: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon_3.png'
|
||||
},
|
||||
{
|
||||
name: '心率',
|
||||
value: '37次/分',
|
||||
icon: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/health_icon_4.png'
|
||||
}
|
||||
],
|
||||
tabIndex: 0,
|
||||
serverList:[
|
||||
{
|
||||
cate_name: '家政保洁',
|
||||
appoints: [
|
||||
{
|
||||
appoint_id: 1,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_1.png',
|
||||
title: '上门抽血',
|
||||
price: 45,
|
||||
unit: '次',
|
||||
},
|
||||
{
|
||||
appoint_id: 2,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_2.png',
|
||||
title: '上门肌注',
|
||||
price: 65,
|
||||
unit: '次',
|
||||
},
|
||||
{
|
||||
appoint_id: 3,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_3.png',
|
||||
title: '脐带护理',
|
||||
price: 95,
|
||||
unit: '次',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
cate_name: '健康养生',
|
||||
appoints: [
|
||||
{
|
||||
appoint_id: 1,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_4.png',
|
||||
title: '体质养生',
|
||||
price: 45,
|
||||
unit: '张',
|
||||
},
|
||||
{
|
||||
appoint_id: 2,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_5.png',
|
||||
title: '四季养生',
|
||||
price: 300,
|
||||
unit: '套',
|
||||
},
|
||||
{
|
||||
appoint_id: 3,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_6.png',
|
||||
title: '肝脾养生',
|
||||
price: 451,
|
||||
unit: '套',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
cate_name: '跑腿服务',
|
||||
appoints: [
|
||||
{
|
||||
appoint_id: 1,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_7.png',
|
||||
title: '同城快递',
|
||||
price: 45,
|
||||
unit: '件',
|
||||
},
|
||||
{
|
||||
appoint_id: 2,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_8.png',
|
||||
title: '快递代取',
|
||||
price: 300,
|
||||
unit: '件',
|
||||
},
|
||||
{
|
||||
appoint_id: 3,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_9.png',
|
||||
title: '外卖代取',
|
||||
price: 451,
|
||||
unit: '件',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
cate_name: '设备配套',
|
||||
appoints: [
|
||||
{
|
||||
appoint_id: 1,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_10.png',
|
||||
title: '血糖计',
|
||||
price: 45,
|
||||
unit: '个',
|
||||
},
|
||||
{
|
||||
appoint_id: 2,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_11.png',
|
||||
title: '血压计',
|
||||
price: 300,
|
||||
unit: '个',
|
||||
},
|
||||
{
|
||||
appoint_id: 3,
|
||||
photo: 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/health/Mask_group_12.png',
|
||||
title: '尿酸检测仪',
|
||||
price: 451,
|
||||
unit: '个',
|
||||
}
|
||||
]
|
||||
}
|
||||
],//服务列表
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
jump(url) {
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
});
|
||||
},
|
||||
changeTab(index) {
|
||||
this.tabIndex = index;
|
||||
},
|
||||
ServerMore(cateId) {
|
||||
// Handle more click
|
||||
console.log('More clicked for category:', cateId);
|
||||
},
|
||||
ServerDesc(appointId) {
|
||||
// Handle service description click
|
||||
console.log('Service clicked:', appointId);
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// Load your data here
|
||||
// this.loadTabList();
|
||||
// this.loadServerList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.swiper {
|
||||
width: 710rpx;
|
||||
height: 300rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.swiper .swiper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.swiper image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tabList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.tabItem {
|
||||
display: flex;
|
||||
width: 25%;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin-bottom: 46rpx;
|
||||
}
|
||||
|
||||
.tabImg {
|
||||
height: 54rpx;
|
||||
}
|
||||
|
||||
.tabName {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.tit {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
margin-left: 20rpx;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
.serviceTag {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
margin-top: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.serviceTagItem {
|
||||
width: 171rpx;
|
||||
height: 212rpx;
|
||||
background: linear-gradient(148deg, #FFF3EF 0%, #FFD0C0 100%);
|
||||
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
||||
box-sizing: border-box;
|
||||
padding-left: 28rpx;
|
||||
padding-top: 37rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.serviceTagItem_name {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.serviceTagItem_msg {
|
||||
margin-top: 76rpx;
|
||||
margin-left: 0rpx;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.serviceTagItem_img1 {
|
||||
width: 70rpx;
|
||||
height: 105rpx;
|
||||
position: absolute;
|
||||
bottom: 5rpx;
|
||||
right: 8rpx;
|
||||
}
|
||||
|
||||
.serviceTagItem_img2 {
|
||||
width: 68.89rpx;
|
||||
height: 87.54rpx;
|
||||
position: absolute;
|
||||
bottom: 15rpx;
|
||||
right: 6rpx;
|
||||
}
|
||||
|
||||
.serviceTagItem_img3 {
|
||||
height: 79rpx;
|
||||
width: 71rpx;
|
||||
position: absolute;
|
||||
bottom: 18rpx;
|
||||
right: 7rpx;
|
||||
}
|
||||
|
||||
.serviceTagItem_img4 {
|
||||
width: 70rpx;
|
||||
height: 105rpx;
|
||||
position: absolute;
|
||||
bottom: 5rpx;
|
||||
right: 8rpx;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 20rpx;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
.tabs .tab {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #555555;
|
||||
margin-right: 70rpx;
|
||||
}
|
||||
|
||||
.tabs .active {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tabs .active::after {
|
||||
content: '';
|
||||
width: 127rpx;
|
||||
height: 10rpx;
|
||||
background: #FF512A;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -10rpx;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.tabs .active::before {
|
||||
width: 127rpx;
|
||||
height: 10rpx;
|
||||
filter: blur(6.599999904632568rpx);
|
||||
background: #FF5D73;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -10rpx;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.list {
|
||||
margin-top: 36rpx;
|
||||
}
|
||||
|
||||
.item_tit {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 0 20rpx;
|
||||
margin-bottom: 32rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.item_tit_left {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.item_tit_right {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #D5AC66;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.item_tit_right image {
|
||||
width: 12rpx;
|
||||
height: 22rpx;
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
.item_goodsItem_tit {
|
||||
width: 223rpx;
|
||||
height: 161rpx;
|
||||
}
|
||||
|
||||
.item_goodsItem_name {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
margin-top: 20rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.item_goodsItem_msg {
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #FF512A;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
margin-top: 6rpx;
|
||||
margin-left: 13rpx;
|
||||
}
|
||||
|
||||
.item_goodsItem_msg view {
|
||||
font-weight: 500;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.item_goodsItem_msg text {
|
||||
font-size: 22rpx;
|
||||
color: #FF512A;
|
||||
}
|
||||
|
||||
.item_goodsList {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.list_item {
|
||||
padding-bottom: 32rpx;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.merchantList {
|
||||
margin: 0 20rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.merchantItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.merchantItem_right {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
width: 150rpx;
|
||||
height: 50rpx;
|
||||
background: #D5AC66;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.merchantItem_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.merchantItem_left_img {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.merchantItem_left_msg_tit {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.merchantItem_left_msg_add {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 14rpx;
|
||||
}
|
||||
|
||||
.merchantItem_left_msg_msg {
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #FF512A;
|
||||
background: #FFF0ED;
|
||||
padding: 2rpx;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.merchantItem_left_msg_tag {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
</style>
|
||||
203
packages/health/reportDesc/reportDesc.vue
Normal file
203
packages/health/reportDesc/reportDesc.vue
Normal file
@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<view class="selftTest">
|
||||
<view class="Tit">血脂</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">总胆固醇</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.zdgc_status == '1'">较低</view>
|
||||
<view wx:if="Info.zdgc_status == '2'">正常</view>
|
||||
<view wx:if="Info.zdgc_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">高密度脂</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.gmdz_status == '1'">较低</view>
|
||||
<view wx:if="Info.gmdz_status == '2'">正常</view>
|
||||
<view wx:if="Info.gmdz_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">甘油三脂</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.gysz_status == '1'">较低</view>
|
||||
<view wx:if="Info.gysz_status == '2'">正常</view>
|
||||
<view wx:if="Info.gysz_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">低密度脂</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.dmyh_status == '1'">较低</view>
|
||||
<view wx:if="Info.dmyh_status == '2'">正常</view>
|
||||
<view wx:if="Info.dmyh_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">冠心病指数</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.gxbzs_status == '1'">较低</view>
|
||||
<view wx:if="Info.gxbzs_status == '2'">正常</view>
|
||||
<view wx:if="Info.gxbzs_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">动脉硬化</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.dmyh_status == '1'">较低</view>
|
||||
<view wx:if="Info.dmyh_status == '2'">正常</view>
|
||||
<view wx:if="Info.dmyh_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">常规项目</view>
|
||||
<view class="row type2">
|
||||
<view class="row_tit">体重</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.tz_status == '1'">较低</view>
|
||||
<view wx:if="Info.tz_status == '2'">正常</view>
|
||||
<view wx:if="Info.tz_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row type2">
|
||||
<view class="row_tit">心率</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.xl_status == '1'">较低</view>
|
||||
<view wx:if="Info.xl_status == '2'">正常</view>
|
||||
<view wx:if="Info.xl_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">体温</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.tw_status == '1'">较低</view>
|
||||
<view wx:if="Info.tw_status == '2'">正常</view>
|
||||
<view wx:if="Info.tw_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">尿酸</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">尿酸</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.ns_status == '1'">较低</view>
|
||||
<view wx:if="Info.ns_status == '2'">正常</view>
|
||||
<view wx:if="Info.ns_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">血压</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">收缩压</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.ssy_status == '1'">较低</view>
|
||||
<view wx:if="Info.ssy_status == '2'">正常</view>
|
||||
<view wx:if="Info.ssy_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">舒张压</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.szy_status == '1'">较低</view>
|
||||
<view wx:if="Info.szy_status == '2'">正常</view>
|
||||
<view wx:if="Info.szy_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">脉搏</view>
|
||||
<view class="row_con ">
|
||||
<view wx:if="Info.mb_status == '1'">较低</view>
|
||||
<view wx:if="Info.mb_status == '2'">正常</view>
|
||||
<view wx:if="Info.mb_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">眼科</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">左眼视力</view>
|
||||
<view class="row_con">
|
||||
<view wx:if="Info.zysl_status == '1'">较低</view>
|
||||
<view wx:if="Info.zysl_status == '2'">正常</view>
|
||||
<view wx:if="Info.zysl_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">右眼视力</view>
|
||||
<view class="row_con ">
|
||||
<view wx:if="Info.yysl_status == '1'">较低</view>
|
||||
<view wx:if="Info.yysl_status == '2'">正常</view>
|
||||
<view wx:if="Info.yysl_status == '3'">较高</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id: "",
|
||||
Info: "",
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
onLoad(options) {
|
||||
let that = this
|
||||
this.id = options.id
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.selftTest {
|
||||
padding: 30rpx 20rpx;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.Tit {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
margin-bottom: 25rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.row_tit {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.row_con {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #72BB4E;
|
||||
}
|
||||
|
||||
.row_con input {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.none {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.type2 {
|
||||
color: #FF512A;
|
||||
}
|
||||
</style>
|
||||
159
packages/health/reportList/reportList.vue
Normal file
159
packages/health/reportList/reportList.vue
Normal file
@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<view class="report">
|
||||
<view class="reportList">
|
||||
<view class="reportItem" @click="desc" v-for="(item, index) in orderList">
|
||||
<view class="reportItem_left">
|
||||
<view class="reportItem_img">
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/port.png" mode="widthFix" />
|
||||
</view>
|
||||
<view class="reportItem_text">
|
||||
<view class="reportItem_text_tit">{{item.title}}检查报告</view>
|
||||
<view class="reportItem_text_type">检测方式：
|
||||
<view>自测</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="reportItem_right">
|
||||
查看
|
||||
<image src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/water_filter/filter_more.png"
|
||||
mode="widthFix" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
t: uni.getMenuButtonBoundingClientRect().top,
|
||||
h: uni.getMenuButtonBoundingClientRect().height,
|
||||
orderList: [{
|
||||
title: "123"
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleNavigateBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
desc(id) {
|
||||
// 处理查看详情逻辑
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.nav-box {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
z-index: 2;
|
||||
background: #F9F9F9;
|
||||
padding-bottom: 25rpx;
|
||||
}
|
||||
|
||||
.nav-box .nav-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nav-box .nav-bar .nav-bar-left,
|
||||
.nav-box .nav-bar .nav-bar-right {
|
||||
padding: 0 20rpx;
|
||||
width: 132rpx;
|
||||
/* min-width: 36rpx; */
|
||||
}
|
||||
|
||||
.nav-box .nav-bar .nav-bar-left van-icon {
|
||||
vertical-align: sub;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.nav-box .nav-bar .nav-bar-title {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
font-size: 36rpx;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.nav-box .nav-bar-right {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #FF512A;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nav-box .nav-bar-right image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.reportList {
|
||||
margin: 0 20rpx;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.reportItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
}
|
||||
|
||||
.reportItem_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.reportItem_img {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.reportItem_right {
|
||||
display: flex;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.reportItem_right image {
|
||||
width: 12rpx;
|
||||
height: 26rpx;
|
||||
margin-left: 13rpx;
|
||||
}
|
||||
|
||||
.reportItem_text_tit {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #222222;
|
||||
}
|
||||
|
||||
.reportItem_text_type {
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #999999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.reportItem_text_type view {
|
||||
color: #222;
|
||||
}
|
||||
</style>
|
||||
204
packages/health/selfTest/selfTest.vue
Normal file
204
packages/health/selfTest/selfTest.vue
Normal file
@ -0,0 +1,204 @@
|
||||
<template>
|
||||
<view class="selftTest">
|
||||
<view class="Tit">血脂</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">总胆固醇</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="zdgc" @input="ipt1" data-datas="zdgc" placeholder="0.4-4" placeholder-style="color: #999999;font-size: 26rpx;" />mg/dL
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">高密度脂</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="gmdz" @input="ipt1" data-datas="gmdz" placeholder="2.9-6" placeholder-style="color: #999999;font-size: 26rpx;" />mmol/L
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">甘油三脂</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="gysz" @input="ipt1" data-datas="gysz" placeholder="1.04-2.59" placeholder-style="color: #999999;font-size: 26rpx;" />mg/L
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">低密度脂</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="dzdz" @input="ipt1" data-datas="dzdz" placeholder="0.51-1.7" placeholder-style="color: #999999;font-size: 26rpx;" />mmol/dL
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">冠心病指数</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="gxbzs" @input="ipt1" data-datas="gxbzs" placeholder="0.3-3.35" placeholder-style="color: #999999;font-size: 26rpx;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">动脉硬化</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="dmyh" @input="ipt1" data-datas="dmyh" placeholder="1.3-4.5" placeholder-style="color: #999999;font-size: 26rpx;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">常规项目</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">体重</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="tz" @input="ipt1" data-datas="tz" placeholder="1-200" placeholder-style="color: #999999;font-size: 26rpx;" />Kg
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">心率</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="xl" @input="ipt1" data-datas="xl" placeholder="60-100" placeholder-style="color: #999999;font-size: 26rpx;" />次/分
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">体温</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="tw" @input="ipt1" data-datas="tw" placeholder="35-37.5" placeholder-style="color: #999999;font-size: 26rpx;" />℃
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">尿酸</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">尿酸</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="ns" @input="ipt1" data-datas="ns" placeholder="179-416" placeholder-style="color: #999999;font-size: 26rpx;" />μmol/L
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">血压</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">收缩压</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="ssy" @input="ipt1" data-datas="ssy" placeholder="1-200" placeholder-style="color: #999999;font-size: 26rpx;" />Kg
|
||||
</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">舒张压</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="szy" @input="ipt1" data-datas="szy" placeholder="60-100" placeholder-style="color: #999999;font-size: 26rpx;" />次/分
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">脉搏</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="mb" @input="ipt1" data-datas="mb" placeholder="60-100" placeholder-style="color: #999999;font-size: 26rpx;" />次/分
|
||||
</view>
|
||||
</view>
|
||||
<view class="gray"></view>
|
||||
<view class="Tit">眼科</view>
|
||||
<view class="row">
|
||||
<view class="row_tit">左眼视力</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="zysl" @input="ipt1" data-datas="zysl" placeholder="1.0-4.0" placeholder-style="color: #999999;font-size: 26rpx;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="row none">
|
||||
<view class="row_tit">右眼视力</view>
|
||||
<view class="row_con">
|
||||
<input type="number" v-model="yysl" @input="ipt1" data-datas="yysl" placeholder="1.0-4.0" placeholder-style="color: #999999;font-size: 26rpx;" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn" @tap="submit">
|
||||
提交
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
zdgc: '',
|
||||
gmdz: '',
|
||||
gysz: '',
|
||||
dzdz: '',
|
||||
gxbzs: '',
|
||||
dmyh: '',
|
||||
tz: '',
|
||||
xl: '',
|
||||
tw: '',
|
||||
ns: '',
|
||||
ssy: '',
|
||||
szy: '',
|
||||
mb: '',
|
||||
zysl: '',
|
||||
yysl: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
ipt1(e) {
|
||||
const key = e.currentTarget.dataset.datas;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
submit() {
|
||||
// 提交逻辑
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.selftTest {
|
||||
padding: 30rpx 20rpx;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.Tit {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #222222;
|
||||
margin-bottom: 25rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 30rpx 0;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.row_tit {
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.row_con {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 400;
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
justify-content: flex-end;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.row_con input {
|
||||
text-align: right;
|
||||
color: #222;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.none {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 650rpx;
|
||||
height: 80rpx;
|
||||
background: #FF512A;
|
||||
border-radius: 100rpx 100rpx 100rpx 100rpx;
|
||||
font-weight: 400;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
</style>
|
||||
@ -16,7 +16,7 @@
|
||||
</view>
|
||||
<div class="iptBox">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
||||
></image>
|
||||
<u--input
|
||||
placeholder="请输入内容"
|
||||
@ -31,35 +31,35 @@
|
||||
<div class="FilterItem" @click="showDialog(1)">
|
||||
附近
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_filterMore.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
|
||||
<div class="FilterItem" @click="showDialog(2)">
|
||||
综合
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_filterMore.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
|
||||
<div class="FilterItem" @click="showDialog(3)">
|
||||
排序
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_filterMore.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
|
||||
<div class="FilterItem" @click="showDialog(4)">
|
||||
分类
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_filterMore.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
|
||||
<div class="FilterItem" @click="showDialog(5)">
|
||||
性别
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_filterMore.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filterMore.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
@ -67,7 +67,7 @@
|
||||
<div class="Filter_right">
|
||||
筛选
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_filter.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_filter.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
@ -155,11 +155,11 @@
|
||||
<div class="MasterItem" v-for="(item, index) in 3" :key="index">
|
||||
<div class="MasterItem_left">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/community_providentFund_Group_1444.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Group_1444.png"
|
||||
></image>
|
||||
<image
|
||||
v-if="false"
|
||||
src="https://static.hshuishang.com/property-img-file/community_providentFund_Ellipse_160.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/community_providentFund_Ellipse_160.png"
|
||||
>
|
||||
</image>
|
||||
</div>
|
||||
@ -167,7 +167,7 @@
|
||||
<div class="MasterItem_info">
|
||||
<div class="MasterItem_Info_left">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/home_icon12.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/home_icon12.png"
|
||||
></image>
|
||||
<div class="state state1">待服务</div>
|
||||
<div class="state state2" v-if="false">休息中</div>
|
||||
@ -178,18 +178,18 @@
|
||||
林师傅
|
||||
<image
|
||||
class="Medal"
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_Champion.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_Champion.png"
|
||||
>
|
||||
</image>
|
||||
<image
|
||||
class="Medal"
|
||||
v-if="false"
|
||||
src="https://static.hshuishang.com/property-img-file/homeServer_RunnerUp.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/homeServer_RunnerUp.png"
|
||||
>
|
||||
</image>
|
||||
<image
|
||||
class="star"
|
||||
src="https://static.hshuishang.com/property-img-file/local_start1.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_start1.png"
|
||||
></image>
|
||||
<span>4.8</span>
|
||||
</div>
|
||||
@ -211,13 +211,13 @@
|
||||
|
||||
<div class="MasterItem_Info_right_6">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_MsgImg1.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_MsgImg1.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_MsgImg1.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_MsgImg1.png"
|
||||
></image>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<view class="location" @click="chooseLocation">
|
||||
<image
|
||||
id="local"
|
||||
src="https://static.hshuishang.com/property-img-file/local_localIcon.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/local_localIcon.png"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
|
||||
@ -14,7 +14,7 @@
|
||||
</view>
|
||||
<view class="search-box">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_communitySearchIcon.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/com_communitySearchIcon.png"
|
||||
class="search-icon"
|
||||
></image>
|
||||
<input class="search-placeholder" placeholder="请输入您要找的服务" />
|
||||
@ -44,7 +44,7 @@
|
||||
>
|
||||
<view id="top" style="height: 1px; opacity: 0"></view>
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/guanggao4.png"
|
||||
src="https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/guanggao4.png"
|
||||
class="content-img"
|
||||
></image>
|
||||
<view
|
||||
@ -138,23 +138,23 @@ export default {
|
||||
serviceCategories: [
|
||||
{
|
||||
name: "家电维修",
|
||||
icon: "https://static.hshuishang.com/property-img-file/index_top3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/index_top3.png",
|
||||
},
|
||||
{
|
||||
name: "数码维修",
|
||||
icon: "https://static.hshuishang.com/property-img-file/index_top3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/index_top3.png",
|
||||
},
|
||||
{
|
||||
name: "电器清洗",
|
||||
icon: "https://static.hshuishang.com/property-img-file/index_top3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/index_top3.png",
|
||||
},
|
||||
{
|
||||
name: "洗衣洗鞋",
|
||||
icon: "https://static.hshuishang.com/property-img-file/index_top3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/index_top3.png",
|
||||
},
|
||||
{
|
||||
name: "精细擦窗",
|
||||
icon: "https://static.hshuishang.com/property-img-file/index_top3.png",
|
||||
icon: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/property-img-file/index_top3.png",
|
||||
},
|
||||
],
|
||||
currentIndex: 0,
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user