wip
This commit is contained in:
parent
2b58f96081
commit
21dfea692f
|
|
@ -34,6 +34,10 @@ body {
|
|||
font-size: 12px;
|
||||
}
|
||||
|
||||
.open-file-manager {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-manager-box .layui-layer-title {
|
||||
background-color: #293042;
|
||||
color: #fff;
|
||||
|
|
@ -45,6 +49,16 @@ body {
|
|||
background-position: center center;
|
||||
}
|
||||
|
||||
.set-product-img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #eee;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
display: flex;
|
||||
transition: margin-left 0.25s ease-in-out, left 0.25s ease-in-out, margin-right 0.25s ease-in-out, right 0.25s ease-in-out;
|
||||
|
|
@ -560,8 +574,8 @@ body.page-product-form .variants-producr-img {
|
|||
justify-content: center;
|
||||
}
|
||||
body.page-product-form .variant-value-img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -27,6 +27,10 @@ body {
|
|||
font-size: 12px;
|
||||
}
|
||||
|
||||
.open-file-manager {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-manager-box {
|
||||
.layui-layer-title {
|
||||
background-color: #293042;
|
||||
|
|
@ -41,6 +45,16 @@ body {
|
|||
}
|
||||
}
|
||||
|
||||
.set-product-img {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #eee;
|
||||
display: flex;
|
||||
align-items: center; // flex-start | center
|
||||
justify-content: center; // flex-end | center | space-between
|
||||
}
|
||||
|
||||
.main-content {
|
||||
display: flex;
|
||||
// flex-direction: column;
|
||||
|
|
|
|||
|
|
@ -13,8 +13,8 @@ body.page-product-form {
|
|||
}
|
||||
|
||||
.variant-value-img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -52,11 +52,13 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input v-if="form.skus.length" type="hidden" name="variables" :value="JSON.stringify(form.variables)">
|
||||
|
||||
<div class="form-group" v-if="editing.isVariable">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label"></label>
|
||||
<div class="col-sm-10">
|
||||
<div v-if="editing.isVariable" class="selectable-variants">
|
||||
<div class="selectable-variants">
|
||||
<div>
|
||||
<div v-for="(variant, variantIndex) in source.variables" :id="'selectable-variant-' + variantIndex">
|
||||
<div class="title">
|
||||
|
|
@ -108,7 +110,6 @@
|
|||
</div>
|
||||
|
||||
<div v-if="form.skus.length" class="mt-3">
|
||||
<input v-if="form.skus.length" type="hidden" name="variables" :value="JSON.stringify(form.variables)">
|
||||
<table class="table table-bordered table-hover">
|
||||
<thead>
|
||||
<th v-for="(variant, index) in form.variables" :key="'pv-header-' + index">
|
||||
|
|
@ -161,34 +162,96 @@
|
|||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="!editing.isVariable">
|
||||
<div>
|
||||
<input type="text" name="skus[0][image]" placeholder="image"
|
||||
value="{{ old('skus.0.image', $product->skus[0]->image ?? '') }}">
|
||||
<input type="text" name="skus[0][model]" placeholder="model"
|
||||
value="{{ old('skus.0.model', $product->skus[0]->model ?? '') }}">
|
||||
<input type="text" name="skus[0][sku]" placeholder="sku"
|
||||
value="{{ old('skus.0.sku', $product->skus[0]->sku ?? '') }}">
|
||||
<input type="text" name="skus[0][price]" placeholder="price"
|
||||
value="{{ old('skus.0.price', $product->skus[0]->price ?? '') }}">
|
||||
<input type="text" name="skus[0][origin_price]" placeholder="origin_price"
|
||||
value="{{ old('skus.0.origin_price', $product->skus[0]->origin_price ?? '') }}">
|
||||
<input type="text" name="skus[0][cost_price]" placeholder="cost_price"
|
||||
value="{{ old('skus.0.cost_price', $product->skus[0]->cost_price ?? '') }}">
|
||||
<input type="text" name="skus[0][quantity]" placeholder="quantity"
|
||||
value="{{ old('skus.0.quantity', $product->skus[0]->quantity ?? '') }}">
|
||||
<input type="hidden" name="skus[0][variants]" placeholder="variants" value="">
|
||||
<input type="hidden" name="skus[0][position]" placeholder="position" value="0">
|
||||
<input type="hidden" name="skus[0][is_default]" placeholder="is_default" value="1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template v-if="!editing.isVariable">
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">图片</label>
|
||||
<div class="col-sm-10">
|
||||
|
||||
<div class="open-file-manager set-product-img">
|
||||
<div>
|
||||
<img :src="thumbnail(form.skus[0].image)" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
<input type="hidden" v-model="form.skus[0].image" name="skus[0][image]">
|
||||
{{-- <input type="text" class="form-control form-control-sm short" name="skus[0][image]" placeholder="image"
|
||||
value="{{ old('skus.0.image', $product->skus[0]->image ?? '') }}"> --}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">model</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" class="form-control form-control-sm short" name="skus[0][model]" placeholder="model"
|
||||
value="{{ old('skus.0.model', $product->skus[0]->model ?? '') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">sku</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" class="form-control form-control-sm short" name="skus[0][sku]" placeholder="sku"
|
||||
value="{{ old('skus.0.sku', $product->skus[0]->sku ?? '') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">price</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" class="form-control form-control-sm short" name="skus[0][price]" placeholder="price"
|
||||
value="{{ old('skus.0.price', $product->skus[0]->price ?? '') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">origin_price</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" class="form-control form-control-sm short" name="skus[0][origin_price]" placeholder="origin_price"
|
||||
value="{{ old('skus.0.origin_price', $product->skus[0]->origin_price ?? '') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">cost_price</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" name="skus[0][cost_price]" class="form-control form-control-sm short" placeholder="cost_price"
|
||||
value="{{ old('skus.0.cost_price', $product->skus[0]->cost_price ?? '') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="row align-items-center">
|
||||
<label for="" class="col-sm-2 col-form-label">quantity</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" class="form-control form-control-sm short" name="skus[0][quantity]" placeholder="quantity"
|
||||
value="{{ old('skus.0.quantity', $product->skus[0]->quantity ?? '') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="hidden" name="skus[0][variants]" placeholder="variants" value="">
|
||||
<input type="hidden" name="skus[0][position]" placeholder="position" value="0">
|
||||
<input type="hidden" name="skus[0][is_default]" placeholder="is_default" value="1">
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="row">
|
||||
<div class="col-sm-2"></div>
|
||||
<div class="col-sm-10"><button type="submit" class="btn btn-primary">Save</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary">Save</button>
|
||||
|
||||
<el-dialog
|
||||
title="编辑"
|
||||
|
|
@ -223,6 +286,11 @@
|
|||
@push('footer')
|
||||
<script>
|
||||
Vue.prototype.thumbnail = function thumbnail(image, width, height) {
|
||||
// 判断 image 是否以 http 开头
|
||||
if (image.indexOf('http') === 0) {
|
||||
return image;
|
||||
}
|
||||
|
||||
return '{{ asset('catalog') }}' + image;
|
||||
};
|
||||
|
||||
|
|
@ -231,6 +299,11 @@
|
|||
data: {
|
||||
current_language_code: '{{ current_language_code() }}',
|
||||
form: {
|
||||
model: @json($product->skus[0]['model'] ?? ''),
|
||||
price: @json($product->skus[0]['price'] ?? ''),
|
||||
quantity: @json($product->skus[0]['quantity'] ?? ''),
|
||||
sku: @json($product->skus[0]['sku'] ?? ''),
|
||||
status: @json($product->skus[0]['status'] ?? false),
|
||||
variables: @json($product->variables ?? []),
|
||||
skus: @json($product->skus ?? []),
|
||||
},
|
||||
|
|
@ -324,6 +397,10 @@
|
|||
});
|
||||
},
|
||||
|
||||
swapSourceVariantValue(e, variantIndex) {
|
||||
console.log(e, variantIndex)
|
||||
},
|
||||
|
||||
closedialogVariablesFormDialog(form) {
|
||||
this.dialogVariables.show = false;
|
||||
this.dialogVariables.variantIndex = null;
|
||||
|
|
@ -332,6 +409,13 @@
|
|||
this.$refs[form].clearValidate();
|
||||
},
|
||||
|
||||
removeSourceVariantValue(variantIndex, variantValueIndex) {
|
||||
this.source.variables[variantIndex].values.splice(variantValueIndex, 1);
|
||||
// this.form.variants = this.validSourceVariants;
|
||||
|
||||
|
||||
},
|
||||
|
||||
modalVariantOpenButtonClicked(variantIndex, variantValueIndex) {
|
||||
this.dialogVariables.variantIndex = variantIndex;
|
||||
this.dialogVariables.variantValueIndex = variantValueIndex;
|
||||
|
|
@ -349,7 +433,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
console.log(name)
|
||||
this.dialogVariables.form.name = JSON.parse(JSON.stringify(name));
|
||||
this.dialogVariables.show = true;
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue