review：【antd】【mp】material、message 的迁移 v1

apps/web-antd/src/views/mp/components/wx-reply/components/TabImage.vue

@@ -13,6 +13,8 @@ import { Button, Col, message, Modal, Row, Upload } from 'ant-design-vue';
 import { WxMaterialSelect } from '#/views/mp/components/wx-material-select';
 import { UploadType, useBeforeUpload } from '#/views/mp/hooks/useUpload';
 
+// TODO @dylan：文件名的大小写
+
 defineOptions({ name: 'TabImage' });
 
 const props = defineProps<{
@@ -45,7 +47,7 @@ function beforeImageUpload(rawFile: UploadRawFile) {
   return useBeforeUpload(UploadType.Image, 2)(rawFile);
 }
 
-// 自定义上传请求
+/** 自定义上传请求 */
 async function customRequest(options: any) {
   const { file, onSuccess, onError } = options;
 
@@ -165,6 +167,7 @@ function selectMaterial(item: any) {
 </template>
 
 <style lang="scss" scoped>
+/** TODO @dylan：看看有没适合 tindwind 的哈。 */
 .select-item {
   width: 280px;
   padding: 10px;

apps/web-antd/src/views/mp/components/wx-reply/components/TabMusic.vue

@@ -21,6 +21,8 @@ import {
 import { WxMaterialSelect } from '#/views/mp/components/wx-material-select';
 import { UploadType, useBeforeUpload } from '#/views/mp/hooks/useUpload';
 
+// TODO @dylan：文件名的大小写
+
 defineOptions({ name: 'TabMusic' });
 
 const props = defineProps<{
@@ -53,7 +55,7 @@ function beforeImageUpload(rawFile: UploadRawFile) {
   return useBeforeUpload(UploadType.Image, 2)(rawFile);
 }
 
-// 自定义上传请求
+/** 自定义上传请求 */
 async function customRequest(options: any) {
   const { file, onSuccess, onError } = options;
 
@@ -182,6 +184,7 @@ function selectMaterial(item: any) {
 </template>
 
 <style lang="scss" scoped>
+/** TODO @dylan：看看有没适合 tindwind 的哈。 */
 .thumb-container {
   display: flex;
   flex-direction: column;

apps/web-antd/src/views/mp/components/wx-reply/components/TabNews.vue

@@ -12,6 +12,8 @@ import { WxNews } from '#/views/mp/components/wx-news';
 
 import { NewsType } from './types';
 
+// TODO @dylan：文件名的大小写
+
 defineOptions({ name: 'TabNews' });
 
 const props = defineProps<{
@@ -94,6 +96,7 @@ function onDelete() {
 </template>
 
 <style lang="scss" scoped>
+/** TODO @dylan：看看有没适合 tindwind 的哈。 */
 .select-item {
   width: 280px;
   padding: 10px;

apps/web-antd/src/views/mp/components/wx-reply/components/TabText.vue

@@ -3,6 +3,8 @@ import { computed } from 'vue';
 
 import { Textarea } from 'ant-design-vue';
 
+// TODO @dylan：文件名的大小写
+
 const props = defineProps<{
   modelValue?: null | string;
 }>();

apps/web-antd/src/views/mp/components/wx-reply/components/TabVideo.vue

@@ -22,6 +22,8 @@ import { WxMaterialSelect } from '#/views/mp/components/wx-material-select';
 import { WxVideoPlayer } from '#/views/mp/components/wx-video-play';
 import { UploadType, useBeforeUpload } from '#/views/mp/hooks/useUpload';
 
+// TODO @dylan：文件名的大小写
+
 defineOptions({ name: 'TabVideo' });
 
 const props = defineProps<{
@@ -54,7 +56,7 @@ function beforeVideoUpload(rawFile: UploadRawFile) {
   return useBeforeUpload(UploadType.Video, 10)(rawFile);
 }
 
-// 自定义上传请求
+/** 自定义上传请求 */
 async function customRequest(options: any) {
   const { file, onSuccess, onError } = options;
 
@@ -184,6 +186,7 @@ function selectMaterial(item: any) {
 </template>
 
 <style lang="scss" scoped>
+/** TODO @dylan：看看有没适合 tindwind 的哈。 */
 .ope-row {
   width: 100%;
   padding-top: 10px;

apps/web-antd/src/views/mp/components/wx-reply/components/TabVoice.vue

@@ -14,6 +14,8 @@ import { WxMaterialSelect } from '#/views/mp/components/wx-material-select';
 import { WxVoicePlayer } from '#/views/mp/components/wx-voice-play';
 import { UploadType, useBeforeUpload } from '#/views/mp/hooks/useUpload';
 
+// TODO @dylan：文件名的大小写
+
 defineOptions({ name: 'TabVoice' });
 
 const props = defineProps<{
@@ -46,7 +48,7 @@ function beforeVoiceUpload(rawFile: UploadRawFile) {
   return useBeforeUpload(UploadType.Voice, 10)(rawFile);
 }
 
-// 自定义上传请求
+/** 自定义上传请求 */
 async function customRequest(options: any) {
   const { file, onSuccess, onError } = options;
 
@@ -166,6 +168,7 @@ function selectMaterial(item: Reply) {
 </template>
 
 <style lang="scss" scoped>
+/** TODO @dylan：看看有没适合 tindwind 的哈。 */
 .select-item {
   padding: 10px;
   margin: 0 auto 10px;

apps/web-antd/src/views/mp/components/wx-reply/main.vue

@@ -37,14 +37,14 @@ interface Props {
   modelValue: Reply;
   newsType?: NewsType;
 }
+
 const reply = computed<Reply>({
   get: () => props.modelValue,
   set: (val) => emit('update:modelValue', val),
 });
-// 作为多个标签保存各自Reply的缓存
-const tabCache = new Map<ReplyType, Reply>();
-// 采用独立的ref来保存当前tab，避免在watch标签变化，对reply进行赋值会产生了循环调用
-const currentTab = ref<ReplyType>(props.modelValue.type || ReplyType.Text);
+
+const tabCache = new Map<ReplyType, Reply>(); // 作为多个标签保存各自 Reply 的缓存
+const currentTab = ref<ReplyType>(props.modelValue.type || ReplyType.Text); // 采用独立的 ref 来保存当前 tab，避免在 watch 标签变化，对 reply 进行赋值会产生了循环调用
 
 watch(
   currentTab,
@@ -153,6 +153,7 @@ defineExpose({
 </template>
 
 <style lang="scss" scoped>
+/** TODO @dylan：看看有没适合 tindwind 的哈。 */
 .select-item {
   width: 280px;
   padding: 10px;