1 line
2.5 KiB
Plaintext
1 line
2.5 KiB
Plaintext
|
{"version":3,"file":"banner.js","sources":["../../../../../../src/pages/index/components/banner.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9wYWdlcy9pbmRleC9jb21wb25lbnRzL2Jhbm5lci52dWU"],"sourcesContent":["<template>\r\n <view class=\"carousel-container\">\r\n <swiper class=\"carousel\" autoplay=\"true\" interval=\"3000\" @change=\"onSwiperChange\">\r\n <swiper-item>\r\n <view class=\"banner-content\">\r\n <image :src=\"imgUrl('@/static/home/banner.png')\" class=\"banner-image\" mod=\"widthFix\" />\r\n </view>\r\n </swiper-item>\r\n <swiper-item>\r\n <view class=\"banner-content\">\r\n <image :src=\"imgUrl('@/static/home/banner.png')\" class=\"banner-image\" mod=\"widthFix\" />\r\n </view>\r\n </swiper-item>\r\n </swiper>\r\n <view class=\"custom-indicators\">\r\n <view\r\n v-for=\"(item, index) in 2\"\r\n :key=\"index\"\r\n :class=\"['indicator', { active: currentIndex === index }]\"\r\n ></view>\r\n </view>\r\n </view>\r\n</template>\r\n\r\n<script setup>\r\nimport { imgUrl } from '@/utils/commUtils'\r\nimport { ref } from 'vue'\r\n\r\nconst currentIndex = ref(0)\r\n\r\nconst onSwiperChange = (event) => {\r\n currentIndex.value = event.detail.current\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.carousel-container {\r\n position: relative;\r\n width: 100vw;\r\n height: 30vh;\r\n background-color: #ff8261;\r\n border-radius: 10px 10px 0 0;\r\n}\r\n\r\n.carousel {\r\n width: 100%;\r\n height: 100%;\r\n}\r\n\r\n.banner-content {\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n justify-content: center;\r\n width: 100%;\r\n height: 100%;\r\n}\r\n\r\n.banner-image {\r\n width: 100%;\r\n object-fit: cover;\r\n}\r\n\r\n.custom-indicators {\r\n position: absolute;\r\n bottom: 20%;\r\n left: 5%;\r\n display: flex;\r\n justify-content: center;\r\n}\r\n\r\n.indicator {\r\n width: 10px;\r\n height: 5px;\r\n margin: 0 2px;\r\n background-color: #cccccc;\r\n border-radius: 5px;\r\n transition: width 0.3s;\r\n}\r\n\r\n.indicator.active {\r\n width: 18px;\r\n background-color: #ffc107;\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/pages/index/components/banner.vue'\nwx.createComponent(Component)"],"names":["ref"],"mappings":";;;;;;AA4BA,UAAM,eAAeA,cAAG,IAAC,CAAC;AAE1B,UAAM,iBAAiB,CAAC,UAAU;AAChC,mBAAa,QAAQ,MAAM,OAAO;AAAA,IACpC;;;;;;;;;;;;;;;;;;;AC/BA,GAAG,gBAAgB,SAAS;"}
|