zmj
/
tradeScreen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

(下班)

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist.zip
View File

Binary file not shown.

5
src/components/townDetail/bottomRight.vue
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='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=' 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> `<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>`, </div>`,
]) ])
}) })

744
src/view/finance.vue
View File

File diff suppressed because it is too large Load Diff

69
src/view/townDetail.vue
View File

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