瀏覽代碼

调整渠道方配置页面

xz
zhoujie 9 月之前
父節點
當前提交
924b2d92bd

+ 382
- 155
src/views/interfaceManage/channelConfig/index.vue 查看文件

@@ -1,140 +1,328 @@
<template>
<div>
<crud-template v-if="itemStart" class="as-weight" :ref="(el) => crudRef = el" :home-data="field"
@btnSearch="btnSearch" @refreshLeft="refreshLeft" :initData="initItem" :tableData="tableData"
@handleEdit="handleEdit" @handleRemark="handleRemark" @cancel="cancel" @CurrentChange="handleCurrentChange">
<crud-template
v-if="itemStart"
class="as-weight"
:ref="(el) => (crudRef = el)"
:home-data="field"
@btnSearch="btnSearch"
@refreshLeft="refreshLeft"
:initData="initItem"
:tableData="tableData"
@handleEdit="handleEdit"
@handleRemark="handleRemark"
@cancel="cancel"
@CurrentChange="handleCurrentChange"
>
<template #search>
<el-input maxlength="60" v-trim clearable v-model="searchForm.sourceIdentId" style="width: 200px"
placeholder="请输入来源方ID" />
<el-input maxlength="60" v-trim clearable v-model="searchForm.sourceIdentName" style="width: 200px"
placeholder="请输入渠道名称" />
<el-input maxlength="60" v-trim clearable v-model="searchForm.institutionalCode" style="width: 200px"
placeholder="请输入机构编码" />
<el-select clearable v-model="searchForm.status" style="width: 200px" placeholder="请选择状态">
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
<el-input
maxlength="60"
v-trim
clearable
v-model="searchForm.sourceIdentId"
style="width: 200px"
placeholder="请输入来源方ID"
/>
<el-input
maxlength="60"
v-trim
clearable
v-model="searchForm.sourceIdentName"
style="width: 200px"
placeholder="请输入渠道名称"
/>
<el-input
maxlength="60"
v-trim
clearable
v-model="searchForm.institutionalCode"
style="width: 200px"
placeholder="请输入机构编码"
/>
<el-select
clearable
v-model="searchForm.status"
style="width: 200px"
placeholder="请选择状态"
>
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</template>
<template #operation="{ scope }">
<!-- <el-button v-if="IsPermission(route, 'RESET_KEY_SM3')" type="warning" size="small"
@click="resetKey(scope.row, 1)">
重置SM3密钥
<el-button
v-if="IsPermission(route, 'RESET_KEY_SM3')"
type="warning"
size="small"
@click="resetKey(scope.row, 'SM3')"
>
重置签名密钥
</el-button>
<el-button
v-if="IsPermission(route, 'RESET_KEY_SM4')"
type="warning"
size="small"
@click="resetKey(scope.row, 'SM4')"
>
重置加密密钥
</el-button>
<el-button v-if="IsPermission(route, 'RESET_KEY_SM4')" type="warning" size="small"
@click="resetKey(scope.row, 2)">
重置SM4密钥
</el-button> -->
</template>
<!-- 状态tag -->
<template #statusTage="{ scope }">
<el-tag :type="scope.row.status === 'DISABLE' ? 'danger' : ''">{{ getDictLabel(statusList,
scope.row.status) }}</el-tag>
<el-tag :type="scope.row.status === 'DISABLE' ? 'danger' : ''">
{{ getDictLabel(statusList, scope.row.status) }}
</el-tag>
</template>
<template #ipValidTag="{ scope }">
<el-tag :type="scope.row.ipValid === 'DISABLE' ? 'danger' : ''">{{ getDictLabel(statusList,
scope.row.ipValid) }}</el-tag>
<el-tag :type="scope.row.ipValid === 'DISABLE' ? 'danger' : ''">
{{ getDictLabel(statusList, scope.row.ipValid) }}
</el-tag>
</template>
<template #signValidTag="{ scope }">
<el-tag :type="scope.row.signValid === 'DISABLE' ? 'danger' : ''">{{ getDictLabel(statusList,
scope.row.signValid) }}</el-tag>
<el-tag :type="scope.row.signValid === 'DISABLE' ? 'danger' : ''">
{{ getDictLabel(statusList, scope.row.signValid) }}
</el-tag>
</template>
<template #secretValidTag="{ scope }">
<el-tag :type="scope.row.secretValid === 'DISABLE' ? 'danger' : ''">{{ getDictLabel(statusList,
scope.row.secretValid) }}</el-tag>
<el-tag :type="scope.row.secretValid === 'DISABLE' ? 'danger' : ''">
{{ getDictLabel(statusList, scope.row.secretValid) }}
</el-tag>
</template>
<template #dialog>
<el-form label-position="right" label-width="110px" :model="addForm" :rules="rules"
:ref="(el) => dataFormRef = el" :hide-required-asterisk="typeOption === 'view'" v-loading="formLoding">
<!-- <el-form-item label="渠道方ID:" prop="sourceIdentId" v-if="typeOption === 'view'">
<span>{{ addForm.sourceIdentId }}</span>
</el-form-item> -->
<el-form
label-position="right"
label-width="120px"
:model="addForm"
:rules="rules"
:ref="(el) => (dataFormRef = el)"
:hide-required-asterisk="typeOption === 'view'"
v-loading="formLoding"
>
<el-form-item label="appid:" prop="sourceIdentId">
<el-input
maxlength="8"
type="number"
v-trim
clearable
v-model="addForm.sourceIdentId"
placeholder="请输入APPID"
:disabled="typeOption === 'edit'"
v-if="typeOption !== 'view'"
/>
<span v-else>{{ addForm.sourceIdentId }}</span>
</el-form-item>

<el-form-item label="渠道名称:" prop="sourceIdentName">
<el-input maxlength="60" v-trim clearable v-model="addForm.sourceIdentName" placeholder="请输入渠道名称"
v-if="typeOption !== 'view'" />
<el-input
maxlength="60"
v-trim
clearable
v-model="addForm.sourceIdentName"
placeholder="请输入渠道名称"
v-if="typeOption !== 'view'"
/>
<span v-else>{{ addForm.sourceIdentName }}</span>
</el-form-item>
<el-form-item label="机构编码:" prop="institutionalCode">
<el-input maxlength="60" v-trim clearable v-model="addForm.institutionalCode" placeholder="请输入机构编码"
v-if="typeOption !== 'view'" />
<el-input
maxlength="60"
v-trim
clearable
v-model="addForm.institutionalCode"
placeholder="请输入机构编码"
v-if="typeOption !== 'view'"
/>
<span v-else>{{ addForm.institutionalCode }}</span>
</el-form-item>
<el-form-item label="每日可访问次数:" prop="visitTimes">
<div style="width: 100%">
<el-input maxlength="60" v-trim clearable v-model="addForm.visitTimes" placeholder="每日可访问次数"
v-if="typeOption !== 'view'" />
<el-input
maxlength="60"
v-trim
clearable
v-model="addForm.visitTimes"
placeholder="每日可访问次数"
v-if="typeOption !== 'view'"
/>
<span v-else>{{ addForm.visitTimes }}</span>
</div>
</el-form-item>
<el-form-item label="IP校验:" prop="ipValid">
<div style="width: 100%">
<el-select clearable v-model="addForm.ipValid" style="width: 100%" placeholder="请选择IP校验"
v-if="typeOption !== 'view'">
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
<el-select
clearable
v-model="addForm.ipValid"
style="width: 100%"
placeholder="请选择IP校验"
v-if="typeOption !== 'view'"
>
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<span v-else>{{ getDictLabel(statusList, addForm.ipValid) }}</span>
<span v-else>
{{ getDictLabel(statusList, addForm.ipValid) }}
</span>
</div>
</el-form-item>
<el-form-item label="sign校验:" prop="signValid">
<div style="width: 100%">
<el-select clearable v-model="addForm.signValid" style="width: 100%" placeholder="请选择sign校验"
v-if="typeOption !== 'view'">
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
<el-select
clearable
v-model="addForm.signValid"
style="width: 100%"
placeholder="请选择sign校验"
v-if="typeOption !== 'view'"
>
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<span v-else>{{ getDictLabel(statusList, addForm.signValid) }}</span>
<span v-else>
{{ getDictLabel(statusList, addForm.signValid) }}
</span>
</div>
</el-form-item>
<el-form-item label="加密校验:" prop="secretValid">
<div style="width: 100%">
<el-select clearable v-model="addForm.secretValid" style="width: 100%" placeholder="请选择加密校验"
v-if="typeOption !== 'view'">
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
<el-select
clearable
v-model="addForm.secretValid"
style="width: 100%"
placeholder="请选择加密校验"
v-if="typeOption !== 'view'"
>
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<span v-else>{{ getDictLabel(statusList, addForm.signValid) }}</span>
<span v-else>
{{ getDictLabel(statusList, addForm.signValid) }}
</span>
</div>
</el-form-item>
<el-form-item label="状态:" prop="status" v-if="typeOption === 'edit'">
<el-form-item
label="状态:"
prop="status"
v-if="typeOption === 'edit'"
>
<div style="width: 100%">
<el-select clearable v-model="addForm.status" style="width: 100%" placeholder="请选择状态">
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value" />
<el-select
clearable
v-model="addForm.status"
style="width: 100%"
placeholder="请选择状态"
>
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</div>
</el-form-item>
<el-form-item label="状态:" v-if="typeOption === 'view'">
<div style="width: 100%"><span>{{
getDictLabel(statusList, addForm.status)
}}</span></div>
<div style="width: 100%">
<span>{{ getDictLabel(statusList, addForm.status) }}</span>
</div>
</el-form-item>
<el-form-item label="加密密钥:" v-if="typeOption === 'view'">
<div style="width: 100%">
<span>{{ addForm.secretKey }}</span>
<el-button
size="small"
@click="copys(addForm.secretKey)"
style="margin-left: 10px"
>
复制
</el-button>
</div>
</el-form-item>
<el-form-item label="签名密钥:" v-if="typeOption === 'view'">
<div style="width: 100%">
<span>{{ addForm.signKey }}</span>
<el-button
size="small"
@click="copys(addForm.signKey)"
style="margin-left: 10px"
>
复制
</el-button>
</div>
</el-form-item>
<el-form-item label="创建时间:" v-if="typeOption === 'view'">
<div style="width: 100%"><span>{{ addForm.insertTime ? addForm.insertTime.replaceAll('T', ' ') : '' }}</span>
<div style="width: 100%">
<span>
{{
addForm.insertTime
? addForm.insertTime.replaceAll('T', ' ')
: ''
}}
</span>
</div>
</el-form-item>
</el-form>

</template>
<template #footer>
<el-button type="default" @click="cancel" v-if="typeOption !== 'view'">取消</el-button>
<el-button type="primary" @click="submitHandle()" v-if="typeOption !== 'view'">确定</el-button>
<el-button type="default" @click="cancel" v-if="typeOption !== 'view'">
取消
</el-button>
<el-button
type="primary"
@click="submitHandle()"
v-if="typeOption !== 'view'"
>
确定
</el-button>
</template>
</crud-template>
</div>
</template>

<!-- 渠道配置 -->
<!-- 渠道配置 -->
<script lang="ts" setup>
// @ts-ignore crudFrom模板
import CrudTemplate from '@/crud/index.vue'
import { reactive, ref, toRaw, getCurrentInstance, onMounted, computed } from 'vue'
import {
reactive,
ref,
toRaw,
getCurrentInstance,
onMounted,
computed,
} from 'vue'
import { list, getMenuData } from '@/data/menuData'
import { ElNotification, ElMessage } from "element-plus";
import { ElNotification, ElMessage, ElMessageBox } from 'element-plus'
import Cookies from 'js-cookie'
import { useDebounce, getDictLabel } from "@/utils/utils";
import { channelAddApi, channelDetailApi, channelQueryApi, channelUpdateApi, enumApi } from "@/api/api";
import BaseService from "@/utils/baseService";
import { IHttpResponse, IObject } from "@/types/interface";
import $storeinitData from "@/store/initData"; //引入tab vuex
import { useRoute } from 'vue-router';
import { IsPermission } from "@/router/routerUtil";
import { useDebounce, getDictLabel } from '@/utils/utils'
import {
channelAddApi,
channelDetailApi,
channelQueryApi,
channelUpdateApi,
enumApi,
} from '@/api/api'
import BaseService from '@/utils/baseService'
import { IHttpResponse, IObject } from '@/types/interface'
import $storeinitData from '@/store/initData' //引入tab vuex
import { useRoute } from 'vue-router'
import { IsPermission } from '@/router/routerUtil'
//或取路由传入过来的对象数据
const route = useRoute();
const route = useRoute()
const dataFormRef = ref()
const crudRef = ref()
const itemStart = ref(true)
@@ -144,35 +332,65 @@ const itemStart = ref(true)
const statusList = computed(() => {
return $storeinitData.state.dictData['ENABLE_DISABLE_STATUS'] || []
})
const copys = async (data) => {
try {
await navigator.clipboard.writeText(data)
ElMessage.success('复制成功')
console.log('复制的数据', data)
} catch (err) {
console.error('Failed to copy: ', err)
const copydata = data
const copyInput = document.createElement('input') // 新建一个元素
copyInput.value = copydata
document.body.appendChild(copyInput)
copyInput.select() // 选择对象;
console.log(copyInput.value)
document.execCommand('Copy')
ElMessage.success('复制成功')
copyInput.remove() // 移除元素
}
}
const searchForm = ref({
sourceIdentId: "", //来源方ID
sourceIdentName: "", //来源方名称
status: "", // 状态
institutionalCode: ''
sourceIdentId: '', //来源方ID
sourceIdentName: '', //来源方名称
status: '', // 状态
institutionalCode: '',
})
const initItem = {
sourceIdentName: "", //来源方名称
status: "ENABLE", // 状态
ipValid: "",
signValid: "",
secretValid: "",
institutionalCode: ''
sourceIdentId: '', //APPID

sourceIdentName: '', //来源方名称
status: 'ENABLE', // 状态
ipValid: '',
signValid: '',
secretValid: '',
institutionalCode: '',
}
const addForm: any = ref(initItem)
const formLoding = ref(false);
const formLoding = ref(false)
const rules = {
sourceIdentName: [{ required: true, message: "请输入来源方名称", trigger: "blur" }],
status: [{ required: true, message: "请选择状态", trigger: "change" }],
institutionalCode: [{ required: true, message: "请输入机构编码", trigger: "blur" }],
sourceIdentName: [
{ required: true, message: '请输入来源方名称', trigger: 'blur' },
],
sourceIdentId: [
{ required: true, message: '请输入APPID', trigger: 'blur' },
{ pattern: /^[0-9]{8}$/, message: '请输入8位数字APPID', trigger: 'blur' },
],
status: [{ required: true, message: '请选择状态', trigger: 'change' }],
institutionalCode: [
{ required: true, message: '请输入机构编码', trigger: 'blur' },
],
// visitTimes: [
// { required: true, message: "请输入每日可访问次数", trigger: "blur" },
// ],
ipValid: [{ required: true, message: "请选择IP校验", trigger: "change" }],
signValid: [{ required: true, message: "请选择sign校验", trigger: "change" }],
secretValid: [{ required: true, message: "请选择加密校验", trigger: "change" }],
ipValid: [{ required: true, message: '请选择IP校验', trigger: 'change' }],
signValid: [{ required: true, message: '请选择sign校验', trigger: 'change' }],
secretValid: [
{ required: true, message: '请选择加密校验', trigger: 'change' },
],
}
const tableData = ref([]);
const typeOption = ref("");
const tableData = ref([])
const typeOption = ref('')
//表单数据配置
const field = ref({
tabSize: 'small', //Table 的尺寸 large / default /small (默认default)
@@ -184,11 +402,11 @@ const field = ref({
crudShow: true, //是否显示CURD操作栏 (默认true)
crudChildShow: true, //是否显示CURD子操作栏 (默认true)
paginStart: true, //是否显示分页查询 (默认false)
titleDialog: "", //table 标题
titleDialog: '', //table 标题
paging: {
pageSize: 10,
currentPage: 1,
total: 0
total: 0,
},
crud: {
add: IsPermission(route, 'ADD_BASE'),
@@ -201,13 +419,13 @@ const field = ref({
searchOperation: {
isDownload: false,
isAdd: false,
isTransferMachine: false
isTransferMachine: false,
},
tableSize: -1,
operateShow: true, //是否为表格添加操作栏(默认true)
operateTitle: '操作', //操作栏标题(默认为"")
operateFixed: false, //操作栏是否固定(默认false)
operateWidth: '150', //操作栏宽度
operateWidth: '300', //操作栏宽度
operate: {
edit: IsPermission(route, 'EDIT_LIST'), //是否编辑(默认true)
delete: false, //是否删除(默认true)
@@ -216,9 +434,9 @@ const field = ref({
forbidden: false, // 禁用
enable: false, // 启用
authorization: false, // 授权
cancel: false,// 取消订单
writeOff: false,// 注销
make: false,// 补缴
cancel: false, // 取消订单
writeOff: false, // 注销
make: false, // 补缴
},
extend: [
{
@@ -228,10 +446,10 @@ const field = ref({
},
],
field: [
// {
// prop: 'sourceIdentId',
// label: '来源方ID',
// },
{
prop: 'sourceIdentId',
label: 'APPID',
},
{
prop: 'sourceIdentName',
label: '渠道名称',
@@ -249,21 +467,21 @@ const field = ref({
label: 'IP校验',
funRuleStarts: false, //是否启用转换规则
slotSet: true, // 是否启用插槽
slotSetName: "ipValidTag", // 插槽名
slotSetName: 'ipValidTag', // 插槽名
},
{
prop: 'signValid',
label: 'sign校验',
funRuleStarts: false, //是否启用转换规则
slotSet: true, // 是否启用插槽
slotSetName: "signValidTag", // 插槽名
slotSetName: 'signValidTag', // 插槽名
},
{
prop: 'secretValid',
label: '加密校验',
funRuleStarts: false, //是否启用转换规则
slotSet: true, // 是否启用插槽
slotSetName: "secretValidTag", // 插槽名
slotSetName: 'secretValidTag', // 插槽名
},
{
prop: 'status',
@@ -271,7 +489,7 @@ const field = ref({
width: '100px',
funRuleStarts: false, //是否启用转换规则
slotSet: true, // 是否启用插槽
slotSetName: "statusTage", // 插槽名
slotSetName: 'statusTage', // 插槽名
},
{
prop: 'insertTime',
@@ -284,80 +502,80 @@ const field = ref({
}
return val
},
}
},
],
})
// 搜索按钮
function btnSearch() {
field.value.paging.currentPage = 1;
getList();
field.value.paging.currentPage = 1
getList()
}
// 搜索重置
function refreshLeft() {
searchForm.value = {
sourceIdentId: "", //来源方ID
sourceIdentName: "", //来源方名称
status: "", // 状态
institutionalCode: ''
sourceIdentId: '', //来源方ID
sourceIdentName: '', //来源方名称
status: '', // 状态
institutionalCode: '',
}
field.value.paging.currentPage = 1;
getList();
field.value.paging.currentPage = 1
getList()
}

//表单编辑按钮
function handleEdit(idx: any, row: any) {
formLoding.value = true;
const data = toRaw(row);
typeOption.value = "edit";
getRow(data.id);
formLoding.value = true
const data = toRaw(row)
typeOption.value = 'edit'
getRow(data.id)
}
function handleRemark(idx: any, row: any) {
formLoding.value = true;
const data = toRaw(row);
typeOption.value = "view";
getRow(data.id);
formLoding.value = true
const data = toRaw(row)
typeOption.value = 'view'
getRow(data.id)
}
// 取消
function cancel() {
addForm.value = JSON.parse(JSON.stringify(initItem)) //清空数据
dataFormRef.value.resetFields();
crudRef.value.reset();
crudRef.value.dialogFormVisible = false;
typeOption.value = ""
dataFormRef.value.resetFields()
crudRef.value.reset()
crudRef.value.dialogFormVisible = false
typeOption.value = ''
}
function handleCurrentChange(val: number) {
field.value.paging.currentPage = val;
getList();
field.value.paging.currentPage = val
getList()
}
// 提交
function submitClick() {
dataFormRef.value.validate((valid: boolean) => {
if (!valid) {
return false;
return false
}
let api = '/ifmw/ident/insert';
let api = '/ifmw/ident/insert'
let params = {
...addForm.value
...addForm.value,
}
if (typeOption.value === 'edit') {
api = '/ifmw/ident/update';
api = '/ifmw/ident/update'
}
BaseService.post(api, params).then((res: any) => {
if (res && res.code === 0) {
ElMessage.success("操作成功");
getList();
cancel();
ElMessage.success('操作成功')
getList()
cancel()
} else {
ElMessage.error(res.message)
}
})
});
})
}
const submitHandle = useDebounce(submitClick)
function getList() {
crudRef.value.tableLoding = true;
crudRef.value.tableLoding = true
let params: any = {
methods: "page",
methods: 'page',
pageNo: field.value.paging.currentPage,
pageSize: field.value.paging.pageSize,
}
@@ -370,12 +588,12 @@ function getList() {
BaseService.post('/ifmw/ident/query', params).then((res: any) => {
if (res && res.code === 0) {
let bizContent = res.data
let data = bizContent.data || [];
tableData.value = data;
crudRef.value.tableLoding = false;
field.value.paging.total = bizContent.totalCount;
let data = bizContent.data || []
tableData.value = data
crudRef.value.tableLoding = false
field.value.paging.total = bizContent.totalCount
} else {
crudRef.value.tableLoding = false;
crudRef.value.tableLoding = false
ElMessage.error(res.message)
}
})
@@ -384,30 +602,39 @@ function getRow(id: string) {
BaseService.post('/ifmw/ident/querybyid', { id: id }).then((res: any) => {
if (res && res.code === 0) {
let bizContent = res.data
let model = bizContent.model || {};
console.log("====interfaceConfig", model)
let model = bizContent.model || {}
console.log('====interfaceConfig', model)
addForm.value = {
...model
...model,
}

} else {
ElMessage.error(res.message)
}
formLoding.value = false;
formLoding.value = false
})
}
onMounted(() => {
getList();
getList()
})
function resetKey(row, type) {
BaseService.post('').then((res: any) => {
if (res && res.code === 0) {
ElMessage.success('重置成功!')
} else {
ElMessage.error(res.message)
}
let text = type === 'SM3' ? '签名密钥' : '加密密钥'
ElMessageBox.confirm(`确定要重置 ${row.sourceIdentName} 的 ${text}吗?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
// 确定
BaseService.post('/ifmw/secret/reset', {
sourceIdentId: row.sourceIdentId,
type,
}).then((res: any) => {
if (res && res.code === 0) {
ElMessage.success(text + '重置成功!')
} else {
ElMessage.error(res.message)
}
})
})
}

</script>
<style scoped></style>

+ 1
- 1
src/views/onlineBusinessHall/productManagement/equityProduct/index.vue 查看文件

@@ -24,7 +24,7 @@
clearable
v-model="searchForm.productName"
style="width: 200px"
placeholder="请输入产品名称"
placeholder="请输入权益名称"
/>
<el-select
clearable

Loading…
取消
儲存