瀏覽代碼

Merge branch 'dev' of http://39.106.8.246:3003/zhangyu/PDM into dev

zhangyu 4 年之前
父節點
當前提交
0231292c98

+ 52 - 21
src/components/business/addBrand.vue

@@ -8,24 +8,20 @@
         <el-input v-model="ruleForm.enName"  placeholder="请输入"/>
       </el-form-item>
       <el-form-item label="品牌LOGO:">
-        <div style="display:inline-block;">
+        <div class="logo">
           <el-upload
+            style="flex: 1"
+            class="avatar-uploader"
             action="https://jsonplaceholder.typicode.com/posts/"
-            list-type="picture-card"
-            :on-preview="handlePictureCardPreview"
-            :on-remove="handleRemove"
-            :before-upload="beforeAvatarUpload"
-            :limit="1"
-            accept=".jpg, .png, .jpeg"
-          >
-            <i class="el-icon-plus"></i>
+            :show-file-list="false"
+            :on-success="handleAvatarSuccess"
+            :before-upload="beforeAvatarUpload">
+            <img v-if="imageUrl" :src="imageUrl" class="avatar">
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
           </el-upload>
-<!--          <span>支持格式GIF、JPG、JPEG、PNG,文件80K以内,建议尺寸80PX*80PX</span>-->
-
+          <span class="imgTip">支持格式GIF、JPG、JPEG、PNG,文件80K以内,建议尺寸80PX*80PX</span>
         </div>
-        <el-dialog :visible.sync="dialogVisible">
-          <img width="100%" :src="dialogImageUrl" alt="">
-        </el-dialog>
+
       </el-form-item>
     </el-form>
     <el-dialog
@@ -75,12 +71,8 @@
       }
     },
     methods: {
-      handleRemove(file, fileList) {
-        console.log(file, fileList);
-      },
-      handlePictureCardPreview(file) {
-        this.dialogImageUrl = file.url;
-        this.dialogVisible = true;
+      handleAvatarSuccess(res, file) {
+        this.imageUrl = URL.createObjectURL(file.raw);
       },
       beforeAvatarUpload(file) {
         const isJPG = file.type === 'image/jpeg';
@@ -103,9 +95,20 @@
     /deep/ .el-dialog__header {
       border-bottom: 1px solid #E4E5E7;
     }
-.reset-form{
+.reset-form {
   width: 320px;
   margin: 0 auto;
+
+  .logo {
+    display: flex;
+    .imgTip{
+      font-size: 12px;
+      color:#C3C7CB;
+      line-height:18px;
+      margin-left: 8px;
+      margin-bottom: 78px;
+    }
+  }
 }
   }
 
@@ -129,3 +132,31 @@
     }
   }
 </style>
+<style>
+  .avatar-uploader .el-upload {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+
+  .avatar-uploader .el-upload:hover {
+    border-color: #409EFF;
+  }
+
+  .avatar-uploader-icon {
+    font-size: 28px;
+    color: #8c939d;
+    width: 112px;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+  }
+
+  .avatar {
+    width: 112px;
+    height: 112px;
+    display: block;
+  }
+</style>

+ 9 - 14
src/components/product/productTool.vue

@@ -1,14 +1,13 @@
 <template>
   <div class="saga-toolbar-box">
     <div class="saga-toolbar-main">
-      <div class="top-menu">
-                <selectTree
-                  :props="props"
-                  :options="optionData"
-                  :value="valueId"
-                  :clearable="isClearable"
-                  :accordion="isAccordion"
-                  @getValue="getValue($event)"/>
+        <selectTree
+          :props="props"
+          :options="optionData"
+          :value="valueId"
+          :clearable="isClearable"
+          :accordion="isAccordion"
+          @getValue="getValue($event)"/>
         <span style="float: right;">
            <el-input
              v-model="value"
@@ -21,7 +20,6 @@
               <el-button type="primary" @click="handBrand">添加产品</el-button>
 
           </span>
-      </div>
     </div>
 
 
@@ -105,14 +103,11 @@
       width: 1200px;
       height: 100%;
       margin: auto;
-    }
-
-    .top-menu {
-      width: 1200px;
-      margin: 0 auto;
       padding-top: 20px;
+
     }
 
+
     .reset-input {
       /deep/ .el-input__inner {
         background: #F6F6F6;

+ 31 - 0
src/components/supplement/sagaSupplement.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="saga-brand-box">
+
+  </div>
+</template>
+
+<script>
+  export default {
+    components: {},
+    created() {
+    },
+    mounted() {
+    },
+    data() {
+      return {}
+    },
+    methods: {}
+  }
+</script>
+<style lang="scss" scoped>
+  .saga-brand-box {
+    width: 100%;
+    margin-top: 90px;
+    padding: 16px;
+    box-sizing: border-box;
+    background: rgba(255, 255, 255, 1);
+    /*box-shadow: 0 2px 4px 0 rgba(0,0,0,0.5);*/
+
+  }
+
+</style>

+ 73 - 0
src/components/supplement/supplementTool.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="saga-toolbar-box">
+    <div class="saga-toolbar-main">
+      <p class="supplement-title">
+        <img src="../../assets/images/rectangle.png" height="16" alt="">
+        添加产品</p>
+      <span class="fr">
+      <el-button>取消</el-button>
+      <el-button type="primary">创建</el-button>
+      <el-button type="primary">创建并继续</el-button>
+      </span>
+    </div>
+
+
+  </div>
+</template>
+
+<script>
+
+
+  export default {
+
+
+    created() {
+    },
+    mounted() {
+    },
+    data() {
+      return {}
+    },
+    methods: {}
+  }
+</script>
+<style lang="scss" scoped>
+  .saga-toolbar-box {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 70px;
+    background: #fff;
+
+    .saga-toolbar-main {
+      width: 1200px;
+      height: 100%;
+      margin: auto;
+      padding-top: 20px;
+
+    }
+
+    .supplement-title {
+      color: #1F2329;
+      font-size: 16px;
+      font-weight: 500;
+      margin-left: 8px;
+      margin-top: 5px;
+      display: inline-block;
+
+      img {
+        vertical-align: middle;
+      }
+    }
+  }
+
+  .fr {
+    float: right;;
+  }
+
+  /*.color-primary {*/
+  /*  background: #3A8DDE;*/
+  /*  color: #fff;*/
+  /*}*/
+</style>

+ 14 - 1
src/router/system.js

@@ -4,9 +4,10 @@ import Dasboard from '@/views/dasboard'
 import login from '@/framework/layout'
 // 品牌管理
 import brand from '@/views/brand'
-
 //产品管理
 import product from "@/views/product/index"
+//从已有数据填充产品
+import supplement from "@/views/supplement"
 //测试页面
 import test from '@/components/test'
 /**模型管理 */
@@ -54,6 +55,18 @@ export default [
       },
     ]
   },
+  // 从已有数据填充产品
+  {
+    path: '/supplement',
+    name: 'LayoutMain',
+    component: LayoutMain,
+    children: [{
+        path: '',
+        name: 'supplement',
+        component: supplement
+      },
+    ]
+  },
   {
     path: '/test',
     name: 'test',

+ 20 - 0
src/views/supplement/index.vue

@@ -0,0 +1,20 @@
+<template>
+  <div class="supplement">
+    <supplementTool/>
+    <sagaSupplement/>
+  </div>
+</template>
+
+<script>
+  import supplementTool from "../../components/supplement/supplementTool";
+  import sagaSupplement from "../../components/supplement/sagaSupplement";
+
+  export default {
+    name: "index",
+    components: {supplementTool, sagaSupplement}
+  }
+</script>
+
+<style scoped>
+
+</style>