137 lines
9.2 KiB
Vue
137 lines
9.2 KiB
Vue
<template>
|
|
<ciy-header title="广场" mode="scroll"></ciy-header>
|
|
<view v-if="init.code != 1">
|
|
<view class="px4 py4">
|
|
<view style="height:12em;width:100%;" class="ciy-skeleton"></view>
|
|
<view style="height:2em;width:60%;" class="ciy-skeleton"></view>
|
|
<view style="height:1em;width:40%;margin-left:1em;" class="ciy-skeleton"></view>
|
|
<view style="height:3em;width:70%;" class="ciy-skeleton"></view>
|
|
<view style="height:3em;width:70%;" class="ciy-skeleton"></view>
|
|
<view style="height:3em;width:70%;" class="ciy-skeleton"></view>
|
|
</view>
|
|
</view>
|
|
<view v-else>
|
|
<view style="min-height:80vw;background: linear-gradient(354deg, #f3fcff, #ffffff);">
|
|
<swiper v-if="init.once.banner && init.once.banner.length > 0" :indicator-dots="init.once.banner.length > 1" :autoplay="false" interval="3000" style="height:80vw;">
|
|
<swiper-item v-for="(item,index) in init.once.banner" :key="item.id">
|
|
<view v-if="isvideo(item.img)">
|
|
<cover-image v-if="vmuted" @tap="vmute" class="cmute" :style="{opacity: vop}" :src="file_stor('/img/wav2.png')"></cover-image>
|
|
<cover-image v-else @tap="vmute" class="cmute" :style="{opacity: vop}" :src="file_stor('/img/wav1.png')"></cover-image>
|
|
<video id="swipervideo" @tap="showop" object-fit="cover" :poster="file_stor(item.img + '.jpg')" :src="file_stor(item.img)" controls autoplay loop show-mute-btn :muted="vmuted" :enable-progress-gesture="false" style="width:100%;height:80vw;"></video>
|
|
</view>
|
|
<image v-else @tap="gourl" :data-url="item.url" :src="file_stor(item.img)" style="width:100%;height:100%;" />
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<view class="bg1">
|
|
<view class="ciy-grid">
|
|
<view class="grid" @tap="gourl" data-url="/pages/demo/index">
|
|
<view class="icon" :style="{backgroundImage:svg2bg(svg.ctg)}"></view>
|
|
<view class="name">Demo</view>
|
|
</view>
|
|
<view class="grid" @tap="gourl" data-url="/pages/main/paper?id=1">
|
|
<view class="icon" :style="{backgroundImage:svg2bg(svg.cqd)}"></view>
|
|
<view class="name">游客页面</view>
|
|
</view>
|
|
<view class="grid" @tap="gourl" data-url="$/pages/main/me_suggest">
|
|
<view class="icon" :style="{backgroundImage:svg2bg(svg.cjf)}"></view>
|
|
<view class="name">用户页面</view>
|
|
</view>
|
|
<view class="grid" @tap="gourl" data-url="!4187|js_shangpin">
|
|
<view class="icon" :style="{backgroundImage:svg2bg(svg.cmh)}"></view>
|
|
<view class="name">原型演示</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ciy-caption mk sti" :style="{top:(header_statusbar_height+header_title_height)+'px'}">
|
|
<view class="title">主标题</view>
|
|
<view class="sub">小标题小标题小标题小标题小标题</view>
|
|
</view>
|
|
<view>
|
|
<diy-xxlist v-for="(item,index) in init.demos" :key="item.id" :index="index" :data="item" :initdata="init"></diy-xxlist>
|
|
</view>
|
|
<view :style="{height:header_statusbar_height+'px'}"></view>
|
|
</view>
|
|
<ciy-tabbar ref="tabbar"></ciy-tabbar>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.cmute {
|
|
position: absolute;
|
|
right: 0.5em;
|
|
top: 0.5em;
|
|
z-index: 100;
|
|
height: 1.5em;
|
|
width: 1.5em;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
vmuted: false,
|
|
vop: 0.2,
|
|
svg: {
|
|
cqd: '<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M546.334118 258.198588V106.315294h288.527058V57.825882c0-31.924706-25.840941-57.825882-57.825882-57.825882H103.002353a57.825882 57.825882 0 0 0-57.825882 57.825882v886.66353C45.176471 976.414118 71.077647 1002.315294 103.002353 1002.315294H777.035294a57.765647 57.765647 0 0 0 57.795765-57.825882v-63.668706H121.133176v-151.853177H834.861176v-55.717647H121.133176v-151.823058H834.861176v-55.717648h-288.527058v-151.823058h288.527058v-55.717647h-288.527058z" fill="#A267F8"></path><path d="M834.861176 465.679059h121.494589V313.825882H834.861176z" fill="#F9D11F"></path><path d="M546.334118 465.679059h288.527058V313.825882h-288.527058z" fill="#7E42B9"></path><path d="M834.861176 673.249882h121.494589v-151.853176H834.861176z" fill="#F9D11F"></path><path d="M121.103059 673.249882h713.728v-151.853176H121.103059z" fill="#7E42B9"></path><path d="M834.861176 258.168471h121.494589V106.315294H834.861176z" fill="#F9D11F"></path><path d="M546.334118 258.168471h288.527058V106.315294h-288.527058z" fill="#7E42B9"></path><path d="M834.861176 880.790588h121.494589v-151.853176H834.861176z" fill="#F9D11F"></path><path d="M121.103059 880.790588h713.728v-151.853176H121.103059z" fill="#7E42B9"></path><path d="M485.586824 465.709176H121.103059v-81.799529a70.053647 70.053647 0 0 1 70.053647-70.053647h224.37647a70.053647 70.053647 0 0 1 70.053648 70.053647v81.799529zM386.891294 189.831529a83.516235 83.516235 0 1 1-167.03247 0 83.516235 83.516235 0 0 1 167.03247 0" fill="#FFFFFF"></path></svg>',
|
|
cjf: '<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M902.384941 257.114353H245.338353a98.454588 98.454588 0 0 0-98.454588 98.424471V746.315294a98.484706 98.484706 0 0 0 98.484706 98.454588h57.675294v141.914353c0 13.914353 16.745412 20.841412 26.593882 11.023059l152.937412-152.937412h419.84a98.484706 98.484706 0 0 0 98.42447-98.484706V355.568941a98.454588 98.454588 0 0 0-98.454588-98.42447" fill="#FF7E50"></path><path d="M98.424471 0h657.046588a98.454588 98.454588 0 0 1 98.484706 98.424471v390.806588a98.424471 98.424471 0 0 1-98.484706 98.42447H697.825882v141.914353a15.570824 15.570824 0 0 1-26.593882 11.023059l-152.997647-152.937412H98.424471A98.454588 98.454588 0 0 1 0 489.231059V98.424471A98.484706 98.484706 0 0 1 98.484706 0" fill="#F9D11F"></path><path d="M671.232 740.592941a15.600941 15.600941 0 0 0 26.624-11.023059v-141.94447h57.645176a98.394353 98.394353 0 0 0 98.424471-98.424471V257.084235H245.338353a98.424471 98.424471 0 0 0-98.424471 98.424471v232.116706h371.350589l152.967529 152.997647z" fill="#ED4042"></path><path d="M303.043765 468.269176h394.812235V358.098824H303.043765z" fill="#FFFFFF"></path></svg>',
|
|
cmh: '<svg viewBox="0 0 1355 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M663.491765 1002.315294c-162.454588 0-294.159059-131.734588-294.159059-294.189176V109.236706A109.236706 109.236706 0 0 1 478.569412 0h369.844706a109.236706 109.236706 0 0 1 109.236706 109.236706v598.889412c0 162.454588-131.704471 294.159059-294.159059 294.159058" fill="#31EC7C"></path><path d="M871.484235 916.148706c-114.868706 114.868706-301.116235 114.868706-416.015059 0L32.015059 492.634353a109.206588 109.206588 0 0 1 0-154.443294l261.511529-261.541647a109.206588 109.206588 0 0 1 154.443294 0l423.514353 423.454117c114.868706 114.928941 114.868706 301.176471 0 416.045177" fill="#A267F8"></path><path d="M455.499294 916.148706c-114.868706-114.868706-114.868706-301.116235 0-416.015059L879.013647 76.649412a109.206588 109.206588 0 0 1 154.443294 0l261.541647 261.541647a109.206588 109.206588 0 0 1 0 154.443294L871.514353 916.148706c-114.898824 114.868706-301.176471 114.868706-416.015059 0" fill="#F83CB6"></path><path d="M871.484235 500.133647L663.491765 292.141176l-208.022589 207.992471c-114.838588 114.868706-114.838588 301.116235 0 416.015059 114.898824 114.868706 301.176471 114.868706 416.015059 0 114.868706-114.898824 114.868706-301.146353 0-416.015059" fill="#7E42B9"></path><path d="M740.532706 636.235294a101.707294 101.707294 0 0 1-143.811765 143.811765 101.707294 101.707294 0 0 1 143.811765-143.811765" fill="#FFFFFF"></path></svg>',
|
|
ctg: '<svg viewBox="0 0 1114 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M801.039059 672.677647l-198.415059 198.415059-198.415059-198.415059-155.888941-155.888941 198.415059-198.415059 155.888941 155.888941 220.16-220.129882V133.150118a133.150118 133.150118 0 0 0-133.150118-133.12H118.211765C44.664471 0 0 59.632941 0 133.12v735.954824C0 942.682353 44.664471 1002.315294 118.211765 1002.315294h571.422117a133.12 133.12 0 0 0 133.12-133.180235v-218.172235l-21.714823 21.744941z" fill="#F9D11F"></path><path d="M1105.92 367.766588l-198.384941-198.415059-84.751059 84.781177v396.8z" fill="#3193FF"></path><path d="M446.735059 318.403765L248.32 516.818824l155.888941 155.888941 198.415059 198.415059 198.415059-198.415059 21.744941-21.744941V254.132706l-220.16 220.16z" fill="#006FD9"></path><path d="M119.657412 239.344941h583.439059v-134.625882H119.657412zM119.687529 882.627765h179.501177v-134.625883h-179.501177z" fill="#FFFFFF"></path></svg>',
|
|
},
|
|
}
|
|
},
|
|
onLoad() {
|
|
if (this.opn.u) {
|
|
uni.navigateTo({
|
|
url: decodeURIComponent(this.opn.u)
|
|
});
|
|
}
|
|
setTimeout(() => {
|
|
this.executepnt(1);
|
|
}, 3000);
|
|
this.getinit();
|
|
},
|
|
onShareAppMessage(res) {
|
|
return this.shareparam({
|
|
type: 'message',
|
|
title: this.init.sharename,
|
|
//img: this.file_stor(''),
|
|
path: this.getroute(),
|
|
query: {
|
|
...this.opn
|
|
}
|
|
});
|
|
},
|
|
onShareTimeline(res) {
|
|
return this.shareparam({
|
|
type: 'timeline',
|
|
title: this.init.sharename,
|
|
//img: this.file_stor(''),
|
|
path: this.getroute(),
|
|
query: {
|
|
...this.opn
|
|
}
|
|
});
|
|
},
|
|
onPullDownRefresh(b) {
|
|
this._stopPullDown = true;
|
|
this.getinit();
|
|
},
|
|
methods: {
|
|
async getinit() {
|
|
var retjson = await this.callajax({
|
|
func: 'main.index_init'
|
|
});
|
|
if (retjson.code != 1)
|
|
return this.alert(retjson.errmsg);
|
|
this.init = retjson;
|
|
},
|
|
showop() {
|
|
this.vop = 2;
|
|
},
|
|
vmute() {
|
|
this.vmuted = !this.vmuted;
|
|
},
|
|
}
|
|
}
|
|
</script> |