java-mall-app/pages/index/index-single.vue
2025-04-24 15:47:08 +08:00

1178 lines
29 KiB
Vue

<template>
<view
class="page"
v-if="loadPageFlag"
:style="{
background:
BgConfig.BackgroundObj.type == 1
? BgConfig.BackgroundObj.bgColor
: 'url(' +
BgConfig.BackgroundObj.path +
') no-repeat ' +
BgConfig.BackgroundObj.pathColor,
}"
>
<status-bar
:backgroundColor="PageNav.window.navigationBarBackgroundColor"
v-if="false"
></status-bar>
<uni-nav-bar
:leftFlag="!!Config.SUBSITE_ENABLE || !!Config.LANG_ENABLE"
:rightFlag="rightFlag"
:statusBar="true"
:fixed="true"
:color="PageNav.window.navigationBarTextStyle"
:backgroundColor="PageNav.window.navigationBarBackgroundColor"
:background-color="PageNav.window.navigationBarBackgroundColor"
right-icon="scan"
right-width="120"
@click-left="showCity"
@click-right="scan"
>
<block slot="left">
<view class="city" v-if="Config.SUBSITE_ENABLE || !!Config.LANG_ENABLE">
<block v-if="!!Config.LANG_ENABLE">
<image
:src="current_img"
mode="widthFix"
style="width: 36rpx; height: 36rpx; line-height: 36rpx"
:color="PageNav.window.navigationBarTextStyle"
></image>
<view
style="font-size: 30rpx; max-height: 80rpx"
class="uni-ellipsis"
>{{ current_label }}</view
>
</block>
<block v-else>
<uni-icons
type="location"
:color="PageNav.window.navigationBarTextStyle"
size="18"
/>
<view
style="font-size: 30rpx; max-height: 80rpx"
class="uni-ellipsis"
>{{ city }}</view
>
</block>
</view>
</block>
<view class="input-view">
<uni-icons
type="search"
size="22"
color="#666666"
style="line-height: 60rpx"
/>
<input
confirm-type="search"
class="input"
type="text"
:placeholder="__('输入搜索关键词')"
@click="onSearch"
/>
</view>
<block slot="right">
<view
style="
padding-right: 14rpx;
line-height: 80rpx;
opacity: 0.6;
position: relative;
"
@click.stop="$.gopage('/member/member/message')"
>
<uni-icons
type="chat"
:color="PageNav.window.navigationBarTextStyle"
size="24"
:style="'color:' + PageNav.window.navigationBarTextStyle"
/>
<view class="msg-num" v-if="newMsgNum > 0">{{ newMsgNum }}</view>
</view>
</block>
</uni-nav-bar>
<diy
:StoreInfo="ChatInfo"
:BgConfig="BgConfig"
:PageContent="PageContent"
:pageId="pageId"
:PageNav="PageNav"
:loadPageFlag="loadPageFlag"
:hideDiy="hideDiy"
></diy>
<guess-you-like ref="guessYouLike"></guess-you-like>
<coupon
ref="coupon"
:user_is_new="userInfo.user_is_new || false"
:CouponAmount="100"
:mskType="1"
v-if="false"
></coupon>
<!-- 弹出层 -->
<view
class="uni-banner"
style="background: #ffffff; height: 800rpx"
v-if="bannerShow"
>
<view style="justify-content: flex-end" @tap="closeBanner">
<view
style="justify-content: flex-end; text-align: right; padding: 20rpx"
>
<text class="uni-icon uni-icon-close"></text>
</view>
</view>
<view>
<scroll-view scroll-y="true" style="height: 550rpx">
<view
class="uni-padding-wrap"
style="width: 96%; margin-right: 40rpx"
>
<view class="uni-title">{{ __("语言选择") }}</view>
<view>
<radio-group class="lang" @change="onLangChange">
<label
v-for="(lang, idx) in Lang.data.items"
:key="idx"
class="lang-list"
>
<view class="option">
<view class="img"
><image :src="lang.img" mode="widthFix"></image
></view>
<text class="txt">{{ lang.label }}</text>
</view>
<radio
:value="lang.lang"
:checked="lang.lang == Lang.lang"
></radio>
</label>
</radio-group>
</view>
</view>
<block v-if="false">
<view class="uni-title uni-common-mt uni-common-pl">{{
__("汇率选择")
}}</view>
<view class="uni-list">
<radio-group @change="onCurrencyChange">
<label class="uni-list-cel uni-list-cell-pd">
<view>
<radio
value="100971"
checked="true"
v-if="current_currency == 100971"
/>
<radio value="100971" v-else />
</view>
<image
src="/static/images/national/AED.png"
style="width: 60rpx; height: 40rpx"
></image>
<view>{{ __("AED") }}</view>
</label>
<label class="uni-list-cel uni-list-cell-pd">
<view>
<radio
value="100966"
checked="true"
v-if="current_currency == 100966"
/>
<radio value="100966" v-else />
</view>
<image
src="/static/images/national/SAR.png"
style="width: 60rpx; height: 40rpx"
></image>
<view>{{ __("SAR") }}</view>
</label>
<label class="uni-list-cel uni-list-cell-pd">
<view>
<radio
value="100973"
checked="true"
v-if="current_currency == 100973"
/>
<radio value="100973" v-else />
</view>
<image
src="/static/images/national/BHD.png"
style="width: 60rpx; height: 40rpx"
></image>
<view>{{ __("BHD") }}</view>
</label>
<label class="uni-list-cel uni-list-cell-pd">
<view>
<radio
value="100968"
checked="true"
v-if="current_currency == 100968"
/>
<radio value="100968" v-else />
</view>
<image
src="/static/images/national/OMR.png"
style="width: 60rpx; height: 40rpx"
></image>
<view>{{ __("OMR") }}</view>
</label>
<label class="uni-list-cel uni-list-cell-pd">
<view>
<radio
value="100965"
checked="true"
v-if="current_currency == 100965"
/>
<radio value="100965" v-else />
</view>
<image
src="/static/images/national/KWD.png"
style="width: 60rpx; height: 40rpx"
></image>
<view>{{ __("KWD") }}</view>
</label>
<label class="uni-list-cel uni-list-cell-pd">
<view>
<radio
value="100964"
checked="true"
v-if="current_currency == 100964"
/>
<radio value="100964" v-else />
</view>
<image
src="/static/images/national/IQD.png"
style="width: 60rpx; height: 40rpx"
></image>
<view>{{ __("USD") }}</view>
</label>
</radio-group>
</view>
</block>
</scroll-view>
<view style="padding: 50rpx 0; padding-bottom: 68rpx">
<button
type="warn"
class="mini-btn"
@click="onConfirmLang"
style="background: #f6644d; margin: 0 80rpx"
>
{{ __("确认选择") }}
</button>
</view>
</view>
</view>
<view class="uni-mask" v-if="bannerShow"></view>
<!-- 弹出层 -->
<view :class="['msk']" @tap="onPopClose" v-if="showPopFlag">
<view class="msk_box">
<image
:src="index_pop_wap_img"
style="width: 100%"
mode="widthFix"
@tap="onPopClick"
></image>
<view class="msk_box_info" style="right: 16%; top: 40%"> </view>
<view class="btn_cancel" @tap="onPopClose">✕</view>
</view>
</view>
</view>
</template>
<script>
import statusBar from "../../components/status-bar.vue";
import uniNavBar from "@/components/uni-nav-bar/uni-nav-bar.vue";
import diy from "../../components/themes/diy.vue";
import coupon from "../../components/coupon/coupon.vue";
import guessYouLike from "@/components/guess-you-like.vue";
var thatProm = {
ProductInfo: {},
addCar: false,
count: 0,
windowHeight: 0,
categoryname: "",
click6: true,
cid: 0,
cartlist: {},
isdata: false,
Sel_Id: [],
tapindex: 1,
viewtype: 0,
shopInfo: {},
pdlist: [],
sort: 2,
ispage: true,
flag: true,
distance: 0,
istop: false,
TemplateKey: "",
smallCategory: {},
AdContent: {},
post: {
store_id: 0,
orderby: 1,
sort: 2,
isnew: false,
curpage: 1,
},
formdate: "",
pageId: 0,
};
import { mapState, mapMutations } from "vuex";
export default {
/**
* 页面的初始数据
*/
data: function () {
return {
options: {},
Coupons: [],
isCancelSuccess: true,
isCancel: true,
CouponAmount: 0,
user_is_new: 1,
PageContent: [],
BgConfig: {
BackgroundObj: {
type: 1,
bgColor: "#ffffff",
pathColor: "#f8f8f8",
path: "",
},
},
PageNav: {
window: {
navigationBarBackgroundColor: "#ffffff",
navigationBarTextStyle: "black",
navigationBarTitleText: "",
backgroundColor: "#f8f8f8",
backgroundTextStyle: "dark",
},
},
loadPageFlag: false,
hideDiy: false,
ChatInfo: {},
TemplateKey: "",
commonTPL: Object.assign({}, thatProm),
indexArray: [],
splist: [],
splistStr: [],
pid: 0,
index: 0,
shareImg: "",
shareTitle: "",
refresh: true,
pageId: 0,
w: 0, //windowWidth
chatUrl: "",
city: "全中国",
showSubsiteFlag: true,
rightFlag: true,
showPopFlag: false,
index_pop_wap_img: "",
index_pop_wap_url: "",
bannerShow: false,
current_currency: 86,
current_lang: "zh-CN",
current_img:
"https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/lancerdt/flags/square/5322affbc4d56.png",
current_label: "中文",
};
},
computed: mapState([
"Config",
"StateCode",
"notice",
"plantformInfo",
"shopInfo",
"userInfo",
"hasLogin",
"newMsgNum",
]),
components: {
diy,
statusBar,
uniNavBar,
coupon,
guessYouLike,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
/*
uni.setNavigationBarTitle({
title:this.__('')
});
*/
//console.info(this.userInfo);
//#ifdef MP
this.rightFlag = false;
//#endif
var that = this;
that.setData({
current_currency: that.Lang.currency_id,
current_lang: that.Lang.lang,
current_label: that.Lang.label,
current_img: that.Lang.img,
});
if (options.scene) {
var scene = decodeURIComponent(options.scene);
var opts = {};
opts = that.$.parse_str(scene);
options = Object.assign(options, opts);
}
uni.setNavigationBarTitle({
title: this.__("首页"),
});
// 离开页面
this.setData({
indexArray: [],
});
var w = that.$.getSystemInfoSync().windowWidth;
that.setData({
w: w,
options: options,
});
that.getPlantformInfo(function (plantform) {
//分类数据
that.initData(false);
/*
if (user) {
that.setData({
//user_is_new: that.userInfo.user_is_new,
//CouponAmount: that.userInfo.CouponAmount
});
}
*/
//that.notice.addNotification("RefreshProduct", that.RefreshProduct, that);
try {
thatProm.windowHeight = that.$.getSystemInfoSync().windowHeight - 50;
that.setData({
commonTPL: thatProm,
});
} catch (n) {
//console.log(" Do something when catch error", n)
}
//start 门店选择
if (that.Config.CHAIN_ENABLE) {
let chain_name = uni.getStorageSync("chain_name");
if (that.$.getStorageSync("chain_name")) {
that.setData({
city: that.$.getStorageSync("chain_name")
? that.$.getStorageSync("chain_name") + ""
: that.__("选择门店"),
});
} else {
that.$.confirm(
that.__("请选择门店"),
function (data) {
if (data.confirm) {
that.showCity();
} else {
//存入本地
uni.setStorageSync("chain_id", 1001);
uni.setStorageSync("chain_name", that.__("一号店"));
that.notice.postNotificationName("RefreshOrderChain", {
chain_id: 1001,
chain_name: that.__("一号店"),
ChainInfo: { chain_id: 1001, chain_name: that.__("一号店") },
});
}
},
true
);
}
}
//end 门店选择
//start 店铺选择
if (false) {
let store_name = uni.getStorageSync("store_name");
if (that.$.getStorageSync("store_name")) {
that.setData({
city: that.$.getStorageSync("store_name")
? that.$.getStorageSync("store_name") + ""
: that.__("选择店铺"),
});
} else {
that.$.confirm(
that.__("请选择店铺"),
function (data) {
if (data.confirm) {
that.showCity();
} else {
//存入本地
uni.setStorageSync("store_id", 1001);
uni.setStorageSync("store_name", that.__("一号店"));
that.notice.postNotificationName("RefreshStoreName");
}
},
true
);
}
}
//end 店铺选择
});
that.notice.addNotification(
"RefreshStoreName",
that.RefreshStoreName,
that
);
that.notice.addNotification(
"RefreshOrderChain",
that.RefreshOrderChain,
that
);
that.notice.addNotification("RefreshSubsite", that.RefreshSubsite, that);
that.notice.addNotification("ScanCode", that.onScanCode, that);
//
that.setData({
city: that.$.getStorageSync("site_name")
? that.$.getStorageSync("site_name")
: that.__("全国站"),
});
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
//
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
let that = this;
//that.$.isNull(that.plantformInfo) || uni.setNavigationBarTitle({title: that.plantformInfo.name});
//this.refresh || this.setData({refresh: true})
this.showCartNum();
// #ifdef APP-PLUS
if (this.pageId > 0) {
this.hideDiy = false;
}
// #endif
that.resetLang();
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
// #ifdef APP-PLUS
this.hideDiy = true;
// #endif
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
// 离开页面,注销事件
var that = this;
//that.notice.removeNotification("RefreshProduct", that);
that.notice.removeNotification("RefreshStoreName", that);
that.notice.removeNotification("RefreshOrderChain", that);
that.notice.removeNotification("RefreshSubsite", that);
that.notice.removeNotification("ScanCode", that);
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
this.setData({
indexArray: [],
});
this.initData(true);
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
this.$refs.guessYouLike.scrollbottom();
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
// #ifdef MP-WEIXIN
wx.showShareMenu({
withShareTicket: true,
menus: ["shareAppMessage", "shareTimeline"],
});
// #endif
return {
title: this.shareTitle,
imageUrl: this.shareImg,
path: "/pages/index/index?uid=" + this.userInfo.user_id,
};
},
/**
* 用户点击右上角分享朋友圈
*/
onShareTimeline: function () {
return {
title: this.shareTitle,
query: {
uid: this.userInfo.user_id,
},
imageUrl: this.shareImg,
};
},
/**
* 页面滚动触发事件的处理函数
*/
onPageScroll: function () {},
methods: {
...mapMutations([
"login",
"logout",
"getPlantformInfo",
"forceUserInfo",
"getUserInfo",
"showCartNum",
]),
//读取diy内容
getDivModel: function (force_refresh) {
var that = this,
params = {};
let site_id = that.$.getStorageSync("site_id");
if (site_id) {
params["site_id"] = site_id;
}
that.$.request({
url: that.Config.URL.index_app,
data: params,
ajaxCache: {
timeout: that.Config.CACHE_EXPIRE,
forceRefresh: force_refresh,
},
success: function (data, status, msg, code) {
uni.stopPullDownRefresh();
that.setData({
loadPageFlag: true,
});
that.setData({
pageId: data.page_id,
PageContent: that.$.parseJSON(data.page_code),
BgConfig: that.$.parseJSON(data.page_config),
PageNav: that.$.parseJSON(data.page_nav),
shareImg: data.page_share_image,
shareTitle: data.page_share_title,
});
if (that.PageNav.window.navigationBarTextStyle == "black") {
that.PageNav.window.navigationBarTextStyle = "#000000";
}
if (that.PageNav.window.navigationBarTextStyle == "white") {
that.PageNav.window.navigationBarTextStyle = "#ffffff";
}
uni.setNavigationBarColor({
frontColor: that.PageNav.window.navigationBarTextStyle,
backgroundColor: that.PageNav.window.navigationBarBackgroundColor,
});
that.setData({
ChatInfo: {
im_enable: data.im_enable,
im_user_id: data.im_user_id,
puid: data.puid,
},
showPopFlag: data.index_pop_wap_enable ? true : false,
index_pop_wap_img: data.index_pop_wap_img,
index_pop_wap_url: data.index_pop_wap_url,
});
},
});
},
RefreshProduct: function (e) {
e
? this.setData({
refresh: true,
})
: this.setData({
refresh: false,
});
},
RefreshStoreName: function (e) {
//console.info(e);
let refresh = false;
if (e.store_row.store_id != this.$.getStorageSync("store_id")) {
refresh = true;
}
this.setData({ city: e.store_row.store_name });
this.$.setStorageSync("store_id", e.store_row.store_id);
this.$.setStorageSync("store_name", e.store_row.store_name);
// #ifdef H5
$cookies.set("store_id", e.store_row.store_id);
// #endif
if (refresh) {
//刷新首页
this.setData({
indexArray: [],
});
this.initData(true);
}
},
RefreshOrderChain: function (e) {
//console.info(e);
//console.info(e.chain_name);
let refresh = false;
if (e.chain_id != this.$.getStorageSync("chain_id")) {
refresh = true;
}
this.setData({ city: e.ChainInfo.chain_name });
this.$.setStorageSync("chain_id", e.chain_id);
this.$.setStorageSync("chain_name", e.ChainInfo.chain_name);
// #ifdef H5
$cookies.set("chain_id", e.chain_id);
// #endif
if (refresh) {
//刷新首页
this.setData({
indexArray: [],
});
this.initData(true);
}
},
RefreshSubsite: function (e) {
//console.info(e.subsite_id);
//console.info(e.subsite_name);
let refresh = false;
if (e.subsite_id != this.$.getStorageSync("site_id")) {
refresh = true;
}
this.setData({ city: e.subsite_name });
this.$.setStorageSync("site_id", e.subsite_id);
this.$.setStorageSync("site_name", e.subsite_name);
// #ifdef H5
$cookies.set("site_id", e.subsite_id);
// #endif
if (refresh) {
//刷新首页
this.setData({
indexArray: [],
});
this.initData(true);
}
},
//初始化数据
initData: function (force_refresh) {
var that = this;
var param = {};
// #ifndef APP-PLUS
that.$.setNavigationBarTitle({ title: that.plantformInfo.name });
// #endif
thatProm.TemplateKey =
that.plantformInfo.plantform_template > 1000
? "shopdiy"
: that.plantformInfo.plantform_template;
if (thatProm.TemplateKey == "shopdiy") {
thatProm.TemplateKey == "shopdiy" && that.getDivModel(force_refresh); //shopdiy用户自定义UI
} else {
}
that.setData({
TemplateKey: thatProm.TemplateKey,
commonTPL: thatProm,
});
//
let $title = that.plantformInfo.name;
let $desc = "" || this.plantformInfo.site_meta_description;
let $link = that.$.sprintf(
"%s/h5/pages/index/index",
that.Config.SiteUrl
);
let $img_url = this.shareImg || this.plantformInfo.logo;
//初始化微信分享
that.$.wxShare($title, $desc, $link, $img_url);
},
doReceive: function () {
this.cancel(), this.userReceiveCoupon();
},
cancel: function () {
this.setData({
isCancel: false,
});
},
cancelsuccess: function () {
this.setData({
isCancelSuccess: true,
});
},
innertouch: function () {},
userReceiveCoupon: function () {
var params = {
CouponIds: "",
user_is_new: this.user_is_new,
};
var that = this;
//领取操作
that.$.request({
url: that.Config.URL.user.voucher_add,
data: params,
success: function (data, status, msg, code) {
if (status == 200) {
that.setData({
isCancelSuccess: false,
Coupons: data.items,
});
} else {
that.$.confirm(msg);
}
},
});
},
onPopClose: function () {
this.setData({ showPopFlag: false });
},
onPopClick: function () {
this.$.gopage(this.index_pop_wap_url);
},
confirm() {},
search() {
uni.showToast({
title: "搜索",
});
},
onSearch(e) {
let that = this;
that.$.gopage("/pagesub/search/search");
},
showCity() {
let that = this;
if (!!that.Config.LANG_ENABLE) {
that.showConfirmLang();
} else {
//that.$.gopage("/pagesub/subsite/subsitelist?city=" + that.city);
//选择店铺模式
//that.$.gopage("/pagesub/index/store-list?issub=1");
//选择门店模式
if (this.Config.CHAIN_ENABLE) {
that.$.gopage("/chain/chain/list?issub=1");
} else {
that.$.gopage("/pagesub/subsite/subsitelist?city=" + that.city);
}
}
},
scan: function (e) {
let that = this;
//#ifdef H5
that.$.gopage("/pagesub/scan/scan");
//#endif
//#ifndef H5
that.$.scanCode({
success: function (e) {
//console.info(e.result);
that.onScanCode(e.result);
//
return;
var t = e.result.split("=");
t.length > 2 || t.length < 2
? that.$.alert(that.__("无法识别"))
: t[0] == "productId"
? that.$.isNull(t[1])
? that.$.alert(that.__("无法识别"))
: that.$.navigateTo("/pages/product/detail?pid=" + t[1])
: t[0] == "eventId"
? that.$.isNull(t[1])
? that.$.alert(that.__("无法识别"))
: that.$.navigateTo(
"../activitycheckin/activitycheckin?eventId=" + t[1]
)
: that.$.alert(that.__("无法识别"));
},
fail: function (e) {
that.$.alert(that.__("无法识别"));
},
});
//#endif
},
onScanCode: function (e) {
//console.info('sss')
//console.info(e)
let that = this;
that.$.gopage("/pagesub/webpage/web?u=" + encodeURIComponent(e));
},
showConfirmLang: function () {
this.bannerShow = true;
},
closeBanner: function () {
this.bannerShow = false;
},
onConfirmLang: function () {
let that = this;
this.bannerShow = false;
for (let idx in that.Lang.data.items) {
if (that.Lang.data.items[idx].lang == that.current_lang) {
that.setData({
current_label: that.Lang.data.items[idx].label,
current_img: that.Lang.data.items[idx].img,
current_currency: that.Lang.data.items[idx].currency_id,
});
break;
}
}
that.Lang.data.lang = this.current_lang;
that.Lang.data.currency_id = this.current_currency;
that.Lang.data.label = this.current_label;
that.Lang.data.img = this.current_img;
that.Lang.lang = this.current_lang;
that.Lang.currency_id = this.current_currency;
that.Lang.label = this.current_label;
that.Lang.img = this.current_img;
uni.setStorageSync("selang", that.Lang.lang);
uni.setStorageSync("currency_id", that.Lang.currency_id);
that.resetLang();
//#ifdef APP-PLUS
uni.reLaunch({
url: "/pages/index/index",
});
//#endif
//#ifndef APP-PLUS
uni.navigateBack();
//#endif
},
onCurrencyChange: function (e) {
var that = this;
that.setData({
current_currency: e.detail.value,
});
},
onLangChange: function (e) {
var that = this;
that.setData({
current_lang: e.detail.value,
});
that.onConfirmLang();
},
},
};
</script>
<style lang="scss">
@import "../../styles/_variables.scss";
@import "../../styles/layout.scss";
.page {
position: absolute;
top: 0;
left: 0;
width: 100%;
min-height: 100%;
background-size: cover !important;
background-position: top center !important;
margin-bottom: var(--window-bottom);
}
.city {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
width: 100%;
margin-left: 6rpx;
white-space: nowrap;
}
.input-view {
width: 92%;
display: flex;
background-color: #e7e7e7;
height: 60rpx;
border-radius: 30rpx;
padding: 0 4%;
flex-wrap: nowrap;
margin: 10rpx 0;
line-height: 60rpx;
}
.input-view .uni-icon {
line-height: 60rpx !important;
}
.input-view .input {
height: 60rpx;
line-height: 60rpx;
width: 94%;
padding: 0 3%;
}
.msg-num {
width: auto;
height: 16px;
line-height: 16px;
border-radius: 16px;
min-width: 16px;
padding: 2px;
font-size: 12px;
text-align: center;
white-space: nowrap;
position: absolute;
top: 6px;
right: 8px;
background-color: #f43530;
color: #fff;
transform: translate(40%, -20%);
}
/* 弹出层形式的广告 */
.uni-banner {
width: 80%;
height: 32%;
position: fixed;
left: 50%;
top: 50%;
background: #fff;
border-radius: 10rpx;
z-index: 9999;
transform: translate(-50%, -50%);
}
.uni-list-cel {
position: relative;
display: flex;
flex-direction: row;
align-items: center;
}
.lang {
display: flex;
flex-direction: column;
}
.lang .lang-list {
margin-bottom: 30rpx;
display: flex;
justify-content: space-between;
}
.lang .lang-list:last-child {
margin-bottom: 0;
}
.lang .lang-list .option {
display: flex;
justify-content: space-between;
}
.lang .lang-list .option .img {
margin-right: 20rpx;
width: 44rpx;
}
.lang .lang-list .option .img image {
width: 100%;
height: auto;
}
.lang .lang-list .option .txt {
font-size: 28rpx;
}
</style>