<el-dialog v-model="dialogFormVisible" :title="`${title}`"> | <el-dialog v-model="dialogFormVisible" :title="`${title}`"> | ||||
<!-- 是否自定义Dialog --> | <!-- 是否自定义Dialog --> | ||||
<div v-if="tableFrom.customDialog"> | <div v-if="tableFrom.customDialog"> | ||||
<slot name="search" :searchCondition="searchCondition" /> | |||||
</div> | |||||
<div v-else> | |||||
<!-- 系统内容 --> | |||||
<el-form ref="ruleFormRef" :rules="rules" :model="form"> | |||||
<el-form-item v-for="(item,index) in tableFrom.field" :label="item.label" :prop="item.prop" | |||||
:label-width="formLabelWidth"> | |||||
<!-- 输入框 --> | |||||
<div style="width: 100%;" v-if="item.form.type === 'input'"> | |||||
<el-input v-model="form[item.prop]" :type="item.itemType" | |||||
:placeholder="item.form.placeholder" /> | |||||
</div> | |||||
<!-- 选择框 --> | |||||
<div style="width: 100%;" v-else-if="item.form.type === 'select'"> | |||||
<el-select style="width: 100%;" v-model="form[item.prop]" | |||||
:placeholder="item.form.placeholder"> | |||||
<el-option v-for="(itemData,index) in item.form.listData" :label="itemData.label" | |||||
:value="itemData.value" /> | |||||
</el-select> | |||||
</div> | |||||
<!-- 日期框 --> | |||||
<div style="width: 100%;" v-else-if="item.form.type === 'date'"> | |||||
<el-date-picker style="width: 100%;" v-model="form[item.prop]" | |||||
:value-format="item.form.valueFormat" :type="item.form.itemType" | |||||
:placeholder="item.form.placeholder" /> | |||||
</div> | |||||
</el-form-item> | |||||
</el-form> | |||||
</div> | </div> | ||||
<!-- 系统内容 --> | |||||
<el-form ref="ruleFormRef" :rules="rules" :model="form"> | |||||
<el-form-item v-for="(item,index) in tableFrom.field" :label="item.label" :prop="item.prop" | |||||
:label-width="formLabelWidth"> | |||||
<!-- 输入框 --> | |||||
<div style="width: 100%;" v-if="item.form.type === 'input'"> | |||||
<el-input v-model="form[item.prop]" :type="item.itemType" | |||||
:placeholder="item.form.placeholder" /> | |||||
</div> | |||||
<!-- 选择框 --> | |||||
<div style="width: 100%;" v-else-if="item.form.type === 'select'"> | |||||
<el-select style="width: 100%;" v-model="form[item.prop]" :placeholder="item.form.placeholder"> | |||||
<el-option v-for="(itemData,index) in item.form.listData" :label="itemData.label" | |||||
:value="itemData.value" /> | |||||
</el-select> | |||||
</div> | |||||
<!-- 日期框 --> | |||||
<div style="width: 100%;" v-else-if="item.form.type === 'date'"> | |||||
<el-date-picker style="width: 100%;" v-model="form[item.prop]" | |||||
:value-format="item.form.valueFormat" :type="item.form.itemType" | |||||
:placeholder="item.form.placeholder" /> | |||||
</div> | |||||
</el-form-item> | |||||
</el-form> | |||||
<template #footer> | |||||
<template v-if="!tableFrom.customDialog" #footer> | |||||
<span class="dialog-footer"> | <span class="dialog-footer"> | ||||
<el-button @click="cancel">取消</el-button> | <el-button @click="cancel">取消</el-button> | ||||
<el-button type="primary" @click="affirm(ruleFormRef)">提交</el-button> | <el-button type="primary" @click="affirm(ruleFormRef)">提交</el-button> | ||||
// 声明事件 | // 声明事件 | ||||
const emit = defineEmits(['add', 'remove', 'refresh', 'edit', 'search', 'submit', 'handleEdit', 'handleDelete']) | const emit = defineEmits(['add', 'remove', 'refresh', 'edit', 'search', 'submit', 'handleEdit', 'handleDelete']) | ||||
// 声明props | // 声明props | ||||
const props = defineProps({ | const props = defineProps({ | ||||
homeData: { //表单配置 | homeData: { //表单配置 | ||||
const testData = ref(props.tableData) //表单数据 | const testData = ref(props.tableData) //表单数据 | ||||
const visible = ref(false) //删除提示框是否显示 | const visible = ref(false) //删除提示框是否显示 | ||||
const dialogFormVisible = ref(false) //表单弹框是否显示 | const dialogFormVisible = ref(false) //表单弹框是否显示 | ||||
const formLabelWidth = '80px' //默认表单宽度 | |||||
const formLabelWidth = '100px' //默认表单宽度 | |||||
const title = ref('添加') //表单标题 | const title = ref('添加') //表单标题 | ||||
const DStart = ref(true) //删除按钮状态 | const DStart = ref(true) //删除按钮状态 | ||||
const EStart = ref(true) //编辑按钮状态 | const EStart = ref(true) //编辑按钮状态 |
}, | }, | ||||
table: { | table: { | ||||
style: '', | style: '', | ||||
customDialog: false, | |||||
customDialog: false, //自定义Dialog (默认false) | |||||
titleDialog: '补卡信息', //自定义Dialog标题 | |||||
extend: [{ | extend: [{ | ||||
type: 'index', | type: 'index', | ||||
label: '序号', | label: '序号', | ||||
}, { | }, { | ||||
prop: 'name', | prop: 'name', | ||||
label: 'OBU状态', | label: 'OBU状态', | ||||
width: '120', | |||||
width: '', | |||||
form: { | form: { | ||||
required: true, | required: true, | ||||
type: 'input', | type: 'input', |
table: { //table 样式配置 | table: { //table 样式配置 | ||||
style: '', //默认表格样式 | style: '', //默认表格样式 | ||||
border: false, //是否添加边框(默认false) | border: false, //是否添加边框(默认false) | ||||
customDialog: false, //自定义Dialog (默认false) | |||||
titleDialog: '', //自定义Dialog标题 | |||||
extend: [{ //表头拓展 | extend: [{ //表头拓展 | ||||
type: '', //类型:selection,index,expand | type: '', //类型:selection,index,expand | ||||
width: '', //表头宽度 | width: '', //表头宽度 |
} | } | ||||
//提示点击 | //提示点击 | ||||
function hint(msg) { | function hint(msg) { | ||||
if (msg === '退出登录') { | if (msg === '退出登录') { | ||||
Cookies.remove('token') | Cookies.remove('token') | ||||
Cookies.remove('rememberPSWD') | Cookies.remove('rememberPSWD') |
phone: '13078580843', //手机号 | phone: '13078580843', //手机号 | ||||
region: '123', //验证码 | region: '123', //验证码 | ||||
delivery: false, //是否展示详细 | delivery: false, //是否展示详细 | ||||
number: '' //对公账户资金账户编号 | |||||
comName:'', | |||||
number: '', //对公账户资金账户编号 | |||||
comName:'' | |||||
}) | }) | ||||
<el-table-column prop="type" label="补卡金额" /> | <el-table-column prop="type" label="补卡金额" /> | ||||
<el-table-column prop="regname" label="录入时间" /> | <el-table-column prop="regname" label="录入时间" /> | ||||
<el-table-column label="操作" class="table_btn" width="150px" align="center"> | <el-table-column label="操作" class="table_btn" width="150px" align="center"> | ||||
<el-tooltip content="驳回" placement="top"> | |||||
<el-button type="warning" @click="dialogFormVisible = true">驳回审核</el-button> | |||||
</el-tooltip> | |||||
<el-tooltip content="审核通过" placement="top"> | |||||
<el-button type="warning" @click="dialogFormVisible = true">审核通过</el-button> | |||||
</el-tooltip> | |||||
<el-tooltip content="详细" placement="top"> | <el-tooltip content="详细" placement="top"> | ||||
<el-button type="warning" @click="dialogFormVisible = true">查看详细</el-button> | <el-button type="warning" @click="dialogFormVisible = true">查看详细</el-button> | ||||
</el-tooltip> | </el-tooltip> |
<template> | <template> | ||||
<div style="font-size: 13px; color: rgb(209, 65, 65);margin-left: 20px;"> | |||||
<div style="font-size: 13px; color: rgb(209, 65, 65);margin-left: 16px;"> | |||||
注:目前仅支持中国工商银行贵州省分行、中国工商银行股份有限公司贵州省分行、农业银行、部互联网发行、 | 注:目前仅支持中国工商银行贵州省分行、中国工商银行股份有限公司贵州省分行、农业银行、部互联网发行、 | ||||
世纪恒通、工行微ETC、工总行直连模式三、贵州农信联社、贵州工行微ETC、世纪恒通GH查询下黑原因! | 世纪恒通、工行微ETC、工总行直连模式三、贵州农信联社、贵州工行微ETC、世纪恒通GH查询下黑原因! | ||||
</div> | </div> | ||||
<el-input v-model="form.name" style="width: 215px" /> | <el-input v-model="form.name" style="width: 215px" /> | ||||
</el-form-item> | </el-form-item> | ||||
<el-form-item label="黑名单类型:" :label-width="150"> | <el-form-item label="黑名单类型:" :label-width="150"> | ||||
<el-select v-model="form" placeholder="请选择黑名单类型"> | |||||
<el-select v-model="form.region" placeholder="请选择黑名单类型"> | |||||
<el-option label="卡挂失" value="shanghai" /> | <el-option label="卡挂失" value="shanghai" /> | ||||
<el-option label="无卡挂起" value="beijing" /> | <el-option label="无卡挂起" value="beijing" /> | ||||
<el-option label="无卡销售" value="shanghai" /> | <el-option label="无卡销售" value="shanghai" /> |
<el-date-picker | <el-date-picker | ||||
v-model="value1" | v-model="value1" | ||||
type="datetime" | type="datetime" | ||||
placeholder="开始日志日期" | |||||
placeholder="开始日期" | |||||
format="YYYY/MM/DD hh:mm:ss" | format="YYYY/MM/DD hh:mm:ss" | ||||
/> | /> | ||||
v-model="value1" | v-model="value1" | ||||
type="datetime" | type="datetime" | ||||
placeholder="结束日志日期" | |||||
placeholder="结束日期" | |||||
format="YYYY/MM/DD hh:mm:ss" | format="YYYY/MM/DD hh:mm:ss" | ||||
style="margin-left: 5px;" | style="margin-left: 5px;" | ||||
/> | /> |