|
|
@@ -0,0 +1,203 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <view class="example">
|
|
|
+ <uniPopup :show="type" position="middle" mode="insert" @hidePopup="togglePopup('')">
|
|
|
+ <view class="uni-center center-box">
|
|
|
+ <image class="image" :src="images" />
|
|
|
+ </view>
|
|
|
+ </uniPopup>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import uniPopup from './uni-popup.vue'
|
|
|
+ export default {
|
|
|
+ props: {
|
|
|
+ show: {
|
|
|
+ default: false,
|
|
|
+ type: Boolean
|
|
|
+ },
|
|
|
+ images: {
|
|
|
+ default: '',
|
|
|
+ type: String
|
|
|
+ }
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ uniPopup
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ 'show':function(val) {
|
|
|
+ console.log(val)
|
|
|
+ if(val) {
|
|
|
+ this.type = true;
|
|
|
+ }else {
|
|
|
+ this.type = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ type: false,
|
|
|
+ pictureUrl: this.pictureUrl,
|
|
|
+ list: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ // onBackPress() {
|
|
|
+ // if (this.type !== '') {
|
|
|
+ // this.type = '';
|
|
|
+ // return true;
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ methods: {
|
|
|
+ togglePopup() {
|
|
|
+ this.type = false;
|
|
|
+ uni.$emit('changshow')
|
|
|
+ },
|
|
|
+ gomoney() {
|
|
|
+ // uni.navigateTo({
|
|
|
+ // url:'/pages/myCenter/definite'
|
|
|
+ // })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ page {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background-color: #fff
|
|
|
+ }
|
|
|
+
|
|
|
+ view {
|
|
|
+ font-size: 28upx;
|
|
|
+ line-height: inherit
|
|
|
+ }
|
|
|
+
|
|
|
+ .example {
|
|
|
+ padding: 0 30upx 30upx
|
|
|
+ }
|
|
|
+
|
|
|
+ .example-title {
|
|
|
+ font-size: 32upx;
|
|
|
+ line-height: 32upx;
|
|
|
+ color: #777;
|
|
|
+ margin: 40upx 25upx;
|
|
|
+ position: relative
|
|
|
+ }
|
|
|
+
|
|
|
+ .example .example-title {
|
|
|
+ margin: 40upx 0
|
|
|
+ }
|
|
|
+
|
|
|
+ .example-body {
|
|
|
+ padding: 0 40upx
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-padding-wrap {
|
|
|
+ padding: 0 30upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ button {
|
|
|
+ margin: 20upx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-helllo-text {
|
|
|
+ height: 100upx;
|
|
|
+ line-height: 100upx;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .center-box {
|
|
|
+ width: 800upx;
|
|
|
+ height: 800upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-list-item {
|
|
|
+ text-align: left;
|
|
|
+ line-height: 80upx;
|
|
|
+ border-bottom: 1px #f5f5f5 solid;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uni-list-item:last-child {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .center-box .image {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-title {
|
|
|
+ line-height: 60upx;
|
|
|
+ font-size: 24upx;
|
|
|
+ padding: 15upx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ padding: 0 35upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-box {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 15upx;
|
|
|
+ width: 25%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-image {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 90upx;
|
|
|
+ height: 90upx;
|
|
|
+ overflow: hidden;
|
|
|
+ background: #007aff;
|
|
|
+ border-radius: 10upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-text {
|
|
|
+ font-size: 26upx;
|
|
|
+ color: #333;
|
|
|
+ margin-top: 10upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-btn {
|
|
|
+ height: 90upx;
|
|
|
+ line-height: 90upx;
|
|
|
+ border-top: 1px #f5f5f5 solid;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-image.wx {
|
|
|
+ background: #00ce47;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-image.qq {
|
|
|
+ background: #00b6f6;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-image.sina {
|
|
|
+ background: #ff766a;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-content-image.copy {
|
|
|
+ background: #07ccd0;
|
|
|
+ }
|
|
|
+
|
|
|
+ @font-face {
|
|
|
+ font-family: 'iconfont';
|
|
|
+ /* project id 1028200 */
|
|
|
+ src: url('https://at.alicdn.com/t/font_1028200_47ewtwy4t04.ttf') format('truetype');
|
|
|
+ }
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ font-family: 'iconfont';
|
|
|
+ font-size: 40upx;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+</style>
|
wcni