优化驾驶舱代码结构 #11
4
.env.dev
4
.env.dev
@ -5,8 +5,8 @@ ENV = 'development'
|
|||||||
VUE_APP_TITLE = 芋道管理系统
|
VUE_APP_TITLE = 芋道管理系统
|
||||||
|
|
||||||
# 芋道管理系统/开发环境
|
# 芋道管理系统/开发环境
|
||||||
# VUE_APP_BASE_API = 'http://192.168.1.61:48080'
|
VUE_APP_BASE_API = 'http://192.168.1.61:48080'
|
||||||
VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com'
|
# VUE_APP_BASE_API = 'http://glass.kszny.picaiba.com'
|
||||||
|
|
||||||
# 路由懒加载
|
# 路由懒加载
|
||||||
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
VUE_CLI_BABEL_TRANSPILE_MODULES = true
|
||||||
|
69
src/views/copilot/components/ChartContainer.vue
Normal file
69
src/views/copilot/components/ChartContainer.vue
Normal file
@ -0,0 +1,69 @@
|
|||||||
|
<!--
|
||||||
|
filename: ChartContainer.vue
|
||||||
|
author: liubin
|
||||||
|
date: 2024-04-10 08:54:33
|
||||||
|
description:
|
||||||
|
todo: 驾驶舱和首页的 ChartContainer, 实现滑动条 和动态宽高
|
||||||
|
-->
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="chart-container" :class="{ 'no-scroll': noScroll }">
|
||||||
|
<slot />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "ChartContainer",
|
||||||
|
components: {},
|
||||||
|
props: {
|
||||||
|
noScroll: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
computed: {},
|
||||||
|
methods: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.chart-container {
|
||||||
|
height: 0;
|
||||||
|
flex: 1;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-scroll::-webkit-scrollbar {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-button {
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
// width: 10px;
|
||||||
|
// height: 10px;
|
||||||
|
// background: #14305f;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background: #14305f;
|
||||||
|
border: 0 none;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: #004798;
|
||||||
|
border: 0 none;
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
</style>
|
@ -1,10 +0,0 @@
|
|||||||
export default {
|
|
||||||
getData: async function (url) {
|
|
||||||
//
|
|
||||||
return await new Promise((resolve, reject) => {
|
|
||||||
setTimeout(() => {
|
|
||||||
resolve([90119, 40801, 44028]);
|
|
||||||
}, 1200);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
};
|
|
Before Width: | Height: | Size: 5.0 KiB After Width: | Height: | Size: 5.0 KiB |
@ -10,7 +10,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import DoubleRingWrapperVue from "./base/DoubleRingWrapper.vue";
|
import DoubleRingWrapperVue from "./sub/ring/DoubleRingWrapper.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "BipvOutput",
|
name: "BipvOutput",
|
@ -6,7 +6,7 @@
|
|||||||
-->
|
-->
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<bar-chart-base
|
<BarChartBase
|
||||||
:legend="legend"
|
:legend="legend"
|
||||||
:series="series"
|
:series="series"
|
||||||
:xAxis="xAxis"
|
:xAxis="xAxis"
|
||||||
@ -16,7 +16,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import BarChartBase from "./base/BarChartBase.vue";
|
import BarChartBase from "./sub/bar/BarChartBase.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "ChipInvest",
|
name: "ChipInvest",
|
@ -10,7 +10,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import DoubleRingWrapperVue from "./base/DoubleRingWrapper.vue";
|
import DoubleRingWrapperVue from "./sub/ring/DoubleRingWrapper.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "ChipOutput",
|
name: "ChipOutput",
|
@ -6,7 +6,7 @@
|
|||||||
-->
|
-->
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<bar-chart-base
|
<BarChartBase
|
||||||
:legend="legend"
|
:legend="legend"
|
||||||
:series="series"
|
:series="series"
|
||||||
:xAxis="xAxis"
|
:xAxis="xAxis"
|
||||||
@ -16,7 +16,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import BarChartBase from "./base/BarChartBase.vue";
|
import BarChartBase from "./sub/bar/BarChartBase.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "FtoInvest",
|
name: "FtoInvest",
|
@ -10,7 +10,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import DoubleRingWrapperVue from "./base/DoubleRingWrapper.vue";
|
import DoubleRingWrapperVue from "./sub/ring/DoubleRingWrapper.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "StdOutput",
|
name: "StdOutput",
|
@ -26,13 +26,13 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import screenfull from "screenfull";
|
import screenfull from "screenfull";
|
||||||
import ChartContainerVue from "../../../../components/ChartContainer.vue";
|
import ChartContainer from "../../../../components/ChartContainer.vue";
|
||||||
import chartMixin from "@/mixins/chart.js";
|
import chartMixin from "@/mixins/chart.js";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "BarChartBase",
|
name: "BarChartBase",
|
||||||
components: {
|
components: {
|
||||||
ChartContainer: ChartContainerVue,
|
ChartContainer,
|
||||||
},
|
},
|
||||||
mixins: [chartMixin],
|
mixins: [chartMixin],
|
||||||
props: {
|
props: {
|
@ -15,7 +15,8 @@
|
|||||||
<script>
|
<script>
|
||||||
import CityNameVue from "./CityName.vue";
|
import CityNameVue from "./CityName.vue";
|
||||||
import CityValueVue from "./CityValue.vue";
|
import CityValueVue from "./CityValue.vue";
|
||||||
import GradientTextVue from "./GradientText.vue";
|
import GradientTextVue from "../gradient/GradientText.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "CityItem",
|
name: "CityItem",
|
||||||
components: {
|
components: {
|
@ -13,7 +13,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Icon from "./icon.png";
|
import Icon from "../../../assets/icon.png";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "CityName",
|
name: "CityName",
|
@ -18,7 +18,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import GradientTextVue from "./GradientText.vue";
|
import GradientTextVue from "../gradient/GradientText.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "CityValue",
|
name: "CityValue",
|
@ -21,7 +21,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import chartMixin from "@/mixins/chart.js";
|
import chartMixin from "@/mixins/chart.js";
|
||||||
import fullscreenMixin from "@/mixins/fullscreen.js";
|
import fullscreenMixin from "@/mixins/fullscreen.js";
|
||||||
import getOptions from "./double-ring-chart-options";
|
import getOptions from "../../../options/double-ring-chart-options";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "DoubleRingChart",
|
name: "DoubleRingChart",
|
@ -27,9 +27,9 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import CopilotSelect from "../../select.vue";
|
import CopilotSelect from "@/views/copilot/components/select.vue";
|
||||||
import DoubleRingChartVue from "./DoubleRingChart.vue";
|
import DoubleRingChartVue from "./DoubleRingChart.vue";
|
||||||
import CityData from "./CityData.vue";
|
import CityData from "../city/CityData.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "DoubleRingWrapper",
|
name: "DoubleRingWrapper",
|
@ -30,22 +30,22 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Container from "../components/Container.vue";
|
import Container from "@/views/copilot/components/Container.vue";
|
||||||
import StdOutputVue from "../components/charts/StdOutput.vue";
|
import StdOutput from "./components/StdOutput.vue";
|
||||||
import ChipOutputVue from "../components/charts/ChipOutput.vue";
|
import ChipOutput from "./components/ChipOutput.vue";
|
||||||
import FtoInvestVue from "../components/charts/FtoInvest.vue";
|
import FtoInvest from "./components/FtoInvest.vue";
|
||||||
import BipvOutputVue from "../components/charts/BipvOutput.vue";
|
import BipvOutput from "./components/BipvOutput.vue";
|
||||||
import ChipInvestVue from "../components/charts/ChipInvest.vue";
|
import ChipInvest from "./components/ChipInvest.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "YieldCopilot",
|
name: "YieldCopilot",
|
||||||
components: {
|
components: {
|
||||||
DbContainer: Container,
|
DbContainer: Container,
|
||||||
StdOutput: StdOutputVue,
|
StdOutput,
|
||||||
ChipOutput: ChipOutputVue,
|
ChipOutput,
|
||||||
BipvOutput: BipvOutputVue,
|
BipvOutput,
|
||||||
FtoInvest: FtoInvestVue,
|
FtoInvest,
|
||||||
ChipInvest: ChipInvestVue,
|
ChipInvest,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
period: {
|
period: {
|
||||||
|
Loading…
Reference in New Issue
Block a user