This commit is contained in:
zmj 2024-06-01 17:33:03 +08:00
parent 96bcd8a40d
commit b3d7de63bb
4 changed files with 816 additions and 802 deletions

BIN
dist.zip

Binary file not shown.

View File

@ -42,11 +42,8 @@ const aa = (cig, data) => {
`<div style='height:40px;line-height:40px; white-space: nowrap; overflow: hidden;text-overflow: ellipsis;'>${item.store_name || item.mer_name}</div>`,
`<div style=' transform: translateY(12px); width: 100%; height: 10px; background-color: #122E3F;overflow: hidden;'> <div style=' width: ${item.store_name ? (item.total_sales / productRankingTotal.value).toFixed(2) * 100 : (item.total_sales / townProductCount.value).toFixed(2) * 100}%;height: 100%; background: linear-gradient(to right, #4459CC, #53CAE2);transition: width 0.5s ease-in-out;'></div> </div>`,
`<div style=' position: relative;line-height:30px;text-align:center' >${item.total_sales} <span style='font-size:10px'>单</span>
<img src="/static/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
<img src="/index/PHBBG.png" style="position: absolute;width: 100%;height: 30px; top:0px;left:0px" alt="">
</div>`,
])
})

File diff suppressed because it is too large Load Diff

View File

@ -3,9 +3,7 @@
<dv-loading>Loading...</dv-loading>
</div>
<div :style="{ opacity: show ? 0 : 1 }">
<div class="top box">
<div class="l">
<topLeft :code="route.query.code" :key="route.query.code"></topLeft>
@ -16,12 +14,9 @@
<div class="r">
<topRight :code="route.query.code" :key="route.query.code"></topRight>
</div>
</div>
<div class="bottom box">
<div class="l">
<bottomleft :code="route.query.code" :key="route.query.code"></bottomleft>
</div>
<div class="c">
@ -29,45 +24,37 @@
</div>
<div class="r">
<bottomRight :code="route.query.code" :key="route.query.code"></bottomRight>
</div>
</div>
</div>
</template>
<script setup>
import { onMounted } from 'vue';
import bottomRight from "@/components/townDetail/bottomRight.vue"
import bottomCenter from "@/components/townDetail/bottomCenter.vue"
import bottomleft from "@/components/townDetail/bottomleft.vue"
import { useRoute } from 'vue-router';
import topCenter from "@/components/townDetail/topCenter.vue"
import topLeft from "@/components/townDetail/topLeft.vue"
import topRight from "@/components/townDetail/topRight.vue"
import { ref } from 'vue'
import { onMounted } from "vue";
import bottomRight from "@/components/townDetail/bottomRight.vue";
import bottomCenter from "@/components/townDetail/bottomCenter.vue";
import bottomleft from "@/components/townDetail/bottomleft.vue";
import { useRoute } from "vue-router";
import topCenter from "@/components/townDetail/topCenter.vue";
import topLeft from "@/components/townDetail/topLeft.vue";
import topRight from "@/components/townDetail/topRight.vue";
import { ref } from "vue";
const show = ref(true)
const route = useRoute()
const show = ref(true);
const route = useRoute();
onMounted(() => {
setTimeout(() => {
show.value = false
}, 1000)
})
show.value = false;
}, 1000);
});
</script>
<style lang="scss" scoped>
.box {
width: 100vw;
height: 47vh;
box-sizing: border-box;
}
.top {
@ -83,9 +70,6 @@ onMounted(() => {
box-sizing: border-box;
position: relative;
padding-top: 6vh;
}
.c {
@ -95,19 +79,13 @@ onMounted(() => {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.r {
width: 25vw;
height: 46vh;
position: relative;
// background-color: RED;
}
}
@ -119,35 +97,26 @@ onMounted(() => {
.l {
// flex: 1;
width: 25VW;
width: 25vw;
height: 46vh;
position: relative;
}
.c {
width: 48VW;
width: 48vw;
height: 46vh;
position: relative;
}
.r {
width: 25VW;
width: 25vw;
height: 46vh;
position: relative;
}
}
.center {
position: absolute;
top: 50%;
@ -159,7 +128,7 @@ onMounted(() => {
transform: translateY(12px);
width: 100%;
height: 10px;
background-color: #122E3F;
background-color: #122e3f;
// border-radius: 10px;
overflow: hidden;
}
@ -167,7 +136,7 @@ onMounted(() => {
.progress {
width: 70%;
height: 100%;
background: linear-gradient(to right, #455CCC, #51C2E0);
background: linear-gradient(to right, #455ccc, #51c2e0);
transition: width 0.5s ease-in-out;
}
@ -178,4 +147,4 @@ onMounted(() => {
transform: translate(-50%, -50%);
color: white;
}
</style>
</style>