From 105abcb08f5d1c1114ce0e093d1a4912fbbfd609 Mon Sep 17 00:00:00 2001
From: kongdeqiang <123456>
Date: 星期五, 09 六月 2023 16:43:47 +0800
Subject: [PATCH] 修改前端页面
---
src/components/page/ticket/index.vue | 463 +++++++++++++++++++++++++++++++--------------------------
1 files changed, 253 insertions(+), 210 deletions(-)
diff --git a/src/components/page/ticket/index.vue b/src/components/page/ticket/index.vue
index aabbb65..6e54bd2 100644
--- a/src/components/page/ticket/index.vue
+++ b/src/components/page/ticket/index.vue
@@ -1,226 +1,269 @@
<template>
- <section>
- <el-card class="box-card toolCard">
- <div slot="header" class="clearfix">
- <!--鏄剧ず瀵艰埅-->
- <el-breadcrumb separator="/">
- <el-breadcrumb-item :to="{ path: '/' }">棣栭〉</el-breadcrumb-item>
- <el-breadcrumb-item>
- <a href="javascript:void(0);">绯荤粺绠＄悊</a>
- </el-breadcrumb-item>
- <el-breadcrumb-item>鐢ㄦ埛绠＄悊</el-breadcrumb-item>
- </el-breadcrumb>
- </div>
- <!--<div class="text item">-->
- <!--宸ュ叿鏉�-->
- <!--<section class="toolbar">-->
+ <div class="mod-config" style="padding: 10px 10px 0px 10px;">
+ <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
+ <el-form-item label="杞︾墝鍙�">
+ <el-input v-model="searchForm.carNo" clearable></el-input>
+ </el-form-item>
+ <el-form-item label="浜嬩欢绫诲瀷">
+ <el-select v-model="searchForm.type" placeholder="璇烽�夋嫨" clearable>
+ <el-option label="鐜板満澶勭綒" :value="0"></el-option>
+ <el-option label="涓婄骇浠诲姟" :value="1"></el-option>
+ <el-option label="杩濈珷鎷栬溅" :value="2"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="缂磋垂鐘舵��">
+ <el-select v-model="searchForm.payStatus" placeholder="璇烽�夋嫨" clearable>
+ <el-option label="寰呯即璐�" :value="0"></el-option>
+ <el-option label="宸茬即璐�" :value="1"></el-option>
+ <el-option label="缂磋垂澶辫触" :value="2"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="杩濈珷绫诲瀷">
+ <el-select v-model="searchForm.violationTypeId" clearable>
+ <el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" size="small" @click="getDataList" icon="el-icon-search">鏌ヨ</el-button>
+ </el-form-item>
+ </el-form>
- <!--</section>-->
- <el-form :inline="true" :model="searchForm">
- <el-form-item label="鍚嶇О">
- <el-input v-model="searchForm.name" placeholder="鍚嶇О"></el-input>
- </el-form-item>
- <el-form-item label="鎵嬫満鍙�">
- <el-input v-model="searchForm.phone" placeholder="鎵嬫満鍙�"></el-input>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" size="small" @click="onSearch" icon="el-icon-search">鏌ヨ</el-button>
- <el-button type="primary" size="small" @click="onAdd" icon="el-icon-plus">澧炲姞</el-button>
- <el-button type="primary" size="small" @click="onInitPassword" icon="el-icon-refresh">鍒濆鍖栧瘑鐮�</el-button>
- <el-button type="primary" size="small" @click="onSetUserImage" icon="el-icon-picture-outline">璁剧疆澶村儚</el-button>
- <el-button type="primary" size="small" @click="onChangeDept" icon="el-icon-picture-outline">璋冩崲閮ㄩ棬</el-button>
- </el-form-item>
- </el-form>
-
- <!--</div>-->
- </el-card>
-
- <!--鍒楄〃鏁版嵁-->
- <el-table :data="pageData.rows" v-loading="pageData.isLoading" :element-loading-text="pageData.loadingText"
- border
- :height="pageConfig.maxHeight"
- stripe tooltip-effect="dark" style="width:100%; height:100%" @selection-change="onSelectionChange" @row-click="clickRow"
- ref="mulTable">
- <!--<el-table-column-->
- <!--type="selection"-->
- <!--width="50">
- </el-table-column>-->
- <el-table-column prop="loginName" label="鐧诲綍鍚�">
+ <div class="avue-crud">
+ <el-table
+ :height="tableHeight"
+ :data="pageData.rows"
+ border
+ v-loading="pageData.isLoading">
+ <el-table-column
+ type="index"
+ width="50"
+ label="搴忓彿"
+ align="center">
+ </el-table-column>
+ <el-table-column
+ prop="carNo"
+ width="100px"
+ header-align="center"
+ align="center"
+ label="杞︾墝鍙�">
+ </el-table-column>
+ <el-table-column
+ prop="type"
+ width="100px"
+ header-align="center"
+ align="center"
+ label="浜嬩欢绫诲瀷">
+ <template slot-scope="scope">
+ <p v-if="scope.row.type==0" >鐜板満澶勭綒</p>
+ <p v-if="scope.row.type==1">涓婄骇浠诲姟</p>
+ <p v-if="scope.row.type==2">杩濈珷鎷栬溅</p>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="carType"
+ width="90px"
+ header-align="center"
+ align="center"
+ label="杞﹁締绫诲瀷">
+ </el-table-column>
+ <el-table-column
+ prop="color"
+ width="90px"
+ header-align="center"
+ align="center"
+ label="杞﹁締棰滆壊">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ header-align="center"
+ align="center"
+ label="杩濇硶鍦扮偣">
</el-table-column>
- <el-table-column prop="name" label="濮撳悕">
- </el-table-column>
- <el-table-column prop="sexStr" label="鎬у埆鍚�">
- </el-table-column>
- <el-table-column prop="age" label="骞撮緞">
- </el-table-column>
- <el-table-column prop="deptName" label="鎵�鍦ㄩ儴闂�">
- </el-table-column>
- <el-table-column prop="post" label="鑱屼綅">
- </el-table-column>
- <el-table-column prop="phone" label="鎵嬫満鍙�">
- </el-table-column>
- <el-table-column prop="roleNames" label="瑙掕壊">
- </el-table-column>
- <el-table-column prop="status" label="鐘舵��">
- </el-table-column>
- <el-table-column prop="lastLoginTime" label="鏈�杩戠櫥褰曟椂闂�">
+ <el-table-column
+ prop="money"
+ width="100px"
+ header-align="center"
+ align="center"
+ label="搴旂即閲戦">
</el-table-column>
- <el-table-column label="鎿嶄綔" fixed="right" width="250">
- <template slot-scope="scope">
- <el-button
- size="mini"
- @click="onEdit(scope.$index, scope.row)">缂栬緫
- </el-button>
- <el-button
- size="mini"
- type="danger"
- @click="onStop(scope.$index, scope.row)">鍋滅敤
- </el-button>
- <el-button
- size="mini"
- @click="onStart(scope.$index, scope.row)">鍚敤
- </el-button>
- </template>
+ <el-table-column
+ prop="payStatus"
+ width="100px"
+ header-align="center"
+ align="center"
+ label="缂磋垂鐘舵��">
+ <template slot-scope="scope">
+ <p v-if="scope.row.payStatus==0" style="color: red">寰呯即璐�</p>
+ <p v-if="scope.row.payStatus==1">宸茬即璐�</p>
+ <p v-if="scope.row.payStatus==2" style="color: blue">缂磋垂澶辫触</p>
+ </template>
</el-table-column>
+ <el-table-column
+ prop="userName"
+ width="100px"
+ header-align="center"
+ align="center"
+ label="澶勭悊浜�">
+ </el-table-column>
+ <el-table-column
+ prop="violationTypeName"
+ header-align="center"
+ align="center"
+ width="100px"
+ label="杩濈珷绫诲瀷">
+ </el-table-column>
+ <el-table-column
+ prop="remark"
+ header-align="center"
+ align="center"
+ label="澶囨敞">
+ </el-table-column>
+ <el-table-column
+ width="300px"
+ fixed="right"
+ header-align="center"
+ align="center"
+ label="鎿嶄綔">
+ <template slot-scope="scope">
+ <el-button type="text" size="small" icon="el-icon-document" @click="addOrUpdateHandle(scope.row.id)">澶勫喅涔�</el-button>
+ <el-button type="text" size="small" icon="el-icon-document-checked" @click="addOrUpdateHandle2(scope.row)">閫佽揪鍥炶瘉</el-button>
+ <el-button type="text" size="small" icon="el-icon-view" @click="pictureHandle(scope.row)">鍥惧儚璇佹嵁</el-button>
+ <el-button v-if="items==2" type="text" size="small" icon="el-icon-delete" @click="onDelete(scope.row.id)">鎾ら攢</el-button>
+<!-- <el-button type="text" size="small" icon="el-pay6zhifu" @click="jiaofeiHandle(scope.row.id)">鐜板満缂磋垂</el-button>-->
+ </template>
+ </el-table-column>
</el-table>
- <!--鍒嗛〉淇℃伅-->
- <el-pagination
- background
- @size-change="onPageSizeChange"
- @current-change="onCurrentPageChange"
- :current-page="pageData.currentPage"
- :page-sizes="[10, 20, 30, 40, 50, 100, 200]"
- :page-size="pageData.pageSize"
- layout="total, sizes, jumper, prev, pager, next"
- :total="pageData.total">
- </el-pagination>
- </section>
+ <el-pagination background @size-change="onPageSizeChange" @current-change="onCurrentPageChange" :current-page="pageData.currentPage" :page-size="pageData.pageSize" :total="pageData.total" style="float: right"></el-pagination>
+
+ </div>
+
+ <!-- 寮圭獥, 鏂板 / 淇敼 -->
+ <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></table-form>
+ <table-form2 v-if="addOrUpdateVisible2" ref="addOrUpdate2" @refreshDataList="getDataList"></table-form2>
+ <!--鍥惧儚璇佹嵁-->
+ <pictureForm v-if="pictureFormVisiable" ref="pictureForm"></pictureForm>
+ </div>
</template>
<script>
- // 瀵煎叆鏂板缁勪欢
- import addDialog from './AddDialog'
- export default {
- name: "UserIndex",
- data: function () {
- return {
- pageConfig: {
- pageDataUrl: this.$systemconfig.basePath + '/security/user/list',
- stopUrl: this.$systemconfig.basePath + '/security/user/stop',
- startUrl: this.$systemconfig.basePath + '/security/user/start',
- initPasswordUrl:this.$systemconfig.basePath+'/security/user/restoreInitialPassword',
- },
- // 鏌ヨ鏁版嵁
- searchForm: {
- name: ''
- },
- // 椤甸潰鏁版嵁
- pageData: this.$byutil.defaultPageData()
- }
+ import TableForm from './ticket-form'
+ import TableForm2 from './ticket-form2'
+ import pictureForm from './picture-form'
+ import {mapState} from 'vuex'
+ export default {
+ data () {
+ return {
+ tableHeight:650,
+ dataForm: {
+ key: ''
},
- // 寮曞叆缁勪欢
- components: {
- addDialog: addDialog
+ table1:[],
+ pageData: this.$byutil.defaultPageData(),
+ searchForm: {
+ current:this.pageIndex,
+ size:this.pageSize,
+ carNo:'',
+ type:null,
+ violationTypeId:null,
+ payStatus:null,
},
- // 鎵ц鍒濆鍖栨暟鎹�
- mounted() {
- this.$byutil.initTableMaxHeight(this);
- this.loadData();
- },
- // 鏂规硶
- methods: {
- //鍔犺浇鏁版嵁
- loadData() {
- this.$byutil.loadPageData(this, this.pageConfig.pageDataUrl, this.searchForm);
- },
- // 鐐瑰嚮鏌ヨ鎸夐挳
- onSearch() {
- this.pageData = this.$byutil.defaultPageData();
- this.loadData();
- },
- // 鐐瑰嚮鏂板鎸夐挳
- onAdd() {
- this.$refs.addDialog.showDialog(true);
- },
- // 鐐瑰嚮缂栬緫鎸夐挳
- onEdit(index, row) {
- this.$refs.addDialog.showDialog(true);
- //鍒濆鍖栨棫鏁版嵁
- this.$refs.addDialog.initData(row);
- },
- // 鐐瑰嚮鍋滅敤
- onStop(index, row) {
- if(row.status == "鍒犻櫎"){
- alert("宸茬粡鍋滅敤锛屼笉鑳藉啀娆″仠鐢�");
- return;
- }
- this.$byutil.stopData(this, this.pageConfig.stopUrl, row);
- },
- // 鐐瑰嚮鍚敤
- onStart(index, row) {
- if(row.status == "姝ｅ父"){
- alert("姝ｅ父鐘舵�侊紝涓嶈兘鍐嶆鍚敤");
- return;
- }
- this.$byutil.startData(this, this.pageConfig.startUrl, row);
- },
- // 澶氶�夋椂
- onSelectionChange(val) {
- // this.pageData.multipleSelection = val
- },
- // 鍒囨崲姣忛〉鏄剧ず鏉℃暟
- onPageSizeChange(val) {
- this.pageData.pageSize = val;
- this.loadData();
- },
- // 璺宠浆椤�
- onCurrentPageChange(val) {
- this.pageData.page = val;
- this.loadData();
- },
- //鍗曢��
- clickRow(val){
- this.pageData.signSelection = val
+ dataList: [],
+ pageIndex: 1,
+ pageSize: 10,
+ totalPage: 0,
+ dataListLoading: false,
+ addOrUpdateVisible: false,
+ addOrUpdateVisible2: false,
+ pictureFormVisiable:false, //鍥惧儚璇佹嵁寮规
+ }
+ },
+ components: {
+ TableForm,
+ TableForm2,
+ pictureForm
+ },
+ created () {
+ this.getDataList()
+ this.findAllViolation()
+ this.tableHeight = window.innerHeight - 255
+ },
+ computed: {
+ ...mapState({
+ items:'roles'
+ }),
+ },
+ methods: {
+ // 鑾峰彇鏁版嵁鍒楄〃
+ getDataList () {
+ this.dataListLoading = true
+ this.searchForm.current=this.pageIndex
+ this.searchForm.size=this.pageSize
+ this.$byutil.loadPageData(this, this.$systemconfig.basePath+'/ffzf/ticket/findPage', this.searchForm);
+ this.dataListLoading = false
+ },
+ findAllViolation(){
+ this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/violationtype/findAll', this.formData, res => {
+ this.table1 = res.data;
+ })
+ },
+ onPageSizeChange(val) {
+ this.pageData.pageSize = val;
+ this.getDataList();
+ },
+ onCurrentPageChange(val) {
+ this.pageData.page = val;
+ this.getDataList();
+ },
+ pictureHandle(data) {
+ console.log(data,'data=====')
+ let imgArry = []
+ if(data.img) {
+ imgArry = data.img.split(',')
+ console.log(imgArry,'imgArry====')
+ }
+ this.pictureFormVisiable = true
+ this.$nextTick(() => {
+ this.$refs.pictureForm.init(imgArry)
+ })
- },
- // 璁剧疆澶村儚
- onSetUserImage (){
- let row = this.pageData.signSelection;
- if(!row){
- this.$alert('璇烽�夋嫨鐢ㄦ埛', {'title': '鎻愮ず','type': 'warning','center': true,'showClose': false});
- return;
- }
- this.$refs.setUserImageDialog.showDialog(true);
- this.$refs.setUserImageDialog.initData(row);
- },
-
- // 璋冩崲閮ㄩ棬
- onChangeDept (){
- let row = this.pageData.signSelection;
- if(!row){
- this.$alert('璇烽�夋嫨鐢ㄦ埛', {'title': '鎻愮ず','type': 'warning','center': true,'showClose': false});
- return;
- }
- this.$refs.changeDeptDialog.showDialog(true);
- this.$refs.changeDeptDialog.initData(row);
- },
-
- //鍒濆鍖栧瘑鐮�
- onInitPassword(){
- let row = this.pageData.signSelection;
- if(!row){
- this.$alert('璇烽�夋嫨鐢ㄦ埛', {'title': '鎻愮ず','type': 'warning','center': true,'showClose': false});
- return;
- }
- this.$byutil.postData(this,this.pageConfig.initPasswordUrl,row,res=>{
- this.$alert(row.name+'鍒濆鍖栧瘑鐮佹垚鍔�', {'title': '鎻愮ず','type': 'success','center': true,'showClose': false});
- })
- }
+ },
+ // 鏂板 / 淇敼
+ addOrUpdateHandle (id) {
+ this.addOrUpdateVisible = true
+ this.$nextTick(() => {
+ this.$refs.addOrUpdate.init(id)
+ })
+ },
+ // 鏂板 / 淇敼
+ addOrUpdateHandle2 (row) {
+ if(row.personName != null){
+ this.addOrUpdateVisible2 = true
+ this.$nextTick(() => {
+ this.$refs.addOrUpdate2.init(row.id)
+ })
+ }else {
+ this.$message.error("澶勫喅涔﹁繕鏈～鍐欙紒")
}
+
+ },
+ //鐜板満缂磋垂
+ jiaofeiHandle(id){
+ this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/ticket/jiaofei', {id:id}, res => {
+ if(res.code===0){
+ this.$message.success(res.msg)
+ }else {
+ this.$message.error(res.msg)
+ }
+ })
+ },
+ //鍒犻櫎
+ onDelete(id) {
+ this.$byutil.deleteData(this,this.$systemconfig.basePath+'/ffzf/ticket/delete',{id:id}, res => {
+ this.$message({message: '鎾ら攢鎴愬姛', type: 'success'});
+ this.getDataList();
+ })
+ },
}
+ }
</script>
-
-<style scoped>
-
-</style>
\ No newline at end of file
--
Gitblit v1.9.1