|
|
@@ -1,127 +1,159 @@
|
|
|
<template>
|
|
|
- <div class="SilkRoadShanShiPinList">
|
|
|
- <img src="../../assets/img/soundbyte.jpg" style="width: 100%;" />
|
|
|
- <div class="guize" @click="showGuize">投票规则</div>
|
|
|
- <van-cell-group title="团队组" style="padding: 8px;">
|
|
|
- <van-row gutter="8">
|
|
|
- <van-col span="12" v-for="item in list" :key="item.id">
|
|
|
- <van-image :width="width" :height="height" fit="cover" position="left"
|
|
|
- :src="item.file + '?x-oss-process=video/snapshot,t_100,f_jpg,m_fast'" />
|
|
|
- <van-row>
|
|
|
- <van-col span="18">{{item.name}}</van-col>
|
|
|
- <van-col span="6">
|
|
|
- <van-button type="primary" size="mini" @click="()=>toupiao(item)">投票</van-button>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <br />
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- </van-cell-group>
|
|
|
- <van-cell-group title="个人组" style="padding: 8px">
|
|
|
- <van-row gutter="8">
|
|
|
- <van-col span="12" v-for="item in listSelf" :key="item.id">
|
|
|
- <van-image :width="width" :height="height" fit="cover" position="left"
|
|
|
- :src="item.file + '?x-oss-process=video/snapshot,t_100,f_jpg,m_fast'" />
|
|
|
- <van-row>
|
|
|
- <van-col span="18">{{item.name}}</van-col>
|
|
|
- <van-col span="6">
|
|
|
- <van-button type="primary" size="mini" @click="()=>toupiao(item)">投票</van-button>
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- <br />
|
|
|
- </van-col>
|
|
|
- </van-row>
|
|
|
- </van-cell-group>
|
|
|
- <br />
|
|
|
- </div>
|
|
|
+ <div class="SilkRoadShanShiPinList">
|
|
|
+ <img src="../../assets/img/soundbyte.jpg" style="width: 100%" />
|
|
|
+ <div class="guize" @click="showGuize">投票规则</div>
|
|
|
+ <van-cell-group title="团队组" style="padding: 8px">
|
|
|
+ <van-row gutter="8">
|
|
|
+ <van-col span="12" v-for="item in list" :key="item.id">
|
|
|
+ <van-image
|
|
|
+ :width="width"
|
|
|
+ :height="height"
|
|
|
+ fit="cover"
|
|
|
+ position="left"
|
|
|
+ :src="
|
|
|
+ item.file + '?x-oss-process=video/snapshot,t_100,f_jpg,m_fast'
|
|
|
+ "
|
|
|
+ />
|
|
|
+ <van-row>
|
|
|
+ <van-col span="18">{{ item.name }}</van-col>
|
|
|
+ <van-col span="6">
|
|
|
+ <van-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ @click="() => toupiao(item)"
|
|
|
+ >投票</van-button
|
|
|
+ >
|
|
|
+ </van-col>
|
|
|
+ </van-row>
|
|
|
+ <br />
|
|
|
+ </van-col>
|
|
|
+ </van-row>
|
|
|
+ </van-cell-group>
|
|
|
+ <van-cell-group title="个人组" style="padding: 8px">
|
|
|
+ <van-row gutter="8">
|
|
|
+ <van-col span="12" v-for="item in listSelf" :key="item.id">
|
|
|
+ <van-image
|
|
|
+ :width="width"
|
|
|
+ :height="height"
|
|
|
+ fit="cover"
|
|
|
+ position="left"
|
|
|
+ :src="
|
|
|
+ item.file + '?x-oss-process=video/snapshot,t_100,f_jpg,m_fast'
|
|
|
+ "
|
|
|
+ />
|
|
|
+ <van-row>
|
|
|
+ <van-col span="18">{{ item.name }}</van-col>
|
|
|
+ <van-col span="6">
|
|
|
+ <van-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ @click="() => toupiao(item)"
|
|
|
+ >投票</van-button
|
|
|
+ >
|
|
|
+ </van-col>
|
|
|
+ </van-row>
|
|
|
+ <br />
|
|
|
+ </van-col>
|
|
|
+ </van-row>
|
|
|
+ </van-cell-group>
|
|
|
+ <br />
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script setup>
|
|
|
- import {
|
|
|
- ref
|
|
|
- } from "vue";
|
|
|
- import {
|
|
|
- showDialog
|
|
|
- } from "vant";
|
|
|
- // import { onMounted, reactive } from "vue";
|
|
|
- // import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
|
|
|
- import {
|
|
|
- getEnrollList,
|
|
|
- getVote
|
|
|
- } from "@/api/SilkRoadSpringGala.js";
|
|
|
- /**
|
|
|
- * window.$originData.orginParames.title 页面标题
|
|
|
- * window.$originData.orginParames.parameters 固定参数值
|
|
|
- * window.$originData.urlParames url参数
|
|
|
- */
|
|
|
- const w = window.$originData.orginParames.availWidth || 0;
|
|
|
- const width = ref((w - 16) / 2);
|
|
|
- const height = ref(width.value * 0.57);
|
|
|
- console.log(window.$originData, window.$shanshipin);
|
|
|
- const list = ref([]);
|
|
|
- getEnrollList({
|
|
|
- type: '团队',
|
|
|
- operateId: 2
|
|
|
- }).then(r => {
|
|
|
- list.value = r || [];
|
|
|
- })
|
|
|
- const listSelf = ref([]);
|
|
|
- getEnrollList({
|
|
|
- type: '个人',
|
|
|
- operateId: 2
|
|
|
- }).then(r => {
|
|
|
- listSelf.value = r || [];
|
|
|
- })
|
|
|
+import { ref } from "vue";
|
|
|
+import { showDialog } from "vant";
|
|
|
+// import { onMounted, reactive } from "vue";
|
|
|
+// import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
|
|
|
+import { getEnrollList, getVote } from "@/api/SilkRoadSpringGala.js";
|
|
|
+/**
|
|
|
+ * window.$originData.orginParames.title 页面标题
|
|
|
+ * window.$originData.orginParames.parameters 固定参数值
|
|
|
+ * window.$originData.urlParames url参数
|
|
|
+ */
|
|
|
+const w = window.$originData.orginParames.availWidth || 0;
|
|
|
+const width = ref((w - 16) / 2);
|
|
|
+const height = ref(width.value * 0.57);
|
|
|
+console.log(window.$originData, window.$shanshipin);
|
|
|
+const list = ref([]);
|
|
|
+getEnrollList({
|
|
|
+ type: "团队",
|
|
|
+ operateId: 2,
|
|
|
+}).then(r => {
|
|
|
+ list.value = r || [];
|
|
|
+});
|
|
|
+const listSelf = ref([]);
|
|
|
+getEnrollList({
|
|
|
+ type: "个人",
|
|
|
+ operateId: 2,
|
|
|
+}).then(r => {
|
|
|
+ listSelf.value = r || [];
|
|
|
+});
|
|
|
|
|
|
+const toupiao = function () {
|
|
|
+ getVote({
|
|
|
+ target: 15658745826,
|
|
|
+ source: 17691223263,
|
|
|
+ client: "闪视频",
|
|
|
+ operateId: 2,
|
|
|
+ }).then(r => {
|
|
|
+ console.log(r);
|
|
|
+ });
|
|
|
+};
|
|
|
|
|
|
- const toupiao = function() {
|
|
|
- getVote({
|
|
|
- target:15658745826,
|
|
|
- source: 17691223263,
|
|
|
- client: '闪视频',
|
|
|
- operateId: 2
|
|
|
- }).then(r => {
|
|
|
- console.log(r)
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- const showGuize = () => {
|
|
|
- showDialog({
|
|
|
- title: "活动规则",
|
|
|
- messageAlign: "left",
|
|
|
- confirmButtonText: "关闭",
|
|
|
- message: () => ( < div class = "art" >
|
|
|
- <
|
|
|
- p > 1、 活动主题：“ 大美中国· 多彩丝路”《 2023 丝路嘉年华· 丝路春晚》 之我要上丝路春晚。 < /p> <
|
|
|
- p > 2、 活动时间： 即日起至12月20日海选报名 + 节目征集， 12 月21日 - 22 日线上海选， 12 月23日 - 26 日网络投票。 < /p> <
|
|
|
- p > 3、 征集范围： 各群体组织及社会民间文艺团体、 凡有才艺者， 且创作内容符合节目要求的团体和个人。 < /p> <
|
|
|
- p >
|
|
|
- 4、 内容形式： 节目内容以“ 大美中国· 多彩丝路” 为主题， 健康、 积极向上， 具备中国文化特色的创意表演， 节目形式包括但不限于情景歌舞、 演唱等， 以及其他适合舞台表演和电视呈现的艺术形式。 <
|
|
|
- /p> <
|
|
|
- p >
|
|
|
- 5、 上传规则： 参与报名的团体、 个人将录制好的高清视频作品上传至闪视频APP， 个人节目不超过3分钟， 团体节目不超过5分钟。 <
|
|
|
- /p> < /
|
|
|
- div >
|
|
|
- ),
|
|
|
- });
|
|
|
- };
|
|
|
+const showGuize = () => {
|
|
|
+ showDialog({
|
|
|
+ title: "活动规则",
|
|
|
+ messageAlign: "left",
|
|
|
+ confirmButtonText: "关闭",
|
|
|
+ message: () => (
|
|
|
+ <div class="art">
|
|
|
+ <p>
|
|
|
+ {" "}
|
|
|
+ 1、 活动主题：“ 大美中国· 多彩丝路”《 2023 丝路嘉年华· 丝路春晚》
|
|
|
+ 之我要上丝路春晚。{" "}
|
|
|
+ </p>{" "}
|
|
|
+ <p>
|
|
|
+ {" "}
|
|
|
+ 2、 活动时间： 即日起至12月20日海选报名 + 节目征集， 12 月21日 - 22
|
|
|
+ 日线上海选， 12 月23日 - 26 日网络投票。{" "}
|
|
|
+ </p>{" "}
|
|
|
+ <p>
|
|
|
+ {" "}
|
|
|
+ 3、 征集范围： 各群体组织及社会民间文艺团体、 凡有才艺者，
|
|
|
+ 且创作内容符合节目要求的团体和个人。{" "}
|
|
|
+ </p>{" "}
|
|
|
+ <p>
|
|
|
+ 4、 内容形式： 节目内容以“ 大美中国· 多彩丝路” 为主题， 健康、
|
|
|
+ 积极向上， 具备中国文化特色的创意表演， 节目形式包括但不限于情景歌舞、
|
|
|
+ 演唱等， 以及其他适合舞台表演和电视呈现的艺术形式。{" "}
|
|
|
+ </p>{" "}
|
|
|
+ <p>
|
|
|
+ 5、 上传规则： 参与报名的团体、
|
|
|
+ 个人将录制好的高清视频作品上传至闪视频APP， 个人节目不超过3分钟，
|
|
|
+ 团体节目不超过5分钟。{" "}
|
|
|
+ </p>{" "}
|
|
|
+ </div>
|
|
|
+ ),
|
|
|
+ });
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss">
|
|
|
- .SilkRoadShanShiPinList {
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
+.SilkRoadShanShiPinList {
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
|
|
|
- .guize {
|
|
|
- background-color: #ff2c2c;
|
|
|
- position: fixed;
|
|
|
- right: 0;
|
|
|
- top: 2em;
|
|
|
- color: #fff;
|
|
|
- font-weight: 400;
|
|
|
- font-size: 16px;
|
|
|
- padding: 3px 5px 3px 15px;
|
|
|
- border-top-left-radius: 1em;
|
|
|
- border-bottom-left-radius: 1em;
|
|
|
- z-index: 11;
|
|
|
- }
|
|
|
- }
|
|
|
+ .guize {
|
|
|
+ background-color: #ff2c2c;
|
|
|
+ position: fixed;
|
|
|
+ right: 0;
|
|
|
+ top: 2em;
|
|
|
+ color: #fff;
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 16px;
|
|
|
+ padding: 3px 5px 3px 15px;
|
|
|
+ border-top-left-radius: 1em;
|
|
|
+ border-bottom-left-radius: 1em;
|
|
|
+ z-index: 11;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
liyongli