''

business/pages/scoreproedit/couponeditor.js

+import {
+  wxChooseImage,
+  wxUploadFile
+} from '../../../utilities/wxApi.js';
+import {
+  bOssAccess
+} from '../../../service/business/common.js';
+import {
+  goodsAdd,
+	goodsUpdate,
+	goodsShow
+} from '../../../service/business/integral.js';
+import {
+  getRandomFilename,
+  imagify,
+} from '../../../utilities/index.js';
 var app = getApp();
 Page({
 
@@ -5,18 +21,64 @@ Page({
    * 页面的初始数据
    */
   data: {
+    showCropper: false,
     imageRoot: app.globalData.imageRoot,
     imageVersion: app.globalData.imageVersion,
     localImageRoot: '../../../images/',
+    sid: 0,
+    gid: 0, // goodsid卡券id
+    params: {
+      cover: '',
+      banner:[],
+      title: '',
+      type: 2,
+      status:  1,
+      price: 100,
+      inventory: 100,
+      remark: ''
+    },
+    cropperOpt: {
+      limit_move: true,
+      disable_rotate: true,
+      width: 300,  // 画布宽度
+      height: 300, // 画布高度
+    },
+    swiperIndex: 0,
+    uploadType: 'mainImg', // mainImg主图 swiperImg 轮播图
+    cropperSrc: '',
+    containerheight: ''
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
-
+    const {sid, gid} = options;
+    this.setData({
+      sid,
+      gid
+    })
+    this.goodsShow();
+    //开始裁剪
+    // this.setData({
+    //     src:"https://cdn.img.shangjiadao.cn/clock-test/member/12186/2019-05-23/33bffe1d32862648b4341d0ac90d554a.png",
+    // });
+  },
+  cropperload(e){
+    console.log("cropper初始化完成");
+  },
+  cancelcropper () {
+    this.setData({
+      showCropper: false,
+      cropperSrc: '',
+      containerheight: ''
+    })
+  },
+  surecropper () {
+    this.cropper = this.selectComponent("#image-cropper");
+    this.cropper._click();
+    
   },
-
   /**
    * 生命周期函数--监听页面初次渲染完成
    */
@@ -64,5 +126,271 @@ Page({
    */
   onShareAppMessage: function () {
 
+  },
+  goodsShow () {
+    if (this.data.gid == 0) {
+      return;
+    }
+    goodsShow({
+      school_id: this.data.sid,
+      id: this.data.gid
+    }).then((res) => {
+      const {code, data} = res;
+      if (code == 200) {
+        this.setData({
+          params: {
+            cover: data.cover,
+            banner: JSON.parse(data.banner),
+            title: data.title,
+            type: 1,
+            status: data.status,
+            price: data.price,
+            inventory: data.inventory,
+            remark: data.remark,
+          },
+        })
+      }
+    })
+  },
+  goPre () {
+    if (this.data.swiperIndex == (this.data.params.banner.length - 1)) {
+      return
+    }
+    let swiperIndex = this.data.swiperIndex + 1;
+    this.setData({
+      swiperIndex
+    })
+  },
+  goBack () {
+    if (this.data.swiperIndex == 0) {
+      return;
+    }
+    let swiperIndex = this.data.swiperIndex - 1;
+    this.setData({
+      swiperIndex
+    })
+  },
+  clickcut (e) {
+    let filepath = e.detail.url;
+    this.setData({
+      showCropper: false,
+      cropperSrc: '',
+      containerheight: ''
+    })
+    let filename = '';
+    bOssAccess({
+      school_id: this.data.sid
+    }).then((acc) => {
+       return acc.data;
+    }).then((access) => {
+      filename = `${access.dir}${getRandomFilename(filepath)}`;
+      wx.showLoading({
+        title: '图片上传中'
+      })
+      return wxUploadFile({
+        url: access.host,
+        formData: {
+          key: filename,
+          policy: access.policy,
+          OSSAccessKeyId: access.accessid,
+          signature: access.signature,
+          callback: access.callback,
+          success_action_status: '200'
+        },
+        filePath: filepath,
+        name: 'file',
+      })
+    }).then((res) => {
+      const {data} = res;
+      if (data == '{"status":"ok"}') {
+        wx.showToast({
+          title: '上传成功'
+        })
+        this.setData({
+          showCropper: false,
+        })
+        this.mycropper = null;
+        this.setData({
+          'params.cover': filename,
+        })
+      } else {
+        wx.hideLoading();
+        wx.showModal({
+          title: '提示',
+          content: '上传失败',
+          showCancel: false 
+        })
+        this.setData({
+          containerheight: ''
+        })
+      }
+    }).catch((err) => {
+      this.setData({
+        containerheight: ''
+      })
+    })
+  },
+  getCropperImage () {
+    this.mycropper.getCropperImage((filepath) => {
+    
+    })
+  },
+  loadimage(){
+
+  },
+  proMainImgUpload (e) {
+    let access = {};
+    let filename = '';
+    const {type} = e.currentTarget.dataset;
+    bOssAccess({
+      school_id: this.data.sid
+    }).then((acc) => {
+      access = acc.data;
+      return wxChooseImage({})
+    }).then((res) => {
+      const {tempFiles} = res;
+      filename = `${access.dir}${getRandomFilename(tempFiles[0].path)}`;
+      return wxUploadFile({
+        url: access.host,
+        formData: {
+          key: filename,
+          policy: access.policy,
+          OSSAccessKeyId: access.accessid,
+          signature: access.signature,
+          callback: access.callback,
+          success_action_status: '200'
+        },
+        filePath: tempFiles[0].path,
+        name: 'file',
+      })
+    }).then((res) => {
+      const {data} = res;
+      if (data == '{"status":"ok"}') {
+        this.setData({
+          'uploadType': type,
+          cropperSrc: imagify(filename, 'image/resize,w_1280/format,jpg'),
+          'cropperOpt.width': 300,
+          'cropperOpt.height': 300,
+          showCropper: true,
+          containerheight: '100vh'
+        })
+      } else {
+        wx.hideLoading();
+        wx.showModal({
+          title: '提示',
+          content: '上传失败',
+          showCancel: false 
+        })
+        this.setData({
+          containerheight: ''
+        })
+      }
+    }).catch((err) => {
+      this.setData({
+        containerheight: ''
+      })
+    });
+  },
+  titleInput(e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.title': value.length > 25 ? value.substr(0, 25) : value
+    })
+  },
+  remarkInput(e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.remark': value.length > 100 ? value.substr(0, 100) : value
+    })
+  },
+  priceInput (e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.price': value
+    })
+  },
+  inventoryInput (e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.inventory': value
+    })
+  },
+  publish () {
+    if (this.data.params.cover == '') {
+      wx.showToast({
+        title: '请上传卡券封面',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.title == '') {
+      wx.showToast({
+        title: '卡券标题不能为空',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.price === '' || this.data.params.price === 0) {
+      wx.showToast({
+        title: '兑换卡券所需积分不能为空',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.price === 0) {
+      wx.showToast({
+        title: '兑换卡券所需积分不能为0',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.inventory === '') {
+      wx.showToast({
+        title: '卡券库存不能为空',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.remark.trim() == '') {
+      wx.showToast({
+        title: '请输入卡券说明',
+        icon: 'none'
+      })
+      return
+    }
+    let ajax = null;
+    if (this.data.gid != 0) {
+      ajax = goodsUpdate(Object.assign({}, this.data.params, {
+        banner: JSON.stringify(this.data.params.banner),
+        school_id: this.data.sid,
+        id: this.data.gid,
+      }))
+    } else {
+      ajax = goodsAdd(Object.assign({}, this.data.params, {
+        banner: JSON.stringify(this.data.params.banner),
+        school_id: this.data.sid
+      }))
+    }
+    ajax.then((res) => {
+      const {code, data} = res;
+      if (code == 200) {
+        wx.showToast({
+          title: '保存成功'
+        })
+      }
+    }).catch(() => {
+      wx.showToast({
+        title: '保存失败',
+        icon: 'none'
+      })
+    })
   }
 })
\ No newline at end of file

business/pages/scoreproedit/couponeditor.json

 {
     "navigationBarTitleText": "添加卡券",
-    "usingComponents": {}
+    "usingComponents": {
+        "imagecropper": "../../../components/imagecropper"
+    }
 }
\ No newline at end of file

business/pages/scoreproedit/couponeditor.wxml

-<view class="container">
+<import src="../../../wecropper/we-cropper.wxml"/>
+<wxs src="../../../filter/index.wxs" module="filter" />
+<view class="container" style="height: {{containerheight}}; overflow: hidden;">
+    <view class="cropperdialog" hover-class="none" hover-stop-propagation="false" wx:if="{{showCropper}}">
+        <imagecropper
+            id="image-cropper"
+            limit_move="{{cropperOpt.limit_move}}"
+            disable_rotate="{{cropperOpt.disable_rotate}}"
+            width="{{cropperOpt.width}}"
+            height="{{cropperOpt.height}}"
+            imgSrc="{{cropperSrc}}"
+            bindload="cropperload"
+            bindimageload="loadimage"
+            bindtapcut="clickcut"
+        ></imagecropper>
+        <view class="cropperoperate" hover-class="none" hover-stop-propagation="false">
+            <view class="" hover-class="none" hover-stop-propagation="false" bindtap="cancelcropper">取消</view>
+            <view class="" hover-class="none" hover-stop-propagation="false" bindtap="surecropper">确认</view>
+        </view>
+    </view>
     <view class="scoreedit-container" hover-class="none" hover-stop-propagation="false">
-        <view class="title" hover-class="none" hover-stop-propagation="false">商品封面</view>
+        <!-- <view class="title" hover-class="none" hover-stop-propagation="false">卡券封面</view> -->
         <view class="uploadcontent" hover-class="none" hover-stop-propagation="false">
             <view class="uploadbox" hover-class="none" hover-stop-propagation="false">
-                <image class="mainimg" src="https://wx.qlogo.cn/mmopen/vi_32/GY0ZvN3sdDsic3MyuFVfmnu9buGSH0EfMhjD8wsH9QwtcQQYQCkAew6xwgPqsmmEbc0456rY7o5gPiah5rrL4ySA/132" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
-                <view class="uploadiconbox" hover-class="none" hover-stop-propagation="false">
-                    <image class="uploadicon" src="{{localImageRoot}}2b/scoremgt/uploadicon.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
+                <image class="mainimg"  wx:if="{{params.cover != ''}}" src="{{filter.imagify(params.cover)}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
+                <view class="uploadiconbox" hover-class="none" hover-stop-propagation="false" bindtap="proMainImgUpload" data-type="mainImg">
+                    <image class="uploadicon" src="{{localImageRoot}}2b/scoremgt/uploadicon.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
                     <text class="addimgtext" selectable="false" space="false" decode="false">添加图片</text>
                 </view>
                 <image class="del-icon" src="{{imageRoot}}2b/common/reddelicon.png?{{imageVersion}}" lazy-load="false" binderror="" bindload=""></image>
             </view>
             <view class="uploadtext" hover-class="none" hover-stop-propagation="false">建议尺寸：310*270 最多上传1张</view>
         </view>
-        <view class="title" hover-class="none" hover-stop-propagation="false">奖品标题</view>
+        <view class="title" hover-class="none" hover-stop-propagation="false">卡券标题</view>
         <view class="prizetitle" hover-class="none" hover-stop-propagation="false">
-            <textarea placeholder="请输入奖品标题"></textarea>
-            <view class="textcount" hover-class="none" hover-stop-propagation="false">1/25</view>
+            <textarea placeholder="请输入奖品标题" value="{{params.title}}" bindinput="titleInput"></textarea>
+            <view class="textcount" hover-class="none" hover-stop-propagation="false">{{params.title.length}}/25</view>
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">积分价格</view>
         <view class="prostatic" hover-class="none" hover-stop-propagation="false">
-            <text class="text" selectable="false" space="false" decode="false">兑换该商品需要</text>
-            <input type="number" class="staticinput" value="2000" />
+            <text class="text" selectable="false" space="false" decode="false">兑换该卡券需要</text>
+            <input type="number" class="staticinput" value="{{params.price}}" bindinput="priceInput"/>
             <text class="text" selectable="false" space="false" decode="false">积分</text>
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">库存</view>
         <view class="prostatic" hover-class="none" hover-stop-propagation="false">
-            <text class="text" selectable="false" space="false" decode="false">该奖品数量</text>
-            <input type="number" class="staticinput" value="2000"/>
+            <text class="text" selectable="false" space="false" decode="false">该卡券数量</text>
+            <input type="number" class="staticinput" value="{{params.inventory}}" bindinput="inventoryInput"/>
             <text class="text" selectable="false" space="false" decode="false">件</text>
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">其他说明</view>
         <view class="prizetitle prizedesc" hover-class="none" hover-stop-propagation="false">
-            <textarea auto-height placeholder="说明一些特殊情况：例如 兑奖规则，奖品情况等"></textarea>
+            <textarea auto-height placeholder="说明一些特殊情况：例如 兑奖规则，奖品情况等"  bindinput="remarkInput" value="{{params.remark}}"></textarea>
             <view class="textcount" hover-class="none" hover-stop-propagation="false">1/100</view>
         </view>
     </view>
-    <view class="submitbtn" hover-class="none" hover-stop-propagation="false">上架</view>
+    <view class="submitbtn" hover-class="none" hover-stop-propagation="false" bindtap="publish">上架</view>
 </view>
-    
\ No newline at end of file

business/pages/scoreproedit/couponeditor.wxss

@@ -17,7 +17,7 @@
 }
 .uploadbox {
     width: 200rpx;
-    height: 174rpx;
+    height: 200rpx;
     border-radius: 10rpx;
     background-color: #F7F7F9;
     overflow: hidden;
@@ -30,7 +30,7 @@
 }
 .mainimg {
     width: 200rpx;
-    height: 174rpx;
+    height: 200rpx;
     position: relative;
     z-index: 2;
 }
@@ -58,14 +58,14 @@
     line-height: 1;
 }
 .del-icon {
-    box-sizing: content-box;
-    padding: 0 0 20rpx 20rpx;
     width: 40rpx;
     height: 40rpx;
     position: absolute;
-    z-index: 3;
+    z-index: 10;
     top: 0;
     right: 0;
+    box-sizing: content-box;
+    padding: 0 0 20rpx 20rpx;
 }
 .prizetitle {
     margin-bottom: 70rpx;
@@ -124,4 +124,81 @@
     /* padding: 0 70rpx; */
     width: 256rpx;
     margin: 220rpx auto 30rpx;
+}
+.proimages {
+    margin-bottom: 24rpx;
+    position: relative;
+}
+.proimages .proswiperimg{
+    width: 100%;
+    height: 290rpx;
+   
+}
+.swiperpagination {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 36rpx;
+}
+.swiperpagination .dot {
+    width: 10rpx;
+    height: 10rpx;
+    border-radius: 5rpx;
+    background-color: #CDCDCD;
+    margin: 0 7rpx;
+    transition: width 0.1s;
+}
+.swiperpagination .dot.active {
+    width: 22rpx;
+    background-color: #65B8F4;
+}
+.advicesize {
+    color: #fff;
+    margin-top: 50rpx;
+}
+.proimages .uploadiconbox {
+    background-color:rgba(0,0,0,0.5);
+}
+.proimages .uploadiconbox .addimgtext {
+    color: #fff;
+}
+.arrowcircleleftbox {
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 5;
+    display: flex;
+    align-items: center;
+    padding: 0 26rpx;
+    height: 100%;
+}
+.arrowcirclerightbox {
+    position: absolute;
+    right: 0;
+    top: 0;
+    z-index: 5;
+    display: flex;
+    align-items: center;
+    padding: 0 26rpx;
+    height: 100%;
+}
+.arrowcircleleft {
+    width: 45rpx;
+    height: 45rpx;
+}
+.arrowcircleright {
+    width: 45rpx;
+    height: 45rpx;
+}
+.cropperoperate {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    position: fixed;
+    z-index: 400;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    color: #fff;
+    height: 200rpx;
 }
\ No newline at end of file

business/pages/scoreproedit/proeditor.js

+import {
+  wxChooseImage,
+  wxUploadFile
+} from '../../../utilities/wxApi.js';
+import {
+  bOssAccess
+} from '../../../service/business/common.js';
+import {
+  goodsAdd,
+	goodsUpdate,
+	goodsShow
+} from '../../../service/business/integral.js';
+import {
+  getRandomFilename,
+  imagify,
+} from '../../../utilities/index.js';
 var app = getApp();
 Page({
 
@@ -5,18 +21,64 @@ Page({
    * 页面的初始数据
    */
   data: {
+    showCropper: false,
     imageRoot: app.globalData.imageRoot,
     imageVersion: app.globalData.imageVersion,
     localImageRoot: '../../../images/',
+    sid: 0,
+    gid: 0, // goodsid商品id
+    params: {
+      cover: '',
+      banner:[],
+      title: '',
+      type: 1,
+      status:  1,
+      price: 100,
+      inventory: 100,
+      remark: ''
+    },
+    cropperOpt: {
+      limit_move: true,
+      disable_rotate: true,
+      width: 310,  // 画布宽度
+      height: 270, // 画布高度
+    },
+    swiperIndex: 0,
+    uploadType: 'mainImg', // mainImg主图 swiperImg 轮播图
+    cropperSrc: '',
+    containerheight: ''
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
-
+    const {sid, gid} = options;
+    this.setData({
+      sid,
+      gid
+    })
+    this.goodsShow();
+    //开始裁剪
+    // this.setData({
+    //     src:"https://cdn.img.shangjiadao.cn/clock-test/member/12186/2019-05-23/33bffe1d32862648b4341d0ac90d554a.png",
+    // });
+  },
+  cropperload(e){
+    console.log("cropper初始化完成");
+  },
+  cancelcropper () {
+    this.setData({
+      showCropper: false,
+      cropperSrc: '',
+      containerheight: ''
+    })
+  },
+  surecropper () {
+    this.cropper = this.selectComponent("#image-cropper");
+    this.cropper._click();
+    
   },
-
   /**
    * 生命周期函数--监听页面初次渲染完成
    */
@@ -64,5 +126,297 @@ Page({
    */
   onShareAppMessage: function () {
 
+  },
+  goodsShow () {
+    if (this.data.gid == 0) {
+      return;
+    }
+    goodsShow({
+      school_id: this.data.sid,
+      id: this.data.gid
+    }).then((res) => {
+      const {code, data} = res;
+      if (code == 200) {
+        this.setData({
+          params: {
+            cover: data.cover,
+            banner: JSON.parse(data.banner),
+            title: data.title,
+            type: 1,
+            status: data.status,
+            price: data.price,
+            inventory: data.inventory,
+            remark: data.remark,
+          },
+        })
+      }
+    })
+  },
+  goPre () {
+    if (this.data.swiperIndex == (this.data.params.banner.length - 1)) {
+      return
+    }
+    let swiperIndex = this.data.swiperIndex + 1;
+    this.setData({
+      swiperIndex
+    })
+  },
+  goBack () {
+    if (this.data.swiperIndex == 0) {
+      return;
+    }
+    let swiperIndex = this.data.swiperIndex - 1;
+    this.setData({
+      swiperIndex
+    })
+  },
+  clickcut (e) {
+    let filepath = e.detail.url;
+    this.setData({
+      showCropper: false,
+      cropperSrc: '',
+      containerheight: ''
+    })
+    let filename = '';
+    bOssAccess({
+      school_id: this.data.sid
+    }).then((acc) => {
+       return acc.data;
+    }).then((access) => {
+      filename = `${access.dir}${getRandomFilename(filepath)}`;
+      wx.showLoading({
+        title: '图片上传中'
+      })
+      return wxUploadFile({
+        url: access.host,
+        formData: {
+          key: filename,
+          policy: access.policy,
+          OSSAccessKeyId: access.accessid,
+          signature: access.signature,
+          callback: access.callback,
+          success_action_status: '200'
+        },
+        filePath: filepath,
+        name: 'file',
+      })
+    }).then((res) => {
+      const {data} = res;
+      if (data == '{"status":"ok"}') {
+        wx.showToast({
+          title: '上传成功'
+        })
+        this.setData({
+          showCropper: false,
+        })
+        this.mycropper = null;
+        if (this.data.uploadType == 'mainImg') {
+          this.setData({
+            'params.cover': filename,
+          })
+        } else if (this.data.uploadType == 'swiperImg') {
+          let banner = this.data.params.banner;
+          banner.push(filename);
+          this.setData({
+            'params.banner': banner
+          })
+        }
+      } else {
+        wx.hideLoading();
+        wx.showModal({
+          title: '提示',
+          content: '上传失败',
+          showCancel: false 
+        })
+        this.setData({
+          containerheight: ''
+        })
+      }
+    }).catch((err) => {
+      this.setData({
+        containerheight: ''
+      })
+    })
+  },
+  getCropperImage () {
+    this.mycropper.getCropperImage((filepath) => {
+    
+    })
+  },
+  loadimage(){
+
+  },
+  proMainImgUpload (e) {
+    let access = {};
+    let filename = '';
+    const {type} = e.currentTarget.dataset;
+    bOssAccess({
+      school_id: this.data.sid
+    }).then((acc) => {
+      access = acc.data;
+      return wxChooseImage({})
+    }).then((res) => {
+      const {tempFiles} = res;
+      filename = `${access.dir}${getRandomFilename(tempFiles[0].path)}`;
+      return wxUploadFile({
+        url: access.host,
+        formData: {
+          key: filename,
+          policy: access.policy,
+          OSSAccessKeyId: access.accessid,
+          signature: access.signature,
+          callback: access.callback,
+          success_action_status: '200'
+        },
+        filePath: tempFiles[0].path,
+        name: 'file',
+      })
+    }).then((res) => {
+      const {data} = res;
+      if (data == '{"status":"ok"}') {
+        if (type == 'mainImg') {
+          this.setData({
+            'uploadType': type,
+            cropperSrc: imagify(filename, 'image/resize,w_1280/format,jpg'),
+            'cropperOpt.width': 310,
+            'cropperOpt.height': 270,
+            showCropper: true,
+            containerheight: '100vh'
+          })
+        } else if (type == 'swiperImg') {
+          this.setData({
+            'uploadType': type,
+            cropperSrc: imagify(filename, 'image/resize,w_1280/format,jpg'),
+            'cropperOpt.width': 333,
+            'cropperOpt.height': 138,
+            showCropper: true,
+            containerheight: '100vh'
+          })
+        }
+      } else {
+        wx.hideLoading();
+        wx.showModal({
+          title: '提示',
+          content: '上传失败',
+          showCancel: false 
+        })
+        this.setData({
+          containerheight: ''
+        })
+      }
+    }).catch((err) => {
+      this.setData({
+        containerheight: ''
+      })
+    });
+  },
+  titleInput(e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.title': value.length > 25 ? value.substr(0, 25) : value
+    })
+  },
+  remarkInput(e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.remark': value.length > 100 ? value.substr(0, 100) : value
+    })
+  },
+  priceInput (e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.price': value
+    })
+  },
+  inventoryInput (e) {
+    const {
+      value
+    } = e.detail;
+    this.setData({
+      'params.inventory': value
+    })
+  },
+  publish () {
+    if (this.data.params.cover == '') {
+      wx.showToast({
+        title: '请上传商品封面',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.banner.length == 0) {
+      wx.showToast({
+        title: '请上传商品详情图',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.title == '') {
+      wx.showToast({
+        title: '商品标题不能为空',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.price === '' || this.data.params.price === 0) {
+      wx.showToast({
+        title: '兑换商品所需积分不能为空',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.price === 0) {
+      wx.showToast({
+        title: '兑换商品所需积分不能为0',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.inventory === '') {
+      wx.showToast({
+        title: '商品库存不能为空',
+        icon: 'none'
+      })
+      return
+    }
+    if (this.data.params.remark.trim() == '') {
+      wx.showToast({
+        title: '请输入商品说明',
+        icon: 'none'
+      })
+      return
+    }
+    let ajax = null;
+    if (this.data.gid != 0) {
+      ajax = goodsUpdate(Object.assign({}, this.data.params, {
+        banner: JSON.stringify(this.data.params.banner),
+        school_id: this.data.sid,
+        id: this.data.gid,
+      }))
+    } else {
+      ajax = goodsAdd(Object.assign({}, this.data.params, {
+        banner: JSON.stringify(this.data.params.banner),
+        school_id: this.data.sid
+      }))
+    }
+    ajax.then((res) => {
+      const {code, data} = res;
+      if (code == 200) {
+        wx.showToast({
+          title: '保存成功'
+        })
+      }
+    }).catch(() => {
+      wx.showToast({
+        title: '保存失败',
+        icon: 'none'
+      })
+    })
   }
 })
\ No newline at end of file

business/pages/scoreproedit/proeditor.json

 {
     "navigationBarTitleText": "添加商品",
-    "usingComponents": {}
+    "usingComponents": {
+        "imagecropper": "../../../components/imagecropper"
+    }
 }
\ No newline at end of file

business/pages/scoreproedit/proeditor.wxml

-<view class="container">
+<import src="../../../wecropper/we-cropper.wxml"/>
+<wxs src="../../../filter/index.wxs" module="filter" />
+<view class="container" style="height: {{containerheight}}; overflow: hidden;">
+    <view class="cropperdialog" hover-class="none" hover-stop-propagation="false" wx:if="{{showCropper}}">
+        <imagecropper
+            id="image-cropper"
+            limit_move="{{cropperOpt.limit_move}}"
+            disable_rotate="{{cropperOpt.disable_rotate}}"
+            width="{{cropperOpt.width}}"
+            height="{{cropperOpt.height}}"
+            imgSrc="{{cropperSrc}}"
+            bindload="cropperload"
+            bindimageload="loadimage"
+            bindtapcut="clickcut"
+        ></imagecropper>
+        <view class="cropperoperate" hover-class="none" hover-stop-propagation="false">
+            <view class="" hover-class="none" hover-stop-propagation="false" bindtap="cancelcropper">取消</view>
+            <view class="" hover-class="none" hover-stop-propagation="false" bindtap="surecropper">确认</view>
+        </view>
+    </view>
     <view class="scoreedit-container" hover-class="none" hover-stop-propagation="false">
         <view class="title" hover-class="none" hover-stop-propagation="false">商品封面</view>
         <view class="uploadcontent" hover-class="none" hover-stop-propagation="false">
             <view class="uploadbox" hover-class="none" hover-stop-propagation="false">
-                <image class="mainimg" src="https://wx.qlogo.cn/mmopen/vi_32/GY0ZvN3sdDsic3MyuFVfmnu9buGSH0EfMhjD8wsH9QwtcQQYQCkAew6xwgPqsmmEbc0456rY7o5gPiah5rrL4ySA/132" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
-                <view class="uploadiconbox" hover-class="none" hover-stop-propagation="false">
+                <image class="mainimg"  wx:if="{{params.cover != ''}}" src="{{filter.imagify(params.cover)}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
+                <view class="uploadiconbox" hover-class="none" hover-stop-propagation="false" bindtap="proMainImgUpload" data-type="mainImg">
                     <image class="uploadicon" src="{{localImageRoot}}2b/scoremgt/uploadicon.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
                     <text class="addimgtext" selectable="false" space="false" decode="false">添加图片</text>
                 </view>
@@ -14,27 +33,21 @@
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">商品详情图</view>
         <view class="proimages" hover-class="none" hover-stop-propagation="false">
-            <swiper style="height: 145px">
-                <swiper-item>
-                    <image class="proswiperimg" src="https://wx.qlogo.cn/mmopen/vi_32/GY0ZvN3sdDsic3MyuFVfmnu9buGSH0EfMhjD8wsH9QwtcQQYQCkAew6xwgPqsmmEbc0456rY7o5gPiah5rrL4ySA/132" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
-                </swiper-item>
-                <swiper-item>
-                    <image class="proswiperimg" src="https://wx.qlogo.cn/mmopen/vi_32/GY0ZvN3sdDsic3MyuFVfmnu9buGSH0EfMhjD8wsH9QwtcQQYQCkAew6xwgPqsmmEbc0456rY7o5gPiah5rrL4ySA/132" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
-                </swiper-item>
-                <swiper-item>
-                    <image class="proswiperimg" src="https://wx.qlogo.cn/mmopen/vi_32/GY0ZvN3sdDsic3MyuFVfmnu9buGSH0EfMhjD8wsH9QwtcQQYQCkAew6xwgPqsmmEbc0456rY7o5gPiah5rrL4ySA/132" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
-                </swiper-item>
-                <swiper-item>
-                    <image class="proswiperimg" src="https://wx.qlogo.cn/mmopen/vi_32/GY0ZvN3sdDsic3MyuFVfmnu9buGSH0EfMhjD8wsH9QwtcQQYQCkAew6xwgPqsmmEbc0456rY7o5gPiah5rrL4ySA/132" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
+            <swiper
+                style="height: 145px"
+                current="{{swiperIndex}}"
+            >
+                <swiper-item wx:for="{{params.banner}}" wx:key="{{index}}">
+                    <image class="proswiperimg" src="{{filter.imagify(item)}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
                 </swiper-item>
             </swiper>
-            <view class="arrowcircleleftbox" hover-class="none" hover-stop-propagation="false">
+            <view class="arrowcircleleftbox" bindtap="goBack" wx:if="{{params.banner.length > 0 && swiperIndex != 0}}" hover-class="none" hover-stop-propagation="false">
                 <image class="arrowcircleleft" src="{{localImageRoot}}2b/scoremgt/arrowcircleleft.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
             </view>
-            <view class="arrowcirclerightbox" hover-class="none" hover-stop-propagation="false">
+            <view class="arrowcirclerightbox" bindtap="goPre" wx:if="{{params.banner.length > 0 && swiperIndex != (params.banner.length - 1)}}" hover-class="none" hover-stop-propagation="false">
                 <image class="arrowcircleright" src="{{localImageRoot}}2b/scoremgt/arrowcircleright.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
             </view>
-            <view class="uploadiconbox" hover-class="none" hover-stop-propagation="false">
+            <view class="uploadiconbox" hover-class="none" hover-stop-propagation="false" bindtap="proMainImgUpload" data-type="swiperImg">
                 <image class="uploadicon" src="{{localImageRoot}}2b/scoremgt/uploadiconwhite.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload=""></image>
                 <text class="addimgtext" selectable="false" space="false" decode="false">添加图片</text>
                 <text class="advicesize" selectable="false" space="false" decode="false">建议尺寸：750*310             3/4</text>
@@ -49,26 +62,26 @@
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">奖品标题</view>
         <view class="prizetitle" hover-class="none" hover-stop-propagation="false">
-            <textarea placeholder="请输入奖品标题"></textarea>
-            <view class="textcount" hover-class="none" hover-stop-propagation="false">1/25</view>
+            <textarea placeholder="请输入奖品标题" value="{{params.title}}" bindinput="titleInput"></textarea>
+            <view class="textcount" hover-class="none" hover-stop-propagation="false">{{params.title.length}}/25</view>
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">积分价格</view>
         <view class="prostatic" hover-class="none" hover-stop-propagation="false">
             <text class="text" selectable="false" space="false" decode="false">兑换该商品需要</text>
-            <input type="number" class="staticinput" value="2000" />
+            <input type="number" class="staticinput" value="{{params.price}}" bindinput="priceInput"/>
             <text class="text" selectable="false" space="false" decode="false">积分</text>
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">库存</view>
         <view class="prostatic" hover-class="none" hover-stop-propagation="false">
             <text class="text" selectable="false" space="false" decode="false">该奖品数量</text>
-            <input type="number" class="staticinput" value="2000"/>
+            <input type="number" class="staticinput" value="{{params.inventory}}" bindinput="inventoryInput"/>
             <text class="text" selectable="false" space="false" decode="false">件</text>
         </view>
         <view class="title" hover-class="none" hover-stop-propagation="false">其他说明</view>
         <view class="prizetitle prizedesc" hover-class="none" hover-stop-propagation="false">
-            <textarea auto-height placeholder="说明一些特殊情况：例如 兑奖规则，奖品情况等"></textarea>
+            <textarea auto-height placeholder="说明一些特殊情况：例如 兑奖规则，奖品情况等"  bindinput="remarkInput" value="{{params.remark}}"></textarea>
             <view class="textcount" hover-class="none" hover-stop-propagation="false">1/100</view>
         </view>
     </view>
-    <view class="submitbtn" hover-class="none" hover-stop-propagation="false">上架</view>
+    <view class="submitbtn" hover-class="none" hover-stop-propagation="false" bindtap="publish">上架</view>
 </view>

business/pages/scoreproedit/proeditor.wxss

@@ -189,4 +189,16 @@
 .arrowcircleright {
     width: 45rpx;
     height: 45rpx;
+}
+.cropperoperate {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    position: fixed;
+    z-index: 400;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    color: #fff;
+    height: 200rpx;
 }
\ No newline at end of file

components/imagecropper/index.json

+{
+  "component": true
+}
\ No newline at end of file

components/imagecropper/index.wxml

+  <view class='image-cropper'>
+    <view class='main' bindtouchend="_cutTouchEnd" bindtouchstart="_cutTouchStart" bindtouchmove="_cutTouchMove" bindtap="_click">
+      <view class='content'>
+        <view class='content_top bg_gray {{_flag_bright?"":"bg_black"}}' style="height:{{cut_top}}px;transition-property:{{_cut_animation?'':'background'}}"></view>
+        <view class='content_middle' style="height:{{height}}px;">
+          <view class='content_middle_left bg_gray {{_flag_bright?"":"bg_black"}}' style="width:{{cut_left}}px;transition-property:{{_cut_animation?'':'background'}}"></view>
+          <view class='content_middle_middle' style="width:{{width}}px;height:{{height}}px;transition-duration: .3s;transition-property:{{_cut_animation?'':'background'}};">
+            <view class="border border-top-left"></view>
+            <view class="border border-top-right"></view>
+            <view class="border border-right-top"></view>
+            <view class="border border-right-bottom"></view>
+            <view class="border border-bottom-right"></view>
+            <view class="border border-bottom-left"></view>
+            <view class="border border-left-bottom"></view>
+            <view class="border border-left-top"></view>
+          </view>
+          <view class='content_middle_right bg_gray {{_flag_bright?"":"bg_black"}}' style="transition-property:{{_cut_animation?'':'background'}}"></view>
+        </view>
+        <view class='content_bottom bg_gray {{_flag_bright?"":"bg_black"}}' style="transition-property:{{_cut_animation?'':'background'}}"></view>
+      </view>
+      <image bindload="imageLoad" bindtouchstart="_start" bindtouchmove="_move" bindtouchend="_end" style="width:{{img_width ? img_width + 'px' : 'auto'}};height:{{img_height ? img_height + 'px' : 'auto'}};transform:translate3d({{_img_left-img_width/2}}px,{{_img_top-img_height/2}}px,0) scale({{scale}}) rotate({{angle}}deg);transition-duration:{{_cut_animation?.4:0}}s;" class='img' src='{{imgSrc}}'></image>
+    </view>
+    <canvas canvas-id='image-cropper' disable-scroll="true" style="width:{{_canvas_width * export_scale}}px;height:{{_canvas_height * export_scale}}px;left:{{canvas_left}}px;top:{{canvas_top}}px" class='image-cropper-canvas'></canvas>
+  </view>

components/imagecropper/index.wxss

+.image-cropper{
+  background:rgba(14, 13, 13,.8);
+  position: fixed;
+  top:0;
+  left:0;
+  width:100vw;
+  height:100vh;
+  z-index: 300;
+}
+.main{
+  position: absolute;
+  width:100vw;
+  height:100vh;
+  overflow: hidden;
+}
+.content{
+  z-index: 9;
+  position: absolute;
+  width:100vw;
+  height:100vh;
+  display: flex;
+  flex-direction:column;
+  pointer-events:none;
+}
+.bg_black{
+  background: rgba(0, 0, 0, 0.8)!important;
+}
+.bg_gray{
+  background: rgba(0, 0, 0, 0.45);
+  transition-duration: .35s;
+}
+.content>.content_top{
+  pointer-events:none;
+}
+.content>.content_middle{
+  display: flex;
+  height: 200px;
+  width:100%;
+}
+.content_middle_middle{
+  width:200px;
+  box-sizing:border-box;
+  position: relative;
+  transition-duration: .3s;
+}
+.content_middle_right{
+  flex: auto;
+}
+.content>.content_bottom{
+  flex: auto;
+}
+.image-cropper .img{
+  z-index: 2;
+  top:0;
+  left:0;
+  position: absolute;
+  border:none;
+  width:100%;
+  backface-visibility: hidden;
+  transform-origin:center;
+}
+.image-cropper-canvas{
+  position: fixed;
+  background: white;
+  width:150px;
+  height:150px;
+  z-index: 10;
+  top:-200%;
+  pointer-events:none;
+}
+.border{
+  background: white;
+  pointer-events:auto;
+  position:absolute;
+}
+.border-top-left{
+  left:-2.5px;
+  top:-2.5px;
+  height:2.5px;
+  width:33rpx;
+}
+.border-top-right{
+  right:-2.5px;
+  top:-2.5px;
+  height:2.5px;
+  width:33rpx;
+}
+.border-right-top{
+  top:-1px;
+  width:2.5px;
+  height:30rpx;
+  right:-2.5px;
+}
+.border-right-bottom{
+  width:2.5px;
+  height:30rpx;
+  right:-2.5px;
+  bottom:-1px;
+}
+.border-bottom-left{
+  height:2.5px;
+  width:33rpx;
+  bottom:-2.5px;
+  left:-2.5px;
+}
+.border-bottom-right{
+  height:2.5px;
+  width:33rpx;
+  bottom:-2.5px;
+  right:-2.5px;
+}
+.border-left-top{
+  top:-1px;
+  width:2.5px;
+  height:30rpx;
+  left:-2.5px;
+}
+.border-left-bottom{
+  width:2.5px;
+  height:30rpx;
+  left:-2.5px;
+  bottom:-1px;
+}
\ No newline at end of file

constants/api.js

@@ -137,7 +137,10 @@ const apis = {
 		integral: {
 			integralRulesAdd:	`${api}member/integral_rules/store`,
 			integralRulesShow: `${api}member/integral_rules/show`,
-			integralRulesUpdate: `${api}member/integral_rules/update`
+			integralRulesUpdate: `${api}member/integral_rules/update`,
+			goodsAdd: `${api}member/integral_goods/store`,
+			goodsUpdate: `${api}member/integral_goods/update`,
+			goodsShow: `${api}member/integral_goods/show`
 		},
     teachermgt: {
       teachersList: `${api}member/teachers`,

service/business/integral.js

@@ -32,8 +32,38 @@ function integralRulesUpdate (data) {
 		errorresolve: 1,
 	})
 }
+function goodsAdd (data) {
+	return wxRequest({
+		role: '2b',
+		url: apis.business.integral.goodsAdd,
+		data,
+		method: 'POST',
+		errorresolve: 1,
+	})
+}
+function goodsUpdate (data) {
+	return wxRequest({
+		role: '2b',
+		url: apis.business.integral.goodsUpdate + '/' + data.id,
+		data,
+		method: 'PUT',
+		errorresolve: 1,
+	})
+}
+function goodsShow (data) {
+	return wxRequest({
+		role: '2b',
+		url: apis.business.integral.goodsShow,
+		data,
+		method: 'GET',
+		errorresolve: 1,
+	})
+}
 export {
 	integralRulesAdd,
 	integralRulesShow,
-	integralRulesUpdate
+	integralRulesUpdate,
+	goodsAdd,
+	goodsUpdate,
+	goodsShow
 }
\ No newline at end of file

wecropper/we-cropper.wxml

+<template name="we-cropper">
+  <canvas
+    class="cropper"
+    disable-scroll="true"
+    bindtouchstart="touchStart"
+    bindtouchmove="touchMove"
+    bindtouchend="touchEnd"
+    style="width:{{width}}px;height:{{height}}px;background-color: rgba(0, 0, 0, 0.8)"
+    canvas-id="{{id}}">
+  </canvas>
+  <canvas
+    class="cropper"
+    disable-scroll="true"
+    style="position: fixed; top: -{{width * pixelRatio}}px; left: -{{height * pixelRatio}}px; width:{{width * pixelRatio}}px;height:{{height * pixelRatio}}px;"
+    canvas-id="{{targetId}}">
+  </canvas>
+</template>
\ No newline at end of file