From 28243550e53fcdf0d8dc4d0dd20f8b35acb4f6ba Mon Sep 17 00:00:00 2001
From: XiaoRuby <3114200645@qq.com>
Date: 星期一, 14 八月 2023 17:22:42 +0800
Subject: [PATCH] 8-14-计量模块
---
src/components/view/measurementManagement.vue | 305 ++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 301 insertions(+), 4 deletions(-)
diff --git a/src/components/view/measurementManagement.vue b/src/components/view/measurementManagement.vue
index 517b179..d3d7291 100644
--- a/src/components/view/measurementManagement.vue
+++ b/src/components/view/measurementManagement.vue
@@ -3,22 +3,319 @@
<el-row>
<el-col :span="12" class="top_left_name">璁￠噺绠＄悊</el-col>
<el-col :span="12" style="text-align: right;">
- <el-button size="mini" icon="el-icon-plus" style="color: #000;"
+ <el-button
+ v-show="radio1 == 2"
+ @click="routingJump()"
+ type="primary"
+ size="mini"
+ icon="el-icon-plus"
+ style="background: #004EA2; "
+ >鏂板</el-button
+ >
+ <el-button size="mini"
+ ><i class="font icon-xiazaidaoru" style="padding-right: 3px;"></i
>瀵煎嚭</el-button
>
</el-col>
</el-row>
+ <div class="top_div">
+ <div class="table_top_div">
+ <span>璁￠噺缂栧彿锛�</span>
+ <el-select
+ class="table_top_input"
+ size="small"
+ v-model="value"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ <span>浠櫒璁惧鍚嶇О锛�</span>
+ <el-select
+ class="table_top_input"
+ size="small"
+ v-model="value"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ <span>璁￠噺鍗曚綅锛�</span>
+ <el-select
+ class="table_top_input"
+ size="small"
+ v-model="value"
+ placeholder="璇烽�夋嫨"
+ >
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ >
+ </el-option>
+ </el-select>
+ <el-button size="mini" @click="reset"><span>閲� 缃�</span></el-button>
+ <el-button
+ size="mini"
+ type="primary"
+ @click="selectSearch"
+ style="background: #004EA2;"
+ ><span>鏌� 璇�</span></el-button
+ >
+ </div>
+ </div>
+ <div class="middle_div">
+ <div class="middle_top_div">
+ <el-radio-group class="ai-tab-change" v-model="radio1">
+ <el-radio-button size="small" label="1">
+ <div class="el_radio_button_div">璁￠噺鍙拌处</div>
+ </el-radio-button>
+ <el-radio-button size="small" label="2">
+ <div class="el_radio_button_div">璁￠噺璁″垝</div>
+ </el-radio-button>
+ </el-radio-group>
+ </div>
+ <div class="middle_middle_div">
+ <el-table
+ v-show="radio1 == 1"
+ ref="multipleTable"
+ :data="tableData"
+ border
+ tooltip-effect="dark"
+ class="middle_middle_table"
+ height="calc(100vh - 325px)"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55"> </el-table-column>
+ <el-table-column label="鏃ユ湡" width="120">
+ <template slot-scope="scope">{{ scope.row.date }}</template>
+ </el-table-column>
+ <el-table-column prop="name" label="濮撳悕" width="120">
+ </el-table-column>
+ <el-table-column prop="address" label="鍦板潃" show-overflow-tooltip>
+ </el-table-column>
+ </el-table>
+ <el-table
+ v-show="radio1 == 2"
+ ref="multipleTable"
+ :data="tableData"
+ border
+ tooltip-effect="dark"
+ class="middle_middle_table"
+ height="calc(100vh - 325px)"
+ @selection-change="handleSelectionChange"
+ >
+ <el-table-column type="selection" width="55"> </el-table-column>
+ <el-table-column label="鏃ユ湡" width="120">
+ <template slot-scope="scope">{{ scope.row.date }}</template>
+ </el-table-column>
+ <el-table-column prop="name" label="濮撳悕" width="120">
+ </el-table-column>
+ <el-table-column prop="address" label="鍦板潃" show-overflow-tooltip>
+ </el-table-column>
+ <el-table-column prop="address" label="鍦板潃" show-overflow-tooltip>
+ </el-table-column>
+ </el-table>
+ </div>
+ <div class="middle_under_div">
+ <el-pagination
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ :current-page="currentPage4"
+ :page-sizes="[12, 20, 30, 40]"
+ :pager-count="9"
+ :page-size="12"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="400"
+ >
+ </el-pagination>
+ </div>
+ </div>
</div>
</template>
<script>
+import zhLocale from "element-ui/lib/locale/lang/zh-CN";
+
+// 鐒跺悗灏唀lement-ui涓璸agination閫夐」鏀规帀
+zhLocale.el.pagination = {
+ pagesize: "鏉�/椤�",
+ total: `鍏辨湁 {total} 鏉,
+ goto: "璺宠嚦",
+ pageClassifier: "椤�"
+};
+
export default {
- name: "measurementManagement"
+ name: "measurementManagement",
+ data() {
+ return {
+ radio1: 1, // 鍒嗙被鍒囨崲
+ currentPage4: 4,
+ value: "",
+ options: [
+ {
+ value: "閫夐」1",
+ label: "榛勯噾绯�"
+ },
+ {
+ value: "閫夐」2",
+ label: "鍙岀毊濂�"
+ },
+ {
+ value: "閫夐」3",
+ label: "铓典粩鐓�"
+ },
+ {
+ value: "閫夐」4",
+ label: "榫欓』闈�"
+ },
+ {
+ value: "閫夐」5",
+ label: "鍖椾含鐑ら腑"
+ }
+ ],
+ tableData: [
+ {
+ date: "2016-05-03",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-02",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-04",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-01",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-08",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-06",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-07",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-07",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-07",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-07",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-07",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ },
+ {
+ date: "2016-05-07",
+ name: "鐜嬪皬铏�",
+ address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�"
+ }
+ ]
+ };
+ },
+ methods: {
+ handleSizeChange(val) {
+ console.log(`姣忛〉 ${val} 鏉);
+ },
+ handleCurrentChange(val) {
+ console.log(`褰撳墠椤�: ${val}`);
+ },
+ routingJump() {
+ this.$router.push("/measure/manage");
+ }
+ }
};
</script>
<style>
-.div_acb {
- color: #000000;
+.top_div {
+ width: 100%;
+ height: 70px;
+ background-color: #ffffff;
+ margin: 5px 0;
+}
+.middle_div {
+ width: 100%;
+ height: calc(100vh - 225px);
+ background-color: #ffffff;
+}
+.middle_top_div {
+ width: 100%;
+ height: 60px;
+}
+.ai-tab-change {
+ padding: 14px 0 15px 15px;
+}
+.middle_middle_div {
+ width: 100%;
+ height: calc(100vh - 325px);
+ margin-top: 5px;
+}
+.middle_middle_table {
+ width: 98%;
+ margin: 0 15px;
+}
+.middle_under_div {
+ width: 99%;
+ height: 30px;
+ margin-top: 5px;
+ text-align: right;
+}
+.table_top_input {
+ width: 13%;
+ margin-right: 24px;
+}
+.table_top_div {
+ margin-left: 20px;
+ padding: 20px 0;
+}
+.table_top_div span {
+ font-size: 15px;
+}
+.el-radio-button__inner {
+ border: 1px solid #ececed;
+ line-height: 14px;
+}
+.el-radio-button__orig-radio:checked + .el-radio-button__inner {
+ background: #fdfdfe;
+ border: 1px solid #2661a0;
+ color: #2661a0;
+ line-height: 14px;
}
</style>
--
Gitblit v1.9.3