123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124 |
- <template>
- <view class="header">
- <image src="../../static/images/skm_fn_bg.png" mode="aspectFill" class="bg-img"></image>
- <view class="info-block flex-row-between">
- <view class="info">
- <view class="title">{{title}}</view>
- <view class="desc">{{$test.$desc}}</view>
- </view>
- <view v-if="title=='收款码'+$test.$test" @click="look" class="btn flex-center">查看指引 <image class="zhiyin" src="../../static/images/zhiyin.png"
- mode=""></image>
- </view>
- <view v-if="title=='普通二维码'+$test.$test" @click="lookCode" class="btn flex-center">查看指引 <image class="zhiyin" src="../../static/images/zhiyin.png"
- mode=""></image>
- </view>
- </view>
- </view>
- </template>
- <script>
- export default {
- name: 'headerTitle',
- props: {
- title: {
- type: String,
- default () {
- return ""
- },
- }
- },
- data() {
- return {
- $test:this.$test.$test,
- }
- },
- methods: {
- look() {
- uni.showModal({
- title: '温馨提示',
- content: '上传多张收款码视为多码合一,请勿上传第三方聚合收款码。多码合一只支持支付宝收款二维码、云闪付钱包收款二维码',
- showCancel: false,
- cancelText: '',
- confirmText: '好的',
- success: res => {},
- fail: () => {},
- complete: () => {}
- });
- },
- lookCode() {
- uni.showModal({
- title: '温馨提示',
- content: `图片${this.$test.$test}只支持能有效进行访问的网址链接,非网址链接的二维码,不建议进行${this.$test.$test}操作。`,
- showCancel: false,
- cancelText: '',
- confirmText: '好的',
- success: res => {},
- fail: () => {},
- complete: () => {}
- });
- },
- }
- }
- </script>
- <style>
- .header {
- width: 100%;
- height: 198rpx;
- position: relative;
- }
- .header .bg-img {
- display: block;
- position: absolute;
- left: 0;
- top: 0;
- z-index: -1;
- width: 100%;
- height: 198rpx;
- }
- .header .info-block {
- padding: 0 40rpx 0 48rpx;
- height: 198rpx;
- }
- .header .info-block .title {
- font-size: 36rpx;
- color: #fff;
- font-weight: 500;
- line-height: 50rpx;
- }
- .header .info-block .desc {
- font-size: 28rpx;
- font-weight: 500;
- color: #fff;
- line-height: 40rpx;
- margin-top: 8rpx;
- }
- .header .info-block .btn {
- width: 176rpx;
- height: 56rpx;
- border: 2rpx solid #fff;
- border-radius: 28rpx;
- text-align: center;
- line-height: 52rpx;
- font-size: 28rpx;
- font-weight: 500;
- color: #fff;
- }
- .zhiyin {
- width: 28rpx;
- height: 28rpx;
- margin-left: 6rpx;
- }
- </style>
|