- 增加 AgreementDialog 组件, '@/components/AgreementDialog'

README.md

@@ -1,9 +1,9 @@
 <!--
  * @Date: 2022-01-19 10:08:58
  * @LastEditors: JinxChen
- * @LastEditTime: 2022-02-25 17:55:22
+ * @LastEditTime: 2022-03-04 15:52:30
  * @FilePath: \AntpayFrontEnd\README.md
- * @description: readme说明文档
+ * @description: 项目说明文档
 -->
 # alipay-scan-code-front-end
 ## 项目说明
@@ -23,12 +23,28 @@ npm run dev
 npm run build
 ```
 
+### 项目本地调试
+
+```
+运行成功后 本地调试首次进入会进入到 http://localhost:8080/#/404 404页面
+因为当前url还没有参数, 此时需要手动在url后面添加需要的参数,
+例子: http://localhost:8080/#/index?goodsNo=889&userId=1
+其中 goodsNo是商品的no,  userId是用户的id, 这两个参数后面接口都会用到
+以上在线上环境不需要配置,因为二维码会自动把这两个参数添加上去
+```
+
 ### 项目代码编写规范(暂时想到这些,后面根据项目情况补充说明)
 - css类名: 小写驼峰 中间用 - 隔开
 - js函数方法: 开头小写后面开头大写驼峰
 - .vue 文件命名: 统一大写驼峰
 - 常量命名: 全部大写 以_拼接, 具体例子见: /src/config/models下的文件
 
+
+### 项目分支管理
+- master: 不可在此分支做任何修改, 只能合并develop分支, git merge --no-ff develop ; 且部署上线时对应production环境,不可混肴
+- develop: 平时开发使用此分支, 需另开分支并说明是做什么的, 比如fix bug, git checkout -b fix-xxxx, 开发完成自测无问题后合并到develop分支，
+- test: 如不必要不在此分支做任何修改, 合并develpo分支, git merge --no-ff develop ; 部署上线时对应test环境,不可混肴
+
 ### git 提交规范
 - feature 新增一个功能
 - bugfix 修复一个
@@ -44,12 +60,13 @@ npm run build
 
 。
 ### 版本控制以及版本迭代说明
+
 ### v1.0.0
 `2022.02.23`
 build
 - 初版发布
 - 完成 项目搭建
-- 完成 项目迁移 从documentFrontEndWeb 到 AlipayFrontendWeb
+- 完成 项目迁移 从documentFrontEndWeb 到 AntpayFrontEnd
 - 增加 docker部署脚本
 - 增加 环境设置脚本
 - 增加 nginx.conf文件
@@ -61,4 +78,12 @@ fix
 feature
 - 增加 非支付宝浏览环境下扫码切换支付宝弹窗提示
 - 增加 android和ios设备支付宝下载链接
-- 增加 android设备复制粘贴下载链接功能
+- 增加 android设备复制粘贴下载链接功能
+
+
+### v1.0.2
+`2022.03.04`
+feature
+- 增加 春雨个性化定制 '@/views/chunyu/AliPayForm'
+- 增加 Checkbox 组件, '@/components/checkbox'
+- 增加 AgreementDialog 组件, '@/components/AgreementDialog'

antpay_frontend_web_run.sh

@@ -2,9 +2,9 @@
 ###
  # @Date: 2021-11-15 09:37:49
  # @LastEditors: JinxChen
- # @LastEditTime: 2022-02-25 11:36:46
+ # @LastEditTime: 2022-03-04 10:47:47
  # @FilePath: \AntpayFrontEnd\antpay_frontend_web_run.sh
- # @description: docker部署脚本
+ # @description: docker部署脚本, 根据项目具体情况来 修改 docker run -p 8804:80
 ###
 environment=$1
 version=$2

package-lock.json

@@ -5,8 +5,10 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "alipay-scan-code-front-end",
       "version": "0.1.0",
       "dependencies": {
+        "@vant/area-data": "^1.2.2",
         "axios": "^0.26.0",
         "core-js": "^3.6.5",
         "nprogress": "^0.2.0",
@@ -2492,6 +2494,11 @@
       "integrity": "sha512-7tFImggNeNBVMsn0vLrpn1H1uPrUBdnARPTpZoitY37ZrdJREzf7I16tMrlK3hen349gr1NYh8CmZQa7CTG6Aw==",
       "dev": true
     },
+    "node_modules/@vant/area-data": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@vant/area-data/-/area-data-1.2.2.tgz",
+      "integrity": "sha512-efv7Yl/OTHjyy0irhJJPtgZb5mJZmroEtVOa8vkGRNTLY93+NgEcVuIBaC35hYCMsTrPHDQRvQGnI9Hyhtto0Q=="
+    },
     "node_modules/@vant/icons": {
       "version": "1.7.3",
       "resolved": "https://registry.npmjs.org/@vant/icons/-/icons-1.7.3.tgz",
@@ -21439,6 +21446,11 @@
       "integrity": "sha512-7tFImggNeNBVMsn0vLrpn1H1uPrUBdnARPTpZoitY37ZrdJREzf7I16tMrlK3hen349gr1NYh8CmZQa7CTG6Aw==",
       "dev": true
     },
+    "@vant/area-data": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@vant/area-data/-/area-data-1.2.2.tgz",
+      "integrity": "sha512-efv7Yl/OTHjyy0irhJJPtgZb5mJZmroEtVOa8vkGRNTLY93+NgEcVuIBaC35hYCMsTrPHDQRvQGnI9Hyhtto0Q=="
+    },
     "@vant/icons": {
       "version": "1.7.3",
       "resolved": "https://registry.npmjs.org/@vant/icons/-/icons-1.7.3.tgz",

package.json

@@ -12,6 +12,7 @@
     "test:unit": "vue-cli-service test:unit"
   },
   "dependencies": {
+    "@vant/area-data": "^1.2.2",
     "axios": "^0.26.0",
     "core-js": "^3.6.5",
     "nprogress": "^0.2.0",

src/api/alipay.js

@@ -1,9 +1,9 @@
 /*
  * @Date: 2022-02-14 15:18:50
  * @LastEditors: JinxChen
- * @LastEditTime: 2022-02-14 15:21:05
- * @FilePath: \alipay-scan-code-front-end\src\api\goods.js
- * @description:
+ * @LastEditTime: 2022-03-04 10:50:22
+ * @FilePath: \AntpayFrontEnd\src\api\alipay.js
+ * @description: axios封装
  */
 import request from '../http/request';
 

src/components/AgreementDialog.vue

@@ -0,0 +1,144 @@
+<!--
+ * @Date: 2022-02-26 16:40:02
+ * @LastEditors: JinxChen
+ * @LastEditTime: 2022-02-28 17:00:19
+ * @FilePath: \AntpayFrontEnd\src\components\AgreementDialog.vue
+ * @description: 协议弹窗组件
+-->
+<template>
+    <div>
+        <van-dialog
+            class="agreement-container"
+            v-model="show"
+            :title="title"
+            confirm-button-color="#1989fa"
+            :show-confirm-button="false"
+        >
+            <div class="agreement-content">
+                <h5>一.开通需知及承诺</h5>
+                <p v-show="isNewCustom">1.感谢用户使用支付宝花呗分期功能。</p>
+                <p v-show="isNewCustom">
+                    2.用户自愿开通4G电子学生证资费套餐服务({{count}}
+                    <!-- 24 -->
+                    期)每月自动通过支付宝花呗分期支付资费(话费+流量)套餐费{{(price/count).toFixed(2)}}元/月。
+                </p>
+                <p v-show="isNewCustom">3.用户需连续使用该资费套餐24期，可据此领取4G电子学生证1台、电话卡1张。</p>
+                <p style="white-space: pre-wrap">
+                    <span v-show="isNewCustom">4.</span>
+                    {{description}}
+                </p>
+                <p v-show="isOldCustom">5.协议期内，电子学生证非人为损坏或进水按“三包”政策进行免费维修或更换。如丢失或人为损坏，按优惠价重新购买。</p>
+                <p v-show="isOldCustom">6.北京随手精灵科技有限公司接受电子学生证运营销售商委托采用支付宝花呗分期付代收业务货款。</p>
+                <h5>二．用户承诺</h5>
+                <p>1.用户已充分了解支付宝花呗付款条款（含支付宝花呗相关规则），充分阅读及理解本协议。</p>
+                <p>2.用户已经签署业务订购回执，自愿购买并同意签署本协议。</p>
+                <h5>三．法律适用与管辖</h5>
+                <p>本协议之效力、解释、变更、执行与争议解决均适用中华人民共和国法律。因本协议产生的争议，均应依照中华人民共和国法律予以处理。</p>
+                <p v-show="!isButtonShow">{{countDown}}秒后显示按钮</p>
+                <div class="agreement-button" v-show="isButtonShow">
+                    <van-button type="warning" @click="onDisAgree" round>不同意</van-button>
+                    <van-button type="info" @click="onAgree" round>同意</van-button>
+                </div>
+            </div>
+        </van-dialog>
+    </div>
+</template>
+
+<script>
+export default {
+  name:'agreement-dialog',
+  props: {
+    show: {
+        default: true,
+        type: Boolean
+    },
+    title: {
+        default: '',
+        type: String
+    },
+    isNewCustom: {
+        default: true,
+        type: Boolean
+    },
+    isOldCustom: {
+        default: false,
+        type: Boolean
+    },
+    count: {
+        default: null,
+        type: Number
+    },
+    price: {
+        default: null,
+        type: Number
+    },
+    description: {
+        default: '',
+        type: String
+    },
+    countDown: {
+        default: 3,
+        type: Number
+    },
+    isButtonShow: {
+        default: false,
+        type: Boolean
+    },
+  },
+  data(){
+   return {
+   }
+  },
+  methods: {
+      //   不同意
+    onDisAgree() {
+        this.$bus.$emit('getCheckStatus', false);
+        this.$bus.$emit('closeButton', false);
+        this.resetCountDown();
+    },
+    //   同意
+    onAgree() {
+        this.$bus.$emit('getCheckStatus', true);
+        this.$bus.$emit('closeButton', false);
+        this.resetCountDown();
+    },
+     // 重置倒计时和关闭弹窗
+    resetCountDown() {
+        this.countDown = 3;
+    },
+  }
+
+}
+</script>
+
+<style scoped lang="scss">
+.agreement-container {
+    .agreement-content {
+        height: 500px;
+        padding: 5px 10px;
+        border-top: 0.5px soild;
+        border-bottom: 0.5px soild;
+        text-align: left;
+        overflow: scroll;
+        h5 {
+            padding: 5px;
+        }
+        p {
+            padding: 5px;
+            font-size: 14px;
+            line-height: 20px;
+        }
+        .agreement-button {
+            padding: 10px;
+            display: flex;
+            justify-content: space-around;
+            align-items: center;
+            .van-button {
+                height: 30px;
+                width: 120px;
+                border-radius: 10px;
+            }
+        }
+    }
+}
+</style>

src/main.js

@@ -1,7 +1,7 @@
 /*
  * @Date: 2022-01-19 10:08:26
  * @LastEditors: JinxChen
- * @LastEditTime: 2022-02-25 17:51:58
+ * @LastEditTime: 2022-03-04 15:00:32
  * @FilePath: \AntpayFrontEnd\src\main.js
  * @description:
  */
@@ -34,7 +34,11 @@ import {
     Notify,
     Loading,
     Toast,
-} from 'vant';
+    Popup,
+    Area,
+    Cascader,
+    Picker,
+} from 'vant'; //按需加载vant组件
 
 Vue
     .use(Button)
@@ -59,9 +63,14 @@ Vue
     .use(Notify)
     .use(Loading)
     .use(Toast)
+    .use(Area)
+    .use(Popup)
+    .use(Picker)
+    .use(Cascader)
     .use(Tabs);
 
 Vue.config.productionTip = false;
+Vue.prototype.$bus =  new Vue();
 new Vue({
   router,
   store,