1.1.3

components/alert-tip/alert-tip.js

@@ -0,0 +1,80 @@
+
+Component({
+  properties: {
+    // 提示内容
+    content: {
+      type: String,
+      value: ''
+    },
+    // 容器背景颜色
+    containerbgColor: {
+      type: String,
+      value: '#e3e3e3'
+    },
+    // 背景颜色
+    bgColor: {
+      type: String,
+      value: '#CA4B15'
+    },
+    // 文字颜色
+    textColor: {
+      type: String,
+      value: '#FFFFFF'
+    },
+    // 图标路径
+    iconPath: {
+      type: String,
+      value: '../../pages/images/sysIcon_b11.png'
+    },
+    // 显示时长(毫秒)，显示多久后开始淡出
+    duration: {
+      type: Number,
+      value: 1000
+    },
+    // 淡出动画时长(毫秒)
+    fadeOutDuration: {
+      type: Number,
+      value: 1000
+    }
+  },
+
+  data: {
+    isShow: false,
+    alertClass: ''
+  },
+
+  methods: {
+    // 显示提示
+    showAlert: function(content) {
+      const that = this;
+      
+      // 如果传入了content参数，则更新content属性
+      if (content) {
+        this.setData({
+          content: content
+        });
+      }
+      
+      // 显示提示
+      this.setData({
+        isShow: true,
+        alertClass: ''
+      });
+      
+      // 设置定时器，显示一段时间后开始淡出
+      setTimeout(function() {
+        that.setData({
+          alertClass: 'alert-fadeout'
+        });
+        
+        // 淡出动画结束后，完全隐藏元素
+        setTimeout(function() {
+          that.setData({
+            isShow: false,
+            alertClass: ''
+          });
+        }, that.data.fadeOutDuration);
+      }, that.data.duration);
+    }
+  }
+});

components/alert-tip/alert-tip.json

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

components/alert-tip/alert-tip.wxml

@@ -0,0 +1,6 @@
+<view class="alert-container {{alertClass}} FlexRow" wx:if="{{isShow}}" style="background-color: {{containerbgColor}};">
+  <view class="alert-content FlexRow" style="background-color: {{bgColor}};">
+    <image src="{{iconPath}}" class="alert-icon"></image>
+    <view class="alert-text" style="color: {{textColor}};">{{content}}</view>
+  </view>
+</view>

components/alert-tip/alert-tip.wxss

@@ -0,0 +1,56 @@
+
+
+.FlexColumn {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.FlexRow {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+}
+
+.alert-container {
+  position: fixed;
+  top: 0;
+  left:0;
+  width: 100%;
+  height: 100rpx;
+  z-index: 999;
+  justify-content: flex-start;
+  align-items: flex-start;
+}
+
+.alert-fadeout {
+  animation: fadeOut 1s ease-out forwards;
+}
+
+@keyframes fadeOut {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+.alert-content {
+  border-radius: 10rpx;
+  height: 70rpx;
+  margin: 20rpx 0 0 30rpx;
+  padding: 0 30rpx;
+}
+
+.alert-icon {
+  width: 20rpx;
+  height: 20rpx;
+}
+
+.alert-text {
+  font-size: 24rpx;
+  margin-left: 20rpx;
+}

docs/alert-tip-usage.md

@@ -0,0 +1,99 @@
+
+# AlertTip 组件使用说明
+
+这是一个用于显示顶部提示信息的自定义组件，支持自定义文本内容、背景颜色、显示时长和淡出动画。
+
+## 引入组件
+
+在需要使用组件的页面的 JSON 配置文件中引入组件：
+
+```json
+{
+  "usingComponents": {
+    "alert-tip": "../../components/alert-tip/alert-tip"
+  }
+}
+```
+
+## 在页面中使用组件
+
+在页面的 WXML 中添加组件：
+
+```html
+<alert-tip id="alertTip" 
+  container-bg-color="#E3E3E3" 
+  bg-color="#CA4B15" 
+  text-color="#FFFFFF" 
+  icon-path="../../pages/images/sysIcon_b11.png"
+  duration="1000"
+  fade-out-duration="1000">
+</alert-tip>
+```
+
+## 组件属性
+
+| 属性名 | 类型 | 默认值 | 说明 |
+|-------|------|-------|------|
+| content | String | '' | 提示内容 |
+| bgColor | String | '#CA4B15' | 背景颜色 |
+| textColor | String | '#FFFFFF' | 文字颜色 |
+| iconPath | String | '../../pages/images/sysIcon_b11.png' | 图标路径 |
+| duration | Number | 1000 | 显示时长(毫秒)，显示多久后开始淡出 |
+| fadeOutDuration | Number | 1000 | 淡出动画时长(毫秒) |
+
+## 组件方法
+
+### showAlert(content)
+
+显示提示信息。
+
+**参数**
+
+- `content` (可选): 提示内容。如果提供，将覆盖组件的 content 属性。
+
+**示例**
+
+```javascript
+// 在页面的 JS 中调用组件的方法
+Page({
+  showTip: function() {
+    // 使用组件的默认 content
+    this.selectComponent('#alertTip').showAlert();
+    
+    // 或者提供新的 content
+    this.selectComponent('#alertTip').showAlert("这是一条提示信息");
+  }
+})
+```
+
+## 完整示例
+
+```javascript
+// 页面 JS
+Page({
+  data: {
+    // 页面数据
+  },
+  
+  onSomeAction: function() {
+    // 当某个条件满足时，显示提示
+    if (someCondition) {
+      this.selectComponent('#alertTip').showAlert("操作成功");
+    } else {
+      this.selectComponent('#alertTip').showAlert("操作失败");
+    }
+  }
+})
+```
+
+```html
+<!-- 页面 WXML -->
+<alert-tip id="alertTip" 
+  bg-color="#28a745" 
+  text-color="#FFFFFF">
+</alert-tip>
+
+<button bindtap="onSomeAction">执行操作</button>
+```
+
+这样，当用户点击按钮时，如果条件满足，将显示绿色背景的"操作成功"提示；否则显示"操作失败"提示。

pages/main/myarticles.wxml

@@ -38,7 +38,6 @@
   <view style="height: 100rpx;"></view>
 </view>
 
-
 <view wx:if="{{IsShowRemind}}" class="panelRemindParent {{parentAnimation}} container FlexColumn" style='min-height:{{Containnerheight}}rpx;{{VectorCSS}}'>
   <view class="panelRemind {{panelAnimation}} FlexColumn">
     <image src="../images/sysIcon_b13.png" class="sysIcon_b10"></image>

pages/main/mywords.js

@@ -1,12 +1,37 @@
 import common from '../../utils/util';
 import main from '../../utils/main';
+import animation from '../../utils/animation';
+
 const app = getApp();
 
 Page({
   data: {
     IsShowSelect:false,
+    IsShowRemind:false,
+    IsShowAlert:false,
+    AlertClass:"",
     Sort1:"panel112",
     Sort2:"",
+    RemindArr:[
+      {
+        "Title":"取消收藏",
+        "Content":"确定删除这条收藏记录吗？删除后无法恢复。",
+        "BtnName":"删除",
+      },{
+        "Title":"取消收藏",
+        "Content":"确定删除这些收藏记录吗？删除后无法恢复。",
+        "BtnName":"删除",
+      },{
+        "Title":"生成文章",
+        "Content":"要用这些单词生成新文章吗？",
+        "BtnName":"继续",
+      },{
+        "Title":"导出到秒过",
+        "Content":"要把这些单词做成秒过题卡吗？\n\n该功能需要切换到「秒过 - 错题记忆卡」小程序中实现。",
+        "BtnName":"继续",
+      },
+    ],
+    RemindIndex:0,
   },
   onLoad: function (options) {
     let that = this;
@@ -53,25 +78,141 @@ Page({
       if (list[i].Selected==1)
         count++;
     }
-    
+
     this.setData({
       List:list,
       Count:count, 
     });
   },
   setDataBoolean:function(e){
-    if (this.data.IsShowSelect){
-      let list=this.data.List;
-      for(let i=0;i<list.length;i++)
-        list[i].Selected=0;
-      this.setData({
-        List:list,
-      });
+    if (e.currentTarget.dataset.name=="IsShowSelect"){
+      this.cancelSelected();
     }
     this.setData({
       IsShowSelect:!this.data.IsShowSelect,
     });
   },
+  
+  showRemindStart:function(e){
+    let that=this;
+    let remindIndex=e.currentTarget.dataset.type;
+    this.setData({
+      RemindIndex:remindIndex,
+    });
+
+    let arr=that.getSelectedWord();
+    if (arr){
+      if (arr.length==0){
+        // 使用组件显示提示
+        this.selectComponent('#alertTip').showAlert("请至少选择1个单词");
+        return null;
+      }
+      else if (remindIndex==2 && arr.length>10){
+        // 使用组件显示提示
+        this.selectComponent('#alertTip').showAlert("一篇文章最多可选10个单词");
+        return null;
+      }
+    }
+
+    if (e.currentTarget.dataset.word)
+      that.Word=e.currentTarget.dataset.word;
+    animation.toggleRemindWithAnimation(this, {
+      hideColor: 'rgba(0,0,0,0)',
+      showColor: 'rgba(277,277,277,0.5)',
+      panelAnimationKey: 'panelAnimation', // 控制内容面板的动画
+      animationKey: 'parentAnimation' // 控制父容器的动画（如果需要）
+    });
+  },
+  showRemindEnd:function(e){
+    let that=this;
+    const confirm=e.currentTarget.dataset.confirm;
+    animation.toggleRemindWithAnimation(this, {
+      hideColor: 'rgba(0,0,0,0)',
+      showColor: 'rgba(277,277,277,0.5)'
+    });
+    if (confirm=="1") {
+      switch(Number(that.data.RemindIndex)){
+        case 0:
+          that.deleteItem(that.Word);
+          break;
+        case 1:
+          that.deleteMany();
+          break;
+        case 2:
+          that.setClipboard();
+          break;
+        case 3:
+          that.gotoMiaoguo();
+          break;
+      }
+    }
+  },
+  deleteItem:function(word){
+    let that=this;
+    main.getData('AddOrDeleteYJBDCUserCollect?UserID='+app.globalData.userInfo.UserID+'&Word='+word, function (data) {
+      if (data){
+        app.globalData.UserCollect=data;
+        that.setData({
+          List:app.globalData.UserCollect,
+        });
+        wx.showToast({
+          title: '删除完成',
+        });
+      }
+    });
+  },
+  deleteMany:function(){
+    let that=this;
+    let arr=that.getSelectedWord();
+    main.getData('DeleteYJBDCUserCollect?UserID='+app.globalData.userInfo.UserID+'&WordArr='+arr.join(","), function (data) {
+      if (data){
+        app.globalData.UserCollect=data;
+        that.setData({
+          List:app.globalData.UserCollect,
+        });
+        wx.showToast({
+          title: '批量删除完成',
+        });
+      }
+    });
+  },
+  setClipboard:function(e){
+    let that=this;
+    let arr=that.getSelectedWord(true);
+    app.globalData.SelectedWords=arr;
+    wx.redirectTo({
+      url: 'wordsinput',
+    });
+  },
+  gotoMiaoguo:function(e){
+    let that=this;
+    let arr=that.getSelectedWord();
+    var appid="wx84b3feac6069eec3";
+    var path="pages/index/index?SourceID="+app.globalData.ProgramID+"&goto=buildcard&Words="+arr.join(",");
+    wx.navigateToMiniProgram({
+      appId: appid,
+      path: path,
+    });
+  },
+  getSelectedWord:function(selectTen){
+    let that=this;
+    let list=that.data.List;
+    let arr=[];
+    for(let i=0;i<list.length;i++){
+      if (list[i].Selected==1)
+        arr.push(list[i].Word);
+    }
+    return arr;
+  },
+  cancelSelected:function(){
+    let list=this.data.List;
+    for(let i=0;i<list.length;i++)
+      list[i].Selected=0;
+    this.setData({
+      List:list,
+      Count:0, 
+    });
+  },
   goto: function (e) {
     let that=this;
     var url=e.currentTarget.dataset.url;

pages/main/mywords.json

@@ -1,8 +1,12 @@
+
 {
   "navigationBarTitleText": "单词收藏",
   "navigationBarBackgroundColor": "#E3E3E3",
   "navigationBarTextStyle": "black",
   "backgroundColorTop":"#E3E3E3",
   "backgroundColorBottom":"#E3E3E3",
-  "backgroundColor": "#E3E3E3"
+  "backgroundColor": "#E3E3E3",
+  "usingComponents": {
+    "alert-tip": "../../components/alert-tip/alert-tip"
+  }
 }

pages/main/mywords.wxml

@@ -9,6 +9,16 @@
     <view wx:if="{{IsShowSelect}}" class="panel12 FlexRow" bind:tap="setDataBoolean" data-name="IsShowSelect">取消</view>
   </view>
 
+  <alert-tip id="alertTip" 
+    container-bg-color="#E3E3E3" 
+    bg-color="#CA4B15" 
+    text-color="#FFFFFF" 
+    icon-path="../../pages/images/sysIcon_b11.png"
+    duration="2000"
+    fade-out-duration="2000">
+  </alert-tip>
+
+  <view style="height: 100rpx;"></view>
   <view class="panel2 FlexColumn">
     <view style="height: 20rpx;"></view>
     <view class="panel2Item FlexRow" wx:for="{{List}}" wx:key="index" bind:tap="selecItem" data-index="{{index}}">
@@ -20,7 +30,7 @@
       </view>
       <view class="panel2ItemLeft">{{item.Word}}</view>
       <view class="panel2ItemRight FlexRow" wx:if="{{!IsShowSelect}}">
-        <view class="panel2ItemRight1 FlexRow">
+        <view class="panel2ItemRight1 FlexRow" bind:tap="showRemindStart" data-type="0" data-word="{{item.Word}}">
           <image src="../images/sysIcon_a39.png" class="sysIcon_a39"></image>
         </view>
       </view>
@@ -31,22 +41,42 @@
 
   <view class="panelFooter FlexRow" wx:if="{{IsShowSelect}}">
     <view class="panelFooter1 FlexRow">
-      <view class="panelFooter11 panelFooter10 FlexColumn" bindtap="" >
+      <view class="panelFooter11 panelFooter10 FlexColumn" >
         <view class="text03">{{Count}}</view>
         <view class="text02">已选</view>
       </view>
-      <view class="panelFooter12 panelFooter10 FlexColumn" bindtap="" >
+      <view class="panelFooter12 panelFooter10 FlexColumn" catch:tap="showRemindStart" data-type="1" >
         <image src="../images/sysIcon_a14.png" class="sysIcon_a14"></image>
         <view class="text02">删除</view>
       </view>
-      <view class="panelFooter12 panelFooter10 FlexColumn" bindtap="" >
+      <view class="panelFooter12 panelFooter10 FlexColumn" catch:tap="showRemindStart" data-type="2"  >
         <image src="../images/sysIcon_a40.png" class="sysIcon_a14"></image>
         <view class="text02">生成文章</view>
       </view>
-      <view class="panelFooter13 panelFooter10 FlexColumn" bind:tap="">
+      <view class="panelFooter13 panelFooter10 FlexColumn" catch:tap="showRemindStart" data-type="3" >
         <image src="../images/sysIcon_a41.png" class="sysIcon_a14"></image>
         <view class="text02">导到秒过</view>
       </view>
     </view>
   </view>
+</view>
+
+<view wx:if="{{IsShowRemind}}" class="panelRemindParent {{parentAnimation}} container FlexColumn" style='min-height:{{Containnerheight}}rpx;{{VectorCSS}}'>
+  <view class="panelRemind {{panelAnimation}} FlexColumn">
+    <image src="../images/sysIcon_b13.png" class="sysIcon_b10"></image>
+      
+    <view class="panelRemind1 FlexRow">
+      <image src="../images/sysIcon_b12.png" class="sysIcon_b09"></image>
+      <view>{{RemindArr[RemindIndex].Title}}</view>
+    </view>
+    <view class="panelRemind2 FlexColumn">
+      <view class="textRemind FlexColumn">
+        <text>{{RemindArr[RemindIndex].Content}}</text>
+      </view>
+      <view class="panelRemind21 FlexColumn">
+        <view class="btnReind1 FlexColumn" catch:tap="showRemindEnd" data-confirm="1">{{RemindArr[RemindIndex].BtnName}}</view>
+        <view class="btnReind1 btnReind2 FlexColumn" catch:tap="showRemindEnd" data-confirm="0">取消</view>
+      </view>
+    </view>
+  </view>
 </view>

pages/main/mywords.wxss

@@ -6,7 +6,10 @@
 .panel1 {
   width: 100%;
   height:100rpx;
-  position: relative;
+  position: fixed;
+  z-index: 10;
+  top:0;
+  background: #E3E3E3;
 }
 .panel11{
   width: 290rpx;
@@ -42,6 +45,10 @@
 .panel13{
   left:30rpx;
 }
+
+
+/* 提示相关样式已移至组件中 */
+
 .panel2{
   width: 690rpx;
   border-radius: 20rpx;
@@ -162,4 +169,67 @@
 .sysIcon_a14{
   width:20rpx;
   height:20rpx;
+}
+
+.panelRemind{
+  width: 690rpx;
+  margin-bottom: 75rpx;
+  position: fixed;
+  bottom: 0;
+
+  background: #FFA70C;
+  box-shadow: 0 20rpx 0 0 #CB8409, 0 50rpx 0 0 rgba(0,0,0,0.50);
+  border-radius: 60rpx;
+  background-image: radial-gradient(circle at 53% 50%, #85261E 0%, rgba(178,71,62,0.00) 50%);
+}
+.sysIcon_b10{
+  width: 360rpx;
+  height:140rpx;
+  position: absolute;
+  right:0;
+  top:-22rpx;
+}
+.panelRemind1{
+  width: 100%;
+  justify-content: flex-start;
+  margin-top: 40rpx;
+  font-size: 36rpx;
+  color: #FFFFFF;
+  z-index: 25rpx;
+}
+.sysIcon_b09{
+  width: 50rpx;
+  height:50rpx;
+  margin: 0 20rpx 0 50rpx ;
+}
+.panelRemind2{
+  width: 650rpx;
+  min-height:220rpx;
+  background: #FFFFFF;
+  color: #2E2E2E;
+  border-radius: 40rpx;
+  margin: 30rpx 0;
+  justify-content: flex-start;
+}
+.textRemind{
+  width:570rpx;
+  font-weight: 400;
+  font-size: 28rpx;
+  align-items: flex-start;
+  margin-top: 80rpx;
+}
+.panelRemind21{
+  width:100%;
+  margin: 60rpx 0 0 0;
+}
+.btnReind1{
+  width:580rpx;
+  height:90rpx;
+  background: #F0F0F0;
+  border-radius: 20rpx;
+  font-size: 36rpx;
+}
+
+.btnReind2{
+  margin: 30rpx 0 40rpx 0;
 }