|
@@ -17,6 +17,41 @@
|
|
|
<el-option v-for="(item, key) in goodTypes" :key="key" :label="item" :value="Number(key)"></el-option>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="标签:" prop="goodType">
|
|
|
+ <el-tag
|
|
|
+ :key="index"
|
|
|
+ v-for="(tag,index) in form.labels"
|
|
|
+ closable
|
|
|
+ :disable-transitions="false"
|
|
|
+ @close="handleClose(index,tag)">
|
|
|
+ {{tag.content}}
|
|
|
+ </el-tag>
|
|
|
+ <el-autocomplete
|
|
|
+ class="inline-input margin-left_10"
|
|
|
+ v-if="inputVisible"
|
|
|
+ ref="saveTagInput"
|
|
|
+ size="small"
|
|
|
+ v-model="inputValue"
|
|
|
+ :fetch-suggestions="querySearch"
|
|
|
+ placeholder="请输入内容"
|
|
|
+ @select="handleSelect"
|
|
|
+ @keydown.enter.native="handleInputConfirm"
|
|
|
+ >
|
|
|
+ <template slot-scope="{ item }">
|
|
|
+ <div class="label_item">
|
|
|
+ <div class="name">
|
|
|
+ {{ item.content }}
|
|
|
+ </div>
|
|
|
+ <div class="btns">
|
|
|
+ <i v-if="item.id" class="el-icon-edit margin-right_10" @click.stop="editLabel(item,$event)"></i>
|
|
|
+ <i class="el-icon-delete" @click.stop="delLabel(item,$event)"></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </template>
|
|
|
+ </el-autocomplete>
|
|
|
+ <el-button v-else class="button-new-tag margin-left_10" size="small" @click="showInput">+ New Tag</el-button>
|
|
|
+ </el-form-item>
|
|
|
<!-- 会员/功能清单 -->
|
|
|
<template v-if="form.goodType">
|
|
|
<div class="vipOrFunList">
|
|
@@ -111,6 +146,9 @@
|
|
|
<el-form-item label="单价(元):" prop="price">
|
|
|
<el-input-number v-model="form.price" :precision="2" controls-position="right" :min="0" style="width: 100%;"></el-input-number>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="原价(元):" prop="orgPrice">
|
|
|
+ <el-input-number v-model="form.orgPrice" :precision="2" controls-position="right" :min="0" style="width: 100%;"></el-input-number>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="购买限制:" prop="goodLimits">
|
|
|
<el-select v-model="form.goodLimits" clearable multiple placeholder="请选择购买限制" style="width: 100%;">
|
|
|
<el-option v-for="(item, index) in goodsLimit" :key="index" :label="item.limitName" :value="item.id"></el-option>
|
|
@@ -144,6 +182,15 @@
|
|
|
<el-form-item label="名称:" prop="goodName">
|
|
|
<div>{{ form.goodName }}</div>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="标签:" prop="labels">
|
|
|
+ <el-tag
|
|
|
+ v-for="(tag,index) in form.labels"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ {{tag.content}}
|
|
|
+ </el-tag>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
<el-form-item label="类型:" prop="goodType">
|
|
|
<div>{{ form.goodTypeStr }}</div>
|
|
|
</el-form-item>
|
|
@@ -173,6 +220,11 @@
|
|
|
{{ form.price }}元
|
|
|
</div>
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="原价:" prop="orgPrice">
|
|
|
+ <div v-if="form.orgPrice">
|
|
|
+ {{ form.orgPrice }}元
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
<el-form-item label="购买限制:" prop="goodLimits">
|
|
|
<div v-if="form.goodByLimitVos && form.goodByLimitVos.length">
|
|
|
{{ form.goodByLimitVos.map(item=>item.limitName).join('、') }}
|
|
@@ -199,6 +251,18 @@
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ title="标签修改"
|
|
|
+ :visible.sync="editLabel_option.dialog"
|
|
|
+ width="30%"
|
|
|
+ :before-close="closeEditLabel">
|
|
|
+ <el-input size="small" v-model="editLabel_option.content"></el-input>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button size="small" @click="closeEditLabel">取 消</el-button>
|
|
|
+ <el-button size="small" type="primary" @click="saveLabel()">确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -206,12 +270,14 @@
|
|
|
const currentForm = {
|
|
|
id:null,
|
|
|
goodName:'',
|
|
|
+ labels:[],
|
|
|
goodType:1,
|
|
|
goodId:null,
|
|
|
startSaleTime:'',
|
|
|
expireTime:'',
|
|
|
goodCount:1,
|
|
|
price:1.00,
|
|
|
+ orgPrice:null,
|
|
|
goodUnit:2,
|
|
|
goodLimits:[],
|
|
|
goodStrategies:[],
|
|
@@ -267,7 +333,19 @@ export default {
|
|
|
},
|
|
|
total:0,
|
|
|
loading:false,
|
|
|
- reload:true
|
|
|
+ reload:true,
|
|
|
+ inputVisible:false,
|
|
|
+ inputValue:'',
|
|
|
+ labels:[],
|
|
|
+ labels_option:{
|
|
|
+ queryString:"",
|
|
|
+ cb:null
|
|
|
+ },
|
|
|
+ editLabel_option:{
|
|
|
+ dialog:false,
|
|
|
+ content:'',
|
|
|
+ id:''
|
|
|
+ }
|
|
|
};
|
|
|
},
|
|
|
watch: {
|
|
@@ -298,6 +376,221 @@ export default {
|
|
|
this.init()
|
|
|
},
|
|
|
methods: {
|
|
|
+ editLabel(item,event){
|
|
|
+ event.stopPropagation();
|
|
|
+ let obj = this.form.labels.find(label=>{
|
|
|
+ return label.content == item.content
|
|
|
+ })
|
|
|
+ if(obj){
|
|
|
+ this.$message.warning('该标签已添加到该商品中,禁止修改!!!')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.$refs.saveTagInput.activated = false
|
|
|
+ this.editLabel_option ={
|
|
|
+ dialog:true,
|
|
|
+ content:item.content,
|
|
|
+ id:item.id
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ closeEditLabel(){
|
|
|
+ this.editLabel_option ={
|
|
|
+ dialog:false,
|
|
|
+ content:'',
|
|
|
+ id:null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ saveLabel(ifForced=false){
|
|
|
+ var params = {
|
|
|
+ id:this.editLabel_option.id,
|
|
|
+ content:this.editLabel_option.content,
|
|
|
+ ifForced:ifForced
|
|
|
+ }
|
|
|
+ this.$api.updateLabel(params).then(response=>{
|
|
|
+ if(response.code == 200){
|
|
|
+ if(response.data.ifUpdate){
|
|
|
+ this.$message.success('修改成功')
|
|
|
+ let item = this.labels.find(i=>{
|
|
|
+ return i.id == this.editLabel_option.id
|
|
|
+ })
|
|
|
+ if(item){
|
|
|
+ this.$set(item,'content',this.editLabel_option.content)
|
|
|
+ this.querySearch(this.labels_option.queryString,this.labels_option.cb)
|
|
|
+ }
|
|
|
+ this.closeEditLabel()
|
|
|
+ }else{
|
|
|
+ this.forcedEdit(response.data.message)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }).catch(error=>{
|
|
|
+ this.$message.warning('修改失败')
|
|
|
+ })
|
|
|
+ },
|
|
|
+ forcedEdit(message){
|
|
|
+ this.$confirm(message, '提示', {
|
|
|
+ confirmButtonText: '强制修改',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.saveLabel(true)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ delLabel(item,event){
|
|
|
+ if(event){
|
|
|
+ event.stopPropagation();
|
|
|
+ }
|
|
|
+ let obj = this.form.labels.find(label=>{
|
|
|
+ return label.content == item.content
|
|
|
+ })
|
|
|
+ if(obj){
|
|
|
+ this.$message.warning('该标签已添加到该商品中,禁止删除!!!')
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ let index = this.labels.findIndex(label=>{
|
|
|
+ return label.content == item.content
|
|
|
+ })
|
|
|
+ if(!item.id){
|
|
|
+ this.labels.splice(index, 1);
|
|
|
+ this.querySearch(this.labels_option.queryString,this.labels_option.cb)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.$confirm('确认删除吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.delLabelById([item.id])
|
|
|
+ })
|
|
|
+ },
|
|
|
+ delLabelById(ids,ifForced=false){
|
|
|
+ let params = {
|
|
|
+ ids:ids,
|
|
|
+ ifForced:ifForced
|
|
|
+ }
|
|
|
+ this.$api.deleteLabel(params).then(response=>{
|
|
|
+ if(response.code == 200){
|
|
|
+ if(response.data.ifDelete){
|
|
|
+ this.$message.success('删除成功')
|
|
|
+ this.querySearch(this.labels_option.queryString,this.labels_option.cb,1)
|
|
|
+ }else{
|
|
|
+ this.forcedDel(ids,response.data.message)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }).catch(error=>{
|
|
|
+ this.$message.warning('删除失败')
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ forcedDel(ids,message){
|
|
|
+ this.$confirm(message, '提示', {
|
|
|
+ confirmButtonText: '强制删除',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.delLabelById(ids,true)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async querySearch(queryString, cb,type) {
|
|
|
+ this.labels_option = {
|
|
|
+ queryString:queryString,
|
|
|
+ cb:cb
|
|
|
+ }
|
|
|
+ if(this.labels.length == 0 || type){
|
|
|
+ await this.getLabels()
|
|
|
+ }
|
|
|
+ var restaurants = this.labels;
|
|
|
+ var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
|
|
|
+ // 调用 callback 返回建议列表的数据
|
|
|
+ cb(results);
|
|
|
+ },
|
|
|
+ createFilter(queryString) {
|
|
|
+ return (restaurant) => {
|
|
|
+ return (restaurant.content.toLowerCase().indexOf(queryString.toLowerCase()) !== -1);
|
|
|
+ };
|
|
|
+ },
|
|
|
+ //获取标签
|
|
|
+ async getLabels(queryString){
|
|
|
+ var params = {
|
|
|
+ content:queryString
|
|
|
+ }
|
|
|
+ await this.$api.queryLabel(params).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.labels=res.data.records
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleClose(index,tag) {
|
|
|
+ this.form.labels.splice(index, 1);
|
|
|
+ if(!tag.id){
|
|
|
+ this.delLabel(tag)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ showInput() {
|
|
|
+ this.inputVisible = true;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.saveTagInput.$refs.input.focus();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleSelect(item) {
|
|
|
+ let obj1 = this.form.labels.find(label=>{
|
|
|
+ return label.content.trim() == item.content.trim()
|
|
|
+ })
|
|
|
+ if(obj1){
|
|
|
+ this.$message.warning('该标签已添加')
|
|
|
+ this.inputVisible = false;
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.form.labels.push(
|
|
|
+ {
|
|
|
+ id:item.id,
|
|
|
+ content:item.content
|
|
|
+ }
|
|
|
+ )
|
|
|
+ this.inputVisible = false;
|
|
|
+ },
|
|
|
+
|
|
|
+ handleInputConfirm() {
|
|
|
+ let inputValue = this.inputValue;
|
|
|
+ if(!inputValue.trim()){
|
|
|
+ this.inputVisible = false;
|
|
|
+ this.inputValue = '';
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let obj1 = this.form.labels.find(item=>{
|
|
|
+ return item.content.trim() == this.inputValue.trim()
|
|
|
+ })
|
|
|
+ if(obj1){
|
|
|
+ this.$message.warning('该标签已添加')
|
|
|
+ this.inputVisible = false;
|
|
|
+ this.inputValue = '';
|
|
|
+ return false
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ let obj = this.labels.find(item=>{
|
|
|
+ return item.content.trim() == this.inputValue.trim()
|
|
|
+ })
|
|
|
+ if(obj){
|
|
|
+ this.form.labels.push(
|
|
|
+ {
|
|
|
+ id:obj.id,
|
|
|
+ content:inputValue
|
|
|
+ }
|
|
|
+ );
|
|
|
+ }else{
|
|
|
+ let label = {
|
|
|
+ content:inputValue
|
|
|
+ }
|
|
|
+ this.labels.push(label)
|
|
|
+ this.form.labels.push(label);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ this.inputVisible = false;
|
|
|
+ this.inputValue = '';
|
|
|
+ },
|
|
|
//获取当前时间
|
|
|
getCurrentDate(){
|
|
|
return formatDate(new Date(),'YYYY-MM-DD HH:mm:ss')
|
|
@@ -416,6 +709,9 @@ export default {
|
|
|
var data = response.data.records
|
|
|
if(data && data.length>0){
|
|
|
this.form = data[0]
|
|
|
+ if(!this.form.labels){
|
|
|
+ this.$set(this.form,'labels',[])
|
|
|
+ }
|
|
|
if(this.model == 'details'){
|
|
|
return
|
|
|
}
|
|
@@ -574,6 +870,11 @@ export default {
|
|
|
}
|
|
|
</style>
|
|
|
<style lang="scss" scoped>
|
|
|
+ .label_item{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
.vipOrFunList{
|
|
|
border:1px solid white;
|
|
|
padding:10px;
|