-
案件列表
-
-
-
+
案件列表
+
+
+
+
+
+
+ {{ item.id }} 案件案号:
+ {{ item.caseCode }}
+
+
+ 案件名称:
+ {{ item.caseName }}
+
+
+ 开庭时间:
+ {{ item.time }}
+
+
+ 开庭法庭:
+ {{ item.court }}
+
+
+ 案件案由:
+ {{ item.brief }}
+
+
+ 当事人:
+ {{ item.user }}
+
+
+ 书记员:
+ {{ item.clerk }}
+
+
+
+
+
@@ -98,38 +157,166 @@ export default {
},
], // 智慧法庭小房子
houseList: ["blueHouse", "redHouse", "yellowHouse", "orangeHouse"],
- userValue:'', //人员选择
- userOptions:[
- {
- label:'人员',
- value:'1'
- },
- {
- label:'人员2',
- value:'2'
- }
- ],//人员子项
- departmentValue:'', //部门选择
- departmentOptions:[
- {
- label:'部门',
- value:'1'
- },
- {
- label:'部门2',
- value:'2'
- }
- ], //部门子项
- selectList:[
+ userValue: "", //人员选择
+ userOptions: [
{
- name:'',
- list:[
+ label: "人员",
+ value: "1",
+ },
+ {
+ label: "人员2",
+ value: "2",
+ },
+ ], //人员子项
+ departmentValue: "", //部门选择
+ departmentOptions: [
+ {
+ label: "部门",
+ value: "1",
+ },
+ {
+ label: "部门2",
+ value: "2",
+ },
+ ], //部门子项
+ selectList: [
+ {
+ name: "立案日期",
+ list: [
{
- label:''
- }
- ]
- }
- ]
+ label: "立案日期",
+ value: "1",
+ },
+ {
+ label: "立案日期2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "法官",
+ list: [
+ {
+ label: "法官",
+ value: "1",
+ },
+ {
+ label: "法官2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "案件类型",
+ list: [
+ {
+ label: "案件类型",
+ value: "1",
+ },
+ {
+ label: "案件类型2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "收案日期",
+ list: [
+ {
+ label: "收案日期",
+ value: "1",
+ },
+ {
+ label: "收案日期2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "经办法院代码",
+ list: [
+ {
+ label: "经办法院代码",
+ value: "1",
+ },
+ {
+ label: "经办法院代码2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "结案日期",
+ list: [
+ {
+ label: "结案日期",
+ value: "1",
+ },
+ {
+ label: "结案日期2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "结案方式",
+ list: [
+ {
+ label: "结案方式",
+ value: "1",
+ },
+ {
+ label: "结案方式2",
+ value: "2",
+ },
+ ],
+ },
+ {
+ name: "案件状态代码",
+ list: [
+ {
+ label: "案件状态代码",
+ value: "1",
+ },
+ {
+ label: "案件状态代码2",
+ value: "2",
+ },
+ ],
+ },
+ ], //案件列表选择器
+ caseDetailList: [
+ {
+ id: "1",
+ caseCode: "(2022)苏0192民初14272号",
+ caseName: "崔怀宁与高保加买卖合同纠纷",
+ time: "2023-01-16 09:00--09:30",
+ court: "新楼第十五法庭",
+ brief: "买卖合同纠纷",
+ user: "原告：崔怀宁;被告：高保加",
+ clerk: "甫明",
+ },
+ {
+ id: "2",
+ caseCode: "(2022)苏0192民初14272号",
+ caseName: "崔怀宁与高保加买卖合同纠纷;崔怀宁与高保加买卖合同纠纷;崔怀宁与高保加买卖合同纠纷;",
+ time: "2023-01-16 09:00--09:30",
+ court: "新楼第十五法庭",
+ brief: "买卖合同纠纷",
+ user: "原告：崔怀宁;被告：高保加",
+ clerk: "甫明",
+ },
+ {
+ id: "3",
+ caseCode: "(2022)苏0192民初14272号",
+ caseName: "崔怀宁与高保加买卖合同纠纷",
+ time: "2023-01-16 09:00--09:30",
+ court: "新楼第十五法庭",
+ brief: "买卖合同纠纷",
+ user: "原告：崔怀宁;被告：高保加",
+ clerk: "甫明",
+ },
+ ],
};
},
mounted() {
@@ -152,7 +339,7 @@ export default {
},
legend: {
icon: "rect",
- bottom:0,
+ bottom: 0,
itemWidth: 15,
data: ["收案", "结案", "存案"],
textStyle: {
@@ -226,7 +413,7 @@ export default {
splitLine: {
show: true,
lineStyle: {
- type: '',
+ type: "",
dashOffset: 10,
color: "rgb(108,108,109)",
},
@@ -297,7 +484,7 @@ export default {
global: false, // 缺省为 false
}),
},
- label: {
+ label: {
normal: {
show: true,
fontSize: "0.4rem",
@@ -333,7 +520,7 @@ export default {
global: false, // 缺省为 false
}),
},
- label: {
+ label: {
normal: {
show: true,
fontSize: "0.4rem",
@@ -346,15 +533,20 @@ export default {
};
myChart.setOption(option);
},
- caseTypeLeft(){
- var myChart = this.$echarts.init(document.getElementById("caseTypeLeft"));
- var data = [
+ caseTypeLeft() {
+ var myChart = this.$echarts.init(document.getElementById("caseTypeLeft"));
+ var data = [
{ value: "25", name: "民事案件" },
{ value: "25", name: "行政案件" },
{ value: "25", name: "刑事案件" },
{ value: "25", name: "其他案件" },
];
- var color = ["rgb(185,8,25)", "rgb(160,87,6)", "rgb(16,134,165)", "rgb(178,178,178)"];
+ var color = [
+ "rgb(185,8,25)",
+ "rgb(160,87,6)",
+ "rgb(16,134,165)",
+ "rgb(178,178,178)",
+ ];
let option = {
color: color,
title: {
@@ -391,7 +583,7 @@ export default {
orient: "horizontal",
icon: "rect",
bottom: "0",
- x:'center',
+ x: "center",
itemWidth: 30,
itemGap: 20,
textStyle: {
@@ -452,15 +644,22 @@ export default {
};
myChart.setOption(option);
},
- caseTypeRight(){
- var myChart = this.$echarts.init(document.getElementById("caseTypeRight"));
- var data = [
+ caseTypeRight() {
+ var myChart = this.$echarts.init(
+ document.getElementById("caseTypeRight")
+ );
+ var data = [
{ value: "25", name: "民事案件" },
{ value: "25", name: "行政案件" },
{ value: "25", name: "刑事案件" },
{ value: "25", name: "其他案件" },
];
- var color = ["rgb(185,8,25)", "rgb(160,87,6)", "rgb(16,134,165)", "rgb(178,178,178)"];
+ var color = [
+ "rgb(185,8,25)",
+ "rgb(160,87,6)",
+ "rgb(16,134,165)",
+ "rgb(178,178,178)",
+ ];
let option = {
color: color,
title: {
@@ -497,7 +696,7 @@ export default {
orient: "horizontal",
icon: "rect",
bottom: "0",
- x:'center',
+ x: "center",
itemWidth: 30,
itemGap: 20,
textStyle: {
@@ -637,14 +836,14 @@ export default {
width: 100%;
height: 35%;
position: relative;
- .select{
- position: absolute;
- right: 5%;
- width: 45%;
- height: 10%;
- display: flex;
- z-index: 999;
- /deep/ .el-select {
+ .select {
+ position: absolute;
+ right: 5%;
+ width: 45%;
+ height: 10%;
+ display: flex;
+ z-index: 999;
+ /deep/ .el-select {
width: 100%;
height: 100%;
border-radius: 15px;
@@ -684,18 +883,18 @@ export default {
.leftThree {
width: 100%;
height: 40%;
- .caseType{
- height: calc(100% - 8%);
- width: 100%;
- display: flex;
- #caseTypeLeft{
- width: 50%;
- height: 100%;
- }
- #caseTypeRight{
- width: 50%;
- height: 100%;
- }
+ .caseType {
+ height: calc(100% - 8%);
+ width: 100%;
+ display: flex;
+ #caseTypeLeft {
+ width: 50%;
+ height: 100%;
+ }
+ #caseTypeRight {
+ width: 50%;
+ height: 100%;
+ }
}
}
}
@@ -708,23 +907,91 @@ export default {
flex-wrap: wrap;
background: url(../assets/images/leftKuang.png) no-repeat;
background-size: 100% 100%;
- .caseList{
+ .caseList {
+ width: 100%;
+ height: calc(100% - 5%);
+ display: flex;
+ flex-wrap: wrap;
+ .selectList {
width: 100%;
- height: calc(100% - 5%);
- border: 1px solid red;
+ height: 20%;
+ position: relative;
display: flex;
flex-wrap: wrap;
- .selectList{
- width: 100%;
+ .selectChange {
+ width: 25%;
height: 20%;
- border: 1px solid rgb(0, 255, 170);
- position: relative;
+ margin-top: 3%;
+ margin-left: 5%;
+ /deep/ .el-select {
+ width: 100%;
+ height: 100%;
+ border-radius: 15px;
+ }
+ /deep/ .el-input__inner {
+ width: 100%;
+ height: 100%;
+ background: transparent;
+ border: 1px solid rgb(1, 176, 202);
+ border-radius: 15px;
+ color: #fff;
+ }
+ /deep/ .el-select-dropdown {
+ background: transparent;
+ border: 1px solid rgb(1, 176, 202);
+ border-radius: 5px;
+ // left: -3px !important;
+ }
+ /deep/ .el-select-dropdown__item {
+ color: turquoise;
+ }
+ /deep/ .el-select .el-input .el-select__caret {
+ color: rgb(1, 176, 202);
+ font-size: 0.3rem;
+ font-weight: 500;
+ }
+ /deep/ .el-input__suffix {
+ display: flex;
+ align-items: center;
+ }
}
- .caseDetail{
+ }
+ .caseDetail {
+ width: 100%;
+ height: calc(100% - 20%);
+ padding: 0 5%;
+ box-sizing: border-box;
+ .caseDetailList {
width: 100%;
- height: calc(100% - 20%);
- border: 1px solid blue;
+ height: 100%;
+ background: url(../assets/images/warnDottedLine.png) no-repeat;
+ background-size: 100% 100%;
+ display: flex;
+ flex-wrap: wrap;
+ overflow: auto;
+ .detail {
+ width: 100%;
+ height: 50%;
+ border: 1px dashed #fff;
+ color: #fff;
+ font-size: 0.65rem;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ justify-content: space-around;
+ .rowDetail {
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+ padding: 0 3%;
+ box-sizing: border-box;
+ }
+ }
}
+ ::-webkit-scrollbar {
+ display: none;
+ }
+ }
}
}
}