From 40eae1097035f908efee59518d0e6c2b2c9a5c2e Mon Sep 17 00:00:00 2001
From: luobisheng <727299681@qq.com>
Date: 星期五, 04 十一月 2022 15:42:25 +0800
Subject: [PATCH] Merge branch 'lbs'
---
src/views/operate/lawEnforcement/index.vue | 258 +++++++++++++++++++++++++++++++++------------------
1 files changed, 167 insertions(+), 91 deletions(-)
diff --git a/src/views/operate/lawEnforcement/index.vue b/src/views/operate/lawEnforcement/index.vue
index b3b7977..0ad9323 100644
--- a/src/views/operate/lawEnforcement/index.vue
+++ b/src/views/operate/lawEnforcement/index.vue
@@ -1,122 +1,198 @@
<template>
- <div class="law-enforcement">
- <!-- table琛ㄦ牸灞曠ず -->
- <MyTable :tableData="list" :tableOption="tableOption" :totalNum="totalNum" @getCurrentPage="getCurrentPage"
- @openDialog="changeDialog">
- <template #operation="{info}">
- <div class="btn">
- <!-- 鎿嶄綔鍖哄煙 -->
- <!-- {{getData(info)}} -->
- <span @click="dataView(info)">鏌ョ湅</span>
- </div>
- </template>
- </MyTable>
- <!-- 寮圭獥 -->
- <div class="dialog">
- <el-dialog v-if="visible" :visible.async="visible" title="闂鐧昏" width="60%" :before-close="handleClose">
- <MyView :viewData=showData />
- </el-dialog>
- </div>
+ <div class="user-list">
+ <header>
+ <div class="header-title">杩愯惀绠＄悊 >> 宸℃煡鎵ф硶</div>
+ </header>
+ <nav>
+ <el-tabs v-model="tabActiveName" @tab-click="tabChange">
+ <el-tab-pane label="缁熻鎶ヨ〃" name="first"></el-tab-pane>
+ <el-tab-pane label="鏁版嵁鍙嶆煡" name="second"></el-tab-pane>
+ </el-tabs>
+ </nav>
+ <main>
+ <div>
+ <el-radio v-model="searchModel" label="document">褰掓。鏌ヨ</el-radio>
+ <el-radio v-model="searchModel" label="timely">瀹炴椂鏌ヨ</el-radio>
+ <label for="searchInput">
+ <span slot="prepend">缁熻绫诲瀷锛�</span>
+ <el-input style="width: 200px" v-model="statisticalType" id="searchInput" placeholder="宸℃煡闃熷憳缁熻"></el-input>
+ </label>
+ </div>
+ <div class="search">
+ <label for="inputDate">
+ <span slot="prepend">鎸夊勾鏈堟煡璇細</span>
+ <el-input style="width: 200px" v-model="year" id="inputDate" placeholder="宸℃煡闃熷憳缁熻"></el-input>
+ <span slot="append"> 骞�</span>
+ </label>
+ <span class="month-tag" :class="{ 'month-selected': item.selected }" v-for="item in monthList" :key="item.value" @click="selecteMonth(item)" >
+ {{ item.text }}
+ <span v-if="item.selected" style="font-size: 12px">鈭�</span>
+ </span>
+ <el-button type="primary" @click="search()">鎼滅储</el-button>
+ <el-button type="primary" @click="reset()">閲嶇疆</el-button>
+ </div>
+ <el-table :data="tableData"
+ style="width: 100%"
+ :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}">
+ <el-table-column
+ v-for="{prop, label} in tableColumnData"
+ :key="prop"
+ :prop="prop"
+ :label="label"
+ ></el-table-column>
+ </el-table>
+ </main>
</div>
</template>
<script>
-import MyTable from '@/components/Table'
-import MyView from './components/dataView'
+import MyView from './components/dataView';
+
export default {
components: {
- MyTable, MyView
+ MyView
},
data() {
return {
- list: [
+ searchModel: '',
+ statisticalType: '',
+ year: '',
+ activeName: '',
+ tabActiveName: '',
+ monthList: [
{
- name: '寮犱笁',
- sex: '鐢�',
- age: '23',
- 'min-width': '10',
+ text: '1鏈�',
+ value: 1,
+ selected: false
},
{
- name: '寮犲洓',
- sex: '鐢�',
- age: '23',
- 'min-width': '10',
+ text: '2鏈�',
+ value: 2,
+ selected: false
},
{
- name: '涓稿皬鍎�',
- sex: '濂�',
- age: '11',
- 'min-width': '10',
+ text: '3鏈�',
+ value: 3,
+ selected: false
},
+ {
+ text: '4鏈�',
+ value: 4,
+ selected: false
+ },
+ {
+ text: '5鏈�',
+ value: 5,
+ selected: false
+ },
+ {
+ text: '6鏈�',
+ value: 6,
+ selected: false
+ },
+ {
+ text: '7鏈�',
+ value: 7,
+ selected: false
+ },
+ {
+ text: '8鏈�',
+ value: 8,
+ selected: false
+ },
+ {
+ text: '9鏈�',
+ value: 9,
+ selected: false
+ },
+ {
+ text: '10鏈�',
+ value: 10,
+ selected: false
+ },
+ {
+ text: '11鏈�',
+ value: 11,
+ selected: false
+ },
+ {
+ text: '12鏈�',
+ value: 12,
+ selected: false
+ }
],
- tableOption: {
- group: [
- {
- label: '濮撳悕',
- type: 'text',
- prop: 'name',
- },
- {
- label: '骞撮緞',
- type: 'text',
- prop: 'age',
- },
- {
- label: '鎬у埆',
- type: 'text',
- prop: 'sex',
- },
- {
- label: '鎿嶄綔',
- type: 'operation',
- prop: 'operation',
- children: [
- {
- operationName: '鏌ョ湅',
- mykey: 'look',
- },
- {
- operationName: '淇敼',
- mykey: 'update',
- }
- ]
- },
- ]
- },
- visible: false,
- totalNum: '',
- showData: {},
+ tableData: [],
+ tableColumnData: [
+ {
+ prop: 'name',
+ label: '宸℃煡浜哄憳',
+ },
+ {
+ prop: 'count',
+ label: '宸℃煡娆℃暟',
+ },
+ {
+ prop: 'warnCount',
+ label: '璀﹀憡鏁�',
+ },
+ {
+ prop: 'punishCount',
+ label: '澶勭綒鏁�',
+ },
+ {
+ prop: 'finishCount',
+ label: '浜ゅ姙瀹屾垚鏁�',
+ },
+ {
+ prop: 'unfinishedCount',
+ label: '浜ゅ姙鏈畬鎴愭暟',
+ }
+ ]
}
},
created() {
- this.totalNum = this.list.length;
},
methods: {
- // 鍏抽棴瀵硅瘽妗�
- handleClose(done) {
- this.$confirm('纭鍏抽棴锛�')
- .then(_ => {
- this.visible = false;
- done();
- })
- .catch(_ => { });
+ search() {
+ console.log('search');
},
- // 鑾峰彇鎿嶄綔缁撴灉
- changeDialog({ index, mykey }) {
- console.log(index, mykey);
- this.showData = this.list[index];
- this.visible = true;
+
+ reset() {
+ this.year = '';
+ this.searchModel = '';
+ this.statisticalType = '';
+ this.monthList.forEach(item => item.selected = false);
},
- // 鏁版嵁灞曠ず
- dataView(data) {
- console.log(data);
+
+ selecteMonth(item) {
+ item.selected = !item.selected;
},
- // 鑾峰彇褰撳墠椤垫暟鎹�
- getCurrentPage(current) {
- console.log(current);
+
+ tabChange() {
+
}
}
}
</script>
<style lang="scss" scoped>
+.user-list {
+ text-align: left;
+ margin: 10px 20px;
+ color: #4b9bb7;
+
+ .header-title {
+ line-height: 40px;
+ }
+ .month-tag {
+ margin: 5px;
+ padding: 5px;
+ border: 1px solid gray;
+ border-radius: 10%;
+ text-align: center;
+ }
+
+ .month-selected {
+ border: 1px solid #409EFF;
+ }
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0