11d1466c by weimo934

feat(综合查询):对接接口,修改分页重置功能

1 parent 84eab6b2
...@@ -3,60 +3,60 @@ ...@@ -3,60 +3,60 @@
3 <el-col :span="18"> 3 <el-col :span="18">
4 <el-row> 4 <el-row>
5 <el-col :span="22"> 5 <el-col :span="22">
6 <el-form :inline="true" :model="formData" class="demo-form-inline"> 6 <el-form :inline="true" class="demo-form-inline">
7 <el-form-item label="宗地编码:"> 7 <el-form-item label="宗地编码:">
8 <el-input v-model="formData.zdbm" placeholder="输入宗地编码"></el-input> 8 <el-input v-model="queryData.zddm" placeholder="输入宗地编码"></el-input>
9 </el-form-item> 9 </el-form-item>
10 <el-form-item label="坐落:"> 10 <el-form-item label="坐落:">
11 <el-input v-model="formData.zl" placeholder="输入坐落地址"></el-input> 11 <el-input v-model="queryData.zl" placeholder="输入坐落地址"></el-input>
12 </el-form-item> 12 </el-form-item>
13 </el-form> 13 </el-form>
14 </el-col> 14 </el-col>
15 <el-col :span="2"> 15 <el-col :span="2">
16 <el-button type="primary" @click="onSubmit">查询</el-button> 16 <el-button type="primary" @click="query">查询</el-button>
17 </el-col> 17 </el-col>
18 </el-row> 18 </el-row>
19 <el-row> 19 <el-row>
20 <el-col :span="22"> 20 <el-col :span="22">
21 <el-form :inline="true" :model="formData" class="demo-form-inline"> 21 <el-form :inline="true" :model="queryData" class="demo-form-inline">
22 <el-form-item label="不动产单元号:"> 22 <el-form-item label="不动产单元号:">
23 <el-input 23 <el-input
24 v-model="formData.bdcdyh" 24 v-model="queryData.bdcdyh"
25 placeholder="输入不动产单元号" 25 placeholder="输入不动产单元号"
26 ></el-input> 26 ></el-input>
27 </el-form-item> 27 </el-form-item>
28 <el-form-item class="demo-form-inline" label="单元类型:"> 28 <el-form-item class="demo-form-inline" label="单元类型:">
29 <el-checkbox-group v-model="formData.type"> 29 <el-checkbox-group v-model="queryData.dylxs">
30 <el-checkbox label="宗地" name="type"></el-checkbox> 30 <el-checkbox label="zd" name="type">宗地</el-checkbox>
31 <el-checkbox label="自然幢" name="type"></el-checkbox> 31 <el-checkbox label="zrz" name="type">自然幢</el-checkbox>
32 <el-checkbox label="户" name="type"></el-checkbox> 32 <el-checkbox label="h" name="type"></el-checkbox>
33 <el-checkbox label="构筑物" name="type"></el-checkbox> 33 <el-checkbox label="gzw" name="type">构筑物</el-checkbox>
34 <el-checkbox label="林权" name="type"></el-checkbox> 34 <el-checkbox label="lq" name="type">林权</el-checkbox>
35 <el-checkbox label="宗海" name="type"></el-checkbox> 35 <el-checkbox label="zh" name="type">宗海</el-checkbox>
36 </el-checkbox-group> 36 </el-checkbox-group>
37 </el-form-item> 37 </el-form-item>
38 </el-form> 38 </el-form>
39 </el-col> 39 </el-col>
40 <el-col :span="2"> 40 <el-col :span="2">
41 <el-button type="warning" @click="onSubmit">重置</el-button> 41 <el-button type="warning" @click="reset">重置</el-button>
42 </el-col> 42 </el-col>
43 </el-row> 43 </el-row>
44 <el-row> 44 <el-row>
45 <el-col :span="22" v-show="ismore"> 45 <el-col :span="22" v-show="ismore">
46 <el-form :inline="true" :model="formData" class="demo-form-inline"> 46 <el-form :inline="true" class="demo-form-inline">
47 <el-form-item label="权利人名称:"> 47 <el-form-item label="权利人名称:">
48 <el-input placeholder="输入权利人名称"></el-input> 48 <el-input placeholder="输入权利人名称" v-model="queryData.qlrmc"></el-input>
49 </el-form-item> 49 </el-form-item>
50 <el-form-item label="项目名称:"> 50 <el-form-item label="项目名称:">
51 <el-input placeholder="输入项目名称"></el-input> 51 <el-input placeholder="输入项目名称" v-model="queryData.xmmc"></el-input>
52 </el-form-item> 52 </el-form-item>
53 <el-form-item label="不动产权证号:"> 53 <el-form-item label="不动产权证号:">
54 <el-input placeholder="输入不动产权证号"></el-input> 54 <el-input placeholder="输入不动产权证号" v-model="queryData.bdcqzh"></el-input>
55 </el-form-item> 55 </el-form-item>
56 </el-form> 56 </el-form>
57 </el-col> 57 </el-col>
58 <el-col :span="2" :offset="offset"> 58 <el-col :span="2" :offset="offset">
59 <el-button type="primary" class="moreSearchBtn" @click="more">更多查询 59 <el-button type="primary" class="moreSearchBtn" @click="ismore=!ismore">更多查询
60 </el-button> 60 </el-button>
61 </el-col> 61 </el-col>
62 </el-row> 62 </el-row>
...@@ -74,12 +74,16 @@ ...@@ -74,12 +74,16 @@
74 return { 74 return {
75 offset: 22, 75 offset: 22,
76 ismore: false, 76 ismore: false,
77 formData: { 77 queryData: {
78 zdbm: "",
79 zl: "",
80 bdcdyh: "", 78 bdcdyh: "",
81 type: [], 79 bdcqzh: "",
82 }, 80 dylxs: [],
81 qlrmc: "",
82 qszt: "",
83 xmmc: "",
84 zddm: "",
85 zl: ""
86 }
83 }; 87 };
84 }, 88 },
85 created() { 89 created() {
...@@ -96,21 +100,37 @@ ...@@ -96,21 +100,37 @@
96 mounted() { 100 mounted() {
97 }, 101 },
98 methods: { 102 methods: {
99 more() { 103 reset() {
100 this.ismore = !this.ismore 104 this.queryData = {
101 if (this.ismore){ 105 bdcdyh: "",
102 this.offset=0 106 bdcqzh: "",
103 } else { 107 dylxs: [],
104 this.offset=22 108 qlrmc: "",
105 } 109 qszt: "",
110 xmmc: "",
111 zddm: "",
112 zl: ""
113 };
114 this.query()
106 }, 115 },
107 onSubmit() { 116 query() {
108 //子组件点击查询时将表单数据发送给父组件 117 //子组件点击查询时将表单数据发送给父组件
109 this.$emit("getSearchCondition", this.formData); 118 this.$emit("getSearchCondition", this.queryData);
110 }, 119 },
111 }, 120 },
112 computed: {}, 121 computed: {},
113 watch: {}, 122 watch: {
123 "ismore": function (val) {
124 if (val) {
125 this.offset = 0
126 } else {
127 this.offset = 22
128 this.queryData.qlrmc = "";
129 this.queryData.xmmc = "";
130 this.queryData.bdcqzh = "";
131 }
132 }
133 },
114 }; 134 };
115 </script> 135 </script>
116 <style scoped lang="less"> 136 <style scoped lang="less">
......
1 <template> 1 <template>
2 <div class="main"> 2 <div class="main">
3 <SearchHead @getSearchCondition="getData"></SearchHead> 3 <SearchHead @getSearchCondition="getData"></SearchHead>
4 <div class="dataGrid" ref="dataGrid"> 4 <div class="dataGrid" ref="dataGrid">
5 <el-table 5 <el-table
6 :data="tableData" 6 :data="tableData"
7 :height="tableHeight" 7 :height="tableHeight"
8 :row-class-name="tableRowClassName" 8 :row-class-name="tableRowClassName"
9 > 9 >
10 <el-table-column type="index" width="80" align="center" label="序号"> 10 <el-table-column type="index" width="80" align="center" label="序号">
11 </el-table-column> 11 </el-table-column>
12 <el-table-column label="操作" width="100"> 12 <el-table-column label="操作" width="100">
13 <template slot-scope="scope"> 13 <template slot-scope="scope">
14 <el-button @click="handleClick(scope.row)" type="text" size="small" 14 <el-button @click="handleClick(scope.row)" type="text" size="small"
15 >办理</el-button 15 >办理
16 > 16 </el-button
17 <el-button type="text" size="small">定位</el-button> 17 >
18 </template> 18 <el-button type="text" size="small">定位</el-button>
19 </el-table-column> 19 </template>
20 <el-table-column prop="bdcdyh" align="left" label="不动产单元号"> 20 </el-table-column>
21 </el-table-column> 21 <el-table-column prop="bdcdyh" align="left" label="不动产单元号">
22 <el-table-column prop="xmmc" align="left" width="150" label="项目名称"> 22 </el-table-column>
23 </el-table-column> 23 <el-table-column prop="xmmc" align="left" width="150" label="项目名称">
24 <el-table-column prop="bdcqzh" align="left" label="不动产权证号"> 24 </el-table-column>
25 </el-table-column> 25 <el-table-column prop="bdcqzh" align="left" label="不动产权证号">
26 <el-table-column prop="lx" align="left" width="120" label="类型"> 26 </el-table-column>
27 </el-table-column> 27 <el-table-column prop="lx" align="left" width="120" label="类型">
28 <el-table-column prop="qlr" align="left" width="120" label="权利人"> 28 </el-table-column>
29 </el-table-column> 29 <el-table-column prop="qlr" align="left" width="120" label="权利人">
30 <el-table-column prop="zl" align="left" label="坐落"> </el-table-column> 30 </el-table-column>
31 <el-table-column prop="zrsj" align="left" width="120" label="转入时间"> 31 <el-table-column prop="zl" align="left" label="坐落"></el-table-column>
32 </el-table-column> 32 <el-table-column prop="zrsj" align="left" width="120" label="转入时间">
33 <el-table-column prop="cjr" align="left" width="120" label="创建人"> 33 </el-table-column>
34 </el-table-column> 34 <el-table-column prop="cjr" align="left" width="120" label="创建人">
35 </el-table> 35 </el-table-column>
36 <div class="pagination"> 36 </el-table>
37 <el-pagination background layout="prev, pager, next" :total="1000"> 37 <div class="pagination">
38 </el-pagination> 38 <el-pagination background layout="prev, pager, next" :total="1000">
39 </div> 39 </el-pagination>
40 </div> 40 </div>
41 </div> 41 </div>
42 </div>
42 </template> 43 </template>
43 44
44 <script> 45 <script>
45 import SearchHead from "../../../components/searchHead/searchHead"; 46 import SearchHead from "../../../components/searchHead/searchHead";
46 export default {
47 name: "",
48 components: { SearchHead },
49 props: {},
50 data() {
51 return {
52 formData: {
53 user: "",
54 region: "",
55 type: [],
56 },
57 tableData: [
58 {
59 bdcdyh: "610101001001GB00001W",
60 xmmc: "万科集团万科城",
61 bdcqzh: "陕(2017)西安市不动产权第00000",
62 lx: "宗地",
63 qlr: "李子新",
64 zl: "灞桥-田家湾-咸宁东路,近浐河西路",
65 zrsj: "2020.09.07 ",
66 cjr: "李子新",
67 },
68 ],
69 tableHeight: "",
70 };
71 },
72 created() {},
73 mounted() {
74 for (let i = 0; i < 11; i++) {
75 let obj = {
76 bdcdyh: "610101001001GB00001W",
77 xmmc: "万科集团万科城",
78 bdcqzh: "陕(2017)西安市不动产权第00000",
79 lx: "自然幢",
80 qlr: "李子新",
81 zl: "灞桥-田家湾-咸宁东路,近浐河西路",
82 zrsj: "2020.09.07 ",
83 cjr: "李子新",
84 };
85 this.tableData.push(obj);
86 }
87 this.tableHeight = this.$refs.dataGrid.offsetHeight - 68;
88 },
89 methods: {
90 onSubmit() {},
91 tableRowClassName({ row, rowIndex }) {
92 if (rowIndex % 2 !== 0) {
93 return "even-row";
94 } else {
95 return "";
96 }
97 },
98 47
99 //获取子组件点击查询触发的事件 48 export default {
100 getData(obj) { 49 name: "",
101 console.log(obj); 50 components: {SearchHead},
102 //将obj作为参数调用接口查询表格数据 51 props: {},
103 }, 52 data() {
104 //点击办理 53 return {
105 handleClick(row) { 54 formData: {
106 let path = ""; 55 user: "",
107 switch (row.lx) { 56 region: "",
108 case "自然幢": 57 type: [],
109 path = "/zrz"; 58 },
110 break; 59 tableData: [
111 case "宗地": 60 {
112 path = "/zd"; 61 bdcdyh: "610101001001GB00001W",
113 break; 62 xmmc: "万科集团万科城",
114 default: 63 bdcqzh: "陕(2017)西安市不动产权第00000",
115 break; 64 lx: "宗地",
116 } 65 qlr: "李子新",
117 this.$router.push(path); 66 zl: "灞桥-田家湾-咸宁东路,近浐河西路",
118 }, 67 zrsj: "2020.09.07 ",
119 }, 68 cjr: "李子新",
120 computed: {}, 69 },
121 watch: {}, 70 ],
122 }; 71 tableHeight: "",
72 };
73 },
74 created() {
75 },
76 mounted() {
77 for (let i = 0; i < 11; i++) {
78 let obj = {
79 bdcdyh: "610101001001GB00001W",
80 xmmc: "万科集团万科城",
81 bdcqzh: "陕(2017)西安市不动产权第00000",
82 lx: "自然幢",
83 qlr: "李子新",
84 zl: "灞桥-田家湾-咸宁东路,近浐河西路",
85 zrsj: "2020.09.07 ",
86 cjr: "李子新",
87 };
88 this.tableData.push(obj);
89 }
90 this.tableHeight = this.$refs.dataGrid.offsetHeight - 68;
91 },
92 methods: {
93 onSubmit() {
94 },
95 tableRowClassName({row, rowIndex}) {
96 if (rowIndex % 2 !== 0) {
97 return "even-row";
98 } else {
99 return "";
100 }
101 },
102
103 //获取子组件点击查询触发的事件
104 getData(obj) {
105 console.log(obj);
106 },
107 //点击办理
108 handleClick(row) {
109 let path = "";
110 switch (row.lx) {
111 case "自然幢":
112 path = "/zrz";
113 break;
114 case "宗地":
115 path = "/zd";
116 break;
117 default:
118 break;
119 }
120 this.$router.push(path);
121 },
122 },
123 computed: {},
124 watch: {},
125 };
123 </script> 126 </script>
124 <style scoped lang="less"> 127 <style scoped lang="less">
125 .main { 128 .main {
126 width: 100%; 129 width: 100%;
127 height: 100%; 130 height: 100%;
128 box-sizing: border-box; 131 box-sizing: border-box;
129 padding: 0 18px; 132 padding: 0 18px;
130 display: flex; 133 display: flex;
131 flex-direction: column; 134 flex-direction: column;
132 background-color: #fcfdff; 135 background-color: #fcfdff;
133 .demo-form-inline { 136 .demo-form-inline {
134 margin-top: 18px; 137 margin-top: 18px;
135 .moreSearchBtn { 138 .moreSearchBtn {
136 background-color: #1ad6e1; 139 background-color: #1ad6e1;
137 border-color: #1ad6e1; 140 border-color: #1ad6e1;
138 } 141 }
139 .moreSearchBtn:focus, 142 .moreSearchBtn:focus,
140 .moreSearchBtn:hover { 143 .moreSearchBtn:hover {
141 background-color: rgba(28, 200, 229, 0.6); 144 background-color: rgba(28, 200, 229, 0.6);
142 } 145 }
143 } 146 }
144 .dataGrid { 147 .dataGrid {
145 flex: 1; 148 flex: 1;
146 .pagination { 149 margin-top: 20px;
147 padding: 18px 0; 150 .pagination {
148 } 151 padding: 18px 0;
149 } 152 }
150 } 153 }
154 }
151 </style> 155 </style>
......
1 <template> 1 <template>
2 <div class="main"> 2 <div class="main">
3 <SearchHead @getSearchCondition="getData"></SearchHead> 3 <SearchHead @getSearchCondition="getData"></SearchHead>
4 <div class="dataGrid" ref="dataGrid"> 4 <div class="dataGrid" ref="dataGrid">
5 <el-table 5 <el-table
6 :data="tableData" 6 :data="tableData"
7 :height="tableHeight" 7 :height="tableHeight"
8 :row-class-name="tableRowClassName" 8 :row-class-name="tableRowClassName"
9 > 9 >
10 <el-table-column type="index" width="80" align="center" label="序号"> 10 <el-table-column type="index" width="80" align="center" label="序号">
11 </el-table-column> 11 </el-table-column>
12 <el-table-column label="操作" width="100"> 12 <el-table-column label="操作" width="100">
13 <template slot-scope="scope"> 13 <template slot-scope="scope">
14 <el-button @click="handleClick(scope.row)" type="text" size="small" 14 <el-button @click="handleClick(scope.row)" type="text" size="small"
15 >办理</el-button 15 >办理
16 > 16 </el-button
17 <el-button type="text" size="small">定位</el-button> 17 >
18 </template> 18 <el-button type="text" size="small">定位</el-button>
19 </el-table-column> 19 </template>
20 <el-table-column prop="bdcdyh" align="left" label="不动产单元号"> 20 </el-table-column>
21 </el-table-column> 21 <el-table-column prop="bdcdyh" align="left" label="不动产单元号">
22 <el-table-column prop="xmmc" align="left" width="150" label="项目名称"> 22 </el-table-column>
23 </el-table-column> 23 <el-table-column prop="xmmc" align="left" width="150" label="项目名称">
24 <el-table-column prop="bdcqzh" align="left" label="不动产权证号"> 24 </el-table-column>
25 </el-table-column> 25 <el-table-column prop="bdcqzh" align="left" label="不动产权证号">
26 <el-table-column prop="lx" align="left" width="120" label="类型"> 26 </el-table-column>
27 </el-table-column> 27 <el-table-column prop="lx" align="left" width="120" label="类型">
28 <el-table-column prop="qlr" align="left" width="120" label="权利人"> 28 </el-table-column>
29 </el-table-column> 29 <el-table-column prop="qlr" align="left" width="120" label="权利人">
30 <el-table-column prop="zl" align="left" label="坐落"> </el-table-column> 30 </el-table-column>
31 <el-table-column prop="zrsj" align="left" width="120" label="转入时间"> 31 <el-table-column prop="zl" align="left" label="坐落"></el-table-column>
32 </el-table-column> 32 <el-table-column prop="zrsj" align="left" width="120" label="转入时间">
33 <el-table-column prop="cjr" align="left" width="120" label="创建人"> 33 </el-table-column>
34 </el-table-column> 34 <el-table-column prop="cjr" align="left" width="120" label="创建人">
35 </el-table> 35 </el-table-column>
36 <div class="pagination"> 36 </el-table>
37 <el-pagination background layout="prev, pager, next" :total="1000" 37 <div class="pagination">
38 @current-change="handleCurrentChange" 38 <el-pagination background layout="prev, pager, next" :total="total"
39 :current-page.sync="currentPage"> 39 @current-change="handleCurrentChange"
40 </el-pagination> 40 :current-page.sync="currentPage">
41 </div> 41 </el-pagination>
42 </div> 42 </div>
43 </div> 43 </div>
44 </div>
44 </template> 45 </template>
45 46
46 <script> 47 <script>
47 import SearchHead from "../../../components/searchHead/searchHead"; 48 import SearchHead from "../../../components/searchHead/searchHead";
48 import {getSearchList} from "../../../api/search"; 49 import {getSearchList} from "../../../api/search";
49 export default { 50
50 name: "", 51 export default {
51 components: { SearchHead }, 52 name: "",
52 props: {}, 53 components: {SearchHead},
53 data() { 54 props: {},
54 return { 55 data() {
55 pageNo:1, 56 return {
56 pageSize:10, 57 total:0,
57 zddm:'', 58 pageNo: 1,
58 zl:'', 59 pageSize: 10,
59 bdcdyh:'', 60 tableData: [],
60 dylx:'', 61 tableHeight: "",
61 qlrmc:'', 62 };
62 xmmc:'', 63 },
63 bdcqzh:'', 64 created() {
64 formData: { 65 },
65 user: "", 66 mounted() {
66 region: "", 67 this.getData({})
67 type: [], 68 this.tableHeight = this.$refs.dataGrid.offsetHeight - 68;
68 }, 69 },
69 tableData: [], 70 methods: {
70 tableHeight: "", 71 onSubmit() {
71 }; 72 },
72 }, 73 tableRowClassName({row, rowIndex}) {
73 created() {}, 74 if (rowIndex % 2 !== 0) {
74 mounted() { 75 return "even-row";
75 this.loadList(); 76 } else {
76 this.tableHeight = this.$refs.dataGrid.offsetHeight - 68; 77 return "";
77 }, 78 }
78 methods: { 79 },
79 onSubmit() {}, 80 handleCurrentChange(val) {
80 tableRowClassName({ row, rowIndex }) { 81 console.log(`当前页: ${val}`);
81 if (rowIndex % 2 !== 0) { 82 this.pageNo = val;
82 return "even-row"; 83 this.getData({});
83 } else { 84 },
84 return ""; 85 //获取子组件点击查询触发的事件
85 } 86 getData(obj) {
86 }, 87 console.log(obj);
87 handleCurrentChange(val){ 88 //将obj作为参数调用接口查询表格数据
88 console.log(`当前页: ${val}`); 89 obj['pageNo'] = this.pageNo
89 this.pageNo=val; 90 obj['pageSize'] = this.pageSize
90 this.loadList(); 91 getSearchList(obj).then(res => {
91 }, 92 this.tableData = res.result.records
92 //获取子组件点击查询触发的事件 93 this.total=res.result.total
93 getData(obj) { 94 })
94 console.log(obj); 95 },
95 //将obj作为参数调用接口查询表格数据 96 //点击办理
96 }, 97 handleClick(row) {
97 //点击办理 98 let path = "";
98 handleClick(row) { 99 switch (row.dylx) {
99 let path = ""; 100 case "zrz":
100 switch (row.dylx) { 101 path = "/zrz";
101 case "zrz": 102 break;
102 path = "/zrz"; 103 case "zd":
103 break; 104 path = "/zd";
104 case "zd": 105 break;
105 path = "/zd"; 106 default:
106 break; 107 break;
107 default: 108 }
108 break; 109 this.$router.push({
109 } 110 path: path,
110 this.$router.push({ 111 query: {
111 path:path, 112 bsm: row.glbsm,
112 query:{ 113 source: 2
113 bsm:row.glbsm, 114 }
114 source:2 115 });
115 } 116 },
116 }); 117 },
117 }, 118 computed: {},
118 loadList(){ 119 watch: {},
119 let params={ 120 };
120 zddm:this.zddm,
121 zl:this.zl,
122 bdcdyh:this.bdcdyh,
123 dylx:this.dylx,
124 qlrmc:this.qlrmc,
125 xmmc:this.xmmc,
126 bdcqzh:this.bdcqzh,
127 pageNo:this.pageNo,
128 pageSize:this.pageSize,
129 }
130 getSearchList(params).then((res)=>{
131 console.log(res)
132 if(res.code===200){
133 this.tableData=res.result.records;
134 console.log(this.tableData)
135 }
136 })
137 }
138 },
139 computed: {},
140 watch: {},
141 };
142 </script> 121 </script>
143 <style scoped lang="less"> 122 <style scoped lang="less">
144 .main { 123 .main {
145 width: 100%; 124 width: 100%;
146 height: 100%; 125 height: 100%;
147 box-sizing: border-box; 126 box-sizing: border-box;
148 padding: 0 18px; 127 padding: 0 18px;
149 display: flex; 128 display: flex;
150 flex-direction: column; 129 flex-direction: column;
151 background-color: #fcfdff; 130 background-color: #fcfdff;
152 .demo-form-inline { 131 .demo-form-inline {
153 margin-top: 18px; 132 margin-top: 18px;
154 .moreSearchBtn { 133 .moreSearchBtn {
155 background-color: #1ad6e1; 134 background-color: #1ad6e1;
156 border-color: #1ad6e1; 135 border-color: #1ad6e1;
157 } 136 }
158 .moreSearchBtn:focus, 137 .moreSearchBtn:focus,
159 .moreSearchBtn:hover { 138 .moreSearchBtn:hover {
160 background-color: rgba(28, 200, 229, 0.6); 139 background-color: rgba(28, 200, 229, 0.6);
161 } 140 }
162 } 141 }
163 .dataGrid { 142 .dataGrid {
164 flex: 1; 143 flex: 1;
165 .pagination { 144 .pagination {
166 padding: 18px 0; 145 padding: 18px 0;
167 } 146 }
168 } 147 }
169 } 148 }
170 </style> 149 </style>
......