op-admin/pikachu-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

配置管理调整 分享编辑页调整

Browse Source
This commit is contained in:
yulixing 2019-07-24 16:18:28 +08:00
parent e13a9ebabc
commit d0372989dc
3 changed files with 349 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

205
src/views/games/details/settings/SettingPanel.vue
View File

@ -1,16 +1,26 @@
<template>
<div class="c-setting-panel">
<el-row>
<el-col :span="14" class="p-r">
<el-col
:span="14"
class="p-r"
>
<div class="al-c">
<h3 class="fw-500">
配置详情 - {{ type === 'normal' ? '普通配置' : '私有配置' }}
</h3>
<span class="dis-b al-c mgb-20" style="color: #E6A23C">{{
<span
class="dis-b al-c mgb-20"
style="color: #E6A23C"
>{{
tip
}}</span>
</div>
<el-form ref="settingForm" label-width="120px" :model="settingsForm">
<el-form
ref="settingForm"
label-width="120px"
:model="settingsForm"
>
<el-form-item label="游戏">
<el-input
v-model="gameInfo.game_name"
@ -32,6 +42,12 @@
/>
</el-select>
</el-form-item>
<div
v-if="showTip"
class="al-c mgt-20 mgb-20"
>
暂无配置，以下为默认添加项，请注意保存
</div>
<template v-for="(item, index) in settingsForm.settings">
<el-form-item
:key="index"
@ -57,9 +73,10 @@
style="width: 70%"
@change="changTip"
/>
<el-button type="primary" @click="openEditor(index)"
>json</el-button
>
<el-button
type="primary"
@click="openEditor(index)"
>json</el-button>
</div>
<div v-else>
<el-input
@ -70,28 +87,23 @@
</div>
</el-form-item>
</template>
<div
v-if="settingsForm.settings.length === 0"
class="al-c mgt-20 mgb-20"
>
暂无配置项
</div>
<el-form-item>
<el-button
v-if="permEdit && this.platform_id"
type="primary"
@click="save"
>保存</el-button
>
>保存</el-button>
<el-button
v-if="permPublish && this.platform_id"
type="warning"
@click="publish"
>发布</el-button
>
<el-button v-if="permEdit && this.platform_id" @click="reset" type="success"
>重置</el-button
>
>发布</el-button>
<el-button
v-if="permEdit && this.platform_id"
@click="reset"
type="success"
>重置</el-button>
</el-form-item>
</el-form>
@ -111,37 +123,47 @@
value-key="key"
@remove-tag="delSetting"
>
<el-option
<el-tooltip
class="item"
:content="item.comment"
placement="left"
v-for="item in settingsList"
:key="item.key"
:label="`${item.value.title}(${item.key})`"
:value="item"
@click.native="clickOp(item)"
/>
:disabled="!item.comment"
>
<el-option
:label="`${item.value.title}(${item.key})`"
:value="item"
@click.native="clickOp(item)"
/>
</el-tooltip>
</el-select>
<div class="btn-group">
<el-button
type="success"
size="small"
@click="addSetting"
v-if="permEdit"
>添加新的配置项</el-button
>
v-if="permSettings"
>添加新的配置项</el-button>
<el-button
v-show="selectedSettings.length > 0"
type="danger"
size="small"
@click="clearSettings"
v-if="permEdit"
>清空</el-button
>
>清空</el-button>
</div>
</div>
</el-col>
</el-row>
<!-- modal - editor -->
<el-dialog title="编辑 JSON" :visible.sync="modalEditorVisible">
<el-dialog
title="编辑 JSON"
:visible.sync="modalEditorVisible"
>
<vue-json-editor
v-model="json"
lang="en"
@ -152,7 +174,10 @@
<div slot="footer">
<el-button @click="closeEditorModal">取 消</el-button>
<el-button type="primary" @click="saveJson">确 定</el-button>
<el-button
type="primary"
@click="saveJson"
>确 定</el-button>
</div>
</el-dialog>
@ -168,28 +193,65 @@
:rules="newSettingRules"
label-width="80px"
>
<el-form-item label="名称" prop="value.title">
<el-form-item
label="名称"
prop="value.title"
>
<el-input v-model="newSettingForm.value.title" />
</el-form-item>
<el-form-item label="key" prop="key">
<el-form-item
label="key"
prop="key"
>
<el-input v-model="newSettingForm.key" />
<span class="ipt-tip">该值写入redis并传入客户端，请谨慎填写</span>
</el-form-item>
<el-form-item label="值类型" prop="value.type">
<el-form-item
label="值类型"
prop="value.type"
>
<el-select
v-model="newSettingForm.value.type"
placeholder="请选择值类型"
style="width: 100%"
>
<el-option label="布尔值" value="bool" />
<el-option label="数值" value="num" />
<el-option label="字符串" value="string" />
<el-option
label="布尔值"
value="bool"
/>
<el-option
label="数值"
value="num"
/>
<el-option
label="字符串"
value="string"
/>
</el-select>
</el-form-item>
<el-form-item
label="是否禁用"
prop="disabled"
>
<el-switch v-model="newSettingForm.disabled"></el-switch>
</el-form-item>
<el-form-item
label="说明"
prop="comment"
>
<el-input
type="textarea"
v-model="newSettingForm.comment"
/>
</el-form-item>
</el-form>
<div slot="footer">
<el-button @click="closeNewSettingModal">取 消</el-button>
<el-button type="primary" @click="saveNewSetting">确 定</el-button>
<el-button
type="primary"
@click="saveNewSetting"
>确 定</el-button>
</div>
</el-dialog>
</div>
@ -230,6 +292,8 @@ export default {
gameInfo: {},
permEdit: false,
permPublish: false,
permSettings: false,
showTip: false,
// left
tip: '',
settingsForm: {
@ -251,7 +315,9 @@ export default {
value: {
title: '',
type: ''
}
},
disabled: false,
comment: ''
},
newSettingRules: {
key: [{ required: true, message: '请输入 key 值', trigger: 'blur' }],
@ -276,6 +342,9 @@ export default {
this.permPublish =
this.userInfo.permissions.includes(`${this.uid}-publish`) ||
this.userInfo.permissions.includes(`games-writeable`)
this.permSettings =
this.userInfo.permissions.includes(`settings-writeable`) ||
this.userInfo.permissions.includes(`games-writeable`)
this.getGameInfo(this.getGameSettings)
this.getSettingsList()
},
@ -331,6 +400,35 @@ export default {
this.settingKeys = data.records.map(item => {
return item.key
})
// 若无配置，默认添加必要选项
if (this.settingsForm.settings.length === 0) {
const defaultSettings = [
{
key: 'openAD',
title: '广告开关',
type: 'bool',
value: 1
},
{
key: 'blackTech',
title: '各种违规操作',
type: 'bool',
value: 1
},
{
key: 'isTestMode',
title: '测试开关',
type: 'bool',
value: 1
}
]
this.showTip = true
this.settingsForm.settings = [...defaultSettings]
this.selectedSettings = [...defaultSettings]
this.settingKeys = ['openAD', 'blackTech', 'isTestMode']
}
if (data.published === false) {
this.tip = '配置已保存，待发布'
} else if (data.published === true) {
@ -423,7 +521,9 @@ export default {
})
return
}
this.$message.success('配置发布成功！')
this.showTip = false
this.tip = '配置已发布'
})
})
@ -459,6 +559,7 @@ export default {
}
this.$message.success('配置保存成功！')
this.tip = '配置已保存，待发布'
this.showTip = false
this.changeState(false)
resolve()
})
@ -479,7 +580,9 @@ export default {
})
return
}
this.settingsList = data.records
this.settingsList = data.records.filter(item => {
return item.disabled !== true
})
})
},
clearSettings() {
@ -546,7 +649,9 @@ export default {
value: {
title: '',
type: 'bool'
}
},
disabled: false,
comment: ''
}
this.modalNewSettingVisible = true
},
@ -562,7 +667,9 @@ export default {
id: this.newSettingForm._id ? this.newSettingForm._id : '',
key: this.newSettingForm.key,
title: this.newSettingForm.value.title,
type: this.newSettingForm.value.type
type: this.newSettingForm.value.type,
disabled: this.newSettingForm.disabled,
comment: this.newSettingForm.comment
}
}).then(res => {
const { data } = res
@ -570,10 +677,22 @@ export default {
this.$message.error(data.errmsg)
return
}
this.modalNewSettingVisible = false
closeNewSettingModal()
this.$message.success('成功添加配置项！')
this.getSettingsList()
})
if (this.newSettingForm.disabled !== true) {
const newSetting = {
key: this.newSettingForm.key,
title: this.newSettingForm.value.title,
type: this.newSettingForm.value.type,
value: ''
}
this.settingsForm.settings.push(newSetting)
this.selectedSettings = [...this.settingsForm.settings]
this.settingKeys.push(newSetting.key)
}
} else {
this.$message.error('请按要求填写配置信息！')
return false

7
src/views/games/details/share/edit.vue
View File

@ -74,10 +74,7 @@
prop="default_share"
>
<el-switch v-model="shareForm.default_share" />
<span class="ipt-tip">设为默认分享, 那么在遇到该分享类型下没有满足条件的分享图,
会使用该分享图, 一种分享类型下只能有一条默认分享记录.
将当前记录变成默认分享后,
将移除这个游戏同分享类型下其他分享图的默认分享属性。</span>
<span class="ipt-tip">默认开启该项。</span>
</el-form-item>
<el-form-item
@ -562,7 +559,7 @@ export default {
// main
shareForm: {
platform_id: '',
default_share: false,
default_share: true,
share_images: [],
share_words: [],
share_count: 0,

206
src/views/games/settings.vue
View File

@ -3,10 +3,17 @@
<!-- toolbar -->
<div class="toolbar clearfix">
<div class="l fl">
<el-button v-if="permWriteable" type="primary" @click="addSetting">新增</el-button>
<el-button
v-if="permWriteable"
type="primary"
@click="addSetting"
>新增</el-button>
</div>
<div class="r fr">
<el-button type="primary" @click="refreshData">刷新</el-button>
<el-button
type="primary"
@click="refreshData"
>刷新</el-button>
</div>
</div>
<!-- table -->
@ -17,41 +24,149 @@
class="table mgt-20 mgb-20"
@row-click="rowClick"
>
<el-table-column prop="value.title" label="名称" show-overflow-tooltip sortable/>
<el-table-column prop="key" label="key" show-overflow-tooltip sortable/>
<el-table-column prop="value.type" label="值类型" show-overflow-tooltip sortable/>
<el-table-column v-if="permWriteable" prop="name" label="操作" fixed="right" width="55">
<el-table-column
prop="value.title"
label="名称"
show-overflow-tooltip
sortable
/>
<el-table-column
prop="key"
label="key"
show-overflow-tooltip
sortable
/>
<el-table-column
prop="comment"
label="说明"
show-overflow-tooltip
sortable
/>
<el-table-column
prop="value.type"
label="值类型"
show-overflow-tooltip
sortable
/>
<el-table-column
prop="disabled"
label="状态"
show-overflow-tooltip
sortable
>
<template slot-scope="scope">
<el-button type="text" size="small" @click.stop="editSetting(scope.row)">编辑</el-button>
<el-tag
type="danger"
v-if="scope.row.disabled"
>禁用</el-tag>
<el-tag
type="success"
v-else
>启用</el-tag>
</template>
</el-table-column>
<el-table-column
v-if="permWriteable"
prop="name"
label="操作"
fixed="right"
width="100"
>
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click.stop="editSetting(scope.row)"
>编辑</el-button>
<el-button
type="text"
size="small"
v-if="!scope.row.disabled"
@click.stop="toggleStatus(scope.row, true)"
>禁用</el-button>
<el-button
type="text"
size="small"
v-if="scope.row.disabled === true"
@click.stop="toggleStatus(scope.row, false)"
>启用</el-button>
</template>
</el-table-column>
</el-table>
<!-- modal -->
<el-dialog title="编辑配置项" :visible.sync="modalVisible" :before-close="closeModal">
<el-form ref="modalForm" :model="modalForm" :rules="modalRules" label-width="80px">
<el-form-item label="名称" prop="value.title">
<el-input v-model="modalForm.value.title"/>
<el-dialog
title="编辑配置项"
:visible.sync="modalVisible"
:before-close="closeModal"
>
<el-form
ref="modalForm"
:model="modalForm"
:rules="modalRules"
label-width="80px"
>
<el-form-item
label="名称"
prop="value.title"
>
<el-input v-model="modalForm.value.title" />
</el-form-item>
<el-form-item label="key" prop="key">
<el-input v-model="modalForm.key" :disabled="!isNew"/>
<el-form-item
label="key"
prop="key"
>
<el-input
v-model="modalForm.key"
:disabled="!isNew"
/>
<span class="ipt-tip">该值写入redis并传入客户端，请谨慎填写</span>
</el-form-item>
<el-form-item label="值类型" prop="value.type">
<el-form-item
label="值类型"
prop="value.type"
>
<el-select
v-model="modalForm.value.type"
placeholder="请选择值类型"
style="width: 100%"
:disabled="!isNew"
>
<el-option label="布尔值" value="bool"/>
<el-option label="数值" value="num"/>
<el-option label="字符串" value="string"/>
<el-option
label="布尔值"
value="bool"
/>
<el-option
label="数值"
value="num"
/>
<el-option
label="字符串"
value="string"
/>
</el-select>
</el-form-item>
<el-form-item
label="是否禁用"
prop="disabled"
>
<el-switch v-model="modalForm.disabled"></el-switch>
</el-form-item>
<el-form-item
label="说明"
prop="comment"
>
<el-input
type="textarea"
v-model="modalForm.comment"
/>
</el-form-item>
</el-form>
<div slot="footer">
<el-button @click="closeModal">取 消</el-button>
<el-button type="primary" @click="saveEdit">确 定</el-button>
<el-button
type="primary"
@click="saveEdit"
>确 定</el-button>
</div>
</el-dialog>
</div>
@ -74,6 +189,8 @@ export default {
modalForm: {
_id: '',
key: '',
comment: '',
disabled: false,
value: {
title: '',
type: 'bool'
@ -122,13 +239,52 @@ export default {
})
return
}
this.tableData = data.records
this.tableData = data.records.sort((a, b) => {
return !!a.disabled - !!b.disabled
})
this.isLoaded = false
})
},
editSetting(row) {
this.openModal(false, row)
},
toggleStatus(row, disabled) {
const toStatus = disabled ? '禁用' : '启用'
this.$confirm(`是否${toStatus}配置项${row.value.title}`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
this.modalForm = JSON.parse(JSON.stringify(row))
this.modalForm.disabled = disabled
saveSettingItem({
record: {
id: this.modalForm._id ? this.modalForm._id : '',
key: this.modalForm.key,
title: this.modalForm.value.title,
type: this.modalForm.value.type,
comment: this.modalForm.comment,
disabled: this.modalForm.disabled
}
}).then(res => {
const { data } = res
if (data.errcode !== 0) {
this.$message.error(data.errmsg)
return
}
const successText = this.isNew
? '配置项添加成功！'
: '配置项修改成功'
this.$message.success(successText)
this.refreshData()
})
})
.catch(err => {
console.log(err)
this.$message.info('操作已取消！')
})
},
// modal
openModal(isNew, data) {
if (isNew) {
@ -139,7 +295,9 @@ export default {
value: {
title: '',
type: ''
}
},
comment: '',
disabled: false
}
} else {
this.isNew = false
@ -154,12 +312,18 @@ export default {
saveEdit() {
this.$refs['modalForm'].validate(valid => {
if (valid) {
if (this.modalForm.comment === undefined) this.modalForm.comment = ''
if (this.modalForm.disabled === undefined)
this.modalForm.disabled = false
saveSettingItem({
record: {
id: this.modalForm._id ? this.modalForm._id : '',
key: this.modalForm.key,
title: this.modalForm.value.title,
type: this.modalForm.value.type
type: this.modalForm.value.type,
comment: this.modalForm.comment,
disabled: this.modalForm.disabled
}
}).then(res => {
const { data } = res