商品数据

src/main/java/com/izouma/awesomeadmin/model/ProductInfo.java

@@ -1,13 +1,15 @@
 package com.izouma.awesomeadmin.model;
 
+import java.math.BigDecimal;
 import java.util.*;
+
 import com.fasterxml.jackson.annotation.JsonAutoDetect;
 import com.fasterxml.jackson.annotation.JsonInclude;
 
 
 @JsonAutoDetect
 @JsonInclude(JsonInclude.Include.NON_NULL)
-public class ProductInfo{
+public class ProductInfo {
     private Integer id;
     private String delFlag;
     private Date updateTime;
@@ -28,183 +30,210 @@ public class ProductInfo{
     private Integer storeId;
     private Integer typeFlag;
     private Integer salesVolume;
+    private BigDecimal price;
 
-private String searchKey;
+    private String searchKey;
 
-/**
-* and,test_name,like,value;or,remark,=,123
-*/
-private String advancedQuery;
+    /**
+     * and,test_name,like,value;or,remark,=,123
+     */
+    private String advancedQuery;
 
-/**
-* column_name_,desc_;column_name_,asc
-*/
-private String orderByStr;
+    /**
+     * column_name_,desc_;column_name_,asc
+     */
+    private String orderByStr;
 
-    public Integer getId(){
+    public Integer getId() {
         return this.id;
     }
 
-    public void setId(Integer id){
+    public void setId(Integer id) {
         this.id = id;
     }
-    public String getDelFlag(){
+
+    public String getDelFlag() {
         return this.delFlag;
     }
 
-    public void setDelFlag(String delFlag){
+    public void setDelFlag(String delFlag) {
         this.delFlag = delFlag;
     }
-    public Date getUpdateTime(){
+
+    public Date getUpdateTime() {
         return this.updateTime;
     }
 
-    public void setUpdateTime(Date updateTime){
+    public void setUpdateTime(Date updateTime) {
         this.updateTime = updateTime;
     }
-    public String getUpdateUser(){
+
+    public String getUpdateUser() {
         return this.updateUser;
     }
 
-    public void setUpdateUser(String updateUser){
+    public void setUpdateUser(String updateUser) {
         this.updateUser = updateUser;
     }
-    public Date getCreateTime(){
+
+    public Date getCreateTime() {
         return this.createTime;
     }
 
-    public void setCreateTime(Date createTime){
+    public void setCreateTime(Date createTime) {
         this.createTime = createTime;
     }
-    public String getCreateUser(){
+
+    public String getCreateUser() {
         return this.createUser;
     }
 
-    public void setCreateUser(String createUser){
+    public void setCreateUser(String createUser) {
         this.createUser = createUser;
     }
-    public String getServiceType(){
+
+    public String getServiceType() {
         return this.serviceType;
     }
 
-    public void setServiceType(String serviceType){
+    public void setServiceType(String serviceType) {
         this.serviceType = serviceType;
     }
-    public String getSubclass(){
+
+    public String getSubclass() {
         return this.subclass;
     }
 
-    public void setSubclass(String subclass){
+    public void setSubclass(String subclass) {
         this.subclass = subclass;
     }
-    public String getTitle(){
+
+    public String getTitle() {
         return this.title;
     }
 
-    public void setTitle(String title){
+    public void setTitle(String title) {
         this.title = title;
     }
-    public String getImage(){
+
+    public String getImage() {
         return this.image;
     }
 
-    public void setImage(String image){
+    public void setImage(String image) {
         this.image = image;
     }
-    public String getServiceDetail(){
+
+    public String getServiceDetail() {
         return this.serviceDetail;
     }
 
-    public void setServiceDetail(String serviceDetail){
+    public void setServiceDetail(String serviceDetail) {
         this.serviceDetail = serviceDetail;
     }
-    public Integer getInventory(){
+
+    public Integer getInventory() {
         return this.inventory;
     }
 
-    public void setInventory(Integer inventory){
+    public void setInventory(Integer inventory) {
         this.inventory = inventory;
     }
-    public String getOnShelf(){
+
+    public String getOnShelf() {
         return this.onShelf;
     }
 
-    public void setOnShelf(String onShelf){
+    public void setOnShelf(String onShelf) {
         this.onShelf = onShelf;
     }
-    public String getUseFlag(){
+
+    public String getUseFlag() {
         return this.useFlag;
     }
 
-    public void setUseFlag(String useFlag){
+    public void setUseFlag(String useFlag) {
         this.useFlag = useFlag;
     }
-    public Integer getHotFlag(){
+
+    public Integer getHotFlag() {
         return this.hotFlag;
     }
 
-    public void setHotFlag(Integer hotFlag){
+    public void setHotFlag(Integer hotFlag) {
         this.hotFlag = hotFlag;
     }
-    public Integer getHomeFlag(){
+
+    public Integer getHomeFlag() {
         return this.homeFlag;
     }
 
-    public void setHomeFlag(Integer homeFlag){
+    public void setHomeFlag(Integer homeFlag) {
         this.homeFlag = homeFlag;
     }
-    public Integer getRank(){
+
+    public Integer getRank() {
         return this.rank;
     }
 
-    public void setRank(Integer rank){
+    public void setRank(Integer rank) {
         this.rank = rank;
     }
-    public Integer getStoreId(){
+
+    public Integer getStoreId() {
         return this.storeId;
     }
 
-    public void setStoreId(Integer storeId){
+    public void setStoreId(Integer storeId) {
         this.storeId = storeId;
     }
-    public Integer getTypeFlag(){
+
+    public Integer getTypeFlag() {
         return this.typeFlag;
     }
 
-    public void setTypeFlag(Integer typeFlag){
+    public void setTypeFlag(Integer typeFlag) {
         this.typeFlag = typeFlag;
     }
-    public Integer getSalesVolume(){
+
+    public Integer getSalesVolume() {
         return this.salesVolume;
     }
 
-    public void setSalesVolume(Integer salesVolume){
+    public void setSalesVolume(Integer salesVolume) {
         this.salesVolume = salesVolume;
     }
 
-public String getSearchKey() {
-    return searchKey;
-}
+    public String getSearchKey() {
+        return searchKey;
+    }
 
-public void setSearchKey(String searchKey) {
-    this.searchKey = searchKey;
-}
+    public void setSearchKey(String searchKey) {
+        this.searchKey = searchKey;
+    }
 
-public String getAdvancedQuery() {
-    return advancedQuery;
-}
+    public String getAdvancedQuery() {
+        return advancedQuery;
+    }
 
-public void setAdvancedQuery(String advancedQuery) {
-    this.advancedQuery = advancedQuery;
-}
+    public void setAdvancedQuery(String advancedQuery) {
+        this.advancedQuery = advancedQuery;
+    }
 
-public String getOrderByStr() {
-    return orderByStr;
-}
+    public String getOrderByStr() {
+        return orderByStr;
+    }
 
-public void setOrderByStr(String orderByStr) {
-    this.orderByStr = orderByStr;
-}
+    public void setOrderByStr(String orderByStr) {
+        this.orderByStr = orderByStr;
+    }
+
+    public BigDecimal getPrice() {
+        return price;
+    }
 
+    public void setPrice(BigDecimal price) {
+        this.price = price;
+    }
 }
 

src/main/vue/src/pages/ProductInfo.vue

@@ -1,70 +1,75 @@
 <template>
     <div>
-        <el-form :model="formData" :rules="rules" ref="form" label-width="80px" label-position="right" size="small"
-                 style="max-width: 500px;">
-                                                                                                                                                                                                                                    <el-form-item prop="serviceType" label="大类">
-                <el-input v-model="formData.serviceType" :disabled="'serviceType'==subColumn"></el-input>
+        <el-form :model="formData" :rules="rules" ref="form" label-width="80px" label-position="right" size="small" style="max-width: 500px;">
+
+            <el-form-item prop="storeId" label="店铺">
+                <el-input v-model="formData.storeId" :disabled="'storeId'==subColumn"></el-input>
+            </el-form-item>
+            <el-form-item prop="typeFlag" label="类型">
+                <template>
+                    <el-select v-model="formData.typeFlag" clearable placeholder="请选择">
+                        <el-option v-for="item in typeFlagOptions" :key="item.value" :label="item.label" :value="item.value">
+                        </el-option>
+                    </el-select>
+                </template>
+            </el-form-item>
+
+            <el-form-item prop="serviceType" label="服务大类">
+                <el-select v-model="formData.serviceType" filterable placeholder="请选择" size="small">
+                    <el-option v-for="item in serviceTypes" :key="item.id" :label="item.shortName" :value="item.id">
+                    </el-option>
+                </el-select>
+
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="subclass" label="小类">
-                <el-input v-model="formData.subclass" :disabled="'subclass'==subColumn"></el-input>
+
+            <el-form-item prop="subclass" label="服务小类">
+                <el-select v-model="formData.subclass" filterable placeholder="请选择" size="small">
+                    <el-option v-for="item in serviceTypeDetails[formData.serviceType]" :key="item.id" :label="item.typeName" :value="item.id">
+                    </el-option>
+                </el-select>
+
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="title" label="标题">
+
+            <el-form-item prop="title" label="标题">
                 <el-input v-model="formData.title" :disabled="'title'==subColumn"></el-input>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                         <el-form-item prop="image" label="主图">
-                 <single-upload v-model="formData.image" :disabled="'image'==subColumn"></single-upload>
-             </el-form-item>
-                                                                                                                                                                                                    <el-form-item prop="serviceDetail" label="服务详情">
+            <el-form-item prop="image" label="主图">
+                <single-upload v-model="formData.image" :disabled="'image'==subColumn"></single-upload>
+            </el-form-item>
+            <el-form-item prop="serviceDetail" label="服务详情">
                 <el-input type="textarea" v-model="formData.serviceDetail" :disabled="'serviceDetail'==subColumn"></el-input>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                        <el-form-item prop="inventory" label="库存">
+            <el-form-item prop="inventory" label="库存">
                 <el-input v-model="formData.inventory" :disabled="'inventory'==subColumn"></el-input>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        <el-form-item prop="onShelf" label="上下架">
-                <el-switch
-                        v-model="formData.onShelf"
-                        active-color="#13ce66"
-                        inactive-color="#ff4949"
-                        :disabled="'onShelf'==subColumn">
+            <el-form-item prop="price" label="默认价格">
+                <el-input v-model="formData.price"></el-input>
+            </el-form-item>
+            <el-form-item prop="onShelf" label="上下架">
+                <el-switch v-model="formData.onShelf" active-color="#13ce66" inactive-color="#ff4949" :disabled="'onShelf'==subColumn">
                 </el-switch>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="useFlag" label="可用">
-                <el-switch
-                        v-model="formData.useFlag"
-                        active-color="#13ce66"
-                        inactive-color="#ff4949"
-                        :disabled="'useFlag'==subColumn">
+            <el-form-item prop="useFlag" label="可用">
+                <el-switch v-model="formData.useFlag" active-color="#13ce66" inactive-color="#ff4949" :disabled="'useFlag'==subColumn">
                 </el-switch>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="hotFlag" label="热门">
-                <el-switch
-                        v-model="formData.hotFlag"
-                        active-color="#13ce66"
-                        inactive-color="#ff4949"
-                        :disabled="'hotFlag'==subColumn">
+            <el-form-item prop="hotFlag" label="热门">
+                <el-switch v-model="formData.hotFlag" active-color="#13ce66" inactive-color="#ff4949" :disabled="'hotFlag'==subColumn">
                 </el-switch>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="homeFlag" label="首页">
-                <el-switch
-                        v-model="formData.homeFlag"
-                        active-color="#13ce66"
-                        inactive-color="#ff4949"
-                        :disabled="'homeFlag'==subColumn">
+            <el-form-item prop="homeFlag" label="首页">
+                <el-switch v-model="formData.homeFlag" active-color="#13ce66" inactive-color="#ff4949" :disabled="'homeFlag'==subColumn">
                 </el-switch>
             </el-form-item>
-                                                                                                <el-form-item prop="rank" label="排序">
+            <el-form-item prop="rank" label="排序">
                 <el-input v-model="formData.rank" :disabled="'rank'==subColumn"></el-input>
             </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="storeId" label="店铺">
-                <el-input v-model="formData.storeId" :disabled="'storeId'==subColumn"></el-input>
-            </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="typeFlag" label="类型">
-                <el-input v-model="formData.typeFlag" :disabled="'typeFlag'==subColumn"></el-input>
-            </el-form-item>
-                                                                                                                                                                                                                                                                                                                            <el-form-item prop="salesVolume" label="销量">
+
+            <el-form-item prop="salesVolume" label="销量">
                 <el-input v-model="formData.salesVolume" :disabled="'salesVolume'==subColumn"></el-input>
             </el-form-item>
-                                                                                                                                                                                                                                                                                        <el-form-item>
+
+            <el-form-item>
                 <el-button @click="onSave" :loading="$store.state.fetchingData" type="primary">保存</el-button>
                 <el-button @click="onDelete" v-if="formData.id" type="danger">删除</el-button>
                 <el-button @click="$router.go(-1)">取消</el-button>
@@ -73,92 +78,138 @@
     </div>
 </template>
 <script>
-    import formValidator from '../formValidator'
+import formValidator from '../formValidator'
+
+export default {
+    created() {
+        if (this.$route.query.column) {
+            this.subColumn = this.$route.query.column.split(',')[1];
+            this.subValue = this.$route.query.column.split(',')[0];
+        }
+
+        if (this.$route.query.id) {
+            this.$http.get({
+                url: '/productInfo/getOne',
+                data: {
+                    id: this.$route.query.id
+                }
+            }).then(res => {
+                if (res.success) {
 
-    export default {
-        created() {
-            if (this.$route.query.column) {
-                this.subColumn = this.$route.query.column.split(',')[1];
-                this.subValue = this.$route.query.column.split(',')[0];
-            }
 
-            if (this.$route.query.id) {
-                this.$http.get({
-                    url: '/productInfo/getOne',
-                    data: {
-                        id: this.$route.query.id
+                    this.formData = res.data;
+
+                    if (this.formData.serviceType) {
+
+                        this.formData.serviceType = Number(this.formData.serviceType);
                     }
-                }).then(res => {
-                    if (res.success) {
+                    if (this.formData.subclass) {
+                        this.formData.subclass = Number(this.formData.subclass);
+                    }
+
+                    this.formData.hotFlag = this.formData.hotFlag == 1 ? true : false;
+                    this.formData.homeFlag = this.formData.homeFlag == 1 ? true : false;
+                    this.formData.useFlag = this.formData.useFlag == 'Y' ? true : false;
+                    this.formData.onShelf = this.formData.onShelf == 'Y' ? true : false;
 
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        
-                        this.formData = res.data;
 
                     if (this.$route.query.column) {
                         this.formData[this.subColumn] = this.subValue;
                     }
-                    }
-                })
-            }else {
-                if (this.$route.query.column) {
-                    this.formData[this.subColumn] = this.subValue;
                 }
+            })
+        } else {
+            if (this.$route.query.column) {
+                this.formData[this.subColumn] = this.subValue;
             }
-
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    },
-        data() {
-            return {
-                saving: false,
-                formData: {},
-                rules: {
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    },
-                                                                                                                                                                            subColumn: '',
-            subValue: '',
         }
-        },
-        methods: {
-            onSave() {
-                this.$refs.form.validate((valid) => {
-                    if (valid) {
-                        this.submit();
-                    } else {
-                        return false;
-                    }
+
+
+        this.$http.get({
+            url: '/serviceType/all'
+        }).then(res => {
+            if (res.success) {
+                this.serviceTypes = res.data;
+
+                this.serviceTypes.forEach(element => {
+
+                    this.serviceTypeDetails[element.id] = element.serviceTypeDetailList
+
                 });
+            }
+        });
+
+    },
+    data() {
+        return {
+            saving: false,
+            formData: {
+                typeFlag: 0,
+                rank: 0,
+                responseTime: 0,
+                reworkRate: 0,
+                useFlag: true,
+                serviceType: 1,
+                onShelf: false,
             },
-            submit() {
-                var data = JSON.parse(JSON.stringify(this.formData));
-                this.$http.post({
-                    url: this.formData.id ? '/productInfo/update' : '/productInfo/save',
-                    data: data
-                }).then(res => {
-                    if (res.success) {
-                        this.$message.success('成功');
-                        this.$router.go(-1);
-                    } else {
-                        this.$message.warning('失败')
-                    }
-                });
+            rules: {
             },
-            onDelete() {
-                this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' }).then(() => {
-                    return this.$http.post({
+            subColumn: '',
+            subValue: '',
+            serviceTypes: [],
+            serviceTypeDetails: {},
+            typeFlagOptions: [{ label: '修图', value: 0 }, { label: '实体商品', value: 1 }],
+        }
+    },
+    methods: {
+        onSave() {
+            this.$refs.form.validate((valid) => {
+                if (valid) {
+                    this.submit();
+                } else {
+                    return false;
+                }
+            });
+        },
+        submit() {
+            var data = JSON.parse(JSON.stringify(this.formData));
+
+            data.hotFlag = this.formData.hotFlag ? 1 : 0;
+            data.homeFlag = this.formData.homeFlag ? 1 : 0;
+            data.useFlag = this.formData.useFlag ? 'Y' : 'N';
+            data.onShelf = this.formData.onShelf ? 'Y' : 'N';
+
+            this.$http.post({
+                url: this.formData.id ? '/productInfo/update' : '/productInfo/save',
+                data: data
+            }).then(res => {
+                if (res.success) {
+                    this.$message.success('成功');
+                    this.$router.go(-1);
+                } else {
+                    this.$message.warning('失败')
+                }
+            });
+        },
+        onDelete() {
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' }).then(() => {
+                return this.$http.post({
                     url: '/productInfo/del',
                     data: { id: this.formData.id }
-                    })
-                }).then(() => {
-                    this.$message.success('删除成功');
-                    this.$router.go(-1);
-                }).catch(action => {
-                    if (action === 'cancel') {
-                        this.$message.info('删除取消');
-                    } else {
-                        this.$message.error('删除失败');
-                    }
                 })
-            },
-        }
+            }).then(() => {
+                this.$message.success('删除成功');
+                this.$router.go(-1);
+            }).catch(action => {
+                if (action === 'cancel') {
+                    this.$message.info('删除取消');
+                } else {
+                    this.$message.error('删除失败');
+                }
+            })
+        },
     }
+}
 </script>
 <style lang="less" scoped>
 </style>

src/main/vue/src/pages/ProductInfos.vue

@@ -1,25 +1,22 @@
 <template>
     <div>
         <div class="filters-container">
-        
+
             <el-input placeholder="关键字" size="small" v-model="filter1" clearable class="filter-item"></el-input>
             <el-button @click="searchData" type="primary" size="small" icon="el-icon-search" class="filter-item">搜索
             </el-button>
-            <el-button @click="showAdvancedQueryDialog = !showAdvancedQueryDialog" type="primary" size="small"
-                       icon="el-icon-search" class="filter-item">高级查询
+            <el-button @click="showAdvancedQueryDialog = !showAdvancedQueryDialog" type="primary" size="small" icon="el-icon-search" class="filter-item">高级查询
             </el-button>
-            <el-button @click="showTableSortDialog = !showTableSortDialog" type="primary" size="small"
-                       icon="el-icon-sort" class="filter-item">排序
+            <el-button @click="showTableSortDialog = !showTableSortDialog" type="primary" size="small" icon="el-icon-sort" class="filter-item">排序
             </el-button>
-            <el-button @click="$router.push({path:'/productInfo',query:{column:$route.query.column}})" type="primary"
-                       size="small" icon="el-icon-edit"
-                       class="filter-item">添加
+            <el-button @click="$router.push({path:'/productInfo',query:{column:$route.query.column}})" type="primary" size="small" icon="el-icon-edit" class="filter-item">添加
             </el-button>
             <el-button @click="exportExcel" type="primary" size="small" icon="el-icon-share" class="filter-item">导出EXCEL
             </el-button>
             <el-dropdown trigger="click" size="medium" class="table-column-filter">
                 <span>
-                  筛选数据<i class="el-icon-arrow-down el-icon--right"></i>
+                    筛选数据
+                    <i class="el-icon-arrow-down el-icon--right"></i>
                 </span>
                 <el-dropdown-menu slot="dropdown" class="table-column-filter-wrapper">
                     <el-checkbox v-for="item in tableColumns" :key="item.value" v-model="item.show">{{item.label}}
@@ -27,132 +24,60 @@
                 </el-dropdown-menu>
             </el-dropdown>
         </div>
-        <el-table
-                :data="tableData"
-                :height="tableHeight"
-                row-key="id"
-                ref="table">
-            <el-table-column
-                    v-if="multipleMode"
-                    align="center"
-                    type="selection"
-                    width="50">
+        <el-table :data="tableData" :height="tableHeight" row-key="id" ref="table">
+            <el-table-column v-if="multipleMode" align="center" type="selection" width="50">
+            </el-table-column>
+            <el-table-column type="index" min-width="50" align="center">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('serviceType')" prop="serviceType" label="大类" :formatter="ServiceTypeFormatter" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('subclass')" prop="subclass" label="小类" :formatter="ServiceTypeDetailFormatter"  min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('title')" prop="title" label="标题" min-width="100">
             </el-table-column>
-            <el-table-column
-                    type="index"
-                    min-width="50"
-                    align="center">
+
+            <el-table-column v-if="isColumnShow('image')" prop="image" label="主图" min-width="100">
+                <template slot-scope="{row}">
+                    <img :src="row.image" @click="showImg(row.image)" style="width: 100px;height: 100px;vertical-align: middle;" />
+                </template>
+
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('serviceDetail')" prop="serviceDetail" label="服务详情" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('inventory')" prop="inventory" label="库存" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('onShelf')" prop="onShelf" label="上下架" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('useFlag')" prop="useFlag" label="可用" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('hotFlag')" prop="hotFlag" label="热门" :formatter="YNFormatter" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('homeFlag')" prop="homeFlag" label="首页" :formatter="YNFormatter" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('rank')" prop="rank" label="排序" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('storeId')" prop="storeId" label="店铺" min-width="100">
+            </el-table-column>
+
+            <el-table-column v-if="isColumnShow('typeFlag')" prop="typeFlag" label="类型" :formatter="TypeFlagFormatter" min-width="100">
             </el-table-column>
-                                                                                                                                                                                                    
-                                            <el-table-column
-                                v-if="isColumnShow('serviceType')"
-                                prop="serviceType"
-                                label="大类"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('subclass')"
-                                prop="subclass"
-                                label="小类"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('title')"
-                                prop="title"
-                                label="标题"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('image')"
-                                prop="image"
-                                label="主图"
-                                min-width="100">
-                            <template slot-scope="{row}">
-                                <img :src="row.image" @click="showImg(row.image)" style="width: 100px;height: 100px;vertical-align: middle;" />
-                            </template>
-
-                        </el-table-column>
-                                                                    
-                                            <el-table-column
-                                v-if="isColumnShow('serviceDetail')"
-                                prop="serviceDetail"
-                                label="服务详情"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('inventory')"
-                                prop="inventory"
-                                label="库存"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('onShelf')"
-                                prop="onShelf"
-                                label="上下架"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('useFlag')"
-                                prop="useFlag"
-                                label="可用"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('hotFlag')"
-                                prop="hotFlag"
-                                label="热门"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('homeFlag')"
-                                prop="homeFlag"
-                                label="首页"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('rank')"
-                                prop="rank"
-                                label="排序"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('storeId')"
-                                prop="storeId"
-                                label="店铺"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('typeFlag')"
-                                prop="typeFlag"
-                                label="类型"
-                                min-width="100">
-                        </el-table-column>
-                                                                
-                                            <el-table-column
-                                v-if="isColumnShow('salesVolume')"
-                                prop="salesVolume"
-                                label="销量"
-                                min-width="100">
-                        </el-table-column>
-                                                            <el-table-column
-                    label="操作"
-                    align="center"
-                    fixed="right"
-                    min-width="150"
-            >
+
+            <el-table-column v-if="isColumnShow('salesVolume')" prop="salesVolume" label="销量" min-width="100">
+            </el-table-column>
+            <el-table-column label="操作" align="center" fixed="right" min-width="150">
                 <template slot-scope="scope">
-                            <el-button @click="editRow(scope.row)" type="primary" size="mini" plain>编辑</el-button>
+                    <el-button @click="editRow(scope.row)" type="primary" size="mini" plain>编辑</el-button>
                     <el-button @click="deleteRow(scope.row)" type="danger" size="mini" plain>删除</el-button>
                 </template>
             </el-table-column>
@@ -166,15 +91,7 @@
                     <el-button size="small" @click="toggleMultipleMode(false)">取消</el-button>
                 </el-button-group>
             </div>
-            <el-pagination
-                    background
-                    @size-change="pageSizeChange"
-                    @current-change="currentPageChange"
-                    :current-page="currentPage"
-                    :page-sizes="[10, 20, 30, 40, 50]"
-                    :page-size="pageSize"
-                    layout="total, sizes, prev, pager, next, jumper"
-                    :total="totalNumber">
+            <el-pagination background @size-change="pageSizeChange" @current-change="currentPageChange" :current-page="currentPage" :page-sizes="[10, 20, 30, 40, 50]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="totalNumber">
             </el-pagination>
         </div>
         <el-dialog title="高级查询" :visible.sync="showAdvancedQueryDialog">
@@ -195,16 +112,14 @@
                     <template slot-scope="{row}">
                         <el-select v-model="row.name">
 
-                            <el-option v-for="item in advancedQueryColumns" :label="item.label" :value="item.value"
-                                       :key="item.value"></el-option>
+                            <el-option v-for="item in advancedQueryColumns" :label="item.label" :value="item.value" :key="item.value"></el-option>
                         </el-select>
                     </template>
                 </el-table-column>
                 <el-table-column prop="searchMethod" label="搜索方式" width="150" align="center">
                     <template slot-scope="{row}">
                         <el-select v-model="row.searchMethod">
-                            <el-option v-for="item in searchMethods" :label="item" :value="item"
-                                       :key="item"></el-option>
+                            <el-option v-for="item in searchMethods" :label="item" :value="item" :key="item"></el-option>
                         </el-select>
                     </template>
                 </el-table-column>
@@ -234,8 +149,7 @@
                     <template slot-scope="{row}">
                         <el-select v-model="row.name">
 
-                            <el-option v-for="item in advancedQueryColumns" :label="item.label" :value="item.value"
-                                       :key="item.value"></el-option>
+                            <el-option v-for="item in advancedQueryColumns" :label="item.label" :value="item.value" :key="item.value"></el-option>
                         </el-select>
                     </template>
                 </el-table-column>
@@ -269,351 +183,416 @@
     </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {format} from 'date-fns'
-    import zh from 'date-fns/locale/zh_cn'
+import { mapState } from 'vuex'
+import { format } from 'date-fns'
+import zh from 'date-fns/locale/zh_cn'
+
+export default {
+    created() {
+        this.$http.get({
+            url: '/serviceType/all'
+        }).then(res => {
+            if (res.success) {
+                this.serviceTypes = res.data;
+
+                this.serviceTypes.forEach(element => {
 
-    export default {
-        created() {
+                    this.serviceTypeDetails[element.id] = element.serviceTypeDetailList
+
+                });
+            }
+        });
+
+        this.getData();
+    },
+    data() {
+        return {
+            totalNumber: 0,
+            totalPage: 10,
+            currentPage: 1,
+            pageSize: 20,
+            tableData: [],
+            filter1: '',
+            filter2: '',
+            tableColumns: [
+                {
+                    label: '大类',
+                    value: 'serviceType',
+                    show: true
+                },
+                {
+                    label: '小类',
+                    value: 'subclass',
+                    show: true
+                },
+                {
+                    label: '标题',
+                    value: 'title',
+                    show: true
+                },
+                {
+                    label: '主图',
+                    value: 'image',
+                    show: true
+                },
+                {
+                    label: '服务详情',
+                    value: 'serviceDetail',
+                    show: true
+                },
+                {
+                    label: '库存',
+                    value: 'inventory',
+                    show: true
+                },
+                {
+                    label: '上下架',
+                    value: 'onShelf',
+                    show: true
+                },
+                {
+                    label: '可用',
+                    value: 'useFlag',
+                    show: true
+                },
+                {
+                    label: '热门',
+                    value: 'hotFlag',
+                    show: true
+                },
+                {
+                    label: '首页',
+                    value: 'homeFlag',
+                    show: true
+                },
+                {
+                    label: '排序',
+                    value: 'rank',
+                    show: true
+                },
+                {
+                    label: '店铺',
+                    value: 'storeId',
+                    show: true
+                },
+                {
+                    label: '类型',
+                    value: 'typeFlag',
+                    show: true
+                },
+                {
+                    label: '销量',
+                    value: 'salesVolume',
+                    show: true
+                },
+            ],
+            multipleMode: false,
+            showAdvancedQueryDialog: false,
+            advancedQueryFields: [],
+            showTableSortDialog: false,
+            tableSortFields: [],
+            searchMethods: ['=', '!=', '>', '>=', '<', '<=', 'like'],
+            advancedQueryColumns: [
+                {
+                    label: '大类',
+                    value: 'service_type'
+                },
+                {
+                    label: '小类',
+                    value: 'subclass'
+                },
+                {
+                    label: '标题',
+                    value: 'title'
+                },
+                {
+                    label: '主图',
+                    value: 'image'
+                },
+                {
+                    label: '服务详情',
+                    value: 'service_detail'
+                },
+                {
+                    label: '库存',
+                    value: 'inventory'
+                },
+                {
+                    label: '上下架',
+                    value: 'on_shelf'
+                },
+                {
+                    label: '可用',
+                    value: 'use_flag'
+                },
+                {
+                    label: '热门',
+                    value: 'hot_flag'
+                },
+                {
+                    label: '首页',
+                    value: 'home_flag'
+                },
+                {
+                    label: '排序',
+                    value: 'rank'
+                },
+                {
+                    label: '店铺',
+                    value: 'store_id'
+                },
+                {
+                    label: '类型',
+                    value: 'type_flag'
+                },
+                {
+                    label: '销量',
+                    value: 'sales_volume'
+                },
+            ],
+            advancedQuerySearchKey: '',
+            orderByStr: '',
+            imgSrc: '',
+            imageDialogVisible: false,
+            serviceTypes: [],
+            serviceTypeDetails: {},
+        }
+    },
+    computed: {
+        ...mapState(['tableHeight']),
+        selection() {
+            return this.$refs.table.selection.map(i => i.id);
+        }
+    },
+    methods: {
+        pageSizeChange(size) {
+            this.currentPage = 1;
+            this.pageSize = size;
+            this.getData();
+        },
+        currentPageChange(page) {
+            this.currentPage = page;
             this.getData();
         },
-        data() {
-            return {
-                totalNumber: 0,
-                totalPage: 10,
-                currentPage: 1,
-                pageSize: 20,
-                tableData: [],
-                filter1: '',
-                filter2: '',
-                tableColumns: [
-                                                                                                                                                                                                                                                                                                                                                {
-                                label: '大类',
-                                value: 'serviceType',
-                                show: true
-                            },
-                                                                                                {
-                                label: '小类',
-                                value: 'subclass',
-                                show: true
-                            },
-                                                                                                {
-                                label: '标题',
-                                value: 'title',
-                                show: true
-                            },
-                                                                                                {
-                                label: '主图',
-                                value: 'image',
-                                show: true
-                            },
-                                                                                                {
-                                label: '服务详情',
-                                value: 'serviceDetail',
-                                show: true
-                            },
-                                                                                                {
-                                label: '库存',
-                                value: 'inventory',
-                                show: true
-                            },
-                                                                                                {
-                                label: '上下架',
-                                value: 'onShelf',
-                                show: true
-                            },
-                                                                                                {
-                                label: '可用',
-                                value: 'useFlag',
-                                show: true
-                            },
-                                                                                                {
-                                label: '热门',
-                                value: 'hotFlag',
-                                show: true
-                            },
-                                                                                                {
-                                label: '首页',
-                                value: 'homeFlag',
-                                show: true
-                            },
-                                                                                                {
-                                label: '排序',
-                                value: 'rank',
-                                show: true
-                            },
-                                                                                                {
-                                label: '店铺',
-                                value: 'storeId',
-                                show: true
-                            },
-                                                                                                {
-                                label: '类型',
-                                value: 'typeFlag',
-                                show: true
-                            },
-                                                                                                {
-                                label: '销量',
-                                value: 'salesVolume',
-                                show: true
-                            },
-                                                            ],
-                multipleMode: false,
-                showAdvancedQueryDialog: false,
-                advancedQueryFields: [],
-                showTableSortDialog: false,
-                tableSortFields: [],
-                searchMethods: ['=', '!=', '>', '>=', '<', '<=', 'like'],
-                advancedQueryColumns: [
-                                                                                                                                                                                                                                                                                                                                                {
-                                label: '大类',
-                                value: 'service_type'
-                            },
-                                                                                                {
-                                label: '小类',
-                                value: 'subclass'
-                            },
-                                                                                                {
-                                label: '标题',
-                                value: 'title'
-                            },
-                                                                                                {
-                                label: '主图',
-                                value: 'image'
-                            },
-                                                                                                {
-                                label: '服务详情',
-                                value: 'service_detail'
-                            },
-                                                                                                {
-                                label: '库存',
-                                value: 'inventory'
-                            },
-                                                                                                {
-                                label: '上下架',
-                                value: 'on_shelf'
-                            },
-                                                                                                {
-                                label: '可用',
-                                value: 'use_flag'
-                            },
-                                                                                                {
-                                label: '热门',
-                                value: 'hot_flag'
-                            },
-                                                                                                {
-                                label: '首页',
-                                value: 'home_flag'
-                            },
-                                                                                                {
-                                label: '排序',
-                                value: 'rank'
-                            },
-                                                                                                {
-                                label: '店铺',
-                                value: 'store_id'
-                            },
-                                                                                                {
-                                label: '类型',
-                                value: 'type_flag'
-                            },
-                                                                                                {
-                                label: '销量',
-                                value: 'sales_volume'
-                            },
-                                                            ],
-                advancedQuerySearchKey: '',
-                orderByStr: '',
-                imgSrc: '',
-                imageDialogVisible: false,
+        getData() {
+
+            var data = {
+                currentPage: this.currentPage,
+                pageNumber: this.pageSize,
+                searchKey: this.filter1,
+                advancedQuery: this.advancedQuerySearchKey,
+                orderByStr: this.orderByStr,
             }
+
+            if (this.$route.query.column) {
+                var tempColumn = this.$route.query.column;
+                data[tempColumn.split(',')[1]] = tempColumn.split(',')[0];
+            }
+
+            this.$http.get({
+                url: '/productInfo/page',
+                data: data
+            }).then(res => {
+                if (res.success) {
+                    this.totalNumber = res.data.page.totalNumber;
+                    this.tableData = res.data.pp;
+                }
+            })
+        },
+        isColumnShow(column) {
+            var row = this.tableColumns.find(i => i.value === column);
+            return row ? row.show : false;
         },
-        computed: {
-            ...mapState(['tableHeight']),
-            selection() {
-                return this.$refs.table.selection.map(i => i.id);
+        toggleMultipleMode(multipleMode) {
+            this.multipleMode = multipleMode;
+            if (!multipleMode) {
+                this.$refs.table.clearSelection();
             }
         },
-        methods: {
-            pageSizeChange(size) {
-                this.currentPage = 1;
-                this.pageSize = size;
-                this.getData();
-            },
-            currentPageChange(page) {
-                this.currentPage = page;
-                this.getData();
-            },
-            getData() {
-
-                var data = {
-                    currentPage: this.currentPage,
-                    pageNumber: this.pageSize,
-                    searchKey: this.filter1,
-                    advancedQuery: this.advancedQuerySearchKey,
-                    orderByStr: this.orderByStr,
+        editRow(row) {
+            this.$router.push({
+                path: '/productInfo',
+                query: {
+                    id: row.id,
+                    column: this.$route.query.column,
                 }
+            })
+        },
+        operation1() {
+            this.$notify({
+                title: '提示',
+                message: this.selection
+            });
+        },
+        operation2() {
+            this.$message('操作2');
+        },
+        addField() {
+            this.advancedQueryFields.push({
+                link: 'AND',
+                name: '',
+                searchMethod: '=',
+                value: '',
+            });
+        },
+        removeField(i) {
+            if (this.advancedQueryFields.length > 0) {
+                this.advancedQueryFields.splice(i, 1);
+            }
+        },
+        advancedQuery() {
 
-                if (this.$route.query.column) {
-                    var tempColumn = this.$route.query.column;
-                    data[tempColumn.split(',')[1]] = tempColumn.split(',')[0];
-                }
+            this.advancedQuerySearchKey = '';
 
-                this.$http.get({
-                    url: '/productInfo/page',
-                    data: data
-                }).then(res => {
-                    if (res.success) {
-                        this.totalNumber = res.data.page.totalNumber;
-                        this.tableData = res.data.pp;
-                    }
-                })
-            },
-            isColumnShow(column) {
-                var row = this.tableColumns.find(i => i.value === column);
-                return row ? row.show : false;
-            },
-            toggleMultipleMode(multipleMode) {
-                this.multipleMode = multipleMode;
-                if (!multipleMode) {
-                    this.$refs.table.clearSelection();
-                }
-            },
-            editRow(row) {
-                this.$router.push({
-                    path: '/productInfo',
-                    query: {
-                        id: row.id,
-                        column: this.$route.query.column,
+            if (this.advancedQueryFields.length > 0) {
+
+                var templist = [];
+
+                this.advancedQueryFields.forEach(item => {
+                    if (item.link && item.name && item.searchMethod && item.value) {
+                        var tempItem = item.link + '_,' + item.name + '_,' + item.searchMethod + '_,' + item.value;
+                        templist.push(tempItem);
                     }
                 })
-            },
-            operation1() {
-                this.$notify({
-                    title: '提示',
-                    message: this.selection
-                });
-            },
-            operation2() {
-                this.$message('操作2');
-            },
-            addField() {
-                this.advancedQueryFields.push({
-                    link: 'AND',
-                    name: '',
-                    searchMethod: '=',
-                    value: '',
-                });
-            },
-            removeField(i) {
-                if (this.advancedQueryFields.length > 0) {
-                    this.advancedQueryFields.splice(i, 1);
-                }
-            },
-            advancedQuery() {
 
-                this.advancedQuerySearchKey = '';
+                if (templist.length > 0) {
 
-                if (this.advancedQueryFields.length > 0) {
+                    this.advancedQuerySearchKey = templist.join('_;');
+                }
+            }
 
-                    var templist = [];
+            this.getData();
+            this.showAdvancedQueryDialog = false;
+        },
+        addSortField() {
+            this.tableSortFields.push({
+                name: '',
+                order: 'asc',
+            });
+        },
+        removeSortField(i) {
+            if (this.tableSortFields.length > 0) {
+                this.tableSortFields.splice(i, 1);
+            }
+        },
+        tableSortQuery() {
 
-                    this.advancedQueryFields.forEach(item => {
-                        if (item.link && item.name && item.searchMethod && item.value) {
-                            var tempItem = item.link + '_,' + item.name + '_,' + item.searchMethod + '_,' + item.value;
-                            templist.push(tempItem);
-                        }
-                    })
+            this.orderByStr = '';
 
-                    if (templist.length > 0) {
+            if (this.tableSortFields.length > 0) {
 
-                        this.advancedQuerySearchKey = templist.join('_;');
+                var templist = [];
+
+                this.tableSortFields.forEach(item => {
+                    if (item.name && item.order) {
+                        var tempItem = item.name + '_,' + item.order;
+                        templist.push(tempItem);
                     }
+                })
+
+                if (templist.length > 0) {
+
+                    this.orderByStr = templist.join('_;');
                 }
+            }
 
+            this.getData();
+            this.showTableSortDialog = false;
+        },
+        exportExcel() {
+            window.location.href = this.$baseUrl + "/productInfo/exportExcel?searchKey="
+                + this.filter1 + "&advancedQuery=" + this.advancedQuerySearchKey + "&orderByStr=" + this.orderByStr;
+        },
+        searchData() {
+            this.currentPage = 1;
+            this.getData();
+        },
+        deleteRow(row) {
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' }).then(() => {
+                return this.$http.post({
+                    url: '/productInfo/del',
+                    data: { id: row.id }
+                })
+            }).then(() => {
+                this.$message.success('删除成功');
                 this.getData();
-                this.showAdvancedQueryDialog = false;
-            },
-            addSortField() {
-                this.tableSortFields.push({
-                    name: '',
-                    order: 'asc',
-                });
-            },
-            removeSortField(i) {
-                if (this.tableSortFields.length > 0) {
-                    this.tableSortFields.splice(i, 1);
+            }).catch(action => {
+                if (action === 'cancel') {
+                    this.$message.info('删除取消');
+                } else {
+                    this.$message.error('删除失败');
                 }
-            },
-            tableSortQuery() {
+            })
+        },
+        DateTimeFormatter(row, column, cellValue) {
+            if (cellValue) {
+                return format(cellValue, 'YYYY/MM/DD HH:mm', { locale: zh })
+            }
 
-                this.orderByStr = '';
+        },
+        DateFormatter(row, column, cellValue) {
+            if (cellValue) {
+                return format(cellValue, 'YYYY/MM/DD', { locale: zh })
+            }
 
-                if (this.tableSortFields.length > 0) {
+        },
+        ServiceTypeFormatter(row, column, cellValue) {
+            if (cellValue) {
+                var serviceType = '';
+                this.serviceTypes.forEach(item => {
+                    if (item.id == Number(cellValue)) {
+                        serviceType = item.shortName;
+                    }
+                })
+
+                return serviceType;
+            }
 
-                    var templist = [];
+        },
 
-                    this.tableSortFields.forEach(item => {
-                        if (item.name && item.order) {
-                            var tempItem = item.name + '_,' + item.order;
-                            templist.push(tempItem);
+        ServiceTypeDetailFormatter(row, column, cellValue) {
+            if (cellValue && row.serviceType) {
+                var serviceTypeDetail = '';
+                if (this.serviceTypeDetails[row.serviceType]) {
+                    this.serviceTypeDetails[row.serviceType].forEach(item => {
+                        if (item.id == Number(cellValue)) {
+                            serviceTypeDetail = item.typeName;
                         }
                     })
+                }
 
-                    if (templist.length > 0) {
 
-                        this.orderByStr = templist.join('_;');
-                    }
-                }
+                return serviceTypeDetail;
+            }
 
-                this.getData();
-                this.showTableSortDialog = false;
-            },
-            exportExcel() {
-                window.location.href = this.$baseUrl + "/productInfo/exportExcel?searchKey="
-                        + this.filter1 + "&advancedQuery=" + this.advancedQuerySearchKey+"&orderByStr=" + this.orderByStr;
-            },
-            searchData() {
-                this.currentPage = 1;
-                this.getData();
-            },
-            deleteRow(row) {
-                this.$alert('删除将无法恢复，确认要删除么？', '警告', {type: 'error'}).then(() => {
-                    return this.$http.post({
-                        url: '/productInfo/del',
-                        data: {id: row.id}
-                    })
-                }).then(() => {
-                    this.$message.success('删除成功');
-                    this.getData();
-                }).catch(action => {
-                    if (action === 'cancel') {
-                        this.$message.info('删除取消');
-                    } else {
-                        this.$message.error('删除失败');
-                    }
-                })
-            },
-            DateTimeFormatter(row, column, cellValue) {
-                if (cellValue) {
-                    return format(cellValue, 'YYYY/MM/DD HH:mm', {locale: zh})
-                }
+        },
 
-            },
-            DateFormatter(row, column, cellValue) {
-                if (cellValue) {
-                    return format(cellValue, 'YYYY/MM/DD', {locale: zh})
-                }
+        YNFormatter(row, column, cellValue) {
+            return cellValue ? 'Y' : 'N';
+
+        },
+        TypeFlagFormatter(row, column, cellValue) {
+
+            var valueStr = '';
+            switch (cellValue) {
+                case 0:
+                    valueStr = '修图';
+                    break;
+                case 1:
+                    valueStr = '实体商品';
+                    break
+            }
 
-            },
-            showImg(img) {
-                this.imgSrc = img;
-                this.imageDialogVisible = true;
-            },
+            return valueStr;
+
+        },
+        showImg(img) {
+            this.imgSrc = img;
+            this.imageDialogVisible = true;
+        },
 
-        }
     }
+}
 </script>
 <style lang="less" scoped>
-
 </style>