上传文件至 'hangout-master/asset/components/note'

hangout-master/asset/components/note/note.js

@@ -0,0 +1,61 @@
+// components/note/note.js
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {},
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    pages: [1],
+    path: "",
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    onRet: function () {
+      wx.reLaunch({
+        url: "/Pages/travel/home/home",
+      });
+    },
+
+    insertImg: function (name, path) {
+      let qurey = this.createSelectorQuery();
+      qurey
+        .select(name)
+        .context(function (res) {
+          (this.editorCtx = res.context),
+            this.editorCtx.insertImage({
+              src: path,
+              width: "100rpx",
+              height: "100rpx",
+            });
+        })
+        .exec();
+    },
+
+    insertPic: function () {
+      const name = "#editor" + this.data.pages[this.data.pages.length - 1];
+      let that = this;
+      wx.chooseMedia({
+        count: 10,
+        camera: "back",
+        success(res) {
+          that.insertImg(name, res.tempFiles[0].tempFilePath);
+        },
+      });
+    },
+
+    insertPage: function () {
+      let that = this;
+      const length = that.data.pages.length;
+      that.setData({
+        pages: that.data.pages.concat([length + 1]),
+      });
+    },
+  },
+});

hangout-master/asset/components/note/note.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

hangout-master/asset/components/note/note.wxml

@@ -0,0 +1,26 @@
+<!--components/note/note.wxml-->
+<!--TODO: 插入下一页后，导航栏没有固定在底部-->
+<view style="display: flex;">
+    <image class="navi" src="/asset/img/navi.png" bindtap="onRet"></image>
+
+    <view style="padding: 0;margin: 0;width: 1px;height:700px;background-color:  #7B8B6F;"></view>
+    <view>
+        <view class="note">
+            <view class="title">旅行手札</view>
+        </view>
+        <view wx:for="{{pages}}"  wx:key="*this" wx:for-item="item">
+            <editor class="note-edit" id="editor{{item}}"></editor>
+        </view>
+        <view style="display: flex;">
+            <view bindtap="insertPic">
+                <image src="/asset/img/icon-insimg.png" class="note-img" style="padding-right: 60px; padding-left: 20px;"></image>
+                <view class="note-img-txt" style="left: 30px;">插入图片</view>
+            </view>
+
+            <view bindtap="insertPage">
+                <image src="/asset/img/icon-add.png" class="note-img" style="padding-left: 60px;padding-right: 20px;"></image>
+                <view class="note-img-txt" style="left: 68px;">插入下一页</view>
+            </view>
+        </view>
+    </view>
+</view>

hangout-master/asset/components/note/note.wxss

@@ -0,0 +1,52 @@
+/* components/note/note.wxss */
+.navi{
+    width: 40px;
+    height: 30px;
+    margin: 5px;
+    padding-top: 10px;
+}
+
+.title{
+    position: relative; 
+    top: 20px; 
+    left: 15px;
+    font-size: 22px; 
+    font-weight: 900; 
+    color: #000;
+}
+
+.note {
+    display: block;
+    padding: 0;
+    margin: 0;
+    position: relative;
+    top: -5px;
+  }
+
+.note-edit{
+    background-color: #D8CAAF;
+    width: 450rpx;
+    height: 700rpx;
+    position: relative;
+    padding: 0;
+    margin: 0;
+    top: 100rpx;
+    left: 100rpx;
+}
+
+.note-img{
+    width: 38px;
+    height: 35px;
+    position: relative;
+    top: 100rpx;
+    left: 100rpx;
+    padding-top: 20px;
+    margin: 0;
+}
+
+.note-img-txt{
+    text-align: center;
+    color: #7B8B6F;
+    position: relative;
+    top: 100rpx;
+}