Commit 0d8e39dc authored by 高铭波's avatar 高铭波

页面图片渲染效果优化

parent c2bb1726
<template> <template>
<view class="cus-wrap-component"> <view class="cus-wrap-component">
<image class="top-image" mode="widthFix" v-if="!isPop" :src="minekefutuImage"></image> <image class="top-image" mode="widthFix" v-if="!isPop" :src="qnFile(imageName)"></image>
<view class="content-view"> <view class="content-view">
<view :class="['title-view', {'is-mine': isMine}]"> <view :class="['title-view', {'is-mine': isMine}]">
<text :class="['title-text', {'is-mine': isMine}]">{{titleText[typeIndex]}}</text> <text :class="['title-text', {'is-mine': isMine}]">{{titleText[typeIndex]}}</text>
<text>{{tipText[typeIndex]}}</text> <text>{{tipText[typeIndex]}}</text>
</view> </view>
<u-image :class="['qrcode', {'is-mine': isMine}]" :src="cusQrcode" mode="widthFix" :fade="true" <u-image :class="['qrcode', {'is-mine': isMine}]" :src="qnFile(cusQrcode)" mode="widthFix" :fade="false">
duration="450">
<u-loading slot="loading"></u-loading> <u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view> <view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image> </u-image>
<button :class="['settle-button', {'is-mine': isMine}]" type="primary" :open-type="openTypes[typeIndex]" show-message-card <button :class="['settle-button', {'is-mine': isMine}]" type="primary" :open-type="openTypes[typeIndex]" show-message-card
send-message-title="点击下方客服会话添加订单助手" shape="circle" @click="download" :send-message-img="kefuzxiaoxiImage" send-message-title="点击下方客服会话添加订单助手" shape="circle" @click="download" :send-message-img="qnFile('kefuzxiaoxi.png')"
send-message-path="/pages/index/index"> send-message-path="/pages/index/index">
{{buttonText[typeIndex]}} {{buttonText[typeIndex]}}
</button> </button>
...@@ -45,14 +44,7 @@ ...@@ -45,14 +44,7 @@
}, },
computed: { computed: {
cusQrcode() { cusQrcode() {
let src = this.isMine ? 'erweima-rk.png' : 'dingdanzhushou-n.png'; return this.isMine ? 'erweima-rk.png' : 'dingdanzhushou-n.png';
return util.imageCache(this, src)
},
kefuzxiaoxiImage() {
return util.imageCache(this, 'kefuzxiaoxi.png')
},
minekefutuImage() {
return util.imageCache(this, this.imageName)
}, },
imageName() { imageName() {
return this.isMine ? 'kefufuwu-n.png' : 'kefutuzs.png' return this.isMine ? 'kefufuwu-n.png' : 'kefutuzs.png'
...@@ -92,6 +84,9 @@ ...@@ -92,6 +84,9 @@
} }
}, },
methods: { methods: {
qnFile(src) {
return process.uniEnv.qn_base_url + src
},
phoneToCustomer() { // 联系客户 phoneToCustomer() { // 联系客户
uni.makePhoneCall({ uni.makePhoneCall({
phoneNumber: this.phone, //仅为示例 phoneNumber: this.phone, //仅为示例
......
...@@ -41,7 +41,8 @@ ...@@ -41,7 +41,8 @@
{ {
"path": "pages/login/index", "path": "pages/login/index",
"style": { "style": {
"navigationBarBackgroundColor": "#FFFFFF", "navigationBarTitleText": "授权登录",
"navigationStyle": "custom",
"disableScroll": true "disableScroll": true
} }
} }
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<u-cell-group :border="false"> <u-cell-group :border="false">
<view v-for="(item, index) in items" :key="index"> <view v-for="(item, index) in items" :key="index">
<u-cell-item :value="item.value" :border-bottom="false" @click="handleClick(item.pathName)"> <u-cell-item :value="item.value" :border-bottom="false" @click="handleClick(item.pathName)">
<image slot="icon" :src="qnPath + item.icon" :style="item.imageStyle"></image> <image slot="icon" :src="qnFile(item.icon)" :style="item.imageStyle"></image>
<view slot="title" class="item-title">{{item.title}}</view> <view slot="title" class="item-title">{{item.title}}</view>
<view slot="value" class="item-value">{{value}}</view> <view slot="value" class="item-value">{{value}}</view>
</u-cell-item> </u-cell-item>
...@@ -43,7 +43,6 @@ ...@@ -43,7 +43,6 @@
export default { export default {
data() { data() {
return { return {
qnPath: process.uniEnv.qn_base_url,
serviceTel: '18124099271', serviceTel: '18124099271',
showSuperButton: false, showSuperButton: false,
show: false, show: false,
...@@ -142,10 +141,13 @@ ...@@ -142,10 +141,13 @@
this.getData() this.getData()
} }
} }
this.wodebeijingImage = await util.imageCache(this, 'wodebeijing.png') this.wodebeijingImage = this.qnFile('wodebeijing.png')
this.placeholderImage = await util.imageCache(this, 'touxiang.png') this.placeholderImage = this.qnFile('touxiang.png')
}, },
methods: { methods: {
qnFile(src) {
return process.uniEnv.qn_base_url + src
},
getData() { getData() {
let self = this let self = this
app.getBaseInfo(self); app.getBaseInfo(self);
......
<template> <template>
<view class=""> <view class="">
<w-navbar></w-navbar>
<view class="backView"> <view class="backView">
<view class="login-block" v-if="needAuth"> <view class="login-block" v-if="needAuth">
<u-image class="u-flex u-row-center logo" :src="logo" width="200" height="200"> <u-image :fade="false" class="u-flex u-row-center logo" :src="logo" width="200" height="200">
<u-loading slot="loading"></u-loading> <u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view> <view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image> </u-image>
<u-image class="u-flex u-row-center logo2" :src="logo2" width="214" height="60"> <u-image :fade="false" class="u-flex u-row-center logo2" :src="logo2" width="214" height="60">
<u-loading slot="loading"></u-loading> <u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view> <view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image> </u-image>
</view> </view>
<view class="bind-block" v-else> <view class="bind-block" v-else>
<u-image class="u-flex u-row-between logo" :src="logo" width="148" height="148"> <u-image :fade="false" class="u-flex u-row-between logo" :src="logo" width="148" height="148">
<u-loading slot="loading"></u-loading> <u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view> <view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image> </u-image>
...@@ -38,7 +39,6 @@ const app = getApp() ...@@ -38,7 +39,6 @@ const app = getApp()
export default { export default {
data() { data() {
return { return {
qnPath: process.uniEnv.qn_base_url,
needAuth: true, needAuth: true,
TimeID: -1, TimeID: -1,
loginTitle: '用户登录', loginTitle: '用户登录',
...@@ -50,10 +50,10 @@ export default { ...@@ -50,10 +50,10 @@ export default {
}, },
computed: { computed: {
logo() { logo() {
return util.imageCache(this, 'logo.png') return this.qnFile('logo.png')
}, },
logo2() { logo2() {
return util.imageCache(this, 'logo-2.png') return this.qnFile('logo-2.png')
}, },
}, },
onLoad(e) { onLoad(e) {
...@@ -67,6 +67,9 @@ export default { ...@@ -67,6 +67,9 @@ export default {
this.getCode() this.getCode()
}, },
methods: { methods: {
qnFile(src) {
return process.uniEnv.qn_base_url + src
},
async getCode() { async getCode() {
login.appLogin().then(res => { login.appLogin().then(res => {
this.code = res.code this.code = res.code
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
:border-bottom="false" title-bold></u-navbar> :border-bottom="false" title-bold></u-navbar>
<view class="wallet-content-view"> <view class="wallet-content-view">
<view class="header-view"> <view class="header-view">
<image class="header-image" :src="qianbaobeijing"></image> <image class="header-image" :src="qnFile('qianbaobeijing.png')"></image>
</view> </view>
<view class="survey-view"> <view class="survey-view">
<view class="survey-top-view"> <view class="survey-top-view">
...@@ -109,9 +109,6 @@ ...@@ -109,9 +109,6 @@
imageUrl() { imageUrl() {
return process.uniEnv.qn_base_url return process.uniEnv.qn_base_url
}, },
qianbaobeijing() {
return util.imageCache(this, 'qianbaobeijing.png')
},
buttonStyle() { buttonStyle() {
return { return {
width: "200rpx", width: "200rpx",
...@@ -139,6 +136,9 @@ ...@@ -139,6 +136,9 @@
this.loadStatement() this.loadStatement()
}, },
methods: { methods: {
qnFile(src) {
return process.uniEnv.qn_base_url + src
},
// 提现 // 提现
handleClickWithdraw() { handleClickWithdraw() {
this.$u.route({ this.$u.route({
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
</view> </view>
</view> </view>
</view> </view>
<image :src="liushuibeijingImage" class="head-back-image" mode="widthFix"></image> <image :src="qnFile('liushuibeijing.png')" class="head-back-image" mode="widthFix"></image>
<view class="list-view" v-if="hasInfo"> <view class="list-view" v-if="hasInfo">
<view class="u-flex u-row-center" v-if="loading"> <view class="u-flex u-row-center" v-if="loading">
<u-gap height="20"></u-gap> <u-gap height="20"></u-gap>
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
</view> </view>
</view> </view>
<view class="list-view-empty" v-else> <view class="list-view-empty" v-else>
<u-image class="empty-image" :src="banner" width="374" height="246" mode="widthFix" :fade="true" duration="450"> <u-image class="empty-image" :src="banner" width="374" height="246" mode="widthFix" :fade="false">
<u-loading slot="loading"></u-loading> <u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view> <view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image> </u-image>
...@@ -64,9 +64,6 @@ ...@@ -64,9 +64,6 @@
} }
}, },
computed: { computed: {
liushuibeijingImage() {
return util.imageCache(this, 'liushuibeijing.png')
},
imageUrl() { imageUrl() {
return process.uniEnv.qn_base_url return process.uniEnv.qn_base_url
}, },
...@@ -74,7 +71,7 @@ ...@@ -74,7 +71,7 @@
return this.loading || this.info.payableRecordExtendDtos && this.info.payableRecordExtendDtos.length return this.loading || this.info.payableRecordExtendDtos && this.info.payableRecordExtendDtos.length
}, },
banner() { banner() {
return util.imageCache(this, 'receipt.png') return this.qnFile('receipt.png')
}, },
}, },
onLoad() { onLoad() {
...@@ -82,6 +79,9 @@ ...@@ -82,6 +79,9 @@
this.loadPayRecord() this.loadPayRecord()
}, },
methods: { methods: {
qnFile(src) {
return process.uniEnv.qn_base_url + src
},
async loadPayRecord() { async loadPayRecord() {
let self = this let self = this
self.loading = true self.loading = true
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
</view> </view>
</view> </view>
</view> </view>
<image :src="liushuibeijingImage" class="head-back-image" mode="widthFix"></image> <image :src="qnFile('liushuibeijing.png')" class="head-back-image" mode="widthFix"></image>
<view class="list-view" v-if="hasInfo"> <view class="list-view" v-if="hasInfo">
<view class="u-flex u-row-center" v-if="loading"> <view class="u-flex u-row-center" v-if="loading">
<u-gap height="20"></u-gap> <u-gap height="20"></u-gap>
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
</view> </view>
</view> </view>
<view class="list-view-empty" v-else> <view class="list-view-empty" v-else>
<u-image class="empty-image" :src="banner" width="374" height="246" mode="widthFix" :fade="true" duration="450"> <u-image class="empty-image" :src="banner" width="374" height="246" mode="widthFix" :fade="false">
<u-loading slot="loading"></u-loading> <u-loading slot="loading"></u-loading>
<view slot="error" style="font-size: 24rpx;">加载失败</view> <view slot="error" style="font-size: 24rpx;">加载失败</view>
</u-image> </u-image>
...@@ -84,14 +84,11 @@ ...@@ -84,14 +84,11 @@
} }
}, },
liushuibeijingImage() {
return util.imageCache(this, 'liushuibeijing.png')
},
imageUrl() { imageUrl() {
return process.uniEnv.qn_base_url return process.uniEnv.qn_base_url
}, },
banner() { banner() {
return util.imageCache(this, 'receipt.png') return this.qnFile('receipt.png')
}, },
hasInfo() { hasInfo() {
return this.loading || this.data.statementList && this.data.statementList.length return this.loading || this.data.statementList && this.data.statementList.length
...@@ -101,7 +98,10 @@ ...@@ -101,7 +98,10 @@
getApp().trackPage('收入流水列表页') getApp().trackPage('收入流水列表页')
this.loadStatement() this.loadStatement()
}, },
methods: { methods: {
qnFile(src) {
return process.uniEnv.qn_base_url + src
},
bindDateChange: function(e) { bindDateChange: function(e) {
this.date = e.target.value this.date = e.target.value
this.loadStatement() this.loadStatement()
......
...@@ -58,7 +58,6 @@ function validImages(imgurl) { ...@@ -58,7 +58,6 @@ function validImages(imgurl) {
const imageCache = async function (vm, src, host) { const imageCache = async function (vm, src, host) {
host = host || process.uniEnv.qn_base_url host = host || process.uniEnv.qn_base_url
let image_url = host + src let image_url = host + src
return image_url // 临时
let image_name = md5Libs.md5(image_url) let image_name = md5Libs.md5(image_url)
var arr = Object.keys(vm.vuex_cache); var arr = Object.keys(vm.vuex_cache);
const result = await validImages(vm.vuex_cache[image_name]) const result = await validImages(vm.vuex_cache[image_name])
...@@ -70,7 +69,6 @@ const imageCache = async function (vm, src, host) { ...@@ -70,7 +69,6 @@ const imageCache = async function (vm, src, host) {
url: image_url, url: image_url,
success: (res) => { success: (res) => {
if (res.statusCode === 200) { if (res.statusCode === 200) {
// call_back(res.tempFilePath)
vm.$u.vuex(`vuex_cache.${image_name}`, res.tempFilePath) vm.$u.vuex(`vuex_cache.${image_name}`, res.tempFilePath)
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment