| | |
| | | <div class="option"> |
| | | <el-input v-model="context" placeholder="请输入车牌号"></el-input> |
| | | </div> |
| | | |
| | | |
| | | <div class="findBtn"> |
| | | <el-button type="primary" @click="handleSearch">查询</el-button> |
| | | </div> |
| | |
| | | <main> |
| | | <div class="mainContent"> |
| | | <div class="type-nav"> |
| | | <div @click="changeTypeChecked(index)" v-for="(item,index) in typeList" :key="item.name" |
| | | :class="[item.checked ? 'is-active':'','type-item']">{{item.name}}</div> |
| | | <div @click="changeTypeChecked(index)" v-for="(item, index) in typeList" :key="item.name" |
| | | :class="[item.checked ? 'is-active' : '', 'type-item']">{{ item.name }}</div> |
| | | </div> |
| | | <!-- 数据展示 --> |
| | | <el-table ref="multipleTable" |
| | | :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" |
| | | :header-cell-style="{ background: '#06122c', 'font-size': '12px', color: '#4b9bb7', 'font-weight': '650', 'line-height': '45px' }" |
| | | :data="tableData" style="width: 100%" :row-class-name="tableRowClassName" |
| | | @selection-change="tableChange"> |
| | | <el-table-column type="selection" min-width="5"> |
| | | </el-table-column> |
| | | <el-table-column prop="carNumber" label="车牌号" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="carModel" label="车型" min-width="10" v-if="mystatus===2"> |
| | | <el-table-column prop="carModel" label="车型" min-width="10" v-if="mystatus === 2"> |
| | | </el-table-column> |
| | | <el-table-column :prop="mystatus ===1 ? 'ownerName':'carOwner'" label="车主姓名" min-width="10"> |
| | | <el-table-column :prop="mystatus === 1 ? 'ownerName' : 'carOwner'" label="车主姓名" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column v-if="mystatus ===2" :prop="mystatus ===1 ? 'vehicleUser' : 'carUser'" label="车辆使用人员" min-width="10"> |
| | | <el-table-column v-if="mystatus === 2" :prop="mystatus === 1 ? 'vehicleUser' : 'carUser'" |
| | | label="车辆使用人员" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column :prop="mystatus ===1 ? 'contact' : 'phone' " label="联系方式" min-width="10"> |
| | | <el-table-column :prop="mystatus === 1 ? 'contact' : 'phone'" label="联系方式" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column :prop="mystatus===1 ? 'pdepartName' : 'geographicPosition'" :label="mystatus === 1 ? '所属部门':'施工地址'" min-width="10"> |
| | | <el-table-column :prop="mystatus === 1 ? 'pdepartName' : 'geographicPosition'" |
| | | :label="mystatus === 1 ? '所属部门' : '施工地址'" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column :prop="mystatus===1 ? 'departName' : 'constructionOrg'" :label="mystatus === 1 ? '所属大队' : '施工单位'" min-width="10"> |
| | | <el-table-column :prop="mystatus === 1 ? 'departName' : 'constructionOrg'" |
| | | :label="mystatus === 1 ? '所属大队' : '施工单位'" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="operation" label="操作" min-width="20"> |
| | | <template slot-scope="scope"> |
| | |
| | | </el-table-column> |
| | | </el-table> |
| | | <!-- 新增 --> |
| | | <el-dialog :visible.sync="dialogAdd" width="60%" title="新增车辆" |
| | | v-if="dialogAdd" :before-close="handleClose"> |
| | | <Mycreate v-if="mystatus === 1" @closeDialog="closeDialog"></Mycreate> |
| | | <el-dialog :visible.sync="dialogAdd" width="60%" title="新增车辆" v-if="dialogAdd" |
| | | :before-close="handleClose"> |
| | | <Mycreate v-if="mystatus === 1" @closeDialog="closeDialog"></Mycreate> |
| | | <MySoil v-else @closeDialog="closeDialog"></MySoil> |
| | | </el-dialog> |
| | | <!-- 查看 --> |
| | | <el-dialog :visible.sync="dialogView" width="60%" title="查看车辆信息" |
| | | v-if="dialogView" :before-close="handleNoClose"> |
| | | <el-dialog :visible.sync="dialogView" width="60%" title="查看车辆信息" v-if="dialogView" |
| | | :before-close="handleNoClose"> |
| | | <MyViewLaw v-if="mystatus === 1" :info="info"></MyViewLaw> |
| | | <MyViewSoil v-else :info="info"></MyViewSoil> |
| | | </el-dialog> |
| | | <!-- 编辑 --> |
| | | <el-dialog :visible.sync="dialogEdit" width="60%" title="编辑车辆信息" |
| | | v-if="dialogEdit" :before-close="handleClose"> |
| | | <el-dialog :visible.sync="dialogEdit" width="60%" title="编辑车辆信息" v-if="dialogEdit" |
| | | :before-close="handleClose"> |
| | | <MyEditLaw v-if="mystatus === 1" @closeDialog="closeDialog" :info="info"></MyEditLaw> |
| | | <MyEditSoil v-else @closeDialog="closeDialog" :info="info"></MyEditSoil> |
| | | </el-dialog> |
| | |
| | | <el-checkbox v-model="unsame" @change="disSame(tableData)">反选</el-checkbox> |
| | | </div> |
| | | <div class="funsItem"> |
| | | <el-select v-model="myIdx" placeholder="批量操作" disabled> |
| | | <el-select v-model="myIdx" placeholder="批量操作" > |
| | | <el-option v-for="item in options" :key="item.value" :label="item.label" |
| | | :value="item.value" :disabled="item.disabled"> |
| | | :value="item.value" :disabled="item.disabled" @click.native="selectChange"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | |
| | | import MyEditSoil from './edit/soil' |
| | | export default { |
| | | components: { |
| | | Mycreate,MySoil,MyViewLaw, |
| | | MyViewSoil,MyEditLaw,MyEditSoil |
| | | Mycreate, MySoil, MyViewLaw, |
| | | MyViewSoil, MyEditLaw, MyEditSoil |
| | | }, |
| | | data() { |
| | | return { |
| | | tableData: [], |
| | | context: "", |
| | | dialogAdd:false, |
| | | dialogView:false, |
| | | dialogEdit:false, |
| | | dialogAdd: false, |
| | | dialogView: false, |
| | | dialogEdit: false, |
| | | info: '', |
| | | totalNum: null, |
| | | pageSize: 10, |
| | |
| | | label: '批量操作', |
| | | disabled: true, |
| | | }, |
| | | { |
| | | value: 1, |
| | | label: '批量启用', |
| | | }, |
| | | { |
| | | value: 2, |
| | | label: '批量禁用', |
| | | }, |
| | | // { |
| | | // value: 1, |
| | | // label: '批量启用', |
| | | // }, |
| | | // { |
| | | // value: 2, |
| | | // label: '批量禁用', |
| | | // }, |
| | | { |
| | | value: 3, |
| | | label: '批量删除', |
| | |
| | | checked: false, |
| | | }, |
| | | ], |
| | | mystatus:1, |
| | | caseId:'', |
| | | timer:null, |
| | | mystatus: 1, |
| | | caseId: '', |
| | | timer: null, |
| | | currentState: 1 |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | }, |
| | | methods: { |
| | | // 编辑车辆 |
| | | handleEdit(data){ |
| | | handleEdit(data) { |
| | | this.dialogEdit = true |
| | | this.info = data; |
| | | }, |
| | | // 搜索车辆 |
| | | handleSearch(val){ |
| | | if(this.timer){ |
| | | handleSearch(val) { |
| | | if (this.timer) { |
| | | clearTimeout(this.timer); |
| | | } |
| | | this.timer = setTimeout(()=>{ |
| | | this.timer = setTimeout(() => { |
| | | this.getCarList(); |
| | | },1000); |
| | | }, 1000); |
| | | }, |
| | | // 添加车辆 |
| | | handleAddCar(){ |
| | | handleAddCar() { |
| | | this.dialogAdd = true; |
| | | }, |
| | | // 监听表格 |
| | | tableChange(list) { |
| | | this.tempList = []; |
| | | list.forEach(item => { |
| | | this.tempList.push(item.code); |
| | | this.tempList.push(item.id); |
| | | }) |
| | | if (list.length === this.tableData.length) { |
| | | this.all = true; |
| | |
| | | }) |
| | | }, |
| | | // 删除单条数据 |
| | | handleDelete({id}) { |
| | | handleDelete({ id }) { |
| | | this.$confirm('确认删除?') |
| | | .then(_ => { |
| | | const {mystatus} = this |
| | | let myurl = mystatus === 1 ? 'deletion_enforce':'deletion_slag' |
| | | const { mystatus } = this |
| | | let myurl = mystatus === 1 ? 'deletion_enforce' : 'deletion_slag' |
| | | this.$axios({ |
| | | method: 'delete', |
| | | url: `/sccg/car_Manage/${myurl}?id=${id}`, |
| | |
| | | this.getCarList(); |
| | | }) |
| | | }) |
| | | .catch(_ => { }); |
| | | .catch(_ => { }); |
| | | }, |
| | | // 获取车辆列表 |
| | | async getCarList() { |
| | | const { currentPage, pageSize, context, mystatus } = this; |
| | | let arr =[]; |
| | | if(mystatus===1){ |
| | | let arr = []; |
| | | if (mystatus === 1) { |
| | | arr = await this.getLawCarList(currentPage, pageSize, context); |
| | | }else{ |
| | | } else { |
| | | arr = await this.getSoilCarList(currentPage, pageSize, context) |
| | | } |
| | | this.tableData = arr.records; |
| | | this.totalNum = arr.total; |
| | | }, |
| | | // 获取执法车 |
| | | async getLawCarList(currentPage,pageSize,carNum){ |
| | | let arr =[]; |
| | | async getLawCarList(currentPage, pageSize, carNum) { |
| | | let arr = []; |
| | | await this.$axios({ |
| | | method:'get', |
| | | url:`sccg/car_Manage/query_enforce?current=${currentPage}&size=${pageSize}&carNum=${carNum}`, |
| | | method: 'get', |
| | | url: `sccg/car_Manage/query_enforce?current=${currentPage}&size=${pageSize}&carNum=${carNum}`, |
| | | }) |
| | | .then(res=>{ |
| | | arr = res.data; |
| | | }) |
| | | .then(res => { |
| | | arr = res.data; |
| | | }) |
| | | return arr; |
| | | }, |
| | | // 获取渣土车 |
| | | async getSoilCarList(currentPage,pageSize,carNum){ |
| | | let arr =[]; |
| | | async getSoilCarList(currentPage, pageSize, carNum) { |
| | | let arr = []; |
| | | await this.$axios({ |
| | | method:'get', |
| | | url:`sccg/car_Manage/query_slag?current=${currentPage}&size=${pageSize}&carNum=${carNum}`, |
| | | method: 'get', |
| | | url: `sccg/car_Manage/query_slag?current=${currentPage}&size=${pageSize}&carNum=${carNum}`, |
| | | }) |
| | | .then(res=>{ |
| | | arr = res.data; |
| | | }) |
| | | .then(res => { |
| | | arr = res.data; |
| | | }) |
| | | return arr; |
| | | }, |
| | | // 更改执法车/渣土车 |
| | |
| | | this.typeList.forEach((item, index) => { |
| | | if (index === idx) { |
| | | item.checked = true; |
| | | this.currentState=item.value; |
| | | } else { |
| | | item.checked = false; |
| | | } |
| | |
| | | }) |
| | | .catch(_ => { }); |
| | | }, |
| | | async JumpView(data){ |
| | | async JumpView(data) { |
| | | await this.getEventInfo(data.code); |
| | | }, |
| | | handleNoClose(done){ |
| | | handleNoClose(done) { |
| | | done(); |
| | | }, |
| | | opernDialog(data){ |
| | | opernDialog(data) { |
| | | this.dialogAdd = true; |
| | | this.caseId = data.id; |
| | | }, |
| | | // 关闭界面 |
| | | closeDialog({flag,index}){ |
| | | closeDialog({ flag, index }) { |
| | | this.dialogAdd = flag; |
| | | this.dialogEdit = flag |
| | | if(index===1){ |
| | | if (index === 1) { |
| | | this.getCarList(); |
| | | } |
| | | }, |
| | | handleView(data){ |
| | | handleView(data) { |
| | | this.info = data; |
| | | this.dialogView = true; |
| | | } |
| | | }, |
| | | selectChange(list) { |
| | | if (this.tempList.length !== 0) { |
| | | |
| | | this.preMyIdx = list; |
| | | this.mulDelete(this.tempList); |
| | | |
| | | } else { |
| | | this.myIdx = this.preMyIdx; |
| | | this.$message({ |
| | | type: "warning", |
| | | message: "您还没选中任何数据", |
| | | }); |
| | | } |
| | | }, |
| | | // 多条数据删除 |
| | | mulDelete(idArr) { |
| | | var path="" |
| | | if(this.currentState==1){ |
| | | path="/sccg/car_Manage/batch_deletion_enforce?ids=" |
| | | } |
| | | else{ |
| | | path="/sccg/car_Manage/batch_deletion_slag?ids=" |
| | | } |
| | | this.$confirm("您确定要批量删除车辆信息吗?") |
| | | .then((_) => { |
| | | this.$axios({ |
| | | method: "delete", |
| | | url: path + idArr, |
| | | }).then((res) => { |
| | | if (res.code === 200) { |
| | | this.$message({ |
| | | type: "success", |
| | | message: "批量删除车辆信息成功", |
| | | }); |
| | | this.getCarList(); |
| | | } else { |
| | | this.$message({ |
| | | type: "error", |
| | | message: res.message, |
| | | }); |
| | | } |
| | | }); |
| | | }) |
| | | .catch((err) => { |
| | | console.log(err); |
| | | }); |
| | | }, |
| | | } |
| | | } |
| | | </script> |
| | |
| | | text-align: left; |
| | | margin: 10px 20px; |
| | | color: #4b9bb7; |
| | | |
| | | header { |
| | | background-color: #09152f; |
| | | border: 1pox solid #fff; |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | &::v-deep .el-input__inner { |
| | | background-color: #09152f; |
| | | border: 1px solid #17324c; |
| | | } |
| | | |
| | | main { |
| | | background-color: #09152f; |
| | | margin-top: 20px; |
| | | padding-bottom: 50px; |
| | | border: 1pox solid #fff; |
| | | .btn span:hover{ |
| | | |
| | | .btn span:hover { |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .type-nav { |
| | | display: flex; |
| | | line-height: 40px; |
| | |
| | | |
| | | .funs { |
| | | display: flex; |
| | | .funs-sp{ |
| | | |
| | | .funs-sp { |
| | | border: 1px solid #17324c; |
| | | } |
| | | |
| | | .funsItem { |
| | | line-height: 28px; |
| | | display: flex; |
| | |
| | | width: 50px !important; |
| | | } |
| | | } |
| | | .line{ |
| | | |
| | | .line { |
| | | padding: 0 5px; |
| | | } |
| | | |
| | | &::v-deep .el-dialog__header, |
| | | &::v-deep .el-dialog__body { |
| | | background-color: #06122c; |