248 lines
6.7 KiB
Vue
248 lines
6.7 KiB
Vue
|
<!--
|
||
|
|
* @Descripttion:
|
||
|
|
* @version:
|
||
|
|
* @Author: kBank
|
||
|
|
* @Date: 2023-02-23 15:59:57
|
||
|
|
-->
|
||
|
|
<template>
|
||
|
|
<div class="page">
|
||
|
|
<div class="main">
|
||
|
|
<el-form :model="ruleForm"
|
||
|
|
:rules="rules"
|
||
|
|
ref="ruleForm"
|
||
|
|
label-width="100px"
|
||
|
|
class="demo-ruleForm">
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="22">
|
||
|
|
<el-form-item :label="$t('MN_F_T_732')"
|
||
|
|
prop="titleName">
|
||
|
|
<el-input clearable
|
||
|
|
v-model="ruleForm.titleName"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="22">
|
||
|
|
<el-form-item :label="$t('MN_F_T_749')"
|
||
|
|
prop="twoLevelTitle">
|
||
|
|
<el-input clearable
|
||
|
|
v-model="ruleForm.twoLevelTitle"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="6">
|
||
|
|
<el-form-item :label="$t('MN_F_T_61')"
|
||
|
|
prop="pkAreaClassify">
|
||
|
|
<el-select clearable
|
||
|
|
v-model="ruleForm.pkAreaClassify">
|
||
|
|
<el-option v-for="item in classifyList"
|
||
|
|
:key="item.pkId"
|
||
|
|
:label="item.classifyName"
|
||
|
|
:value="item.pkId"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="6">
|
||
|
|
<el-form-item :label="$t('S_C_83')"
|
||
|
|
prop="languageType">
|
||
|
|
<el-select v-model="ruleForm.languageType"
|
||
|
|
size="medium"
|
||
|
|
filterable
|
||
|
|
:placeholder="$t('CK_KS_38')">
|
||
|
|
<el-option v-for="item in countryList"
|
||
|
|
:key="item.pkCountry"
|
||
|
|
:label="item.name"
|
||
|
|
:value="item.pkCountry">
|
||
|
|
</el-option>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item :label="$t('MN_F_T_750')"
|
||
|
|
prop="coverAddress">
|
||
|
|
<imageUpload v-model="ruleForm.coverAddress" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="12">
|
||
|
|
<el-form-item :label="$t('CK_KS_46')"
|
||
|
|
prop="picture">
|
||
|
|
<imageUpload v-model="ruleForm.picture" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
<el-row>
|
||
|
|
<el-col :span="22">
|
||
|
|
<el-form-item :label="$t('MN_F_T_295')"
|
||
|
|
prop="content">
|
||
|
|
<editor ref="sptwEditor"
|
||
|
|
v-model="ruleForm.content"
|
||
|
|
:min-height="196"
|
||
|
|
:uploadUrl="uploadImgUrl" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
<div class="footer">
|
||
|
|
<el-button size="small"
|
||
|
|
class="thebtn2"> {{ $t('ENU_P_TYPE0') }}</el-button>
|
||
|
|
<el-button size="small"
|
||
|
|
@click="submit"
|
||
|
|
class="thebtn1"> {{ $t('MN_F_32') }}</el-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Editor from '@/components/Editor'
|
||
|
|
import * as api from '@/api/site.js'
|
||
|
|
import ImageUpload from '@/components/ImageUpload'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
Editor,
|
||
|
|
ImageUpload,
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
uploadImgUrl: process.env.VUE_APP_BASE_API + '/system/upload',
|
||
|
|
ruleForm: {
|
||
|
|
isType: '',
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
picture: [{ required: true, message: this.$t('MN_F_T_356'), trigger: 'change' }],
|
||
|
|
coverAddress: [
|
||
|
|
{ required: true, message: this.$t('MN_F_T_751'), trigger: 'change' },
|
||
|
|
],
|
||
|
|
pkAreaClassify: [
|
||
|
|
{ required: true, message: this.$t('MN_F_T_457'), trigger: 'change' },
|
||
|
|
],
|
||
|
|
titleName: [{ required: true, message: this.$t('MN_F_T_736'), trigger: 'blur' }],
|
||
|
|
twoLevelTitle: [
|
||
|
|
{ required: true, message: this.$t('MN_F_T_752'), trigger: 'blur' },
|
||
|
|
],
|
||
|
|
content: [{ required: true, message: this.$t('MN_F_T_738'), trigger: 'blur' }],
|
||
|
|
sort: [{ required: true, message: this.$t('MN_F_T_357'), trigger: 'blur' }],
|
||
|
|
languageType: [
|
||
|
|
{ required: true, message: this.$t('MN_F_T_739'), trigger: 'change' },
|
||
|
|
],
|
||
|
|
},
|
||
|
|
localList: [],
|
||
|
|
popList: [],
|
||
|
|
webList: [],
|
||
|
|
gradeList: [],
|
||
|
|
pkId: '',
|
||
|
|
funcList: [],
|
||
|
|
jsList: [],
|
||
|
|
news: false,
|
||
|
|
lookOver: false,
|
||
|
|
classifyList: [],
|
||
|
|
countryList: [],
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.pkId = this.$route.query.pkId || ''
|
||
|
|
if (this.pkId != '') {
|
||
|
|
this.getDetails()
|
||
|
|
}
|
||
|
|
this.goodClify()
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
goodClify() {
|
||
|
|
api
|
||
|
|
.classifyList({
|
||
|
|
isRecommend: 0,
|
||
|
|
})
|
||
|
|
.then((res) => {
|
||
|
|
this.classifyList = res.data
|
||
|
|
})
|
||
|
|
api.userCountryList().then((res) => {
|
||
|
|
this.countryList = res.data
|
||
|
|
})
|
||
|
|
},
|
||
|
|
getDetails() {
|
||
|
|
api.getOneProduct(this.pkId).then((res) => {
|
||
|
|
this.ruleForm = res.data
|
||
|
|
this.$forceUpdate()
|
||
|
|
})
|
||
|
|
},
|
||
|
|
submit() {
|
||
|
|
let obj = Object.assign({}, this.ruleForm, { pkId: this.pkId })
|
||
|
|
let urlRequest = ''
|
||
|
|
if (this.pkId == '') {
|
||
|
|
urlRequest = api.productSave
|
||
|
|
} else {
|
||
|
|
urlRequest = api.productUpdate
|
||
|
|
}
|
||
|
|
urlRequest(obj).then((res) => {
|
||
|
|
if (res.code == 200) {
|
||
|
|
if (this.pkId == '') {
|
||
|
|
this.$message({
|
||
|
|
message: this.$t('MN_F_T_477'),
|
||
|
|
type: 'success',
|
||
|
|
})
|
||
|
|
} else {
|
||
|
|
this.$message({
|
||
|
|
message: this.$t('MN_F_T_478'),
|
||
|
|
type: 'success',
|
||
|
|
})
|
||
|
|
}
|
||
|
|
this.$router.replace({
|
||
|
|
path: 'goodsSet',
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
// console.log(
|
||
|
|
// '%c [ res ]-238',
|
||
|
|
// 'font-size:13px; background:#5f4299; color:#a386dd;',
|
||
|
|
// res
|
||
|
|
// )
|
||
|
|
})
|
||
|
|
},
|
||
|
|
},
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.page {
|
||
|
|
padding: 20px;
|
||
|
|
background: #f9f9f9;
|
||
|
|
font-size: 14px;
|
||
|
|
.main {
|
||
|
|
background: #ffffff;
|
||
|
|
border-radius: 8px;
|
||
|
|
box-shadow: 0px 2px 20px 0px rgba(238, 238, 238, 0.5);
|
||
|
|
padding: 10px;
|
||
|
|
}
|
||
|
|
::v-deep .el-select {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.footer {
|
||
|
|
height: 68px;
|
||
|
|
background: #ffffff;
|
||
|
|
box-shadow: 0px -3px 20px 0px rgba(204, 204, 204, 0.5);
|
||
|
|
// margin: 0 20px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
.thebtn1 {
|
||
|
|
background: #3181e5;
|
||
|
|
color: #ffffff;
|
||
|
|
padding: 9px 45px;
|
||
|
|
}
|
||
|
|
.thebtn2 {
|
||
|
|
background: #cccccc;
|
||
|
|
color: #ffffff;
|
||
|
|
padding: 9px 45px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|