添加 vue-echarts echarts 等相关包

src/views/wmsManagement/components/TheWmBatchSearch/仓库数据总看板/index.css

@@ -0,0 +1,90 @@
+.border {
+	border: 1px solid #0055ff;
+}
+/* 主背景框 */
+.container{
+	margin: 0;
+	padding: 0;
+	width: 100%;
+	height: 800px;
+	font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
+}
+/* 排序 */
+.flex-row{
+	display: flex;
+	flex-direction: row;
+}
+.flex-column{
+	display: flex;
+	flex-direction: column;
+}
+/* 区域组件样式 */
+/* 边框适配 */
+.box-padding-10{
+	padding: 10px;
+}
+.box-padding-20{
+	padding: 20px;
+}
+/* 大屏背景色 */
+.main-background-color{
+	background-color: #1D282F;
+}
+/* 组件背景色 */
+.template-background-color{
+	background-color: #121F2A;
+}
+/* 文字颜色 */
+.text-t1{
+	color: #ffffff;
+}
+.text-t2{
+	color: #f4f6f9;
+}
+.text-t3{
+	color: #8CA386;
+}
+/* 主要颜色 */
+.main-color{
+	/* #44A9EB */
+	/* #2D9BF8 */
+	/* #44EBEA */
+	/* #EFBB65 */
+	/* #8FB2C9 */
+}
+/* 状态颜色 */
+.type-color{
+	/* #E27878 */
+	/* #44EBEA */
+	/* #EFBB65 */
+	/* #7E8B90 */
+}
+/* 头部 */
+.header-out-box {
+	width: 100%;
+	height: 60px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.main-out-box{
+	padding: 20px;
+	width: 100%;
+	height: 100%;
+}
+
+/* 图表常用样式 */
+.chart-out-box {
+	width: 100%;
+	height: 340px;
+	padding: 10px;
+}
+
+.chart-box1 {
+	width: 480px;
+	height: 380px;
+}
+.number-box{
+	width: 100%;
+	height: 33%;
+}

src/views/wmsManagement/components/TheWmBatchSearch/仓库数据总看板/index.vue

@@ -1,9 +1,97 @@
 <template>
-	<div>仓库数据总看板</div>
+	<div class="container main-background-color">
+		<dv-border-box-11 title="仓库数据总看板">
+			<div class="header-out-box">
+				<!-- <dv-decoration-1 style="width:200px;height:50px;" /> -->
+			</div>
+			<div class="main-out-box">
+				<!-- 第一层 -->
+				<el-row type="flex" justify="space-around">
+					<el-col :span="8">
+
+						<dv-border-box-13 class="chart-out-box">
+						</dv-border-box-13>
+					</el-col>
+					<el-col :span="8">
+						<dv-border-box-8 class="chart-out-box">
+							<dv-border-box-7>
+								<dv-border-box-10 class="number-box">dv-border-box-9</dv-border-box-10>
+								<dv-border-box-10 class="number-box">dv-border-box-9</dv-border-box-10>
+								<dv-border-box-10 class="number-box">dv-border-box-9</dv-border-box-10>
+							</dv-border-box-7>
+						</dv-border-box-8>
+					</el-col>
+					<el-col :span="8">
+						<dv-border-box-13 class="chart-out-box">
+						</dv-border-box-13>
+					</el-col>
+				</el-row>
+				<!-- 第二层 -->
+				<el-row type="flex" justify="space-around">
+					<el-col :span="8">
+						<dv-border-box-13 class="chart-out-box">
+
+						</dv-border-box-13>
+					</el-col>
+					<el-col :span="8">
+						<dv-border-box-13 class="chart-out-box">
+
+						</dv-border-box-13>
+					</el-col>
+					<el-col :span="8">
+						<dv-border-box-13 class="chart-out-box">
+
+						</dv-border-box-13>
+					</el-col>
+				</el-row>
+
+			</div>
+
+		</dv-border-box-11>
+
+		<!-- 		<dv-border-box-1 >
+			<v-charts class="chart-box1 border" :loading="loading1" :option="options1" />
+		</dv-border-box-1>
+		<dv-loading>Loading...</dv-loading> -->
+	</div>
 </template>
 
 <script>
+	export default {
+		name: 'PatchSearch1',
+		data() {
+			return {
+				loading1: false,
+				title: '看板标题',
+				options1: {
+					tooltip: {
+						trigger: 'axis',
+						axisPointer: {
+							type: 'shadow'
+						}
+					},
+					xAxis: {
+						type: 'category',
+						data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+					},
+					yAxis: {
+						type: 'value'
+					},
+					series: [{
+						data: [120, 200, 150, 80, 70, 110, 130],
+						type: 'bar'
+					}]
+
+				}
+			}
+		},
+		created() {},
+		methods: {
+
+		}
+	}
 </script>
 
-<style>
+<style scoped>
+	@import url("index.css");
 </style>