feat(游戏列表): "新增/修改"新增游戏ID必填项
This commit is contained in:
hzj
parent
3a41bbed52
commit
649a27c7a6
@ -10,12 +10,19 @@
|
||||
>
|
||||
<div v-loading="submitLoading">
|
||||
<div class="form-contetn">
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="110px" style="margin-right: 50px;">
|
||||
<el-form
|
||||
ref="form"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
label-width="110px"
|
||||
style="margin-right: 50px;"
|
||||
>
|
||||
<!-- 封面 -->
|
||||
<el-form-item label="封面" prop="cover">
|
||||
<el-upload
|
||||
:disabled="coverUploadLoading"
|
||||
:file-list="coverFileList"
|
||||
:class="{'upload-but-hide': !isShowCoverUpload}"
|
||||
:class="{ 'upload-but-hide': !isShowCoverUpload }"
|
||||
action=""
|
||||
list-type="picture-card"
|
||||
:http-request="uploadCover"
|
||||
@ -23,9 +30,15 @@
|
||||
:on-remove="handleCoverFileRemove"
|
||||
accept="image/*"
|
||||
>
|
||||
<i slot="default" v-loading="coverUploadLoading" class="el-icon-plus" />
|
||||
<i
|
||||
slot="default"
|
||||
v-loading="coverUploadLoading"
|
||||
class="el-icon-plus"
|
||||
/>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 系统 -->
|
||||
<el-form-item label="系统">
|
||||
<el-select
|
||||
v-model="form.sysOrigin"
|
||||
@ -41,11 +54,17 @@
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
<span style="float: left;"> <sys-origin-icon :icon="item.value" :desc="item.value" /></span>
|
||||
<span style="float: left;margin-left:10px">{{ item.label }}</span>
|
||||
<span style="float: left;">
|
||||
<sys-origin-icon :icon="item.value" :desc="item.value"
|
||||
/></span>
|
||||
<span style="float: left;margin-left:10px">{{
|
||||
item.label
|
||||
}}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 游戏源 -->
|
||||
<el-form-item label="游戏源" prop="gameOrigin">
|
||||
<el-select
|
||||
v-model="form.gameOrigin"
|
||||
@ -53,19 +72,33 @@
|
||||
style="width:100%;"
|
||||
class="filter-item"
|
||||
>
|
||||
<el-option v-for="item in gameOrigins" :key="item.value" :label="item.name" :value="item.value" />
|
||||
<el-option
|
||||
v-for="item in gameOrigins"
|
||||
:key="item.value"
|
||||
:label="item.name"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="客户端" prop="clientOrigin">
|
||||
|
||||
<!-- 客户端 -->
|
||||
<el-form-item label="游戏源" prop="clientOrigin">
|
||||
<el-select
|
||||
v-model="form.clientOrigin"
|
||||
placeholder="客户端"
|
||||
style="width:100%;"
|
||||
class="filter-item"
|
||||
>
|
||||
<el-option v-for="item in clientOrigins" :key="item.value" :label="item.name" :value="item.value" />
|
||||
<el-option
|
||||
v-for="item in clientOrigins"
|
||||
:key="item.value"
|
||||
:label="item.name"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 是否自研 -->
|
||||
<el-form-item label="是否自研" prop="self">
|
||||
<el-select
|
||||
v-model="form.self"
|
||||
@ -75,21 +108,75 @@
|
||||
class="filter-item"
|
||||
>
|
||||
<el-option label="是" :value="true" />
|
||||
<el-option label="否" :value="false" />
|
||||
</el-select>自研游戏下架会影响到其他系统
|
||||
<el-option label="否" :value="false" /> </el-select
|
||||
>自研游戏下架会影响到其他系统
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.self" label="自研游戏Code" prop="selfGameCode">
|
||||
<el-input v-model.trim="form.selfGameCode" type="text" placeholder="请输入自研游戏Code" minlength="1" maxlength="150" show-word-limit />
|
||||
|
||||
<!-- 自研游戏Code -->
|
||||
<el-form-item
|
||||
v-if="form.self"
|
||||
label="自研游戏Code"
|
||||
prop="selfGameCode"
|
||||
>
|
||||
<el-input
|
||||
v-model.trim="form.selfGameCode"
|
||||
type="text"
|
||||
placeholder="请输入自研游戏Code"
|
||||
minlength="1"
|
||||
maxlength="150"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 游戏ID -->
|
||||
<el-form-item label="游戏ID" prop="gameId">
|
||||
<el-input
|
||||
v-model.trim="form.gameId"
|
||||
type="text"
|
||||
placeholder="请输入游戏ID"
|
||||
minlength="1"
|
||||
maxlength="150"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 名称 -->
|
||||
<el-form-item label="名称" prop="name">
|
||||
<el-input v-model.trim="form.name" type="text" placeholder="请输入名称" minlength="1" maxlength="150" show-word-limit />
|
||||
<el-input
|
||||
v-model.trim="form.name"
|
||||
type="text"
|
||||
placeholder="请输入名称"
|
||||
minlength="1"
|
||||
maxlength="150"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 编号 -->
|
||||
<el-form-item label="编号" prop="gameCode">
|
||||
<el-input v-model.trim="form.gameCode" type="text" placeholder="请输入编号" minlength="1" maxlength="150" show-word-limit />
|
||||
<el-input
|
||||
v-model.trim="form.gameCode"
|
||||
type="text"
|
||||
placeholder="请输入编号"
|
||||
minlength="1"
|
||||
maxlength="150"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 金额 -->
|
||||
<el-form-item label="金额" prop="gameCode">
|
||||
<el-input v-model.trim="form.amounts" type="text" placeholder="金币必须是整数多个逗号隔改" minlength="1" maxlength="150" show-word-limit />
|
||||
<el-input
|
||||
v-model.trim="form.amounts"
|
||||
type="text"
|
||||
placeholder="金币必须是整数多个逗号隔改"
|
||||
minlength="1"
|
||||
maxlength="150"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 是否全屏 -->
|
||||
<el-form-item label="是否全屏" prop="fullScreen">
|
||||
<el-select
|
||||
v-model="form.fullScreen"
|
||||
@ -102,12 +189,26 @@
|
||||
<el-option label="否" :value="false" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 宽 -->
|
||||
<el-form-item label="宽" prop="width">
|
||||
<el-input v-model.trim="form.width" type="text" placeholder="宽度" />
|
||||
<el-input
|
||||
v-model.trim="form.width"
|
||||
type="text"
|
||||
placeholder="宽度"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 高 -->
|
||||
<el-form-item label="高" prop="height">
|
||||
<el-input v-model.trim="form.height" type="text" placeholder="高度" />
|
||||
<el-input
|
||||
v-model.trim="form.height"
|
||||
type="text"
|
||||
placeholder="高度"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 状态 -->
|
||||
<el-form-item label="状态" prop="showcase">
|
||||
<el-select
|
||||
v-model="form.showcase"
|
||||
@ -120,11 +221,30 @@
|
||||
<el-option label="上架" :value="true" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 排序 -->
|
||||
<el-form-item label="排序" prop="sort">
|
||||
<el-input-number v-model.trim="form.sort" v-number style="width: 100%;" :min="0" :max="99999" placeholder="降序排列(数字越大越靠前)" />
|
||||
<el-input-number
|
||||
v-model.trim="form.sort"
|
||||
v-number
|
||||
style="width: 100%;"
|
||||
:min="0"
|
||||
:max="99999"
|
||||
placeholder="降序排列(数字越大越靠前)"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 区域 -->
|
||||
<el-form-item label="区域" prop="regionList">
|
||||
<el-select v-model="form.regionList" v-loading="loading" multiple clearable placeholder="请选择" style="width:100%;" class="filter-item">
|
||||
<el-select
|
||||
v-model="form.regionList"
|
||||
v-loading="loading"
|
||||
multiple
|
||||
clearable
|
||||
placeholder="请选择"
|
||||
style="width:100%;"
|
||||
class="filter-item"
|
||||
>
|
||||
<el-option
|
||||
v-for="(item, index) in regions"
|
||||
:key="index"
|
||||
@ -144,10 +264,9 @@
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
import { saveOrUpdateGameConfig, regionConfigTable } from '@/api/sys'
|
||||
import { getElementUiUploadFile } from '@/utils'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { saveOrUpdateGameConfig, regionConfigTable } from "@/api/sys";
|
||||
import { getElementUiUploadFile } from "@/utils";
|
||||
import { mapGetters } from "vuex";
|
||||
export default {
|
||||
props: {
|
||||
row: {
|
||||
@ -160,42 +279,46 @@ export default {
|
||||
}
|
||||
},
|
||||
data() {
|
||||
const commonRules = [{ required: true, message: '必填字段', trigger: 'blur' }]
|
||||
const commonRules = [
|
||||
{ required: true, message: "必填字段", trigger: "blur" }
|
||||
];
|
||||
return {
|
||||
gameOrigins: [
|
||||
{ value: 'THIRD_PARTY', name: '第三方游戏' },
|
||||
{ value: 'APP', name: '原生游戏' },
|
||||
{ value: 'H5', name: 'H5游戏' },
|
||||
{ value: 'BAISHUN', name: 'Baishun' },
|
||||
{ value: 'LINGXIAN', name: 'LingXian' },
|
||||
{ value: 'HOTGAME', name: 'HOTGAME' }
|
||||
{ value: "THIRD_PARTY", name: "第三方游戏" },
|
||||
{ value: "APP", name: "原生游戏" },
|
||||
{ value: "H5", name: "H5游戏" },
|
||||
{ value: "BAISHUN", name: "Baishun" },
|
||||
{ value: "LINGXIAN", name: "LingXian" },
|
||||
{ value: "HOTGAME", name: "HOTGAME" }
|
||||
],
|
||||
clientOrigins: [
|
||||
{ value: 'ANDROID', name: '安卓' },
|
||||
{ value: 'IOS', name: '苹果' },
|
||||
{ value: 'COMMON', name: '通用' }
|
||||
{ value: "ANDROID", name: "安卓" },
|
||||
{ value: "IOS", name: "苹果" },
|
||||
{ value: "COMMON", name: "通用" }
|
||||
],
|
||||
coverUploadLoading: false,
|
||||
coverFileList: [],
|
||||
regions: [],
|
||||
loading: false,
|
||||
form: {
|
||||
id: '',
|
||||
cover: '',
|
||||
sysOrigin: 'YOLO',
|
||||
name: '',
|
||||
gameCode: '',
|
||||
id: "",
|
||||
sysOrigin: "YOLO",
|
||||
name: "",
|
||||
gameId: "",
|
||||
gameCode: "",
|
||||
cover: "",
|
||||
amounts: "",
|
||||
showcase: false,
|
||||
sort: 0,
|
||||
amounts: '',
|
||||
gameOrigin: '',
|
||||
height: '',
|
||||
width: '',
|
||||
clientOrigin: 'COMMON',
|
||||
height: "",
|
||||
width: "",
|
||||
fullScreen: "",
|
||||
clientOrigin: "COMMON",
|
||||
regionList: [],
|
||||
fullScreen: '',
|
||||
self: '',
|
||||
selfGameCode: ''
|
||||
|
||||
gameOrigin: "",
|
||||
self: "",
|
||||
selfGameCode: ""
|
||||
},
|
||||
submitLoading: false,
|
||||
uploadLoading: false,
|
||||
@ -204,6 +327,7 @@ export default {
|
||||
sysOrigin: commonRules,
|
||||
gameOrigin: commonRules,
|
||||
name: commonRules,
|
||||
gameId: commonRules,
|
||||
showcase: commonRules,
|
||||
sort: commonRules,
|
||||
amounts: commonRules,
|
||||
@ -211,105 +335,114 @@ export default {
|
||||
fullScreen: commonRules,
|
||||
self: commonRules
|
||||
}
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
textOptTitle() {
|
||||
return this.row && this.row.id ? '修改' : '新增'
|
||||
return this.row && this.row.id ? "修改" : "新增";
|
||||
},
|
||||
isShowCoverUpload() {
|
||||
return !this.form.cover
|
||||
return !this.form.cover;
|
||||
},
|
||||
...mapGetters(['permissionsSysOriginPlatforms'])
|
||||
...mapGetters(["permissionsSysOriginPlatforms"])
|
||||
},
|
||||
watch: {
|
||||
row: {
|
||||
handler(val) {
|
||||
this.listRegion()
|
||||
this.listRegion();
|
||||
if (!val) {
|
||||
return
|
||||
return;
|
||||
}
|
||||
const form = Object.assign({}, val)
|
||||
const form = Object.assign({}, val);
|
||||
if (form.regions) {
|
||||
form.regionList = form.regions.split(',')
|
||||
form.regionList = form.regions.split(",");
|
||||
}
|
||||
this.coverFileList = getElementUiUploadFile(form.cover)
|
||||
this.form = Object.assign(this.form, form)
|
||||
this.coverFileList = getElementUiUploadFile(form.cover);
|
||||
this.form = Object.assign(this.form, form);
|
||||
if (this.form.selfGameCode) {
|
||||
this.form.self = true
|
||||
return
|
||||
this.form.self = true;
|
||||
return;
|
||||
}
|
||||
this.form.self = false
|
||||
this.form.self = false;
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
uploadCover(file) {
|
||||
const that = this
|
||||
that.coverUploadLoading = true
|
||||
that.$simpleUploadFlie(file, that.$application.fileBucket.other).then(res => {
|
||||
that.coverUploadLoading = false
|
||||
that.form.cover = that.$getAccessImgUrl(res.name)
|
||||
}).catch(er => {
|
||||
that.coverUploadLoading = false
|
||||
})
|
||||
const that = this;
|
||||
that.coverUploadLoading = true;
|
||||
that
|
||||
.$simpleUploadFlie(file, that.$application.fileBucket.other)
|
||||
.then(res => {
|
||||
that.coverUploadLoading = false;
|
||||
that.form.cover = that.$getAccessImgUrl(res.name);
|
||||
})
|
||||
.catch(er => {
|
||||
that.coverUploadLoading = false;
|
||||
});
|
||||
},
|
||||
handleCoverFileRemove(file, fileList) {
|
||||
this.form.cover = ''
|
||||
this.coverUploadLoading = false
|
||||
this.form.cover = "";
|
||||
this.coverUploadLoading = false;
|
||||
},
|
||||
listRegion() {
|
||||
const that = this
|
||||
that.loading = true
|
||||
that.form.sysOrigin = that.listquery
|
||||
regionConfigTable({ 'sysOrigin': that.form.sysOrigin }).then(res => {
|
||||
that.regions = res.body || []
|
||||
that.loading = false
|
||||
}).catch(er => {
|
||||
that.loading = false
|
||||
})
|
||||
const that = this;
|
||||
that.loading = true;
|
||||
that.form.sysOrigin = that.listquery;
|
||||
regionConfigTable({ sysOrigin: that.form.sysOrigin })
|
||||
.then(res => {
|
||||
that.regions = res.body || [];
|
||||
that.loading = false;
|
||||
})
|
||||
.catch(er => {
|
||||
that.loading = false;
|
||||
});
|
||||
},
|
||||
handleClose() {
|
||||
this.$emit('close')
|
||||
this.$emit("close");
|
||||
},
|
||||
changeSysOrigin() {
|
||||
this.listRegion()
|
||||
this.listRegion();
|
||||
},
|
||||
submitForm() {
|
||||
const that = this
|
||||
const that = this;
|
||||
that.$refs.form.validate(valid => {
|
||||
if (!valid) {
|
||||
console.error('error submit!!')
|
||||
return
|
||||
console.error("error submit!!");
|
||||
return;
|
||||
}
|
||||
if (that.form.self && !that.form.selfGameCode) {
|
||||
that.$opsMessage.info('必须填写自研游戏code')
|
||||
that.$opsMessage.info("必须填写自研游戏code");
|
||||
}
|
||||
const submitForm = Object.assign({}, that.form)
|
||||
that.submitLoading = true
|
||||
const amountsArrays = submitForm.amounts.split(',')
|
||||
submitForm.amounts = amountsArrays.filter(item => !isNaN(parseFloat(item)) && isFinite(item)).join(',')
|
||||
saveOrUpdateGameConfig(submitForm).then(res => {
|
||||
that.submitLoading = false
|
||||
that.$emit('success', res)
|
||||
}).catch(er => {
|
||||
that.submitLoading = false
|
||||
that.$emit('fial', er)
|
||||
})
|
||||
})
|
||||
const submitForm = Object.assign({}, that.form);
|
||||
that.submitLoading = true;
|
||||
const amountsArrays = submitForm.amounts.split(",");
|
||||
submitForm.amounts = amountsArrays
|
||||
.filter(item => !isNaN(parseFloat(item)) && isFinite(item))
|
||||
.join(",");
|
||||
saveOrUpdateGameConfig(submitForm)
|
||||
.then(res => {
|
||||
that.submitLoading = false;
|
||||
that.$emit("success", res);
|
||||
})
|
||||
.catch(er => {
|
||||
that.submitLoading = false;
|
||||
that.$emit("fial", er);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.form-contetn {
|
||||
max-height: 550px;
|
||||
overflow: auto;
|
||||
max-height: 550px;
|
||||
overflow: auto;
|
||||
}
|
||||
.form-autocomplete {
|
||||
li {
|
||||
li {
|
||||
line-height: normal;
|
||||
padding: 7px;
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user