feat 添加申请开店

app.json

@@ -9,6 +9,7 @@
     "pages/usercenter/address/list/index",
     "pages/usercenter/address/edit/index",
     "pages/usercenter/set/index",
+    "pages/usercenter/apply-shop/index",
     "pages/goods/list/index",
     "pages/goods/details/index",
     "pages/goods/category/index",

components/upload/index.js

@@ -0,0 +1,110 @@
+// components/upload/index.js
+Component({
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    mediaType: {
+      type: Array,
+      value: ['image'],
+    },
+    max: {
+      type: Number,
+      value: 1,
+    },
+    lable: {
+      type: String,
+      value: "",
+    },
+    fileList: {
+      type: Array,
+      value: [],
+    },
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    fileList: []
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    // 子组件中触发自定义事件并传递数据
+    // triggerEventToParent() {
+    //   const dataToPass = this.data.fileList; // 获取要传递的值
+    //   this.triggerEvent('customEvent', dataToPass); // 触发自定义事件，并传递值
+    // },
+
+    handleAdd(e) {
+      console.log(111);
+
+      const {
+        fileList
+      } = this.data;
+      const {
+        files
+      } = e.detail;
+
+      // 方法1：选择完所有图片之后，统一上传，因此选择完就直接展示
+      // this.setData({
+      //   fileList: [...fileList, ...files], // 此时设置了 fileList 之后才会展示选择的图片
+      // });
+
+      // 方法2：每次选择图片都上传，展示每次上传图片的进度
+      files.forEach(file => this.onUpload(file))
+    },
+    onUpload(file) {
+      const {
+        fileList
+      } = this.data;
+
+      this.setData({
+        fileList: [...fileList, {
+          ...file,
+          status: 'loading'
+        }],
+      });
+      const {
+        length
+      } = fileList;
+
+      const task = wx.uploadFile({
+        url: 'http://192.168.1.102:8888/api/Common/UploadFile', // 仅为示例，非真实的接口地址
+        filePath: file.url,
+        name: 'file',
+        formData: {
+          fileDir: 'Shops'
+        },
+        success: (res) => {
+          this.setData({
+            [`fileList[${length}].url`]: JSON.parse(res.data).data.url,
+            [`fileList[${length}].status`]: 'done',
+          });
+          // this.triggerEventToParent()
+        },
+      });
+      task.onProgressUpdate((res) => {
+        this.setData({
+          [`fileList[${length}].percent`]: res.progress,
+        });
+      });
+    },
+    handleRemove(e) {
+      const {
+        index
+      } = e.detail;
+      const {
+        fileList
+      } = this.data;
+
+      fileList.splice(index, 1);
+      this.setData({
+        fileList,
+      });
+    },
+  }
+})

components/upload/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "t-upload": "tdesign-miniprogram/upload/upload"
+  }
+}

components/upload/index.wxml

@@ -0,0 +1,12 @@
+<!-- 上传组件 -->
+<view class="wrapper">
+    <view class="wrapper-title">{{lable}}</view>
+    <t-upload
+      mediaType="{{mediaType}}"
+      max="{{max}}"
+      files="{{fileList}}"
+      bind:add="handleAdd"
+      bind:remove="handleRemove"
+    >
+    </t-upload>
+  </view>

components/upload/index.wxss

@@ -0,0 +1,19 @@
+/* components/upload/index.wxss */
+.wrapper{
+  padding: 50rpx 30rpx;
+  border-bottom: 1px solid #f3f3f3;
+}
+
+.wrapper-title{
+  font-size: 32rpx;
+  margin-left: 5rpx;
+  margin-bottom: 30rpx;
+}
+
+.sub-btn-pos-box{
+  width: 100%;
+  padding: 50rpx 0 100rpx 0;
+  position: fixed;
+  bottom: 0;
+  background-color: white;
+}

pages/usercenter/apply-shop/index.js

@@ -0,0 +1,79 @@
+// pages/usercenter/apply-shop/index.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    logo: [],
+
+  },
+
+  submit(){
+    console.log(this.data.logo);
+  },
+
+  onCustomEvent(event) {
+    // console.log(event.detail,"获取子组件传递的值");
+    // const receivedData = event.detail; // 获取子组件传递的值
+    // this.setData({
+    //   fileList: receivedData // 将子组件传递的值绑定到父组件的 data 属性 fileList 上
+    // });
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/usercenter/apply-shop/index.json

@@ -0,0 +1,10 @@
+{
+  "usingComponents": {
+    "t-input": "tdesign-miniprogram/input/input",
+    "t-textarea": "tdesign-miniprogram/textarea/textarea",
+    "upload": "/components/upload/index",
+    "t-button": "tdesign-miniprogram/button/button",
+    "van-button": "@vant/weapp/button/index"
+  },
+  "navigationBarTitleText": "申请开店"
+}

pages/usercenter/apply-shop/index.wxml

@@ -0,0 +1,38 @@
+<!-- 申请开店 -->
+
+<view class="apply-shop-container">
+
+  <t-input value="{{shopInfo.ShopBusinessCategoryGuid}}" label="经营类目" maxlength="10"  placeholder="请输入店铺名称" align="right" />
+  <t-input value="{{shopInfo.ShopName}}" label="店铺名称" maxlength="10"  placeholder="请输入店铺名称" align="right" />
+  <t-textarea
+    value="{{shopInfo.ShopIntro}}"
+    t-class="external-class"
+    label="店铺简介"
+    placeholder="设置最大字符个数"
+    maxlength="50"
+    disableDefaultPadding="{{true}}"
+    indicator
+  />
+
+  <!-- <view class="wrapper">
+    <view class="wrapper-title">店铺Logo</view>
+    <t-upload
+      mediaType="{{['image']}}"
+      max="{{1}}"
+      files="{{fileList}}"
+      bind:add="handleAdd"
+      bind:remove="handleRemove"
+    >
+    </t-upload>
+  </view> -->
+
+  <upload lable="店铺Logo" fileList="{{logo}}" ></upload>
+
+  <!-- 提交按钮 -->
+  <view class="sub-btn-pos-box">   
+    <view class="sub-btn-box">
+      <van-button class="sub-btn" type="info" size="large" round block bind:click="submit">提交</van-button>
+    </view>
+  </view>
+
+</view>

pages/usercenter/apply-shop/index.wxss

@@ -0,0 +1,30 @@
+/* pages/usercenter/apply-shop/index.wxss */
+
+.external-class{
+  height: 300rpx;
+  border-bottom: 1px solid #f3f3f3;
+}
+
+.wrapper{
+  padding: 50rpx 30rpx;
+  border-bottom: 1px solid #f3f3f3;
+}
+
+.wrapper-title{
+  font-size: 32rpx;
+  margin-left: 5rpx;
+  margin-bottom: 30rpx;
+}
+
+.sub-btn-pos-box{
+  width: 100%;
+  padding: 50rpx 0 100rpx 0;
+  position: fixed;
+  bottom: 0;
+  background-color: white;
+}
+
+.sub-btn-box{
+  width: 90%;
+  margin: 0 auto;
+}

pages/usercenter/index.js

@@ -3,6 +3,12 @@ import Toast from 'tdesign-miniprogram/toast/index';
 
 const menuData = [
   [
+    {
+      title: '申请开店',
+      tit: '',
+      url: '',
+      type: 'apply-shop',
+    },
     {
       title: '收货地址',
       tit: '',
@@ -156,6 +162,10 @@ Page({
     const { type } = currentTarget.dataset;
 
     switch (type) {
+      case 'apply-shop': {
+        wx.navigateTo({ url: '/pages/usercenter/apply-shop/index' });
+        break;
+      }
       case 'address': {
         wx.navigateTo({ url: '/pages/usercenter/address/list/index' });
         break;