Просмотр исходного кода

将 舌面象上传 页面改成 弹窗组件

cc12458 5 месяцев назад
Родитель
Сommit
eea8178e49

+ 1 - 1
miniprogram/app.json

@@ -4,7 +4,7 @@
     {
       "name": "chats",
       "root": "module/chats",
-      "pages": ["pages/index/index", "pages/analysis/analysis"]
+      "pages": ["pages/index/index"]
     },
     {
       "name": "health",

+ 1 - 3
miniprogram/module/chats/pages/analysis/analysis.json → miniprogram/module/chats/components/guide-analysis/guide-analysis.json

@@ -1,9 +1,7 @@
 {
-  "renderer": "skyline",
   "component": true,
-  "pureDataPattern": "^_",
   "usingComponents": {
-    "t-navbar": "/components/navigation-bar/navigation-bar",
+    "t-popup": "tdesign-miniprogram/popup/popup",
     "t-cell": "/miniprogram_npm/tdesign-miniprogram/cell/cell",
     "t-icon": "/miniprogram_npm/tdesign-miniprogram/icon/icon",
     "t-loading": "/miniprogram_npm/tdesign-miniprogram/loading/loading",

+ 46 - 3
miniprogram/module/chats/pages/analysis/analysis.scss → miniprogram/module/chats/components/guide-analysis/guide-analysis.scss

@@ -1,10 +1,53 @@
+/* module/chats/components/guide-analysis/guide-analysis.wxss */
 @import '../../../../themes/page.scss';
 
-/* module/chats/pages/analysis/analysis.wxss */
-.page-scroll__container {
-  flex: 0 1 auto;
+.guide-analysis {
+  display: flex;
+  flex-direction: column;
+  width: 100vw;
   height: var(--page-container-safeHeight, 100vh);
+  background: var(--td-bg-color-container);
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+
+  .header-container {
+    flex: none;
+  }
+
+  .content-container {
+    flex: auto;
+  }
+}
+
+.header-container {
+  display: flex;
+  align-items: center;
+  height: 116rpx;
+
+  .title {
+    flex: 1;
+    text-align: center;
+    font-weight: 600;
+    font-size: 36rpx;
+    color: var(--td-text-color-primary);
+  }
 
+  .btn {
+    font-size: 32rpx;
+    padding: 32rpx;
+  }
+
+  .btn--cancel {
+    color: var(--td-text-color-secondary);
+  }
+
+  .btn--confirm {
+    color: #0052d9;
+  }
+}
+
+.page-scroll__container {
+  flex: 0 1 auto;
   padding-top: 12px;
   background-color: #F5F6F7;
 }

+ 114 - 0
miniprogram/module/chats/components/guide-analysis/guide-analysis.ts

@@ -0,0 +1,114 @@
+// module/chats/components/guide-analysis/guide-analysis.ts
+import PageContainerBehavior from "../../../../core/behavior/page-container.behavior";
+import { upload } from "../../../../lib/request/upload";
+Component({
+  behaviors: [PageContainerBehavior],
+  properties: {
+    visible: { type: Boolean, value: false },
+  },
+  data: {
+    uploadList: [
+      {
+        target: "tongueImgUrl",
+        required: true,
+        label: "舌面图",
+        src: "../../assets/tongue-1.png",
+      },
+      {
+        target: "tongueBackImgUrl",
+        required: true,
+        label: "舌下图",
+        src: "../../assets/tongue-2.png",
+      },
+      {
+        target: "faceImgUrl",
+        required: false,
+        label: "正面面部图",
+        src: "../../assets/face-1.png",
+      },
+    ],
+    thumbnail: [] as string[],
+    original: [] as string[],
+
+    _queue: {} as AnyObject,
+  },
+  methods: {
+    handle(event: WechatMiniprogram.TouchEvent) {
+      const { handle, index } = event.mark as AnyObject;
+      switch (handle) {
+        case "preview":
+          break;
+        case "upload":
+          this._chooseMedia(index).then((src) => src && this._uploadMedia(index, src));
+          break;
+        case "upload:delete":
+          this._deleteMedia(index);
+          break;
+      }
+    },
+    _chooseMedia(index: number) {
+      return wx.chooseMedia({
+        count: 1,
+        mediaType: ["image"],
+        sourceType: ["album", "camera"],
+        camera: "front",
+      }).then((res) => {
+        const src = res.tempFiles[0].tempFilePath;
+        this.setData({ [`thumbnail.${index}`]: src });
+        return src;
+      }).catch(() => null);
+    },
+    _deleteMedia(index: number) {
+      this.setData({
+        [`thumbnail.${index}`]: "",
+        [`original.${index}`]: "",
+      });
+    },
+    _uploadMedia(index: number, src?: string) {
+      this.setData({ [`_queue.${index}`]: true });
+      src ??= this.data.thumbnail[index];
+      upload({
+        params: { name: "file", file: src! },
+        transform({ data }) {
+          return (<any>data).url;
+        },
+      }).then(
+        (src) => {
+          this.setData({ [`original.${index}`]: src });
+        },
+        (error) => {
+          wx.showToast({ title: error?.errMsg ?? "上传失败", icon: "error" });
+          this.setData({
+            [`thumbnail.${index}`]: "",
+            [`original.${index}`]: "",
+          });
+        }
+      ).then(() => {
+        this.setData({ [`_queue.${index}`]: false });
+      });
+    },
+    onCancel() {
+      this.triggerEvent('stop');
+    },
+    onSubmit() {
+      const data = {
+        thumbnail: [] as any,
+        source: [] as any,
+      };
+      for (let index = 0; index < this.data.uploadList.length; index++) {
+        const item = this.data.uploadList[index];
+        if (this.data._queue[index]) return wx.showToast({ title: `请等待图片上传完毕`, icon: 'none' });
+        if (item.required && !this.data.original[index]) return wx.showToast({ title: `请上传${item.label}`, icon: 'none' });
+        if (this.data.original[index]) data.source.push({
+          target: item.target,
+          src: this.data.original[index],
+        });
+        if (this.data.thumbnail[index]) data.thumbnail.push({
+          target: item.target,
+          src: this.data.thumbnail[index],
+        });
+      }
+      this.triggerEvent('stop', data);
+    }
+  },
+})

+ 50 - 0
miniprogram/module/chats/components/guide-analysis/guide-analysis.wxml

@@ -0,0 +1,50 @@
+<!--module/chats/components/guide-analysis/guide-analysis.wxml-->
+<t-popup visible="{{visible}}" t-class="wrapper" usingCustomNavbar bind:visible-change="onVisibleChange" placement="bottom">
+  <view class="guide-analysis" style="{{containerStyle}}">
+    <view class="header-container">
+      <view class="btn btn--cancel" aria-role="button" bind:tap="onCancel">取消</view>
+      <view class="title">舌面象上传</view>
+      <view class="btn btn--confirm" aria-role="button" bind:tap="onSubmit">提交</view>
+    </view>
+    <scroll-view class="content-container page-scroll__container" type="list" scroll-y>
+      <t-cell title="拍摄注意事项" required bordered="{{false}}">
+        <view slot="description">
+          <view style="margin: 8px 0px 8px 0px;color:black;">光线:</view>
+          <view>白天充足、柔和的自然光线下效果最佳,避免背光、偏暗、曝光。</view>
+          <view style="margin: 8px 0px 8px 0px;color:black;">禁忌:</view>
+          <view>不要在食用有色饮食或药物后、有色光源下、早晨起床时、饭后半小时内拍摄舌象。</view>
+          <view>不要带妆拍摄面部图片。</view>
+        </view>
+      </t-cell>
+      <view class="upload-card" wx:for="{{uploadList}}" wx:key="{{item.target}}" mark:index="{{index}}" mark:target="{{item.target}}" bind:tap="handle">
+        <view class="upload-card__header">
+          <text>{{item.label}}上传</text>
+          <text wx:if="{{item.required}}" style="color: #D54941;">(必传)</text>
+        </view>
+        <view class="upload-card__content">
+          <view class="row">
+            <image class="col example" mark:handle="preview" src="{{item.src}}" mode="aspectFit" />
+            <image wx:if="{{thumbnail[index]}}" class="col picture" mark:handle="preview:thumbnail" src="{{thumbnail[index]}}" mode="aspectFit"></image>
+            <!-- <image wx:elif="{{original[index]}}" class="col picture" mark:handle="preview:original" src="{{original[index]}}" mode="aspectFit"></image> -->
+            <image wx:else class="col picture" mark:handle="upload" src="../../assets/upload-picture.bg.png" mode="aspectFit" />
+          </view>
+          <view class="row">
+            <view class="col">示例</view>
+            <view class="col">
+              <text>(上传)</text>
+              <block wx:if="{{thumbnail[index]}}">
+                <t-icon wx:if="{{original[index]}}" style="color: #D54941;" name="delete-1" mark:handle="upload:delete" />
+                <t-loading wx:else="" theme="spinner" size="40rpx" class="wrapper" />
+              </block>
+            </view>
+          </view>
+        </view>
+      </view>
+
+
+      <form bind:submit="onSubmit">
+        <form-button block index="1" loading="{{submitting}}" disableOnClick="{{false}}">提交</form-button>
+      </form>
+    </scroll-view>
+  </view>
+</t-popup>

+ 1 - 0
miniprogram/module/chats/components/message-analysis/message-analysis.json

@@ -5,6 +5,7 @@
   "usingComponents": {
     "t-cell": "tdesign-miniprogram/cell/cell",
     "t-loading": "tdesign-miniprogram/loading/loading",
+    "analysis": "../guide-analysis/guide-analysis",
     "user-avatar": "../../../../components/user-avatar/user-avatar"
   }
 }

+ 46 - 12
miniprogram/module/chats/components/message-analysis/message-analysis.ts

@@ -1,3 +1,5 @@
+import { Post } from "../../../../lib/request/method";
+
 interface Gallery {
   label?: string;
   src: string;
@@ -24,6 +26,7 @@ Component({
   },
   data: {
     isAnalysis: 0,
+    start: false,
     examples: [
       { label: '舌面举例', src: '../../assets/tongue-1.png' },
       { label: '舌下举例', src: '../../assets/tongue-2.png' },
@@ -31,28 +34,59 @@ Component({
     ] as Gallery[],
     source: [] as Gallery[],
   },
-attached(){
-  this.setData({
-    isAnalysis: wx.getStorageSync("isAnalysis"),
-  });
-  
-},
+  attached() {
+    this.setData({
+      isAnalysis: wx.getStorageSync("isAnalysis"),
+    });
+  },
   /**
    * 组件的方法列表
    */
   methods: {
     onConfirm() {
       if (this.data.source.length) return;
-      wx.navigateTo({
-        url: '/module/chats/pages/analysis/analysis?messageType=' + this.data.messageType,
-        events: { update: (data: Result) => this._update(data) }
-      });
+      this.setData({ start: true });
+      // wx.navigateTo({
+      //   url: '/module/chats/pages/analysis/analysis?messageType=' + this.data.messageType,
+      //   events: { update: (data: Result) => this._update(data) }
+      // });
     },
     onCancel() {
       this.triggerEvent('next', defaultGallery);
     },
-
-    _update({source, thumbnail}:Result) {
+    async onUpdate(event) {
+      this.setData({ start: false });
+      if (event.detail) {
+        await this._followUp(event.detail);
+        this._update(event.detail);
+      }
+    },
+    // 提交随访提醒
+    async _followUp({ source, thumbnail }: Result) {
+      const data = {} as AnyObject;
+      for (const item of source) { data[item.target] = item.src; }
+      if (this.data.messageType === 2 && this.data.isAnalysis === 2) {
+        wx.showLoading({ title: '提交中', mask: true });
+        try {
+          const workId = wx.getStorageSync("workId") || 0;
+          const followObj = wx.getStorageSync("followObj");
+          const res = await Post(
+            `/followupTaskManage/updateFollowupTaskFillin/${workId}`,
+            { ...followObj, upImg: data.tongueImgUrl, downImg: data.tongueBackImgUrl, faceImg: data.faceImgUrl },
+            { transform({ data }: any) { return data; }, }
+          );
+          // 存储舌面象分析报告id,用于跳转页面时最后产生结果查看
+          wx.setStorageSync("tonguefaceAnalysisReportId", res.tonguefaceAnalysisReportId);
+          wx.hideLoading();
+        } catch (error) {
+          wx.hideLoading();
+          wx.showToast({ title: error?.errMsg ?? '提交失败', icon: 'none', duration: 3000 });
+          this.setData({ start: true });
+          throw error;
+        }
+      }
+    },
+    _update({ source, thumbnail }: Result) {
       this.setData({ source: thumbnail });
       const data = {} as AnyObject;
       for (const item of source) { data[item.target] = item.src; }

+ 3 - 1
miniprogram/module/chats/components/message-analysis/message-analysis.wxml

@@ -38,4 +38,6 @@
     </view>
   </view>
   <t-loading wx:if="{{active && isAnalysis===3}}" t-class="loading" theme="spinner" size="40rpx" class="wrapper" />
-</view>
+</view>
+
+<analysis visible="{{start}}" bind:stop="onUpdate"></analysis>

+ 0 - 229
miniprogram/module/chats/pages/analysis/analysis.ts

@@ -1,229 +0,0 @@
-import PageContainerBehavior from "../../../../core/behavior/page-container.behavior";
-import { upload } from "../../../../lib/request/upload";
-import { Post } from "../../../../lib/request/method";
-
-// module/chats/pages/analysis/analysis.ts
-
-interface IAnalysisData {
-  _lastResetTime: number;
-  uploadList: Array<{
-    target: string;
-    required: boolean;
-    label: string;
-    src: string;
-  }>;
-  thumbnail: string[];
-  original: string[];
-  status: boolean[];
-  _queue: Record<string, any>;
-  activeObj: Record<string, any>;
-  followObj: Record<string, any>;
-  workId: number;
-}
-
-interface IAnalysisProperties {
-  messageType: number;
-}
-
-type IAnalysisInstance = WechatMiniprogram.Component.Instance<
-  IAnalysisData,
-  IAnalysisProperties,
-  {
-    handle(event: WechatMiniprogram.TouchEvent): void;
-    _chooseMedia(index: number): Promise<string | null>;
-    _deleteMedia(index: number): void;
-    _uploadMedia(index: number, src?: string): void;
-    onSubmit(): Promise<void>;
-  }
->;
-
-Component({
-  behaviors: [PageContainerBehavior],
-  options: {},
-  properties: {
-    messageType: { type: Number, value: 0 },
-  },
-  data: {
-    _lastResetTime: 0,
-    uploadList: [
-      {
-        target: "tongueImgUrl",
-        required: true,
-        label: "舌面图",
-        src: "../../assets/tongue-1.png",
-      },
-      {
-        target: "tongueBackImgUrl",
-        required: true,
-        label: "舌下图",
-        src: "../../assets/tongue-2.png",
-      },
-      {
-        target: "faceImgUrl",
-        required: false,
-        label: "正面面部图",
-        src: "../../assets/face-1.png",
-      },
-    ],
-    thumbnail: [] as string[],
-    original: [] as string[],
-    status: [false, false, false],
-    _queue: {} as AnyObject,
-    // 随访上传参数
-    activeObj: {},
-    followObj: {},
-    workId: 0,
-    _submitting: false,
-  },
-  attached() {
-    // 从存储中拿到之前的对话信息
-    this.setData({
-      followObj: wx.getStorageSync("followObj"),
-      workId: wx.getStorageSync("workId"),
-    });
-  },
-  methods: {
-    handle(event: WechatMiniprogram.TouchEvent) {
-      const { handle, index } = event.mark as AnyObject;
-      switch (handle) {
-        case "preview":
-          break;
-        case "upload":
-          this._chooseMedia(index).then(
-            (src) => src && this._uploadMedia(index, src)
-          );
-          break;
-        case "upload:delete":
-          this._deleteMedia(index);
-          break;
-      }
-    },
-    _chooseMedia(index: number) {
-      return wx
-        .chooseMedia({
-          count: 1,
-          mediaType: ["image"],
-          sourceType: ["album", "camera"],
-          camera: "front",
-        })
-        .then((res) => {
-          const src = res.tempFiles[0].tempFilePath;
-          this.setData({ [`thumbnail.${index}`]: src });
-          return src;
-        })
-        .catch(() => null);
-    },
-    _deleteMedia(index: number) {
-      this.setData({
-        [`thumbnail.${index}`]: "",
-        [`original.${index}`]: "",
-      });
-    },
-    _uploadMedia(index: number, src?: string) {
-      this.setData({ [`_queue.${index}`]: true });
-      src ??= this.data.thumbnail[index];
-      upload({
-        params: { name: "file", file: src! },
-        transform({ data }) {
-          return (<any>data).url;
-        },
-      })
-        .then(
-          (src) => {
-            this.setData({ [`original.${index}`]: src });
-          },
-          (error) => {
-            wx.showToast({ title: error?.errMsg ?? "上传失败", icon: "error" });
-            this.setData({
-              [`thumbnail.${index}`]: "",
-              [`original.${index}`]: "",
-            });
-          }
-        )
-        .then(() => {
-          this.setData({ [`_queue.${index}`]: false });
-        });
-    },
-    async onSubmit() {
-      const submitBtn = this.selectComponent('#submitBtn');
-      if (this.data._submitting) return;
-      this.setData({ _submitting: true });
-      const data = {
-        thumbnail: [] as any,
-        source: [] as any,
-      };
-      for (let index = 0; index < this.data.uploadList.length; index++) {
-        const item = this.data.uploadList[index];
-        if (this.data._queue[index]) {
-          console.log('[Analysis] Upload in progress, resetting button');
-          wx.showToast({ title: `请等待图片上传完毕`, icon: "none" });
-          submitBtn?.resetState();
-          this.setData({ _submitting: false });
-          return;
-        } else if (item.required && !this.data.original[index]) {
-          console.log('[Analysis] Missing required image, resetting button');
-          wx.showToast({ title: `请上传${item.label}`, icon: "none" });
-          submitBtn?.resetState();
-          this.setData({ _submitting: false });
-          return;
-        }
-        if (this.data.original[index])
-          data.source.push({
-            target: item.target,
-            src: this.data.original[index],
-          });
-        if (this.data.thumbnail[index])
-          data.thumbnail.push({
-            target: item.target,
-            src: this.data.thumbnail[index],
-          });
-      }
-      let imageObj: any = {
-        upImg: this.data.original[0],
-        downImg: this.data.original[1],
-        faceImg: this.data.original[2],
-      };
-      
-      // console.log(this.data.followObj, "this.data.followObj");
-      this.setData({
-        activeObj: { ...imageObj, ...this.data.followObj },
-      });
-      // console.log({ ...this.data.activeObj }, "activeObj");
-      let isAnalysis: number;
-      if (this.data.messageType === 2) {
-        isAnalysis = wx.getStorageSync("isAnalysis");
-      }
-      // console.log(this.data, "messageType", isAnalysis);
-      if (isAnalysis === 2) {
-        // 提交随访提醒
-        try {
-          const res = await Post(
-            `/followupTaskManage/updateFollowupTaskFillin/${this.data?.workId}`,
-            { ...this.data.activeObj },
-            {
-              transform({ data }: any) {
-                return data;
-              },
-            }
-          );
-          // 存储舌面象分析报告id,用于跳转页面时最后产生结果查看
-          wx.setStorageSync(
-            "tonguefaceAnalysisReportId",
-            res.tonguefaceAnalysisReportId
-          );
-          this.getOpenerEventChannel().emit("update", data);
-          wx.navigateBack();
-        } catch (error) {
-          console.log('[Analysis] Submit failed, resetting button');
-          wx.showToast({ title: error?.errMsg ?? "提交失败", icon: "none" });
-          submitBtn?.resetState();
-          this.setData({ _submitting: false });
-        }
-      } else {
-        // 对话管家
-        this.getOpenerEventChannel().emit("update", data);
-        wx.navigateBack();
-      }
-    },
-  },
-});

+ 0 - 42
miniprogram/module/chats/pages/analysis/analysis.wxml

@@ -1,42 +0,0 @@
-<!--module/chats/pages/analysis/analysis.wxml-->
-<t-navbar title="舌面象上传" left-arrow />
-<scroll-view class="page-scroll__container" type="list" scroll-y style="{{containerStyle}}">
-  <t-cell title="拍摄注意事项" required bordered="{{false}}">
-    <view slot="description">
-      <view style="margin: 8px 0px 8px 0px;color:black;">光线:</view>
-      <view>白天充足、柔和的自然光线下效果最佳,避免背光、偏暗、曝光。</view>
-      <view style="margin: 8px 0px 8px 0px;color:black;">禁忌:</view>
-      <view>不要在食用有色饮食或药物后、有色光源下、早晨起床时、饭后半小时内拍摄舌象。</view>
-      <view>不要带妆拍摄面部图片。</view>
-    </view>
-  </t-cell>
-  <view class="upload-card" wx:for="{{uploadList}}" wx:key="{{item.target}}" mark:index="{{index}}" mark:target="{{item.target}}" bind:tap="handle">
-    <view class="upload-card__header">
-      <text>{{item.label}}上传</text>
-      <text wx:if="{{item.required}}" style="color: #D54941;">(必传)</text>
-    </view>
-    <view class="upload-card__content">
-      <view class="row">
-        <image class="col example" mark:handle="preview" src="{{item.src}}" mode="aspectFit" />
-        <image wx:if="{{thumbnail[index]}}" class="col picture" mark:handle="preview:thumbnail" src="{{thumbnail[index]}}" mode="aspectFit"></image>
-        <!-- <image wx:elif="{{original[index]}}" class="col picture" mark:handle="preview:original" src="{{original[index]}}" mode="aspectFit"></image> -->
-        <image wx:else class="col picture" mark:handle="upload" src="../../assets/upload-picture.bg.png" mode="aspectFit" />
-      </view>
-      <view class="row">
-        <view class="col">示例</view>
-        <view class="col">
-          <text>(上传)</text>
-          <block wx:if="{{thumbnail[index]}}">
-            <t-icon wx:if="{{original[index]}}" style="color: #D54941;" name="delete-1" mark:handle="upload:delete" />
-            <t-loading wx:else="" theme="spinner" size="40rpx" class="wrapper" />
-          </block>
-        </view>
-      </view>
-    </view>
-  </view>
-
-
-  <form bind:submit="onSubmit">
-    <form-button block index="1" id="submitBtn"></form-button>
-  </form>
-</scroll-view>