From a5604d778ca31451a95d8dabdf94f7ebc78e5c55 Mon Sep 17 00:00:00 2001
From: zhaoxiaoqiang <287285524@qq.com>
Date: Fri, 14 Apr 2023 11:24:10 +0800
Subject: [PATCH] v-console
---
src/views/main/product.vue | 365 ++++++++++++++++++++++++---------------------------
1 files changed, 172 insertions(+), 193 deletions(-)
diff --git a/src/views/main/product.vue b/src/views/main/product.vue
index fc8297d..5682e4d 100644
--- a/src/views/main/product.vue
+++ b/src/views/main/product.vue
@@ -7,7 +7,6 @@
-->
<template>
<div class="product-box h-100-g">
-
<nav class="product-title">
产品管理
</nav>
@@ -17,218 +16,198 @@
<p>支付宝扫码收款</p>
</div>
-
<div class="product-list grid">
<div class="list-title">办理分期</div>
- <div class="item flex-center-g" @click="handlerClick(item)" v-for="(item, index) in menu" :key="index" :class="item.icon.replace('#','')">
- <div class="text-center-g" >
- <svg class="icon" aria-hidden="true" :style="{fill:item.color}">
+ <div class="item flex-center-g" @click="handlerClick(item)" v-for="(item, index) in menu" :key="index" :class="item.icon.replace('#', '')">
+ <div class="text-center-g">
+ <svg class="icon" aria-hidden="true" :style="{ fill: item.color }">
<use :xlink:href="item.icon"></use>
</svg>
- <p class="label">{{item.label}}</p>
+ <p class="label">{{ item.label }}</p>
</div>
</div>
</div>
-
</div>
</template>
<script>
- export default {
- name: "product",
- data() {
- return {
- // 菜单栏
- menu: [
- {
- icon: '#iconxinyongkafenqi',
- label: '信用卡分期',
- path: '',
- color:'#896EDB'
+export default {
+ name: "product",
+ data() {
+ return {
+ // 菜单栏
+ menu: [
+ {
+ icon: "#iconxinyongkafenqi",
+ label: "信用卡分期",
+ path: "",
+ color: "#896EDB",
+ },
+ {
+ icon: "#iconhuabeifenqi",
+ label: "花呗分期",
+ color: "#896EDB",
+ },
+ {
+ icon: "#iconshoujifenqi",
+ label: "手机分期",
+ color: "#896EDB",
+ },
+ {
+ icon: "#icongoujizhijiang",
+ label: "购机直降",
+ color: "#ccc",
+ },
+ {
+ icon: "#iconzhixianghua",
+ label: "智享花",
+ color: "#896EDB",
+ },
+ {
+ icon: "#iconzhixianghua",
+ label: "信用购",
+ color: "#896EDB",
+ },
+ {
+ icon: "#icondangmianfu",
+ label: "商户收款",
+ color: "#ccc",
+ },
+ {
+ icon: "#iconhuabeiheyueji",
+ label: "花呗合约机",
+ color: "#896EDB",
+ },
+ {
+ icon: "#iconhuabeitie",
+ label: "花呗提额",
+ color: "#896EDB",
+ },
+ ],
+ };
+ },
+ created() {
+ // this.openAuto();
+ },
+ methods: {
+ openAuto() {
+ let openId = window.localStorage.getItem("pOpenId");
+ let codeId = window.localStorage.getItem("pCodeId");
+ alert("openId:" + openId);
+ alert("codeId:" + codeId);
+ if (codeId == undefined) {
+ var strUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + "wx594ab33e0466eccf" + "&redirect_uri=" + "https%3a%2f%2fsie.jycash.cn%2fsib_wx_scores%2f%23%2f" + "&response_type=code&scope=snsapi_userinfo" + "#wechat_redirect";
+ window.location.href = strUrl;
+ } else if (openId == undefined) {
+ this.$api.getWeChatUserInfo({ code: codeId }).then(
+ (res) => {
+ let openId = res.body;
+ window.localStorage.setItem("pOpenId", openId);
+ this.$api.setUserOpenId({ openId: openId }).then(
+ (res) => {
+ alert("updateOpenId:" + openId);
+ },
+ (error) => {
+ statusCodeManage.showTipOfStatusCode(error, this);
+ }
+ );
},
- {
- icon: '#iconhuabeifenqi',
- label: '花呗分期',
- color:'#896EDB'
- },
- {
- icon: '#iconshoujifenqi',
- label: '手机分期',
- color:'#896EDB'
- },
- {
- icon: '#icongoujizhijiang',
- label: '购机直降',
- color:'#ccc'
- },
- {
- icon: '#iconzhixianghua',
- label: '智享花',
- color:'#896EDB'
- },
- {
- icon: '#iconzhixianghua',
- label: '信用购',
- color:'#896EDB'
- },
- {
- icon: '#icondangmianfu',
- label: '商户收款',
- color:'#ccc'
- },
- {
- icon: '#iconhuabeiheyueji',
- label: '花呗合约机',
- color:'#896EDB'
- },
- {
- icon: '#iconhuabeitie',
- label: '花呗提额',
- color:'#896EDB'
- },
-
- ]
+ (error) => {
+ statusCodeManage.showTipOfStatusCode(error, this);
+ }
+ );
}
},
- created() {
- // this.openAuto();
+ handlerClick(item) {
+ if (item.path) {
+ this.$router.push(item.path);
+ return false;
+ }
+
+ switch (item.label) {
+ case "信用卡分期":
+ this.Click_XYK();
+ break;
+ case "花呗分期":
+ this.Click_HBFQ();
+ break;
+ }
},
- methods: {
- openAuto(){
- let openId = window.localStorage.getItem("pOpenId");
- let codeId = window.localStorage.getItem("pCodeId");
- alert("openId:"+openId);
- alert("codeId:"+codeId);
- if(codeId == undefined) {
- var strUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + "wx594ab33e0466eccf" +
- "&redirect_uri=" + "https%3a%2f%2fsie.jycash.cn%2fsib_wx_score%2f%23%2f" + "&response_type=code&scope=snsapi_userinfo" + "#wechat_redirect";
- window.location.href = strUrl;
- }else if(openId == undefined){
- this.$api.getWeChatUserInfo({"code":codeId}).then(
- res => {
- let openId = res.body;
- window.localStorage.setItem("pOpenId",openId);
- this.$api.setUserOpenId({"openId":openId}).then(
- res => {
- alert("updateOpenId:"+ openId);
- },
- error => {
- statusCodeManage.showTipOfStatusCode(error, this);
- }
- );
- },
- error => {
- statusCodeManage.showTipOfStatusCode(error, this);
- }
- );
- }
- },
- handlerClick(item) {
- if (item.path) {
- this.$router.push(item.path);
- return false;
- }
- switch (item.label) {
- case '信用卡分期':
- this.Click_XYK();
- break;
- case '花呗分期':
- this.Click_HBFQ();
- break;
- }
- },
+ //信用卡分期点击
+ Click_XYK() {},
-
- //信用卡分期点击
- Click_XYK() {
- console.log('信用卡分期点击');
- },
-
- //花呗分期
- Click_HBFQ() {
- console.log('花呗分期');
- },
-
-
- }
- }
+ //花呗分期
+ Click_HBFQ() {},
+ },
+};
</script>
<style scoped lang="less">
- .product-box {
- padding-bottom: 100px;
+.product-box {
+ padding-bottom: 100px;
- //产品标题
- .product-title {
- .lh(44px);
- background: @c-black;
- font-size: @font-16;
- color: @c-fff;
- font-weight: bold;
- text-align: center;
- }
-
-
- .alipay{
- width: 360px;
- margin: 0 auto;
- .flex(center,center,warp,column);
- margin-top: 20px;
- min-height: 130px;
- background-color: @c-fff;
- .van-icon{
- font-size: 55px;
- margin-bottom: 15px;
- color: @c-default;
- }
- p{
- font-size: @font-12;
- color: @c-default;
- }
- }
-
-
- //产品列表
- .grid {
- margin: 15px auto 0 auto;
- width: 360px;
- background-color: @c-bg-fff;
- .flex(flex-start, center, wrap);
- z-index: @zIndex-20;
- box-shadow: 0 8px 20px 0 rgba(66, 61, 93, 0.05);
- border-radius: 3px;
- .item {
- width: 120px;
- height: 122px;
- }
- .icon{
- width:35px;
- height:35px;
- /* fill:@c-default;*/
- }
- .label {
- margin-top: 15px;
- color: @c-text-666;
- }
- }
-
-
-
- .list-title{
- width: 100%;
- .lh(44px);
- padding-left: 25px;
- border-bottom: 1px solid #c7c7c7;
- }
-
-
- //单独修改某一单元格样式
- .iconshoujifenqi{
-
- }
-
-
-
+ //产品标题
+ .product-title {
+ .lh(44px);
+ background: @c-black;
+ font-size: @font-16;
+ color: @c-fff;
+ font-weight: bold;
+ text-align: center;
}
+
+ .alipay {
+ width: 360px;
+ margin: 0 auto;
+ .flex(center, center, warp, column);
+ margin-top: 20px;
+ min-height: 130px;
+ background-color: @c-fff;
+ .van-icon {
+ font-size: 55px;
+ margin-bottom: 15px;
+ color: @c-default;
+ }
+ p {
+ font-size: @font-12;
+ color: @c-default;
+ }
+ }
+
+ //产品列表
+ .grid {
+ margin: 15px auto 0 auto;
+ width: 360px;
+ background-color: @c-bg-fff;
+ .flex(flex-start, center, wrap);
+ z-index: @zIndex-20;
+ box-shadow: 0 8px 20px 0 rgba(66, 61, 93, 0.05);
+ border-radius: 3px;
+ .item {
+ width: 120px;
+ height: 122px;
+ }
+ .icon {
+ width: 35px;
+ height: 35px;
+ /* fill:@c-default;*/
+ }
+ .label {
+ margin-top: 15px;
+ color: @c-text-666;
+ }
+ }
+
+ .list-title {
+ width: 100%;
+ .lh(44px);
+ padding-left: 25px;
+ border-bottom: 1px solid #c7c7c7;
+ }
+
+ //单独修改某一单元格样式
+ .iconshoujifenqi {
+ }
+}
</style>
--
Gitblit v1.8.0