<template>
|
<div class="businessSub-box">
|
<basic-container>
|
<div>
|
<el-button @click="addSubBtn" type="primary" icon="el-icon-plus">新增执法案件</el-button>
|
</div>
|
<div class="law-search-box">
|
<el-row :gutter="40">
|
<el-col :span="6">
|
<el-input suffix-icon="el-icon-search" placeholder="请输入案件名称"></el-input>
|
</el-col>
|
<el-col :span="4">
|
<el-select v-model="manageValue" placeholder="请选立案时间范围" style="width: 100%">
|
<el-option
|
v-for="item in manageType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-col>
|
<el-col :span="4">
|
<el-select v-model="manageValue" placeholder="请选择违法事项" style="width: 100%">
|
<el-option
|
v-for="item in manageType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-col>
|
<el-col :span="4">
|
<el-select v-model="manageValue" placeholder="请选处理类型" style="width: 100%">
|
<el-option
|
v-for="item in manageType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-col>
|
<el-col :span="4">
|
<el-select v-model="manageValue" placeholder="请选择罚款金额" style="width: 100%">
|
<el-option
|
v-for="item in manageType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-col>
|
<!--<el-col :span="5">
|
<div class="sort-box">
|
<img src="../../../assets/lawImg/sortIcon.png" alt="">
|
<h1>违法数量由高至低排列</h1>
|
</div>
|
</el-col>-->
|
|
</el-row>
|
</div>
|
<div class="law-table-main">
|
<el-table
|
:data="tableData"
|
@sort-change="changeSort"
|
border
|
style="width: 100%">
|
<el-table-column
|
label="序号"
|
type="index"
|
width="60">
|
</el-table-column>
|
<el-table-column
|
prop="name"
|
label="立案日期"
|
width="150">
|
</el-table-column>
|
<el-table-column
|
prop="province"
|
label="案件名称"
|
width="150">
|
</el-table-column>
|
<el-table-column
|
prop="city"
|
label="案件主体"
|
width="150">
|
</el-table-column>
|
<el-table-column
|
prop="address"
|
label="违法事项"
|
width="180">
|
</el-table-column>
|
<el-table-column
|
prop="zip"
|
label="当前阶段"
|
width="200">
|
</el-table-column>
|
<el-table-column
|
prop="zip"
|
label="责任人"
|
width="160">
|
</el-table-column>
|
<el-table-column
|
prop="zip"
|
label="处理结果">
|
</el-table-column>
|
<el-table-column
|
fixed="right"
|
width="120"
|
label="操作">
|
<template slot-scope="scope">
|
<el-button @click="seeHandleClick(scope.row)" type="text" size="small"><img src="../../../assets/lawImg/seeIcon.png" alt=""></el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="avue-crud__pagination">
|
<el-pagination
|
@size-change="sizeChangeHandle"
|
@current-change="currentChangeHandle"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="page.pageSize"
|
:total="page.totalPage"
|
background
|
layout="total, sizes, prev, pager, next, jumper">
|
</el-pagination>
|
</div>
|
</basic-container>
|
<!--新增主题-->
|
<div class="newSub-box">
|
<el-dialog :visible.sync="newSubShow" width="700px">
|
<el-form ref="form" :model="newSubForm" label-width="80px">
|
<el-row :gutter="40">
|
<el-col :span="12">
|
<el-form-item label="项目名称">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="注册本金">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="注册地址">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="联系电话">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="统一信用代码" label-width="100px">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="法定代表人" label-width="100px">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="经营范围">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="违法总数">
|
<el-input v-model="newSubForm.name"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="经营类型">
|
<el-select style="width: 100%" v-model="newSubForm.region" placeholder="请选择活动区域">
|
<el-option label="区域一" value="shanghai"></el-option>
|
<el-option label="区域二" value="beijing"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="成立时间">
|
<el-date-picker
|
style="width: 100%"
|
v-model="newSubForm.value"
|
type="date"
|
placeholder="选择日期">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="企业状态">
|
<el-select style="width: 100%" v-model="newSubForm.region" placeholder="请选择活动区域">
|
<el-option label="区域一" value="shanghai"></el-option>
|
<el-option label="区域二" value="beijing"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item>
|
<div style="display: flex;justify-content: center">
|
<el-button type="primary" @click="subOnSubmit">保存事项清单</el-button>
|
</div>
|
</el-form-item>
|
</el-form>
|
</el-dialog>
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "caseManage",
|
data() {
|
return {
|
newSubShow:false, //新增主题弹框
|
newSubForm:{ //新增主题form数据
|
|
},
|
manageValue:'', //经营类型回显
|
manageType:'', //经营类型
|
establishDate:'', //成立日期
|
page:{ // 分页
|
pageSize:10,
|
totalPage:0,
|
},
|
tableData: [{
|
date: '2016-05-02',
|
name: '王小虎',
|
province: '上海',
|
city: '普陀区',
|
address: '上海市普陀区金沙江路 1518 弄',
|
zip: 200333,
|
tag: '家',
|
weifaNum:2
|
}, {
|
date: '2016-05-04',
|
name: '王小虎',
|
province: '上海',
|
city: '普陀区',
|
address: '上海市普陀区金沙江路 1517 弄',
|
zip: 200333,
|
tag: '公司',
|
weifaNum:1
|
}, {
|
date: '2016-05-01',
|
name: '王小虎',
|
province: '上海',
|
city: '普陀区',
|
address: '上海市普陀区金沙江路 1519 弄',
|
zip: 200333,
|
tag: '家',
|
weifaNum:6
|
}, {
|
date: '2016-05-03',
|
name: '王小虎',
|
province: '上海',
|
city: '普陀区',
|
address: '上海市普陀区金沙江路 1516 弄',
|
zip: 200333,
|
tag: '公司',
|
weifaNum:4
|
}],
|
}
|
},
|
methods: {
|
seeHandleClick() { //查看详情
|
|
},
|
editHandleClick() {
|
|
},
|
addSubBtn() { //新增主题
|
this.newSubShow = true
|
},
|
subOnSubmit() { //保存事项清单
|
|
},
|
changeSort(column) { //违法数量排序
|
console.log(column)
|
console.log(column.prop)
|
console.log(column.order)
|
let fieldName = column.prop
|
let sortingType = column.order
|
if(sortingType == 'descending') {
|
this.tableData = this.tableData.sort((a,b) =>b[fieldName] - a[fieldName])
|
}else {
|
this.tableData = this.tableData.sort((a,b) => a[fieldName] - b[fieldName])
|
}
|
},
|
// 每页数
|
sizeChangeHandle (val) {
|
|
},
|
// 当前页
|
currentChangeHandle (val) {
|
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
h1,h2,h3,h4,h5{
|
font-weight: normal;
|
font-size: 12px;
|
}
|
.law-search-box{
|
margin:20px 0;
|
}
|
.sort-box{
|
display: flex;
|
align-items: center;
|
cursor: pointer;
|
}
|
.sort-box img{
|
width: 24px;
|
height: 24px;
|
}
|
.sort-box h1{
|
color: #1829de;
|
}
|
</style>
|
