海洋无痕 3 年之前
父節點
當前提交
592976b6d9
共有 2 個檔案被更改,包括 452 行新增6 行删除
  1. 254
    3
      src/views/shengbo/blacklistQuery/blacklistQuery.vue
  2. 198
    3
      src/views/shengbo/trafficFlow/trafficFlow.vue

+ 254
- 3
src/views/shengbo/blacklistQuery/blacklistQuery.vue 查看文件

@@ -1,7 +1,258 @@
<template>
blacklistQuery
<div style="font-size: 13px; color: rgb(209, 65, 65)">
注:目前仅支持中国工商银行贵州省分行、中国工商银行股份有限公司贵州省分行、农业银行、部互联网发行、
世纪恒通、工行微ETC、工总行直连模式三、贵州农信联社、贵州工行微ETC、世纪恒通GH查询下黑原因!
</div>
<div class="top">
<!-- 输入框 -->
<div class="topstyle">
<span style="margin-right: 10px; width: 40px">卡号</span>
<el-input v-model="input4" placeholder="请输入卡号"> </el-input>
</div>
<!-- 日期框 -->
<div class="topstyle">
<el-date-picker
v-model="value1"
type="datetime"
placeholder="开始日期"
format="YYYY/MM/DD hh:mm:ss"
/>
<!-- <span>-</span> -->
<!-- <el-button>至</el-button> -->
<el-date-picker
v-model="value1"
type="datetime"
placeholder="结束日期"
format="YYYY/MM/DD hh:mm:ss"
style="margin-left: 5px"
/>
</div>
<!-- 下拉框 -->
<div class="topstyle">
<span style="margin-right: 10px">查询类型</span>
<el-select v-model="value1" style="width: 100px">
<el-option label="下黑" value="shanghai" />
<el-option label="反白" value="beijing" />
</el-select>
</div>
<!-- 按钮 -->
<div class="topstyle">
<el-button v-model="input4" type="success" :icon="Search" @click="search">搜索</el-button>
<el-button type="warning" :icon="Refresh" @click="reset">重置</el-button>
<el-button type="primary" :icon="Plus" @click="dialogFormVisible = true">添加</el-button>
<el-dialog v-model="dialogFormVisible" title="卡黑名单-操作(下黑反白)">
<el-form :model="form">
<el-form-item label="卡号:" :label-width="150">
<el-input v-model="form.name" style="width: 215px" />
</el-form-item>
<el-form-item label="黑名单类型:" :label-width="150">
<el-select v-model="form" placeholder="请选择黑名单类型">
<el-option label="卡挂失" value="shanghai" />
<el-option label="无卡挂起" value="beijing" />
<el-option label="无卡销售" value="shanghai" />
<el-option label="账户透支" value="beijing" />
<el-option label="合作机构黑名单" value="shanghai" />
<el-option label="车型不符" value="beijing" />
<el-option label="储值卡余额不足" value="shanghai" />
</el-select>
</el-form-item>
<el-form-item label="状态类型:" :label-width="150">
<el-select v-model="form.region" placeholder="请选择状态类型">
<el-option label="下黑" value="shanghai" />
<el-option label="反白" value="beijing" />
</el-select>
</el-form-item>
<el-form-item label="原因:" :label-width="150">
<el-input v-model="form.desc" type="textarea" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogFormVisible = false">关闭</el-button>
<el-button type="primary" @click="dialogFormVisible = false">提交</el-button>
</span>
</template>
</el-dialog>
</div>
</div>
<div style="padding-top: 12px">
<el-table :data="tableData" border style="width: 100%">
<el-table-column property="date1" label="序号" width="60" />
<el-table-column property="date2" label="卡号" width="120" />
<el-table-column property="date3" label="黑名单类型" width="100" />
<el-table-column property="date4" label="黑名单生效时间" width="170" />
<el-table-column property="date5" label="状态" width="60" />
<el-table-column property="date6" label="黑名单反白时间" width="130" />
<el-table-column property="date7" label="下黑操作工号" width="110" />
<el-table-column property="date8" label="下黑原因" width="200" />
<el-table-column property="date9" label="反白操作工号" width="130" />
<el-table-column property="date10" label="反白原因" width="110" />
<el-table-column label="操作" width="90">
<el-button @click="dialogFormVisible1 = true" style="border-style: none">详情</el-button>
</el-table-column>
</el-table>
<el-dialog v-model="dialogFormVisible1">
<span class="as-gravity-center" style="font-size: 22px">基本信息</span>
<el-form :model="form1" style="padding-top: 12px">
<el-form-item label="卡号:" :label-width="150">
<el-input v-model="form1.data" style="width: 215px" disabled />
</el-form-item>
</el-form>
<el-form :model="form1">
<el-form-item label="车辆号:" :label-width="150">
<el-input v-model="form1.data1" style="width: 215px" disabled />
</el-form-item>
</el-form>
<el-form :model="form1">
<el-form-item label="机构名称:" :label-width="150">
<el-input v-model="form1.data2" style="width: 215px" disabled />
</el-form-item>
</el-form>
<el-form :model="form1">
<el-form-item label="黑名单类型:" :label-width="150">
<el-input v-model="form1.data3" style="width: 215px" disabled />
</el-form-item>
</el-form>
<span class="as-gravity-center" style="font-size: 22px">黑名单上传日志</span>
<el-form :model="form1" style="padding-top: 12px">
<el-form-item label="上传日志:" :label-width="150" style="color: rgb(209, 65, 65)">
<el-input v-model="form1.data4" type="textarea" disabled />
</el-form-item>
</el-form>
<span class="as-gravity-center" style="font-size: 22px">渠道下黑原因</span>
<el-form :model="form1" style="padding-top: 12px">
<el-form-item label="查询结果:" :label-width="150" style="color: rgb(209, 65, 65)">
<el-input v-model="form1.data5" style="width: 215px" disabled />
</el-form-item>
</el-form>
<el-form :model="form1">
<el-form-item label="下黑原因:" :label-width="150" style="color: rgb(209, 65, 65)">
<el-input v-model="form1.data6" type="textarea" disabled />
</el-form-item>
</el-form>
<template #footer>
<span>
<el-button @click="dialogFormVisible1 = false">关闭</el-button>
</span>
</template>
</el-dialog>
</div>
<div style="padding-top: 12px" class="as-gravity-center-end">
<el-pagination :page-sizes="[10, 20, 30, 40]" layout="sizes, prev, pager, next" :total="1000" />
</div>
</template>

<script lang="ts" setup>
</script>
import { reactive, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { Calendar, Search, Refresh, Plus } from '@element-plus/icons-vue'
import type { ElTable } from 'element-plus'

const input3 = ref('')
const input4 = ref('')
const value1 = ref('')

function reset() {}
function search() {}
function addTo() {}
const dialogFormVisible = ref(false)
const dialogFormVisible1 = ref(false)
const form1 = reactive({
data: '52011640230217310678',
data1: '云AG9L76',
data2: '中国工商银行贵州省分行',
data3: '账户透支黑名单',
data4: '未查到黑名单上传日志!',
data5: '成功',
data6:
'银行卡号:621476*********6594,总欠额:229.78元,最后一次补扣时间:2022-05-09 07:31:06,失败原因:总行处理失败:帐户余额不足,请保证余额充足系统每天会自动补扣',
})
const form = reactive({
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: '',
})

interface User {
date1: string
date2: string
date3: string
date4: string
date5: string
date6: string
date7: string
date8: string
date9: string
date10: string
date11: string
}

const currentRow = ref()
const singleTableRef = ref<InstanceType<typeof ElTable>>()

const setCurrent = (row?: User) => {
singleTableRef.value!.setCurrentRow(row)
}
const handleCurrentChange = (val: User | undefined) => {
currentRow.value = val
}
const tableData: User[] = [
{
date1: '1',
date2: '52011640230217310678',
date3: '账户透支',
date4: '2020-12-19T03:41:04',
date5: '在黑',
date6: '',
date7: 'ETCGsyh002',
date8: '车牌尾号L76欠费:229.78元;于20201219进入黑名单',
date9: '',
date10: '',
date11: '',
},
{
date1: '2',
date2: '52011640230217310678',
date3: '账户透支',
date4: '2020-12-19T03:41:04',
date5: '在黑',
date6: '',
date7: 'ETCGsyh002',
date8: '车牌尾号L76欠费:229.78元;于20201219进入黑名单',
date9: '',
date10: '',
date11: '',
},
{
date1: '3',
date2: '52011640230217310678',
date3: '账户透支',
date4: '2020-12-19T03:41:04',
date5: '在黑',
date6: '',
date7: 'ETCGsyh002',
date8: '车牌尾号L76欠费:229.78元;于20201219进入黑名单',
date9: '',
date10: '',
date11: '',
},
]
</script>
<style lang="scss" scoped>
.top {
display: flex;
margin-left: 10px;
}
.topstyle {
display: flex;
height: 50px;
margin-right: 10px;
align-items: center;
justify-content: flex-start;
}
</style>

+ 198
- 3
src/views/shengbo/trafficFlow/trafficFlow.vue 查看文件

@@ -1,7 +1,202 @@
<template>
trafficFlow
<div class="top">
<!-- 输入框 -->
<div class="topstyle">
<el-input v-model="input4" placeholder="请输入ETC卡号"> </el-input>
</div>
<div class="topstyle">
<el-input v-model="input4" placeholder="请输入车牌号"> </el-input>
</div>
<!-- 日期框 -->
<div class="topstyle" >
<el-date-picker
v-model="value1"
type="datetime"
placeholder="开始日志日期"
format="YYYY/MM/DD hh:mm:ss"
/>
<!-- <span>-</span> -->
<!-- <el-button>至</el-button> -->
<el-date-picker
v-model="value1"
type="datetime"
placeholder="结束日志日期"
format="YYYY/MM/DD hh:mm:ss"
style="margin-left: 5px;"
/>
</div>
<!-- 按钮 -->
<div class="topstyle">
<el-button v-model="input4" type="success" :icon="Search" @click="search">搜索</el-button>
<el-button type="warning" :icon="Refresh" @click="reset">重置</el-button>
<el-button type="primary" plain @click="exportCurrentPage">导出当前页</el-button>
<el-button type="primary" plain @click="exportAll">导出所有</el-button>
</div>
</div>
<div style="padding-top: 12px">
<el-table :data="tableData" border style="width: 100%">
<el-table-column property="date1" label="序号" width="60" />
<el-table-column property="date2" label="ETC卡号" width="140" />
<el-table-column property="date3" label="车牌号" width="100" />
<el-table-column property="date4" label="消费类型" width="90" />
<el-table-column property="date5" label="入口时间" width="110" />
<el-table-column property="date6" label="入口站名" width="110" />
<el-table-column property="date7" label="出口时间" width="110" />
<el-table-column property="date8" label="出口站名" width="110" />
<el-table-column property="date9" label="交易前余额(元)" width="140" />
<el-table-column property="date10" label="交易金额(元)" width="125" />
<el-table-column property="date11" label="交易后金额(元)" width="140" />
</el-table>
</div>
<div style="padding-top: 12px" class="as-gravity-center-end">
<el-pagination
:page-sizes="[10, 20, 30, 40]"
layout="sizes, prev, pager, next"
:total="1000"
/>
</div>
</template>

<script lang="ts" setup>
</script>
import { reactive, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { Calendar, Search, Refresh } from '@element-plus/icons-vue'
import type { ElTable } from 'element-plus'

const input3 = ref('')
const input4 = ref('')
const value1 = ref('')

function reset() {}
function search() {}
function exportCurrentPage() {}
function exportAll() {}

interface User {
date1: string
date2: string
date3: string
date4: string
date5: string
date6: string
date7: string
date8: string
date9: string
date10: string
date11: string
}

const currentRow = ref()
const singleTableRef = ref<InstanceType<typeof ElTable>>()

const setCurrent = (row?: User) => {
singleTableRef.value!.setCurrentRow(row)
}
const handleCurrentChange = (val: User | undefined) => {
currentRow.value = val
}
// const objectService = {
// url: 'http://localhost:8888/list2',
// }

// const { data } = useRequest(objectService)
// console.log(data.value);

// const tableData = data
const tableData: User[] = [
{
date1: '1',
date2: '52011328220200481698',
date3: '贵A710AE',
date4: '省内流水',
date5: '2019-12-27 20:14:02',
date6: '贵阳西主线站',
date7: '2019-12-27 20:18:20',
date8: '贵阳西主线站',
date9: '38.25',
date10: '0.00',
date11: '38.25',
},
{
date1: '2',
date2: '52011328220200481698',
date3: '贵A710AE',
date4: '省内流水',
date5: '2019-12-27 20:14:02',
date6: '贵阳西主线站',
date7: '2019-12-27 20:18:20',
date8: '贵阳西主线站',
date9: '38.25',
date10: '0.00',
date11: '38.25',
},
{
date1: '3',
date2: '52011328220200481698',
date3: '贵A710AE',
date4: '省内流水',
date5: '2019-12-27 20:14:02',
date6: '贵阳西主线站',
date7: '2019-12-27 20:18:20',
date8: '贵阳西主线站',
date9: '38.25',
date10: '0.00',
date11: '38.25',
},
{
date1: '4',
date2: '52011328220200481698',
date3: '贵A710AE',
date4: '省内流水',
date5: '2019-12-27 20:14:02',
date6: '贵阳西主线站',
date7: '2019-12-27 20:18:20',
date8: '贵阳西主线站',
date9: '38.25',
date10: '0.00',
date11: '38.25',
},
{
date1: '5',
date2: '52011328220200481698',
date3: '贵A710AE',
date4: '省内流水',
date5: '2019-12-27 20:14:02',
date6: '贵阳西主线站',
date7: '2019-12-27 20:18:20',
date8: '贵阳西主线站',
date9: '38.25',
date10: '0.00',
date11: '38.25',
},
{
date1: '6',
date2: '52011328220200481698',
date3: '贵A710AE',
date4: '省内流水',
date5: '2019-12-27 20:14:02',
date6: '贵阳西主线站',
date7: '2019-12-27 20:18:20',
date8: '贵阳西主线站',
date9: '38.25',
date10: '0.00',
date11: '38.25',
},
]
</script>
<style lang="scss" scoped>
.top {
display: flex;
margin-left: 10px;
}
.topstyle {
display: flex;
height: 40px;

margin-right: 10px;
align-items: center;
justify-content: flex-start;
}
</style>

Loading…
取消
儲存