fe / yoho-shop-manage · Commits

Go to a project

Authored by htoooth
Commit 73e48ea5018804bc38d29cfb5789a4e8f66d8e2b 1 parent 2d07c4c9

fix

Inline Side-by-side
Showing 2 changed files with 101 additions and 95 deletions
... ... @@ -27,7 +27,7 @@
<Row>
<Col span="8">
<Form-item label="类目">
<span>{{product.sortName}}</span>
<span>{{sortName}}</span>
</Form-item>
</Col>
</Row>
... ... @@ -103,7 +103,7 @@
</Row>
<Row>
<Form-item label="颜色*">
<Form-item label="颜色">
<span class='squre'
v-for="color in colors"
@click="clickColor(color)"
... ... @@ -120,7 +120,7 @@
</Row>
<Row>
<Form-item label="尺寸*">
<Form-item label="尺寸">
<Checkbox-group v-model='table.selectedSizes'>
<Checkbox v-for="size in sizes" :key="size" :label="size.id" >
<span>{{size.sizeName}}</span>
... ... @@ -161,9 +161,11 @@
</Form>
<Row>
<Col span="6" offset="10" class="text-center">
<Button type="primary" @click="backStep">上一步</Button>
<Button type="primary" @click="nextStep">下一步</Button>
<Col>
<div style="text-align: center">
<Button type="primary" @click="backStep" size="large">上一步</Button>
<Button type="primary" @click="nextStep" size="large">下一步</Button>
</div>
</Col>
</Row>
</div>
... ... @@ -251,7 +253,7 @@ export default {
}
},
{
title: '颜色展示名称*',
title: '颜色展示名称',
key: 'factoryGoodsName',
render(row, col, index) {
return `<div v-if="isExist(${index})">
... ... @@ -431,7 +433,6 @@ export default {
},
getSize: function() {
return api.getSize(this.product.smallSortId).then((result) => {
// return api.getSize(129).then((result) => {
if (result.code === 200) {
this.sizes = result.data;
}
... ... @@ -646,7 +647,7 @@ export default {
},
computed: {
sortName: function() {
return `${this.product.maxSortName}/${this.product.middleSortName}/${this.product.smallSortName}`;
return this.product.maxSortName + '/' + this.product.middleSortName + '/' + this.product.smallSortName;
}
},
watch: {
... ... @@ -681,67 +682,69 @@ export default {
</script>
<style lang="scss">
@mixin row-span{
min-height: 30px;
@mixin row-span{
min-height: 30px;
.row-span {
min-height: 30px;
border-bottom: 1px solid #e3e8ee;
padding-top: 20px ;
padding-bottom: 20px ;
margin-left: -18px;
margin-right: -18px;
padding-left: 18px ;
padding-right: 18px ;
&:last-child {
border-bottom: none;
}
.row-span {
min-height: 30px;
border-bottom: 1px solid #e3e8ee;
padding-top: 20px ;
padding-bottom: 20px ;
margin-left: -18px;
margin-right: -18px;
padding-left: 18px ;
padding-right: 18px ;
&:last-child {
border-bottom: none;
}
}
.squre {
display: inline-block;
height: 30px;
margin-right: 10px;
cursor: pointer;
border: 1px solid white;
}
.squre-selected {
border: 1px solid black;
}
.squre-disabled {
color: gray;
opacity: 0.5;
cursor: not-allowed;
border: 1px solid gray;
}
.squre-color {
display: inline-block;
height: 28px;
width: 28px;
}
.squre-name {
display: inline-block;
height: 30px;
line-height: 30px;
vertical-align: top;
}
.size-code {
@include row-span;
}
.size-id {
@include row-span;
}
.size-operator {
@include row-span;
}
}
.squre {
display: inline-block;
height: 30px;
margin-right: 10px;
cursor: pointer;
border: 1px solid white;
}
.squre-selected {
border: 1px solid black;
}
.squre-disabled {
color: gray;
opacity: 0.5;
cursor: not-allowed;
border: 1px solid gray;
}
.squre-color {
display: inline-block;
height: 28px;
width: 28px;
}
.squre-name {
display: inline-block;
height: 30px;
line-height: 30px;
vertical-align: top;
}
.size-code {
@include row-span;
}
.size-id {
@include row-span;
text-align: center;
}
.size-operator {
@include row-span;
text-align: center;
}
</style>
... ...
... ... @@ -200,9 +200,11 @@
</Row>
<Row>
<Col span="6" offset="10" class="text-center">
<Button type="primary" @click="backStep">上一步</Button>
<Button type="primary" @click="nextStep">保存</Button>
<Col>
<div style="text-align: center">
<Button type="primary" @click="backStep" size="large">上一步</Button>
<Button type="primary" @click="nextStep" size="large">保存</Button>
</div>
</Col>
</Row>
</div>
... ... @@ -350,29 +352,30 @@ export default {
<style lang="scss">
.upload-item {
display: inline-block;
height: 200px;
width: 130px;
text-align: center;
}
.color-item-title {
text-align: center;
margin: 50px 0;
}
.upload-item-img {
display: inline-block;
height: 124px;
width: 124px;
border: 2px solid #e8e8e8;
box-sizing: border-box;
}
.upload-item-title {
display: inline-block;
margin-top: 15px;
}
.upload-item {
display: inline-block;
height: 180px;
width: 130px;
text-align: center;
margin: 10px 0;
}
.color-item-title {
text-align: center;
margin: 50px 0;
}
.upload-item-img {
display: inline-block;
height: 126px;
width: 124px;
border: 2px solid #e8e8e8;
box-sizing: border-box;
}
.upload-item-title {
display: inline-block;
margin-top: 15px;
}
</style>
... ...