增加编辑商品信息,修改样式

.env.development

@@ -6,7 +6,7 @@ VUE_APP_BASE_API=''
 # 文件下载地址
 VUE_APP_BASE_DO_API='http://local.ng.backend.api.com'
 # CDN文件地址
-VUE_APP_CDN_API='http://16.163.228.151:8041'
+VUE_APP_CDN_API='http://172.19.124.45:9970'
 # 页面地址
 VUE_APP_BASE_WEBSITE='http://local.ng.backend.ele.com'
 # PayStack

src/api/shop.js

@@ -38,5 +38,26 @@ export function goodsDelete(query) {
     })
 }
 
+// 编辑商品-获取详情
+export function getGoodsDetail(query) {
+    return request({
+      url: '/v1/shop/goods-edit',
+      method: 'get',
+      data: query,
+      params: query
+    })
+}
+
+// 提交表单,编辑商品信息
+export function editGoodsData(query) {
+  return request({
+    url: '/v1/shop/goods-edit',
+    method: 'post',
+    data: query
+  })
+}
+
+
+
 
 

src/views/shop/index.vue

@@ -63,7 +63,7 @@
         </div>
       </div>
       <el-dialog :title="$t('shop.editProducts')" :visible.sync="dialogEditFormVisible"><!-- 修改商品 -->
-        <el-form :model="form" label-width="250px" class="form-dialog" v-loading="dialogEditLoading">
+        <el-form :model="form"  v-loading="dialogEditLoading">
           <el-form-item :label="$t('shop.productName')"><!-- 商品名称 -->
             <el-input v-model="form.goodsName"></el-input>
           </el-form-item>
@@ -141,16 +141,16 @@
             
             <el-form-item :label="$t('shop.uploadImages')"> <!-- 上传图片 -->
               <div class='up_load'>
-             <!-- <img v-if="form.cover&&img_show" :src="form.cover" alt=""> -->
-                <!-- <leo-uploader
-                    @on-success='upLoadSuccess'
-                    :request-route="'shop/upload'"
-                    ref='up_load'
-                    :defaultImageUrl='form.cover'
-                ></leo-uploader> -->
+                <Upload
+                  v-model="form.image"
+                  :request-route="'v1/shop/upload'"
+                  :default-image-url="form.cover"
+                  width="400px"
+                  height="160px"
+                  @on-success="upLoadSuccess"
+                ></Upload>
               </div>
             </el-form-item>
-  
           </el-form>
           <div slot="footer" class="dialog-footer">
             <el-button @click="dialogEditFormVisible = false">{{ $t('table.cancel') }}<!-- 取 消 --></el-button>
@@ -168,13 +168,12 @@
   import permission from '@/utils/permission'
   import Pagination from '@/components/Pagination'
   import filterHelper from '@/utils/filterHelper'
-  import { shopList, goodsListExport, updateGoodsStatus, goodsDelete } from '@/api/shop'
-  
-  
-//   import LeoUploader from '@/components/Uploader';
+  import { shopList, goodsListExport, updateGoodsStatus, goodsDelete, getGoodsDetail, editGoodsData } from '@/api/shop'
+  import Upload from '@/components/Upload'
+
   export default {
     name: 'index',
-    components: {FilterUser, Pagination},
+    components: {FilterUser, Pagination, Upload},
     mounted () {
       this.getData()
       // this.$refs.up_load.successImageUrl='';
@@ -275,7 +274,6 @@
         this.$router.push({path: `/shop/goods-add`})
       },
       upLoadSuccess (file) {
-        // this.form.cover=file;
         this.form.cover = tool.getArImage(file, '/files/')
         this.form.coverOrigin = file
         this.img_show = false
@@ -285,67 +283,48 @@
         this.auditId = row.ID
         this.dialogEditFormVisible = true
         let vueObj = this
-        network.getData('shop/goods-edit', {id: this.auditId}).then(response => {
-          vueObj.dialogEditLoading = false
-          vueObj.goodsType = response.goodsType
-          vueObj.categoryType = response.categoryType
-  
-          let gift = response.goodsInfo.GIFT_TYPE;
-          let gift_type = response.giftType
-  
-          let giftType = []
-          if (gift.length > 0) {
-            for (let i in gift_type) {
-              giftType.push({key: i, name: gift_type[i].name, checked: false})
-              gift.map((v, k) => {
-                if (v === i) {
-                  giftType[i - 1].checked = true
+        getGoodsDetail({id: this.auditId}).then(response => {
+            vueObj.dialogEditLoading = false
+            vueObj.goodsType = response.data.goodsType
+            vueObj.categoryType = response.data.categoryType
+            let gift = response.data.goodsInfo.GIFT_TYPE;
+            let gift_type = response.data.giftType
+            let giftType = []
+            if (gift.length > 0) {
+                for (let i in gift_type) {
+                    giftType.push({key: i, name: gift_type[i].name, checked: false})
+                    gift.map((v, k) => {
+                        if (v === i) {
+                            giftType[i - 1].checked = true
+                        }
+                    })
                 }
-              })
             }
-          }
-          vueObj.GiftTypeArr = giftType
-  
-          // let sell = response.goodsInfo.SELL_TYPE;
-          // let sell_type = response.sellType;
-          // let sellType=[];
-          // if(sell.length>0){
-          //     for(let i in sell_type){
-          //         sellType.push({key:i,name:sell_type[i].name,checked:false})
-          //         sell.map((item,index)=>{
-          //             if(item==i){
-          //                 sellType[i-1].checked=true;
-          //             }
-          //         })
-          //     }
-          // }
-          vueObj.sell_type = response.goodsInfo.SELL_TYPE;
-          vueObj.form.goodsName = response.goodsInfo.GOODS_NAME
-          vueObj.form.sellDiscount = response.goodsInfo.SELL_DISCOUNT
-          vueObj.form.goodsNo = response.goodsInfo.GOODS_NO
-          vueObj.form.type = response.goodsInfo.TYPE
-          vueObj.form.unit = response.goodsInfo.UNIT
-          vueObj.form.marketPrice = response.goodsInfo.MARKET_PRICE
-          vueObj.form.sellPrice = response.goodsInfo.SELL_PRICE
-          vueObj.form.sellPriceStandard = response.goodsInfo.SELL_PRICE_STANDARD
-          vueObj.form.pricePv = response.goodsInfo.PRICE_PV
-          vueObj.form.point = response.goodsInfo.POINT
-          vueObj.form.storeNums = response.goodsInfo.STORE_NUMS
-          vueObj.form.content = response.goodsInfo.CONTENT
-          vueObj.form.sort = response.goodsInfo.SORT
-          vueObj.form.id = response.goodsInfo.ID
-          vueObj.form.pvSplit = response.goodsInfo.PV_SPLIT
-          // vueObj.form.cover = response.goodsInfo.COVER
-          vueObj.form.categoryType = parseInt(response.goodsInfo.CATEGORY_TYPE)
-          vueObj.form.taxRate = response.goodsInfo.TAX_RATE
-          // vueObj.form.sellType=vueObj.form.sellType.map((item,index)=>{
-          //   return response.goodsInfo.SELL_TYPE.some(val=>(index+1).toString()==val)
-          //   })
-  
-          vueObj.form.coverOrigin = response.goodsInfo.COVER
-          vueObj.form.cover = tool.getArImage(response.goodsInfo.COVER, '/files/')
-  
-          this.$forceUpdate()
+            vueObj.GiftTypeArr = giftType
+            vueObj.sell_type = response.data.goodsInfo.SELL_TYPE;
+            vueObj.form.goodsName = response.data.goodsInfo.GOODS_NAME
+            vueObj.form.sellDiscount = response.data.goodsInfo.SELL_DISCOUNT
+            vueObj.form.goodsNo = response.data.goodsInfo.GOODS_NO
+            vueObj.form.type = response.data.goodsInfo.TYPE
+            vueObj.form.unit = response.data.goodsInfo.UNIT
+            vueObj.form.marketPrice = response.data.goodsInfo.MARKET_PRICE
+            vueObj.form.sellPrice = response.data.goodsInfo.SELL_PRICE
+            vueObj.form.sellPriceStandard = response.data.goodsInfo.SELL_PRICE_STANDARD
+            vueObj.form.pricePv = response.data.goodsInfo.PRICE_PV
+            vueObj.form.point = response.data.goodsInfo.POINT
+            vueObj.form.storeNums = response.data.goodsInfo.STORE_NUMS
+            vueObj.form.content = response.data.goodsInfo.CONTENT
+            vueObj.form.sort = response.data.goodsInfo.SORT
+            vueObj.form.id = response.data.goodsInfo.ID
+            vueObj.form.pvSplit = response.data.goodsInfo.PV_SPLIT
+            vueObj.form.categoryType = parseInt(response.data.goodsInfo.CATEGORY_TYPE)
+            vueObj.form.taxRate = response.data.goodsInfo.TAX_RATE
+            vueObj.form.coverOrigin = response.data.goodsInfo.COVER
+            vueObj.form.cover = tool.getArImage(response.data.goodsInfo.COVER, '/files/')
+    
+            this.$forceUpdate()
+        }).catch(err => {
+
         })
       },
       handleEdit () {
@@ -354,8 +333,6 @@
           message: 'Modifying data', // 正在修改数据
           type: 'info'
         })
-        let path = 'shop/goods-edit'
-  
         // let sen_sell=[];
         // this.sell_type.map((item,index)=>{
         //     if(item.checked){
@@ -374,14 +351,17 @@
         this.form.sellType = 1
         this.form.cover = this.form.coverOrigin
         delete this.form.coverOrigin
-  
-        network.postData(path, {...this.form}).then(response => {
+        editGoodsData({...this.form}).then(response => {
           this.$message({
-            message: response,
+            message: response.data,
             type: 'success'
           })
           this.getData(this.currentPage, this.pageSize)
-        }).catch(response => {
+        }).catch(err => {
+          this.$message({
+            message:err,
+            type: 'error'
+          })
         })
       },
   
@@ -519,5 +499,16 @@
           margin-right: 0;
           margin-bottom: 0;
       }
+      /deep/ .el-dialog .el-form-item__label {
+        width:100%;
+        text-align: left;
+      }
+      @media (max-width:862px) {
+        /deep/ img { 
+          width: 100px !important;
+          height: 60px !important;
+        }
+      }
+      
   </style>
   

vue.config.js

@@ -39,7 +39,7 @@ module.exports = {
     },
     proxy: {
       [process.env.VUE_APP_BASE_API]:{
-        target:"http://172.29.198.198:9970",
+        target:"http://172.19.124.45:9970",
         changeOrigin:true,
         pathRewrite:{
           ["^" + process.env.VUE_APP_BASE_API] : ""