Skip to content

F
founder_vue
Commit e8323849 by liupeng
Options

修改了页面样式

parent 76f5bd02
Showing with 284 additions and 103 deletions
src/views/cbyp/qgxxxx.vue
...@@ -10,7 +10,8 @@ ...@@ -10,7 +10,8 @@
v-for="item in bottonData" v-for="item in bottonData"
:key="item.xzqhdmSj" :key="item.xzqhdmSj"
@click="searchCaseByProvince(item)" @click="searchCaseByProvince(item)"
type="primary" plain type="primary"
plain
>{{ item.xzqhdmSj + " " + item.count }}</el-button >{{ item.xzqhdmSj + " " + item.count }}</el-button
> >
</div> </div>
...@@ -103,6 +104,7 @@ export default { ...@@ -103,6 +104,7 @@ export default {
tableLoading: false, tableLoading: false,
bottonData: [], bottonData: [],
tableData: [], tableData: [],
tableArr: [],
currentPage: 1, currentPage: 1,
propdefaultFormThead: [ propdefaultFormThead: [
{ {
...@@ -152,22 +154,18 @@ export default { ...@@ -152,22 +154,18 @@ export default {
var params = { var params = {
xszajbh: this.xszajbh, xszajbh: this.xszajbh,
cbxgfwbzh: this.cbxgfwbzh, cbxgfwbzh: this.cbxgfwbzh,
} };
getQgAsjxxByXszajbh(params).then((res) => { getQgAsjxxByXszajbh(params).then((res) => {
this.tableData = res.data.rows; this.tableData = res.data.rows;
this.tableArr = res.data.rows;
this.bottonData = res.data.qucsj; this.bottonData = res.data.qucsj;
console.log(res); console.log(res);
}); });
}, },
searchCaseByProvince(item) { searchCaseByProvince(item) {
var params = { let str = item.xzqhdmSj;
xszajbh: item.xszajbh, let arr = this.tableArr.filter((i) => i.xzqhdmSj.indexOf(str) >= 0);
cbxgfwbzh: item.cbxgfwbzh, this.tableData = arr;
}
getQgAsjxxByXszajbh(params).then((res) => {
console.log(res);
this.tableData = res.data.qucsj;
});
}, },
handleSizeChange() {}, handleSizeChange() {},
handleCurrentChange() {}, handleCurrentChange() {},
......
src/views/cbyp/tobjcba.vue
...@@ -8,7 +8,9 @@ ...@@ -8,7 +8,9 @@
<el-col :span="16" :offset="4" class="firstSquare"> <el-col :span="16" :offset="4" class="firstSquare">
<div class="topSquare"> <div class="topSquare">
<div class="titleBox"> <div class="titleBox">
<span>有关于内蒙古自治区呼和浩特市回民区、内蒙古自治区二连浩特等地区系列诈骗案的串并案件</span> <span
>有关于内蒙古自治区呼和浩特市回民区、内蒙古自治区二连浩特等地区系列诈骗案的串并案件</span
>
</div> </div>
<div class="contentBox"> <div class="contentBox">
<el-form ref="form" :model="messageForm" label-width="80px"> <el-form ref="form" :model="messageForm" label-width="80px">
...@@ -42,7 +44,7 @@ ...@@ -42,7 +44,7 @@
{{ messageForm.cblx }} {{ messageForm.cblx }}
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8" :offset="0"> <el-col :span="24" :offset="0">
<el-form-item label="串并描述:" prop="cbms"> <el-form-item label="串并描述:" prop="cbms">
{{ messageForm.cbxxms }} {{ messageForm.cbxxms }}
</el-form-item> </el-form-item>
...@@ -56,31 +58,103 @@ ...@@ -56,31 +58,103 @@
<div class="titleBox"> <div class="titleBox">
<span>案件信息</span> <span>案件信息</span>
</div> </div>
<span class="zhankai" @click="zhan('boo1', boo1, $event)">
<i class="el-icon-arrow-down" v-if="!boo1"></i>
<i class="el-icon-arrow-up" v-else></i>
{{ boo1 == true ? "收缩" : "展开" }}</span
>
<div class="contentBox"> <div class="contentBox">
<el-table <el-table
:data="messageTableData" :data="messageTableData"
border
stripe stripe
height="400" height="400"
style="width: 100%; margin-top: 20px" style="width: 100%; margin-top: 20px"
> >
<el-table-column prop="asjbh" label="案件编号" width="230"> <el-table-column
prop="asjbh"
label="案件编号"
width="230"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="ajmc" label="案件名称" width="100"> <el-table-column
prop="ajmc"
label="案件名称"
width="100"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="ajlbdm" label="案件类别" width="80"> <el-table-column
prop="ajlbdm"
label="案件类别"
width="80"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="zcjddm" label="案件状态" width="100"> <el-table-column
prop="zcjddm"
label="案件状态"
width="100"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="asjfssjKssj" label="案发时间" width="100"> <el-table-column
prop="asjfssjKssj"
label="案发时间"
width="100"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="asjfsddXzqhdm" prop="asjfsddXzqhdm"
label="案发地点" label="案发地点"
width="90" align="center"
> >
</el-table-column> </el-table-column>
<el-table-column prop="jyaq" label="简要案情" width="560"> <el-table-column
prop="jyaq"
label="简要案情"
width="360"
align="center"
>
<template slot-scope="scope">
<div class="ajxq_s">
<span class="none" v-html="scope.row['jyaq']"></span
><a
href="javascript:void(0);"
onclick='javascript:this.parentNode.style.display="none";this.parentNode.nextSibling.style.display="block"'
style="
display: inline-block;
width: 100%;
text-align: right;
color: #3692c6;
font-weight: 600;
"
id="open"
v-show="
scope.row['jyaq'] != '' && scope.row['jyaq'] != null
"
>展开</a
>
</div>
<div class="ajxq_n" style="display: none">
<span
style="display: block"
v-html="scope.row['jyaq']"
></span
><a
href="javascript:void(0);"
onclick='javascript:this.parentNode.style.display="none";this.parentNode.previousSibling.style.display="block"'
style="float: right; color: #3692c6; font-weight: 600"
id="stop"
v-show="
scope.row['jyaq'] != '' && scope.row['jyaq'] != null
"
>收起</a
>
</div>
</template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -101,35 +175,67 @@ ...@@ -101,35 +175,67 @@
<div class="titleBox"> <div class="titleBox">
<span>嫌疑人员</span> <span>嫌疑人员</span>
</div> </div>
<span class="zhankai" @click="zhan('boo2', boo2, $event)">
<i class="el-icon-arrow-down" v-if="!boo2"></i>
<i class="el-icon-arrow-up" v-else></i>
{{ boo2 == true ? "收缩" : "展开" }}</span
>
<div class="contentBox"> <div class="contentBox">
<el-table <el-table
:data="criminalTableData" :data="criminalTableData"
border
stripe stripe
height="400" height="400"
style="width: 100%; margin-top: 20px" style="width: 100%; margin-top: 20px"
> >
<el-table-column prop="zhfzxyrXm" label="姓名" width="180"> <el-table-column
prop="zhfzxyrXm"
label="姓名"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="zhfzxyrXbdm" label="性别" width="180"> <el-table-column
prop="zhfzxyrXbdm"
label="性别"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="zhfzxyrCyzjZjhm" prop="zhfzxyrCyzjZjhm"
label="身份证号" label="身份证号"
width="180" width="180"
align="center"
> >
</el-table-column> </el-table-column>
<el-table-column prop="hjdzDzmc" label="户籍区域" width="180"> <el-table-column
prop="hjdzDzmc"
label="户籍区域"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="asjbh" label="案事件编号" width="210"> <el-table-column
prop="asjbh"
label="案事件编号"
width="210"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="zhfzxyrFzxyrdaztdm" prop="zhfzxyrFzxyrdaztdm"
label="抓获状态" label="抓获状态"
width="150" width="150"
align="center"
> >
</el-table-column> </el-table-column>
<el-table-column prop="zhrq_str" label="抓获日期" width="180"> <el-table-column
prop="zhrq_str"
label="抓获日期"
width="180"
align="center"
>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -143,34 +249,73 @@ ...@@ -143,34 +249,73 @@
> >
</el-pagination> </el-pagination>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="16" :offset="4" class="fourthSquare"> <el-col :span="16" :offset="4" class="fourthSquare">
<div class="titleBox"> <div class="titleBox">
<span>受害人员</span> <span>受害人员</span>
</div> </div>
<span class="zhankai" @click="zhan('boo3', boo3, $event)">
<i class="el-icon-arrow-down" v-if="!boo3"></i>
<i class="el-icon-arrow-up" v-else></i>
{{ boo3 == true ? "收缩" : "展开" }}</span
>
<div class="contentBox"> <div class="contentBox">
<el-table <el-table
:data="victimTableData" :data="victimTableData"
border
stripe stripe
height="400" height="400"
style="width: 100%; margin-top: 20px" style="width: 100%; margin-top: 20px"
> >
<el-table-column prop="bhrXm" label="姓名" width="180"> <el-table-column
prop="bhrXm"
label="姓名"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="bhrXbdm" label="性别" width="180"> <el-table-column
prop="bhrXbdm"
label="性别"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="bhrCyzjZjhm" label="身份证号" width="180"> <el-table-column
prop="bhrCyzjZjhm"
label="身份证号"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="bhrHjdzDzmc" label="户籍区域" width="180"> <el-table-column
prop="bhrHjdzDzmc"
label="户籍区域"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="asjbh" label="案事件编号" width="180"> <el-table-column
prop="asjbh"
label="案事件编号"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="rsshcddm" label="受害程度" width="180"> <el-table-column
prop="rsshcddm"
label="受害程度"
width="180"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column prop="bhrLxdh" label="联系电话" width="180"> <el-table-column
prop="bhrLxdh"
label="联系电话"
width="180"
align="center"
>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
...@@ -190,7 +335,12 @@ ...@@ -190,7 +335,12 @@
</template> </template>
<script> <script>
import { queryCbzAsjGlxx, getCbzXyry, getCbzBhry, toBjcba } from "@/api/cbyp.js"; import {
queryCbzAsjGlxx,
getCbzXyry,
getCbzBhry,
toBjcba,
} from "@/api/cbyp.js";
export default { export default {
data() { data() {
return { return {
...@@ -217,6 +367,9 @@ export default { ...@@ -217,6 +367,9 @@ export default {
totalrows01: 0, totalrows01: 0,
totalrows02: 0, totalrows02: 0,
totalrows03: 0, totalrows03: 0,
boo1: true,
boo2: true,
boo3: true,
}; };
}, },
created() { created() {
...@@ -232,21 +385,31 @@ export default { ...@@ -232,21 +385,31 @@ export default {
xlajbh: this.xlajbh, xlajbh: this.xlajbh,
page: this.page01, page: this.page01,
rows: this.rows, rows: this.rows,
} };
queryCbzAsjGlxx(params).then((res) => { queryCbzAsjGlxx(params).then((res) => {
this.messageTableData = res.data.result; this.messageTableData = res.data.result;
this.totalrows01 = res.data.recordsTotal this.totalrows01 = res.data.recordsTotal;
}); });
}, },
zhan(type, value, event) {
this[type] = !this[type];
if (value) {
event.target.nextSibling.style.display = "none";
event.target.nextSibling.nextSibling.style.display = "none";
} else {
event.target.nextSibling.style.display = "block";
event.target.nextSibling.nextSibling.style.display = "block";
}
},
getCriminalMessage() { getCriminalMessage() {
var params = { var params = {
xlajbh: this.xlajbh, xlajbh: this.xlajbh,
page: this.page01, page: this.page01,
rows: this.rows, rows: this.rows,
} };
getCbzXyry(params).then((res) => { getCbzXyry(params).then((res) => {
this.criminalTableData = res.data.result; this.criminalTableData = res.data.result;
this.totalrows02 = res.data.recordsTotal this.totalrows02 = res.data.recordsTotal;
}); });
}, },
getVictimMessage() { getVictimMessage() {
...@@ -254,10 +417,10 @@ export default { ...@@ -254,10 +417,10 @@ export default {
xlajbh: this.xlajbh, xlajbh: this.xlajbh,
page: this.page01, page: this.page01,
rows: this.rows, rows: this.rows,
} };
getCbzBhry(params).then((res) => { getCbzBhry(params).then((res) => {
this.victimTableData = res.data.result; this.victimTableData = res.data.result;
this.totalrows03 = res.data.recordsTotal this.totalrows03 = res.data.recordsTotal;
}); });
}, },
getDetailOfCase() { getDetailOfCase() {
...@@ -265,31 +428,53 @@ export default { ...@@ -265,31 +428,53 @@ export default {
xlajbh: this.xlajbh, xlajbh: this.xlajbh,
page: this.page01, page: this.page01,
rows: this.rows, rows: this.rows,
} };
toBjcba(params).then((res) => { toBjcba(params).then((res) => {
this.messageForm = res.data.rows; this.messageForm = res.data.rows;
}); });
}, },
messageTableDataChange(val) { messageTableDataChange(val) {
this.page01 = val this.page01 = val;
this.getMessage() this.getMessage();
}, },
criminalTableDataChange(val) { criminalTableDataChange(val) {
this.page02 = val this.page02 = val;
this.getCriminalMessage() this.getCriminalMessage();
}, },
victimTableDataChange(val) { victimTableDataChange(val) {
this.page03 = val this.page03 = val;
this.getVictimMessage() this.getVictimMessage();
}, },
}, },
}; };
</script> </script>
<style>
.el-form-item {
margin-bottom: 0px;
}
.el-form-item__label {
line-height: 30px !important;
}
.el-form-item__content {
line-height: 30px !important;
}
</style>
<style lang="scss" scoped> <style lang="scss" scoped>
.el-form-item {
margin-bottom: 0px;
}
.el-form-item__label {
line-height: 30px !important;
}
.el-form-item__content {
line-height: 30px !important;
}
.tobjcba { .tobjcba {
margin: 0;
padding: 0;
.title { .title {
height: 52px; height: 52px;
background: #1f212c; background: #1f212c;
...@@ -308,32 +493,31 @@ export default { ...@@ -308,32 +493,31 @@ export default {
line-height: 24px; line-height: 24px;
color: #ffffff; color: #ffffff;
} }
} }
.firstSquare { .firstSquare {
background-color: #fff; background-color: #fff;
.topSquare { .topSquare {
margin-top: 5px; margin-top: 5px;
.titleBox {
.contentBox {
}
}
}
.titleBox {
border-bottom: 1px solid black; border-bottom: 1px solid black;
margin: 5px 0 0 0; margin: 5px 0 5px 0;
display: inline-block; display: inline-block;
height: 40px; height: 25px;
line-height: 40px; line-height: 25px;
padding: 0 24px; padding: 0 24px;
border-radius: 0px 0px 22px 4px; border-radius: 0px 0px 22px 4px;
background: #69ABE9; background: #69abe9;
color: #fff; color: #fff;
margin-left: 10px; margin-left: 10px;
font-size: 16px; font-size: 16px;
span { span {
font-size: 16px; font-size: 16px;
} }
}
.contentBox {
}
}
} }
.secondSquare { .secondSquare {
background-color: #fff; background-color: #fff;
...@@ -342,72 +526,67 @@ export default { ...@@ -342,72 +526,67 @@ export default {
.midSquare { .midSquare {
background-color: #fff; background-color: #fff;
.titleBox { // .titleBox {
border-bottom: 1px solid black; // border-bottom: 1px solid black;
margin: 5px 0 0 0; // margin: 5px 0 0 0;
display: inline-block; // display: inline-block;
height: 40px; // height: 40px;
line-height: 40px; // line-height: 40px;
padding: 0 24px; // padding: 0 24px;
border-radius: 0px 0px 22px 4px; // border-radius: 0px 0px 22px 4px;
background: #69ABE9; // background: #69abe9;
color: #fff; // color: #fff;
margin-left: 10px; // margin-left: 10px;
font-size: 16px; // font-size: 16px;
span { // span {
font-size: 16px; // font-size: 16px;
} // }
} // }
.contentBox { .contentBox {
} }
.paginationBox { .paginationBox {
} }
} }
} }
.thirdSquare { .thirdSquare {
background-color: #fff; background-color: #fff;
margin-top: 5px; margin-top: 5px;
.bottomSquare { .bottomSquare {
.titleBox { // .titleBox {
border-bottom: 1px solid black; // font-size: 16px;
margin: 5px 0 0 0; // font-family: Microsoft YaHei;
display: inline-block; // font-weight: bold;
height: 40px; // line-height: 21px;
line-height: 40px; // color: #333333;
padding: 0 24px; // span {
border-radius: 0px 0px 22px 4px; // font-size: 16px;
background: #69ABE9; // }
color: #fff; // }
margin-left: 10px;
font-size: 16px;
span {
font-size: 16px;
}
}
.contentBox { .contentBox {
} }
.paginationBox { .paginationBox {
} }
} }
} }
.fourthSquare { .fourthSquare {
background-color: #fff; background-color: #fff;
margin-top: 5px; margin-top: 5px;
.titleBox { .titleBox {
border-bottom: 1px solid black; border-bottom: 1px solid black;
margin: 5px 0 0 0; margin: 17px 0 0 10px;
display: inline-block; display: inline-block;
height: 40px; height: 21px;
line-height: 40px; line-height: 21px;
padding: 0 24px; padding: 0 24px;
border-radius: 0px 0px 22px 4px; border-radius: 0px 0px 22px 4px;
background: #69ABE9; background: #69abe9;
color: #fff; color: #fff;
margin-left: 10px; margin-left: 10px;
font-size: 16px; font-size: 16px;
font-family: Microsoft YaHei;
font-weight: bold;
span { span {
font-size: 16px; font-size: 16px;
} }
...@@ -418,7 +597,11 @@ export default { ...@@ -418,7 +597,11 @@ export default {
} }
} }
.zhankai {
float: right !important;
margin-top: 5px;
font-size: 15px;
margin-right: 10px;
cursor: pointer;
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment