123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139 |
- <template>
- <van-overlay :show="show">
- <view class="popup-ad-wrapper">
- <view class="popup-ad">
- <view class="popup-ad-image" @click="onClickImage">
- <image :src="adImage" mode="widthFix"/>
- </view>
- <view class="popup-ad-close" @click="onClickClose">
- <van-icon name="close" />
- </view>
- </view>
- </view>
- <van-action-sheet
- :show="showActionSheet"
- :actions="actions"
- @select="onActionSelect"
- @cancel="onActionCancel"
- :close-on-click-overlay="true"
- :close-on-click-action="true"
- cancel-text="取消"
- />
- </van-overlay>
- </template>
- <script>
- import VanOverlay from '@/wxcomponents/vant/overlay/index'
- import VanActionSheet from '@/wxcomponents/vant/action-sheet/index'
-
- export default {
- options: {
- styleIsolation: 'shared'
- },
- components: {
- VanOverlay,
- VanActionSheet
- },
- props: {
- show: Boolean
- },
- data() {
- return {
- adUrl: 'https://file.smarket.net.cn/s/template/hOM48k/index.html?customFormId=2310071208827845&instanceId=387836&linkId=345547&configId=3439487%23%2Fwap_index%3FrandNum%3D1709540499#/pc_index?randNum=1709540499',
- adImage: 'https://oss.starify.cn/prod/starify/up/0001018678/20241107/672c895e605c9.png',
- showActionSheet: false,
- actions: [{
- name: '保存图片',
- value: 'save'
- }, {
- name: '识别二唯码',
- value: 'open'
- }]
- }
- },
- created() {
-
- },
- methods: {
- onClickClose() {
- this.$emit('update:show', false)
- },
- onClickImage() {
- this.showActionSheet = true
-
-
-
-
- },
- onActionSelect(e) {
- if (e.detail.value === 'save') {
- uni.getImageInfo({
- src: this.adImage,
- success: (res) => {
- uni.saveImageToPhotosAlbum({
- filePath: res.path,
- success() {
- uni.showToast({
- title: '保存成功',
- icon: 'success',
- })
- },
- fail(err) {
- uni.showToast({
- title: '保存失败',
- icon: 'none',
- });
- console.error(err);
- },
- })
- },
- fail(err) {
- uni.showToast({
- title: '获取图片失败',
- icon: 'none',
- })
- console.error(err)
- },
- })
- } else if (e.detail.value === 'open') {
- this.navigateTo(this.adUrl)
- }
- this.showActionSheet = false
- },
- onActionCancel() {
- this.showActionSheet = false
- }
- }
- }
- </script>
- <style lang="scss">
- .popup-ad-wrapper{
- @include display-flex-center;
- height: 100%;
- .popup-ad{
- @include display-flex-center;
- width: 100%;
- position: relative;
- flex-direction: column;
- padding: 36rpx;
- }
- .popup-ad-image{
- width: 100%;
- image{
- width: 100%;
- height: auto;
- border-radius: 10rpx;
- overflow: hidden;
- }
- }
- .popup-ad-close{
- margin-top: 50rpx;
- .van-icon-close{
- font-size: 69rpx;
- color: #ffffff;
- cursor: pointer;
- }
- }
- }
- </style>
|