From 589dc7ed2381b21d3f8c5574e8d19fc183431e57 Mon Sep 17 00:00:00 2001
From: 懒羊羊 <15939171744@163.com>
Date: 星期五, 05 一月 2024 18:29:44 +0800
Subject: [PATCH] 优化
---
jcdm-ui/src/views/main/kb/stationTerminal/index1.vue | 228 +++++++++++++++++++++++++
jcdm-ui/src/views/main/kb/stationTerminal/index.vue | 275 ++++++++++++++++--------------
2 files changed, 375 insertions(+), 128 deletions(-)
diff --git a/jcdm-ui/src/views/main/kb/stationTerminal/index.vue b/jcdm-ui/src/views/main/kb/stationTerminal/index.vue
index 0ada208..773de03 100644
--- a/jcdm-ui/src/views/main/kb/stationTerminal/index.vue
+++ b/jcdm-ui/src/views/main/kb/stationTerminal/index.vue
@@ -1,107 +1,145 @@
<template>
<div class="app-container">
- <el-row :gutter="10">
- <el-col :xs="24" :sm="24" :md="12" :lg="24" >
- <el-card class="update-log" style="height: 70px">
- <el-form ref="elForm" :model="formData" size="small" label-width="80px" :inline="true">
+ <el-row :gutter="5">
+ <el-col :span="6">
+ <el-card shadow="hover">
+ 宸ヤ綅缂栧彿:OP1010
+ </el-card>
+ </el-col>
+ <el-col :span="6">
+ <el-card shadow="hover">
+ 宸ヤ綅鍚嶇О:璐存爣鏈�-璐寸爜
+ </el-card>
+ </el-col>
+ <el-col :span="6">
+ <el-card shadow="hover">
+ 鎬绘垚缂栫爜:1000000000000001
+ </el-card>
+ </el-col>
+ <el-col :span="6">
+ <el-card shadow="hover">
+ 榧犳爣鎮诞鏃舵樉绀�
+ </el-card>
+ </el-col>
+ </el-row>
+ <el-row :gutter="5" style="margin-top: 5px">
+ <el-col :span="6" >
+ <el-card class="bottom-card">
+ <div slot="header" class="clearfix">
+ <span>褰撳墠宸ヤ欢淇℃伅</span>
+ </div>
+ <el-descriptions :column="1" border>
+ <el-descriptions-item>
+ <template slot="label">
+ <i class="el-icon-user"></i>
+ <span>鎬绘垚缂栧彿</span>
+ </template>
+ kooriookami
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template slot="label">
+ <i class="el-icon-mobile-phone"></i>
+ 鎵嬫満鍙�
+ </template>
+ 18100000000
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template slot="label">
+ <i class="el-icon-location-outline"></i>
+ 灞呬綇鍦�
+ </template>
+ 鑻忓窞甯�
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template slot="label">
+ <i class="el-icon-tickets"></i>
+ 澶囨敞
+ </template>
+ <el-tag size="small">瀛︽牎</el-tag>
+ </el-descriptions-item>
+ <el-descriptions-item>
+ <template slot="label">
+ <i class="el-icon-office-building"></i>
+ 鑱旂郴鍦板潃
+ </template>
+ 姹熻嫃鐪佽嫃宸炲競鍚翠腑鍖哄惔涓ぇ閬� 1188 鍙�
+ </el-descriptions-item>
+ </el-descriptions>
+ <el-divider></el-divider>
+ <el-row>
+ <el-col :span="12">
+ <el-button class="circle-button" circle></el-button>
+ <span>OPC蹇冭烦</span>
+ </el-col>
+ <el-col :span="12">
+ <el-button class="circle-button" circle></el-button>
+ <span>鎵爜鏋姸鎬�</span>
+ </el-col>
+ </el-row>
+ <el-row style="margin-top: 20px">
+ <el-col :span="12">
+ <el-button class="circle-button" circle></el-button>
+ <span>宸ヤ欢鍒颁綅</span>
+ </el-col>
+ <el-col :span="12">
+ <el-button class="circle-button" circle></el-button>
+ <span>鎵爜瀹屾垚</span>
+ </el-col>
+ </el-row>
+ <el-row style="margin-top: 20px">
+ <el-col :span="12">
+ <el-button class="circle-button" circle></el-button>
+ <span>寮�濮嬩綔涓�</span>
+ </el-col>
+ <el-col :span="12">
+ <el-button class="circle-button" circle></el-button>
+ <span>鍏佽鏀捐</span>
+ </el-col>
+ </el-row>
+ </el-card>
- <el-form-item label="宸ヤ綅缂栧彿" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable>
- </el-input>
- </el-form-item>
- <el-form-item label="宸ヤ綅鍚嶇О" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
- </el-input>
- </el-form-item>
- <el-form-item label="鎬绘垚缂栫爜" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
- </el-input>
- </el-form-item>
-
- <el-form-item style="float: right">
- <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">宸ヤ綅璁剧疆</el-button>
- </el-form-item>
- </el-form>
- </el-card>
- </el-col>
- </el-row>
- <el-row :gutter="10">
- <el-col :xs="24" :sm="24" :md="12" :lg="6" >
- <el-card class="update-log" style="height: 600px">
- <div slot="header" class="clearfix" style="height: 12px">
- <span>褰撳墠宸ヤ欢淇℃伅 </span>
- </div>
- <div class="body">
- <el-form ref="elForm" :model="formData" size="medium" label-width="80px" >
-
- <el-form-item label="鎬绘垚缂栧彿" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable>
- </el-input>
- </el-form-item>
- <el-form-item label="宸ュ崟缂栧彿" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
- </el-input>
- </el-form-item>
- <el-form-item label="鐗╂枡缂栧彿" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
- </el-input>
- </el-form-item>
- <el-form-item label="浜у搧鍨嬪彿" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
- </el-input>
- </el-form-item>
- <el-form-item label="鍗曡鏂囨湰" prop="field101">
- <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
- </el-input>
- </el-form-item>
- <hr />
- </el-form>
- </div>
- <div>
-
- <button class="circle-btn"></button>11111
- <button class="circle-btn"></button>2222
-
- </div>
- </el-card>
- </el-col>
- <el-col :xs="24" :sm="24" :md="12" :lg="18">
- <el-tabs type="border-card" style="height: 600px">
- <el-tab-pane>
- <span slot="label"> <a class="el-icon-date"></a>棣栭〉</span>
- <el-empty >
- <span slot="description">鏆傛棤鏁版嵁</span>
- </el-empty>
- </el-tab-pane>
- <el-tab-pane>
- <span slot="label"> <b class="el-icon-date"></b>鐗╂枡BOM</span>
- <el-empty >
- <span slot="description">鏆傛棤鏁版嵁</span>
- </el-empty>
- </el-tab-pane>
- <el-tab-pane>
- <span slot="label"> <c class="el-icon-date"></c>閲囬泦娓呭崟</span>
- <el-empty >
- <span slot="description">鏆傛棤鏁版嵁</span>
- </el-empty>
- </el-tab-pane>
- <el-tab-pane>
- <span slot="label"> <d class="el-icon-date"></d>瀹夌伅鐘舵��</span>
- <el-empty >
- <span slot="description">鏆傛棤鏁版嵁</span>
- </el-empty>
- </el-tab-pane>
- <el-tab-pane>
- <span slot="label"> <e class="el-icon-date"></e>宸ヨ壓閰嶆柟</span>
- <el-empty >
- <span slot="description">鏆傛棤鏁版嵁</span>
- </el-empty>
- </el-tab-pane>
- </el-tabs>
- </el-col>
- </el-row>
-
-
+ </el-col>
+ <el-col :span="18">
+ <el-tabs type="border-card" style="height: 600px">
+ <el-tab-pane>
+ <span slot="label"> <a class="el-icon-date"></a>棣栭〉</span>
+ <el-col :span="8">
+ <el-table>
+ <el-table-column label="搴忓彿" align="center" prop="repairIdentification" width="60px"/>
+ <el-table-column label="鎿嶄綔鍐呭" align="center" prop="boxCode" width="320px"/>
+ </el-table>
+ </el-col>
+ <el-col :span="16">
+ <el-image style="height: 520px;width: 100%" :src="imgSrc"></el-image>
+ </el-col>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <b class="el-icon-date"></b>鐗╂枡BOM</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <c class="el-icon-date"></c>閲囬泦娓呭崟</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <d class="el-icon-date"></d>瀹夌伅鐘舵��</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <e class="el-icon-date"></e>宸ヨ壓閰嶆柟</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ </el-tabs>
+ </el-col>
+ </el-row>
</div>
@@ -112,16 +150,7 @@
props: [],
data() {
return {
- formData: {
- field101: undefined,
- },
- rules: {
- field101: [{
- required: true,
- message: '璇疯緭鍏ュ崟琛屾枃鏈�',
- trigger: 'blur'
- }],
- },
+ imgSrc: '',
}
},
computed: {},
@@ -132,23 +161,13 @@
}
</script>
-<style>
-hr {
- margin-top: 20px;
- margin-bottom: 20px;
- border: 0;
- border-top: 1px solid #eee;
+<style scoped>
+.bottom-card{
+ height: 600px;
}
-blockquote {
- padding: 10px 20px;
- margin: 0 0 20px;
- border-left: 5px solid #eee;
-}
-.circle-btn {
- border: none;
- width: 30px; /* 鏍规嵁闇�姹傝皟鏁存寜閽ぇ灏� */
- height: 30px;
- border-radius: 50%; /* 灏嗚竟妗嗗彉鎴愬渾瑙� */
- background-color: #e31116;
+.circle-button{
+ height: 40px;
+ width: 40px;
+ background-color: #ce0b0b;
}
</style>
diff --git a/jcdm-ui/src/views/main/kb/stationTerminal/index1.vue b/jcdm-ui/src/views/main/kb/stationTerminal/index1.vue
new file mode 100644
index 0000000..e5f706d
--- /dev/null
+++ b/jcdm-ui/src/views/main/kb/stationTerminal/index1.vue
@@ -0,0 +1,228 @@
+<template>
+ <div class="app-container">
+ <el-row :gutter="10">
+ <el-col :xs="24" :sm="24" :md="12" :lg="24" >
+ <el-card class="update-log" style="height: 70px">
+ <el-form ref="elForm" :model="formData" size="small" label-width="80px" :inline="true">
+
+ <el-form-item label="宸ヤ綅缂栧彿" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable>
+ </el-input>
+ </el-form-item>
+ <el-form-item label="宸ヤ綅鍚嶇О" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="鎬绘垚缂栫爜" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
+ </el-input>
+ </el-form-item>
+
+ <el-form-item style="float: right">
+ <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">宸ヤ綅璁剧疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
+ </el-col>
+ </el-row>
+ <el-row :gutter="10">
+ <el-col :xs="24" :sm="24" :md="12" :lg="6" >
+ <el-card class="update-log" style="height: 600px">
+ <div slot="header" class="clearfix" style="height: 12px">
+ <span>褰撳墠宸ヤ欢淇℃伅 </span>
+ </div>
+ <div class="body">
+ <el-form ref="elForm" :model="formData" size="medium" label-width="80px" >
+
+ <el-form-item label="鎬绘垚缂栧彿" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable>
+ </el-input>
+ </el-form-item>
+ <el-form-item label="宸ュ崟缂栧彿" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="鐗╂枡缂栧彿" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="浜у搧鍨嬪彿" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
+ </el-input>
+ </el-form-item>
+ <el-form-item label="鍗曡鏂囨湰" prop="field101">
+ <el-input v-model="formData.field101" placeholder="璇疯緭鍏ュ崟琛屾枃鏈�" clearable >
+ </el-input>
+ </el-form-item>
+ <hr />
+ </el-form>
+ </div>
+ <el-row>
+ <el-col :span="12">
+ <button class="circle-btn"></button>
+ <span class="relative">宸ヤ欢鍒颁綅</span>
+ </el-col>
+ <el-col :span="12">
+ <button class="circle-btn"></button>
+ <span class="relative">宸ヤ欢鍒颁綅</span>
+ </el-col>
+ </el-row>
+ <el-row style="margin-top: 20px">
+ <el-col :span="12">
+ <button class="circle-btn"></button>
+ <span class="relative">宸ヤ欢鍒颁綅</span>
+ </el-col>
+ <el-col :span="12">
+ <button class="circle-btn"></button>
+ <span class="relative">宸ヤ欢鍒颁綅</span>
+ </el-col>
+ </el-row>
+ <el-row style="margin-top: 20px">
+ <el-col :span="12">
+ <button class="circle-btn"></button>
+ <span class="relative">宸ヤ欢鍒颁綅</span>
+ </el-col>
+ <el-col :span="12">
+ <button class="circle-btn"></button>
+ <span class="relative">宸ヤ欢鍒颁綅</span>
+ </el-col>
+ </el-row>
+<!-- <el-row>-->
+<!-- <el-col :span="12">-->
+<!-- <el-button class="circle-button"></el-button>-->
+<!--<!– <span class="relative">宸ヤ欢鍒颁綅</span>–>-->
+<!-- </el-col>-->
+<!-- <el-col :span="12">-->
+<!-- <el-button circle style="background-color: #a95812;height: 50px;width: 50px"></el-button>-->
+<!-- <span class="relative">宸ヤ欢鍒颁綅</span>-->
+<!-- </el-col>-->
+<!-- </el-row>-->
+<!-- <el-row style="margin-top: 20px">-->
+<!-- <el-col :span="12">-->
+<!-- <button class="circle-btn"></button>-->
+<!-- <span class="relative">宸ヤ欢鍒颁綅</span>-->
+<!-- </el-col>-->
+<!-- <el-col :span="12">-->
+<!-- <button class="circle-btn"></button>-->
+<!-- <span class="relative">宸ヤ欢鍒颁綅</span>-->
+<!-- </el-col>-->
+<!-- </el-row>-->
+<!-- <el-row style="margin-top: 20px">-->
+<!-- <el-col :span="12">-->
+<!-- <button class="circle-btn"></button>-->
+<!-- <span class="relative">宸ヤ欢鍒颁綅</span>-->
+<!-- </el-col>-->
+<!-- <el-col :span="12">-->
+<!-- <button class="circle-btn"></button>-->
+<!-- <span class="relative">宸ヤ欢鍒颁綅</span>-->
+<!-- </el-col>-->
+<!-- </el-row>-->
+ </el-card>
+ </el-col>
+ <el-col :xs="24" :sm="24" :md="12" :lg="18">
+ <el-tabs type="border-card" style="height: 600px">
+ <el-tab-pane>
+ <span slot="label"> <a class="el-icon-date"></a>棣栭〉</span>
+ <el-col :xs="5" :sm="5" :md="5" :lg="9" >
+ <el-table v-loading="loading" >
+ <el-table-column label="搴忓彿" align="center" prop="repairIdentification" width="60px"/>
+ <el-table-column label="鎿嶄綔鍐呭" align="center" prop="boxCode" width="320px"/>
+ </el-table>
+ </el-col>
+ <el-col :xs="5" :sm="5" :md="5" :lg="15" >
+ <el-row style="height: 520px">
+ <el-image style="height: 100%;width: 100%" :src="src"></el-image>
+ </el-row>
+ </el-col>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <b class="el-icon-date"></b>鐗╂枡BOM</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <c class="el-icon-date"></c>閲囬泦娓呭崟</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <d class="el-icon-date"></d>瀹夌伅鐘舵��</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ <el-tab-pane>
+ <span slot="label"> <e class="el-icon-date"></e>宸ヨ壓閰嶆柟</span>
+ <el-empty >
+ <span slot="description">鏆傛棤鏁版嵁</span>
+ </el-empty>
+ </el-tab-pane>
+ </el-tabs>
+ </el-col>
+ </el-row>
+
+
+
+
+ </div>
+</template>
+<script>
+export default {
+ components: {},
+ props: [],
+ data() {
+ return {
+ formData: {
+ field101: undefined,
+ },
+ rules: {
+ field101: [{
+ required: true,
+ message: '璇疯緭鍏ュ崟琛屾枃鏈�',
+ trigger: 'blur'
+ }],
+ },
+ }
+ },
+ computed: {},
+ watch: {},
+ created() {},
+ mounted() {},
+ methods: {}
+}
+
+</script>
+<style>
+hr {
+ margin-top: 20px;
+ margin-bottom: 20px;
+ border: 0;
+ border-top: 1px solid #eee;
+}
+blockquote {
+ padding: 10px 20px;
+ margin: 0 0 20px;
+ border-left: 5px solid #eee;
+}
+.circle-btn {
+ border: none;
+ width: 30px; /* 鏍规嵁闇�姹傝皟鏁存寜閽ぇ灏� */
+ height: 30px;
+ border-radius: 50%; /* 灏嗚竟妗嗗彉鎴愬渾瑙� */
+ background-color: #e31116;
+}
+.relative{
+ position: relative;
+ left: 2px;
+ bottom: 7px;
+}
+.circle-button {
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ background-color: #e31116;
+
+}
+</style>
--
Gitblit v1.9.3