You need to sign in or sign up before continuing.
hookehuyr

新增首页页面

...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
2 * @Author: hookehuyr hookehuyr@gmail.com 2 * @Author: hookehuyr hookehuyr@gmail.com
3 * @Date: 2022-05-27 15:57:59 3 * @Date: 2022-05-27 15:57:59
4 * @LastEditors: hookehuyr hookehuyr@gmail.com 4 * @LastEditors: hookehuyr hookehuyr@gmail.com
5 - * @LastEditTime: 2022-06-06 14:47:04 5 + * @LastEditTime: 2022-09-20 13:51:26
6 - * @FilePath: /taro-vant-weapp/src/app.config.js 6 + * @FilePath: /swx/src/app.config.js
7 * @Description: 7 * @Description:
8 */ 8 */
9 const vantComponentNames = require("../vantComponentConf"); 9 const vantComponentNames = require("../vantComponentConf");
...@@ -24,8 +24,8 @@ export default { ...@@ -24,8 +24,8 @@ export default {
24 ], 24 ],
25 subpackages: [ // 配置在tabBar中的页面不能分包写到subpackages中去 25 subpackages: [ // 配置在tabBar中的页面不能分包写到subpackages中去
26 { 26 {
27 - root: "pages/demo", 27 + root: 'pages/demo',
28 - pages: ["index"], 28 + pages: ['index'],
29 }, 29 },
30 ], 30 ],
31 window: { 31 window: {
......
1 +page {
2 + color: #222222;
3 + background-color: #F6F6F6;
4 +}
......
1 +/*
2 + * @Date: 2022-09-19 14:11:06
3 + * @LastEditors: hookehuyr hookehuyr@gmail.com
4 + * @LastEditTime: 2022-09-20 13:55:01
5 + * @FilePath: /swx/src/pages/index/index.config.js
6 + * @Description: 文件描述
7 + */
1 export default { 8 export default {
2 - navigationBarTitleText: '首页', 9 + navigationBarTitleText: '胜文轩-活动工具',
3 usingComponents: { 10 usingComponents: {
4 }, 11 },
5 } 12 }
......
1 +.slide-box {
2 + height: 15rem;
3 + .slide-image {
4 + width: 100%;
5 + height: 100%;
6 + }
7 +}
8 +
9 +.bg-gradient {
10 + background: linear-gradient(#B3DDC9, #B3DDC9) no-repeat;
11 + /*调整下划线的宽度占百分之百 高度是3px */
12 + background-size: 100% 1vw;
13 + /* 调整下划线的起始位置 左侧是0 上边是1.15em */
14 + background-position: 0 1rem;
15 +}
16 +
17 +.underline {
18 + position: relative;
19 + z-index: 2;
20 + &::before {
21 + position: absolute;
22 + z-index: 1;
23 + content: "";
24 + color: white;
25 + left: 0;
26 + width: 100%;
27 + height: 1.1rem;
28 + border-bottom: 4rpx solid #B3DDC9;
29 + }
30 +}
......
1 <!-- 1 <!--
2 * @Date: 2022-09-19 14:11:06 2 * @Date: 2022-09-19 14:11:06
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-09-19 17:21:39 4 + * @LastEditTime: 2022-09-20 15:45:23
5 * @FilePath: /swx/src/pages/index/index.vue 5 * @FilePath: /swx/src/pages/index/index.vue
6 - * @Description: 文件描述 6 + * @Description: 首页
7 --> 7 -->
8 <template> 8 <template>
9 - <!-- <van-tabs :active="active" bind:change="onChange">
10 - <van-tab title="标签 1">内容 2</van-tab>
11 - <van-tab title="标签 2">内容 2</van-tab>
12 - <van-tab title="标签 3">内容 3</van-tab>
13 - <van-tab title="标签 4">
14 - <van-button type="primary" @click="goTo">主要按钮</van-button>
15 - </van-tab>
16 - </van-tabs> -->
17 - <van-button type="primary" @click="goTo">主要按钮</van-button>
18 - <van-image width="100" height="100" src="https://img.yzcdn.cn/vant/cat.jpeg" />
19 - <view class="page-body">
20 - <view class="page-section">
21 - <text>时间日期选择器--无默认</text>
22 <view> 9 <view>
23 - <timePickerData 10 + <swiper
24 - :start-time="startTime" 11 + class='slide-box'
25 - :end-time="endTime" 12 + indicatorColor='#94B294'
26 - @result="onResult" 13 + indicatorActiveColor='#FFFFFF'
27 - > 14 + current="current"
28 - <input placeholder="请选择" disabled='true' :value="time" /> 15 + :duration="duration"
29 - </timePickerData> 16 + :interval="interval"
17 + :circular="isCircular"
18 + :autoplay="isAutoplay"
19 + :indicatorDots="hasIndicatorDots">
20 + <swiper-item v-for="(item, idx) in imgUrls" :key="idx">
21 + <image :src="item" class="slide-image" />
22 + </swiper-item>
23 + </swiper>
30 </view> 24 </view>
25 + <view style="padding: 1rem;">
26 + <text class="bg-gradient">推荐活动</text>
31 </view> 27 </view>
28 + <view style="padding: 1rem;">
29 + <activity-card></activity-card>
32 </view> 30 </view>
33 </template> 31 </template>
34 32
35 <script setup> 33 <script setup>
36 import Taro from '@tarojs/taro' 34 import Taro from '@tarojs/taro'
37 import { ref } from 'vue'; 35 import { ref } from 'vue';
38 -import request from '../../utils/request'; 36 +import activityCard from '@/components/activity-card.vue'
39 -import timePickerData from "@/components/time-picker-data/picker";
40 37
41 -request.get('/srv/?a=kg_list')
42 -.then(res => {
43 - console.warn(res);
44 -})
45 -.catch(err => {
46 - console.error(err);
47 -})
48 -// Taro.request({
49 -// url: 'http://voice.onwall.cn/srv/?f=voice&a=kg_list', //仅为示例,并非真实的接口地址
50 -// data: {
51 -// },
52 -// // header: {
53 -// // 'content-type': 'application/json' // 默认值
54 -// // },
55 -// success: function (res) {
56 -// console.log(res.data)
57 -// }
58 -// })
59 -const active = ref(1);
60 -
61 -const goTo = () => {
62 - Taro.navigateTo({
63 - url: '../demo/index?id=1'
64 - })
65 -}
66 </script> 38 </script>
67 39
68 <script> 40 <script>
69 import "./index.less"; 41 import "./index.less";
42 +
70 export default { 43 export default {
71 name: "indexPage", 44 name: "indexPage",
72 onReady() { 45 onReady() {
...@@ -110,34 +83,20 @@ export default { ...@@ -110,34 +83,20 @@ export default {
110 }, 83 },
111 data() { 84 data() {
112 return { 85 return {
113 - time:'', 86 + current: 1,
114 - startTime: new Date(), 87 + duration: 500,
115 - default:new Date(), 88 + interval: 5000,
89 + isCircular: true,
90 + isAutoplay: false,
91 + hasIndicatorDots: true,
92 + imgUrls: [
93 + 'https://img10.360buyimg.com/babel/s700x360_jfs/t25855/203/725883724/96703/5a598a0f/5b7a22e1Nfd6ba344.jpg!q90!cc_350x180',
94 + 'https://img11.360buyimg.com/babel/s700x360_jfs/t1/4776/39/2280/143162/5b9642a5E83bcda10/d93064343eb12276.jpg!q90!cc_350x180',
95 + 'https://img14.360buyimg.com/babel/s700x360_jfs/t1/4099/12/2578/101668/5b971b4bE65ae279d/89dd1764797acfd9.jpg!q90!cc_350x180',
96 + ],
116 }; 97 };
117 }, 98 },
118 - created(){
119 - this.startTime = this.getTime("min", 1);
120 - this.endTime = this.getTime("year", 2);
121 - },
122 methods: { 99 methods: {
123 - getTime(key, number, date) {
124 - let _date = date ? new Date(date) : new Date();
125 - if (key === "min") {
126 - _date.setMinutes(_date.getMinutes() + number);
127 - }
128 - if (key === "hour") {
129 - _date.setHours(_date.getHours() + number);
130 } 100 }
131 - if (key === "year") {
132 - _date.setFullYear(_date.getFullYear() + number);
133 - }
134 - return _date;
135 - },
136 - onResult(arr) {
137 - let time =
138 - arr[0] + "-" + arr[1] + "-" + arr[2] + " " + arr[3] + ":" + arr[4];
139 - this.time = time;
140 - },
141 - },
142 }; 101 };
143 </script> 102 </script>
......