店铺管理

src/benyun/components/byForm/byForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="by-form">
+  <div class="by-form" :style="{width:attrs.width}">
     <el-descriptions v-if="attrs.showType=='desc'" :title="attrs.title" :column="attrs.itemCount" :border="attrs.border" :direction="attrs.direction" 
     :size="attrs.size?attrs.size:'medium'" :colon="attrs.colon">
       <template v-for="(itemChild,index) of columns">
@@ -58,6 +58,7 @@
   基础配置
   config:{
     attr:{
+      width:'', //表单宽度
       showType: ''  //展示形式
       title:''  //标题（desc的时候用）
       itemCount:''  //每行展示几列（desc的时候用）
@@ -157,6 +158,9 @@ export default class ByForm extends VueViews {
     this.value = {};
     this.clearChildrenComp();
     this.defaultHandle();
+    setTimeout(()=>{
+      this.clearValidate();
+    },100)
   }
 
   //获取数据
@@ -270,6 +274,7 @@ export default class ByForm extends VueViews {
 <style lang="scss" scoped>
 .by-form{
   width: 100%;
+  margin: 0 auto;
   .form-comp{
     width: 100%;
   }

src/benyun/components/bySwitch/bySwitch.vue

@@ -20,7 +20,13 @@ import VueViews from '@/benyun/compVue/VueViews';
 
 @Component
 export default class BySwitch extends VueViews {
-  value:any=null
+  value:any=null;
+
+  @Watch('propValue')
+  propValueChange(v:any){
+
+  }
+
   created(){
     if(this.propConfig){
       this.setConfig(this.propConfig)

src/benyun/components/moduleView/moduleView.vue

@@ -26,7 +26,7 @@
     <transition name="el-zoom-in-center" v-if="modalConfig">
       <div class="view-modal" v-show="modalShow">
         <div class="tool-box" v-if="modalConfig.tool">
-          <by-tool :propConfig="modalConfig.tool" @clickHandle="modalHandle" />
+          <by-tool :propConfig="modalConfig.tool" @clickHandle="modalHandle" ref="toolForm" />
         </div>
         <div class="view-form">
           <by-form :propConfig="modalConfig.form" :ref="formID"></by-form>
@@ -119,7 +119,11 @@ export default class ModuleView extends ModuleViewHandle {
     // this.searchHandle()
   }
   detail(row:any){
-    this.$emit('detail',row)
+    this.$emit('detail',row);
+    if(this.$refs[this.formID]){
+      (this.$refs[this.formID] as any).setValue(row);
+      this.modalShow = true;
+    }
   }
   //清除搜索条件
   clearSearch(){
@@ -146,6 +150,7 @@ export default class ModuleView extends ModuleViewHandle {
   modalHandle(e:string){
     if(e == 'onReturn'){
       this.modalShow = false;
+      (this.$refs[this.formID] as any).clearValue();
     }else{
       this.$emit('modalHandle',e)
     }
@@ -201,7 +206,11 @@ export default class ModuleView extends ModuleViewHandle {
     }
     return null
   }
-
+  initFormTool(){
+    if(this.$refs.toolForm){
+      (this.$refs.toolForm as any).initTools();
+    }
+  }
   onChangeRow(row:any){
     this.$emit('onChangeRow',row);
   }

src/views/oms/shop/components/tag.vue

@@ -1,7 +1,7 @@
 <template>
-  <el-tag type="success" v-if="value == 'Authorized'">已授权</el-tag>
-  <el-tag type="danger" v-else-if="value == 'Unauthorized'">未授权</el-tag>
-  <el-tag type="info" v-else-if="value == 'Expired'">已过期</el-tag>
+  <el-tag type="success" v-if="value == 'Authorized'" size="mini">已授权</el-tag>
+  <el-tag type="danger" v-else-if="value == 'Unauthorized'" size="mini">未授权</el-tag>
+  <el-tag type="info" v-else-if="value == 'Expired'" size="mini">已过期</el-tag>
   <span v-else></span>
 </template>
 
@@ -20,6 +20,17 @@ export default class ShopTag extends Vue {
   @Prop()
   parentValue:any
 
+  @Watch('propValue')
+  propValueChange(v:any){
+    this.setValue(v);
+  }
+
+  mounted(){
+    if(this.propValue){
+      this.setValue(this.propValue)
+    }
+  }
+
   setValue(v:any){
     this.value = v;
   }

src/views/oms/shop/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="shop">
     <module-view :propConfig="config" ref="view" v-loading="load" style="height:100%" @pagination="pagination" @modalHandle="modalHandle" @onRefresh="getList" 
-    @resert="queryList" @search="queryList" @clickHandle="clickHandle" />
+    @resert="queryList" @search="queryList" @clickHandle="clickHandle" @detail="detail" />
   </div>
 </template>
 
@@ -35,15 +35,29 @@ export default class Shop extends Vue {
           component:'by-input',
           compConfig:{}
         },{
-          label:'店铺简称',
-          prop:'shortName',
+          label:'店铺状态',
+          prop:'shopStatus',
           component:'by-input',
           compConfig:{}
         },{
           label:'授权状态',
           prop:'authStatus',
-          component:'by-input',
-          compConfig:{}
+          component:'by-select',
+          compConfig:{
+            attr:{
+              clearable:true,
+              data:[{
+                value:'Authorized',
+                label:'已授权'
+              },{
+                value:'Unauthorized',
+                label:'未授权'
+              },{
+                value:'Expired',
+                label:'已过期'
+              }]
+            }
+          }
         }],
         [{
           label:'授权账号',
@@ -63,15 +77,21 @@ export default class Shop extends Vue {
         },{
           label:'创建时间',
           prop:'createTime',
-          component:'by-input',
-          compConfig:{}
+          component:'by-date-picker',
+          compConfig:{
+            attr:{
+              editable:false,
+              type:'datetimerange',
+              format:'yyyy-MM-dd HH:mm:ss'
+            }
+          }
         }]
       ]
     },
     tool:{
       tools:{
         add:true,
-        delete:true,
+        // delete:true,
         search:true,
         refresh:true
       }
@@ -81,11 +101,12 @@ export default class Shop extends Vue {
         size:'mini',
         seq:true,
         align:'center',
-        checkbox:true
+        // checkbox:true
       },
       columns:[{
         title:'店铺名称',
         field:'shopName',
+        isDetail:true,
         width:150
       },{
         title:'店铺简称',
@@ -122,7 +143,8 @@ export default class Shop extends Vue {
       },{
         title:'授权状态',
         field:'authStatus',
-        width:150
+        width:150,
+        component:shopTag
       },{
         title:'授权开始时间',
         field:'authBegin',
@@ -283,7 +305,7 @@ export default class Shop extends Vue {
           name:'删除',
           event:{
             click:(item:any) => {
-              // this.del(item);
+              this.del(item);
             }
           }
         }]
@@ -370,8 +392,8 @@ export default class Shop extends Vue {
             prop:'authStatus',
             component:'by-select',
             compConfig:{
-              clearable:true,
               attr:{
+                clearable:true,
                 data:[{
                   value:'Authorized',
                   label:'已授权'
@@ -503,66 +525,81 @@ export default class Shop extends Vue {
             prop:'enableSplitOrderFullSend',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'同步库存',
             prop:'enableSynvStore',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'订单下载',
             prop:'enableSyncOrder',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'天猫物流升级',
             prop:'enableTmallLogistics',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           }],
-          
           [{
             label:'商品下载',
             prop:'enableSkuDownload',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'开启链接库存同步',
             prop:'enableLinkSync',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'是否虾皮SIP',
             prop:'shopeeSip',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'同步发货',
             prop:'enableSyncSend',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           }],
           [{
@@ -570,32 +607,40 @@ export default class Shop extends Vue {
             prop:'shopStatus',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'退款状态',
             prop:'refundStatus',
             component:'by-switch',
             compConfig:{
-              activeValue:'1',
-              inactiveValue:'0'
+              attr:{
+                activeValue:'1',
+                inactiveValue:'0'
+              }
             }
           },{
             label:'启用分销',
             prop:'enableDistribution',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'揽收轨迹同步发货',
             prop:'enableTrackSyncSend',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           }],
           [{
@@ -603,39 +648,44 @@ export default class Shop extends Vue {
             prop:'enableSyncAfterSale',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'开通AG',
             prop:'enableAg',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'确认收货自动退款',
             prop:'enableAutoRefund',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           },{
             label:'开启跨境操作',
             prop:'enableCbec',
             component:'by-switch',
             compConfig:{
-              activeValue:1,
-              inactiveValue:0
+              attr:{
+                activeValue:1,
+                inactiveValue:0
+              }
             }
           }]
         ]
       }
-    },
-    request:{
-      url:'/omsOrder/omsShop/save'
     }
   }
   mounted(){
@@ -643,29 +693,20 @@ export default class Shop extends Vue {
       this.getList()
     })
   }
-  del(){
-    let data = (this.$refs.view as any).getSelectData()
-    if(data.length == 0){
-      this.$message('请选择店铺！')
-      return
-    }
-    let ids:Array<any>=[];
-    for(const item of data){
-      ids.push(item.id);
-    }  
-
-    this.$confirm('此操作将永久删除该店铺, 是否继续?', '提示', {
+  del(item:any){
+    this.$confirm('此操作将永久删除 “'+item.shopName+'” 店铺, 是否继续?', '提示', {
       confirmButtonText: '确定',
       cancelButtonText: '取消',
       type: 'warning'
     }).then(() => {
       this.load = true;
-      del({ids:ids}).then(()=>{
+      del({id:item.id}).then(()=>{
         this.load = false;
         this.$message({
           message:'删除成功！',
           type:'success'
         })
+        this.pagination();
       }).catch(()=>{
         this.load = false;
       })
@@ -716,15 +757,35 @@ export default class Shop extends Vue {
       this.load = false;
     })
   }
+  onSave(){
+    let data = (this.$refs.view as any).getFormValue();
+    this.load = true;
+    update(data).then((res:any) => {
+      this.$message({
+        message:res.msg,
+        type:'success'
+      });
+      this.load = false;
+      (this.$refs.view as any).closeModal();
+      this.pagination();
+    }).catch(()=>{
+      this.load = false;
+    })
+  }
   modalHandle(n:string){
     if(n == 'onAdd'){
       (this.$refs.view as any).getFormValidate(this.addShop)
-      
+    }
+
+    if(n == 'onSave'){
+      this.onSave();
     }
   }
-  clickHandle(n:string){
-    if(n == 'onDelete'){
-      this.del();
+  clickHandle(n:string){ 
+    if(n == 'onAdd'){
+      this.config.modal.tool.tools.add = true;
+      delete this.config.modal.tool.tools.save;
+      (this.$refs.view as any).initFormTool();
     }
   }
   addShop(){
@@ -744,6 +805,11 @@ export default class Shop extends Vue {
       })
     }
   }
+  detail(){
+    this.config.modal.tool.tools.save = true;
+    delete this.config.modal.tool.tools.add;
+    (this.$refs.view as any).initFormTool();
+  }
 }
 </script>