Skip to content

C
company_app
提交 5629faa0 作者: 施汉文
操作

refactor(举报弹窗): 重构角色ID类型切换逻辑

上级 a00120de
正在显示 包含 153 行增加 和 43 行删除
src/App.vue
...@@ -211,7 +211,7 @@ export default { ...@@ -211,7 +211,7 @@ export default {
// 页面刷新时从 Cookie 恢复 token 到 store // 页面刷新时从 Cookie 恢复 token 到 store
// Cookies.set( // Cookies.set(
// "token", // "token",
// "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOjEyMzg2LCJkYXRhIjp7ImNzZXJfaWQiOjEyMzg2LCJjc2VyX25hbWUiOiLlvKDlpo3lpo0ifSwiaWF0IjoxNzc2OTk3MTgzLCJleHAiOjE3Nzk1ODkxODMsIm5iZiI6MTc3Njk5NzE4Mywic3ViIjoidG9rZW7orqTor4EiLCJqdGkiOiIxM2I3ODk0MjJjMThiOTUzNzFmOWVjZmYzZGMzNzY1NCJ9.2_8gCTzSrnR8q7i9_Pus1xT8NMY9-cXJim_FElSsa5A" // ""
// ); // );
// Cookies.set("corp_id", "wweaefe716636df3d1"); // Cookies.set("corp_id", "wweaefe716636df3d1");
// Cookies.set("userid", "ShanYi"); // Cookies.set("userid", "ShanYi");
......
src/views/popup/reportPopup/index.vue
...@@ -29,31 +29,31 @@ ...@@ -29,31 +29,31 @@
<div class="role-card"> <div class="role-card">
<el-form-item label="" class="role-type-item"> <el-form-item label="" class="role-type-item">
<el-radio-group v-model="reportForm.report_role_id_type"> <el-radio-group v-model="reportForm.role_id_type" @change="onReporteeTypeChange">
<el-radio label="cp_role_id">CP角色ID</el-radio> <el-radio label="cp_role_id">CP角色ID</el-radio>
<el-radio label="role_id">掌游角色ID</el-radio> <el-radio label="role_id">掌游角色ID</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<!--被举报人 --> <!--被举报人 -->
<inputTags <inputTags
:input-select-list.sync="reportForm.cp_role_id" :input-select-list.sync="reporteeIds"
label-text="被举报人CP角色ID" :label-text="reporteeLabelText"
placeholder="请输入被举报人" :placeholder="reporteePlaceholder"
:disabled="reportForm.main_game_id === ''" :disabled="reportForm.main_game_id === ''"
rule-prop="cp_role_id" :rule-prop="reporteeIdField"
@inputChange="inputChange" @inputChange="inputChange"
/> />
<inputTags <inputTags
:input-select-list.sync="reportForm.role_name" :input-select-list.sync="reportForm.role_name"
label-text="被举报人角色名" label-text="被举报人角色名"
placeholder="输入CP角色ID后自动获取" :placeholder="autoFillPlaceholder"
:disabled="true" :disabled="true"
rule-prop="role_name" rule-prop="role_name"
/> />
<inputTags <inputTags
:input-select-list.sync="reportForm.server_name" :input-select-list.sync="reportForm.server_name"
label-text="被举报人区服" label-text="被举报人区服"
placeholder="输入CP角色ID后自动获取" :placeholder="autoFillPlaceholder"
:disabled="true" :disabled="true"
rule-prop="server_name" rule-prop="server_name"
/> />
...@@ -72,17 +72,17 @@ ...@@ -72,17 +72,17 @@
<div class="role-card"> <div class="role-card">
<el-form-item label="" class="role-type-item"> <el-form-item label="" class="role-type-item">
<el-radio-group v-model="reportForm.role_id_type"> <el-radio-group v-model="reportForm.report_role_id_type" @change="onReporterTypeChange">
<el-radio label="cp_role_id">CP角色ID</el-radio> <el-radio label="cp_role_id">CP角色ID</el-radio>
<el-radio label="role_id">掌游角色ID</el-radio> <el-radio label="role_id">掌游角色ID</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<!-- 举报人 --> <!-- 举报人 -->
<el-form-item label="举报人CP角色ID" prop="report_cp_role_id"> <el-form-item :label="reporterLabelText" :prop="reporterIdField">
<el-input <el-input
v-model="reportForm.report_cp_role_id" v-model="reporterId"
style="width: 100%" style="width: 100%"
placeholder="请输入举报人" :placeholder="reporterPlaceholder"
@change="change_report_role_id" @change="change_report_role_id"
></el-input> ></el-input>
</el-form-item> </el-form-item>
...@@ -90,14 +90,14 @@ ...@@ -90,14 +90,14 @@
<el-input <el-input
v-model="reportForm.report_role_name" v-model="reportForm.report_role_name"
style="width: 100%" style="width: 100%"
placeholder="输入CP角色ID后自动获取" :placeholder="reporterAutoFillPlaceholder"
disabled disabled
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="举报人区服" prop="report_server_name"> <el-form-item label="举报人区服" prop="report_server_name">
<el-input <el-input
v-model="reportForm.report_server_name" v-model="reportForm.report_server_name"
placeholder="输入CP角色ID后自动获取" :placeholder="reporterAutoFillPlaceholder"
style="width: 100%" style="width: 100%"
disabled disabled
></el-input> ></el-input>
...@@ -170,6 +170,60 @@ ...@@ -170,6 +170,60 @@
...mapState('game', ['accountSelect']), ...mapState('game', ['accountSelect']),
...mapState('user', ['userInfo']), ...mapState('user', ['userInfo']),
/** /**
* 被举报人当前 type 对应的字段名（cp_role_id / role_id）
*/
reporteeIdField() {
return this.reportForm.role_id_type === 'role_id' ? 'role_id' : 'cp_role_id'
},
/**
* 举报人当前 type 对应的字段名（report_cp_role_id / report_role_id）
*/
reporterIdField() {
return this.reportForm.report_role_id_type === 'role_id' ? 'report_role_id' : 'report_cp_role_id'
},
/**
* inputTags 用：被举报人 ID 数组（按 type 路由读写，仅写入当前类型对应字段）
*/
reporteeIds: {
get() {
return this.reportForm[this.reporteeIdField] || []
},
set(val) {
this.reportForm[this.reporteeIdField] = val
}
},
/**
* 举报人 input v-model（按 type 路由读写，仅写入当前类型对应字段）
*/
reporterId: {
get() {
return this.reportForm[this.reporterIdField] || ''
},
set(val) {
this.reportForm[this.reporterIdField] = val
}
},
reporteeLabelText() {
return this.reportForm.role_id_type === 'role_id' ? '被举报人掌游角色ID' : '被举报人CP角色ID'
},
reporteePlaceholder() {
return this.reportForm.role_id_type === 'role_id' ? '请输入被举报人掌游角色ID' : '请输入被举报人CP角色ID'
},
reporterLabelText() {
return this.reportForm.report_role_id_type === 'role_id' ? '举报人掌游角色ID' : '举报人CP角色ID'
},
reporterPlaceholder() {
return this.reportForm.report_role_id_type === 'role_id' ? '请输入举报人掌游角色ID' : '请输入举报人CP角色ID'
},
autoFillPlaceholder() {
const label = this.reportForm.role_id_type === 'role_id' ? '掌游角色ID' : 'CP角色ID'
return `输入${label}后自动获取`
},
reporterAutoFillPlaceholder() {
const label = this.reportForm.report_role_id_type === 'role_id' ? '掌游角色ID' : 'CP角色ID'
return `输入${label}后自动获取`
},
/**
* 生态运营展示文案：有列表时拼接全部 user_name；无列表时回显表单已有值（如编辑态） * 生态运营展示文案：有列表时拼接全部 user_name；无列表时回显表单已有值（如编辑态）
*/ */
ecoUserNamesDisplay() { ecoUserNamesDisplay() {
...@@ -191,20 +245,19 @@ ...@@ -191,20 +245,19 @@
* 无生态运营数据时不校验 eco_user、is_negotiation * 无生态运营数据时不校验 eco_user、is_negotiation
*/ */
reportRules() { reportRules() {
const reporteeField = this.reporteeIdField
const reporteeLabel = this.reportForm.role_id_type === 'role_id' ? '掌游角色ID' : 'CP角色ID'
const rules = { const rules = {
main_game_id: [ main_game_id: [
{ required: true, message: '请选择主游戏', trigger: 'change' } { required: true, message: '请选择主游戏', trigger: 'change' }
], ],
cp_role_id: [ [reporteeField]: [
{ {
required: true, required: true,
message: '请选择被举报人cp角色id', message: `请选择被举报人${reporteeLabel}`,
trigger: 'change' trigger: 'change'
} }
], ],
role_id: [
{ required: true, message: '请选择角色名', trigger: 'change' }
],
server_name: [ server_name: [
{ required: true, message: '请选择区服', trigger: 'change' } { required: true, message: '请选择区服', trigger: 'change' }
], ],
...@@ -380,28 +433,78 @@ ...@@ -380,28 +433,78 @@
}, },
// inputTag 返回的值 // inputTag 返回的值
inputChange(value) { inputChange(value) {
this.reportForm.cp_role_id = value this.reportForm[this.reporteeIdField] = value
this.change_cp_role_id() this.change_reportee_role()
},
/**
* 切换被举报人 ID 类型：清空两侧输入与回填，避免数据残留与校验红字
*/
onReporteeTypeChange() {
this.reportForm.cp_role_id = []
this.reportForm.role_id = []
this.reportForm.role_name = []
this.reportForm.server_name = []
this.zyou_server_id_list = []
this.eco_user_list = []
this.reportForm.eco_user = ''
this.$nextTick(() => {
if (this.$refs.reportForm) {
this.$refs.reportForm.clearValidate([
'cp_role_id',
'role_id',
'role_name',
'server_name',
'eco_user',
'is_negotiation'
])
}
})
},
/**
* 切换举报人 ID 类型：清空举报人输入与回填
*/
onReporterTypeChange() {
this.reportForm.report_cp_role_id = ''
this.reportForm.report_role_id = ''
this.reportForm.report_role_name = ''
this.reportForm.report_server_name = ''
this.$nextTick(() => {
if (this.$refs.reportForm) {
this.$refs.reportForm.clearValidate([
'report_cp_role_id',
'report_role_id',
'report_role_name',
'report_server_name'
])
}
})
}, },
async change_cp_role_id() { async change_reportee_role() {
if (this.reportForm.main_game_id == '') { if (this.reportForm.main_game_id == '') {
this.$message.warning('请先选择主游戏') this.$message.warning('请先选择主游戏')
return return
} }
if (this.reportForm.cp_role_id.length == 0) { const inputIds = this.reportForm[this.reporteeIdField]
this.$message.warning('请按回车键确定CP角色ID') if (!inputIds || inputIds.length == 0) {
this.$message.warning('请按回车键确定输入')
return return
} }
this.cp_role_id_loading = true this.cp_role_id_loading = true
this.$message.warning('查询中，请稍等') this.$message.warning('查询中，请稍等')
// 按 type 用对应字段名作为查询参数
const res = await searchcondition({ const res = await searchcondition({
type: 'role', type: 'role',
cp_role_id: this.reportForm.cp_role_id, [this.reporteeIdField]: inputIds,
main_game_id: this.reportForm.main_game_id main_game_id: this.reportForm.main_game_id
}) })
this.cp_role_id_loading = false this.cp_role_id_loading = false
if (res.status_code == 1 && res.data.data.length > 0) { if (res.status_code == 1 && res.data.data.length > 0) {
this.reportForm.role_id = res.data.data.map((item) => item.value) // 当前类型字段保留用户输入，另一类型字段从接口返回回填
if (this.reporteeIdField === 'cp_role_id') {
this.reportForm.role_id = res.data.data.map((item) => item.value)
} else {
this.reportForm.cp_role_id = res.data.data.map((item) => item.cp_role_id)
}
this.reportForm.role_name = res.data.data.map((item) => item.label) this.reportForm.role_name = res.data.data.map((item) => item.label)
this.reportForm.server_name = res.data.data.map( this.reportForm.server_name = res.data.data.map(
(item) => item.server_name (item) => item.server_name
...@@ -420,19 +523,24 @@ ...@@ -420,19 +523,24 @@
} }
}, },
async change_report_role_id() { async change_report_role_id() {
if ( const inputId = this.reportForm[this.reporterIdField]
!!this.reportForm.report_cp_role_id && if (!!inputId && !!this.reportForm.main_game_id) {
!!this.reportForm.main_game_id
) {
const res = await searchcondition({ const res = await searchcondition({
type: 'role', type: 'role',
cp_role_id: this.reportForm.report_cp_role_id, [this.reporterIdField === 'report_role_id' ? 'role_id' : 'cp_role_id']: inputId,
main_game_id: this.reportForm.main_game_id main_game_id: this.reportForm.main_game_id
}) })
if (res.status_code == 1 && res.data.data.length > 0) { if (res.status_code == 1 && res.data.data.length > 0) {
this.reportForm.report_role_id = res.data.data[0] // 当前类型字段保留用户输入，另一类型字段从接口返回回填
? res.data.data[0].value if (this.reporterIdField === 'report_cp_role_id') {
: '' this.reportForm.report_role_id = res.data.data[0]
? res.data.data[0].value
: ''
} else {
this.reportForm.report_cp_role_id = res.data.data[0]
? res.data.data[0].cp_role_id
: ''
}
this.reportForm.report_role_name = res.data.data[0] this.reportForm.report_role_name = res.data.data[0]
? res.data.data[0].label ? res.data.data[0].label
: '' : ''
...@@ -453,7 +561,6 @@ ...@@ -453,7 +561,6 @@
} }
} else { } else {
this.$message.warning('请先选择主游戏') this.$message.warning('请先选择主游戏')
this.reportForm.cp_role_id = ''
this.zyou_server_id_list = [] this.zyou_server_id_list = []
this.eco_user_list = [] this.eco_user_list = []
this.reportForm.eco_user = '' this.reportForm.eco_user = ''
...@@ -493,15 +600,16 @@ ...@@ -493,15 +600,16 @@
const mainGameId = this.reportForm.main_game_id const mainGameId = this.reportForm.main_game_id
if (!mainGameId) return if (!mainGameId) return
try { try {
const cpIds = Array.isArray(this.reportForm.cp_role_id) const reporteeRaw = this.reportForm[this.reporteeIdField]
? this.reportForm.cp_role_id.filter(Boolean) const reporteeIds = Array.isArray(reporteeRaw)
: this.reportForm.cp_role_id ? reporteeRaw.filter(Boolean)
? [this.reportForm.cp_role_id] : reporteeRaw
? [reporteeRaw]
: [] : []
if (cpIds.length > 0) { if (reporteeIds.length > 0) {
const res = await searchcondition({ const res = await searchcondition({
type: 'role', type: 'role',
cp_role_id: cpIds, [this.reporteeIdField]: reporteeIds,
main_game_id: mainGameId main_game_id: mainGameId
}) })
if (res.status_code == 1 && res.data.data && res.data.data.length > 0) { if (res.status_code == 1 && res.data.data && res.data.data.length > 0) {
...@@ -512,10 +620,12 @@ ...@@ -512,10 +620,12 @@
return return
} }
} }
if (this.reportForm.report_cp_role_id) { const reporterRaw = this.reportForm[this.reporterIdField]
if (reporterRaw) {
const reporterQueryField = this.reporterIdField === 'report_role_id' ? 'role_id' : 'cp_role_id'
const res = await searchcondition({ const res = await searchcondition({
type: 'role', type: 'role',
cp_role_id: this.reportForm.report_cp_role_id, [reporterQueryField]: reporterRaw,
main_game_id: mainGameId main_game_id: mainGameId
}) })
if (res.status_code == 1 && res.data.data && res.data.data.length > 0) { if (res.status_code == 1 && res.data.data && res.data.data.length > 0) {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论