|
|
@@ -105,6 +105,42 @@
|
|
|
<el-option v-for="item in categoryList" :key="item.categoryId" :label="item.categoryName" :value="item.categoryName"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item v-if="formData.showContent.find(x => x === 4)" label="按钮样式" class="goods-show-container">
|
|
|
+ <el-radio v-model="formData.button_type" label="1">图片按钮</el-radio>
|
|
|
+ <el-radio v-model="formData.button_type" label="2">自定义按钮</el-radio>
|
|
|
+ <!-- 上传图片按钮 -->
|
|
|
+ <div class="goods-show-content" v-show="formData.button_type === '1'">
|
|
|
+ <el-form-item label="按钮背景图:">
|
|
|
+ <div :style="'width: 50px;height:50px;backgroundImage: url('+formData.button_imgsrc+');background-size: 100%; background-repeat: no-repeat;'">
|
|
|
+ <!-- <el-image :src="formData.button_imgsrc" style="width: 50px;height: 50px;"></el-image>-->
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-button @click="changeImg">选择图片</el-button>
|
|
|
+ <el-form-item label="背景图宽度:">
|
|
|
+ <el-input type="number" v-model="formData.button_img_width"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="背景图高度:">
|
|
|
+ <el-input type="number" v-model="formData.button_img_height"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <!-- 自定义按钮样式 -->
|
|
|
+ <div class="goods-show-content" v-show="formData.button_type === '2'">
|
|
|
+ <el-form ref="form" :model="formData" label-width="100px" label-position="left" :inline="true">
|
|
|
+ <el-form-item label="文本内容:">
|
|
|
+ <el-input type="text" size="small" v-model="formData.button_text" maxlength="4"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="字体大小:">
|
|
|
+ <el-input type="number" size="small" v-model="formData.button_font_size"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="边框弧度:">
|
|
|
+ <el-input type="number" size="small" v-model="formData.button_border_radius"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="背景颜色:">
|
|
|
+ <el-color-picker size="small" v-model="formData.button_back_color"></el-color-picker>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -134,15 +170,36 @@ export default {
|
|
|
categoryList: [],
|
|
|
dragIndex: '',
|
|
|
enterIndex: '',
|
|
|
+ resourcesUrl: process.env.VUE_APP_RESOURCES_URL,
|
|
|
commonCheckFieldRules: 'checkData', // 当前组件默认的规则判断函数
|
|
|
dialogChooseGoods: false,
|
|
|
isGetChooseData: false, // 是否该是获取选择的数据
|
|
|
+ iconList: [{
|
|
|
+ value: 'el-icon-circle-plus-outline',
|
|
|
+ label: '1'
|
|
|
+ }, {
|
|
|
+ value: 'el-icon-goods',
|
|
|
+ label: '2'
|
|
|
+ }, {
|
|
|
+ value: 'el-icon-s-goods',
|
|
|
+ label: '3'
|
|
|
+ }],
|
|
|
formData: {
|
|
|
categoryName: null,
|
|
|
categoryId: null,
|
|
|
size: 2, // 一行多少个
|
|
|
- showContent: [1, 2, 3],
|
|
|
- goods: []
|
|
|
+ showContent: [1, 2, 3, 4],
|
|
|
+ goods: [],
|
|
|
+ button_type: '1',
|
|
|
+ button_img_width: 54,
|
|
|
+ button_img_height: 24,
|
|
|
+ button_imgsrc: undefined,//购买按钮背景图
|
|
|
+ buy_btn_type: 1, // 购买按钮的样式
|
|
|
+ button_text: '马上抢',// 购买按钮的文本
|
|
|
+ icon_class: 'el-icon-s-goods', //购买按钮的icon
|
|
|
+ button_font_size: 10,// 购买按钮的字体大小
|
|
|
+ button_border_radius: 0, //购买按钮边框弧度
|
|
|
+ button_back_color: '#ffffff' //购买按钮背景颜色
|
|
|
// buy_btn_type: 1, // 购买按钮的样式
|
|
|
// button_text: '马上抢'// 购买按钮的文本
|
|
|
},
|
|
|
@@ -159,6 +216,10 @@ export default {
|
|
|
{
|
|
|
value: 3,
|
|
|
label: this.$i18n.t('shopFeature.goods.prodPrice')
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 4,
|
|
|
+ label: '按钮'
|
|
|
}],
|
|
|
// 一行几个
|
|
|
lineSize: [
|
|
|
@@ -244,6 +305,14 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ /** 更换图片 */
|
|
|
+ changeImg (index) {
|
|
|
+ console.log(index)
|
|
|
+ this.isChangeImg = true
|
|
|
+ this.currentEditIndex = index
|
|
|
+ this.elxImgboxHandle(1)
|
|
|
+ // this.canChooseImagesNum = 1
|
|
|
+ },
|
|
|
getlistCategory(){
|
|
|
this.$http({
|
|
|
url: this.$http.adornUrl('/prod/category/listCategory'),
|
