更新笔触和管理员页面

public/index.html

@@ -15,6 +15,7 @@
     <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/color-thief/2.3.0/color-thief.umd.js"></script> -->
 	<script src="./js/color-thief.js"></script>
 	<script src="./js/fabric.min.js"></script>
+	<script src="./js/fabric.brushes.js"></script>
     <noscript>
       <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>

src/assets/style/style.css

@@ -595,6 +595,130 @@ li {
 .libraryPageCascader .ant-cascader-menu {
   margin-top: 4rem;
 }
+.admin_page {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  position: relative;
+}
+.admin_page .admin_table_search {
+  margin-top: 2rem;
+  padding: 2rem 3.5rem 5rem 2.8rem;
+  background: #fff;
+  display: flex;
+  justify-content: space-between;
+}
+.admin_page .admin_table_search .admin_search {
+  width: 40%;
+}
+.admin_page .admin_table_search .admin_search .admin_search_item {
+  background: #343579;
+  border-color: #343579;
+  height: 4rem;
+  padding: 0.64rem 1.5rem;
+  font-size: 1.6rem;
+  border-radius: 2px;
+  display: inline-block;
+  color: #fff;
+  cursor: pointer;
+}
+.admin_page .admin_table_search .admin_state {
+  position: relative;
+  cursor: pointer;
+  width: 60%;
+}
+.admin_page .admin_table_search .admin_state .admin_state_item {
+  margin-right: 2rem;
+  margin-bottom: 2rem;
+  display: flex;
+  align-items: center;
+}
+.admin_page .admin_table_search .admin_state .admin_state_item > span {
+  font-size: 1.6rem;
+  font-weight: 400;
+  color: #030303;
+  margin-right: 15px;
+  flex-shrink: 0;
+  display: block;
+  min-width: 13rem;
+  text-align: right;
+}
+.admin_page .admin_table_search .admin_state .admin_current {
+  background: #fff;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.admin_page .admin_table_search .admin_state .header_user_content {
+  position: absolute;
+  border: 2px solid;
+  border-radius: 1rem;
+  overflow: hidden;
+  top: 0;
+  transform: translateY(6rem);
+  z-index: 2;
+  display: none;
+  margin-left: -2rem;
+}
+.admin_page .admin_table_search .admin_state .header_user_content .username {
+  padding: 0 2rem;
+  color: #000;
+}
+.admin_page .admin_table_search .admin_state .header_user_content .username:hover {
+  background: #e1e1e1;
+}
+.admin_page .admin_table_search .admin_state .header_user_content.active {
+  display: block;
+}
+.admin_page .admin_table_content {
+  margin-top: 2.6rem;
+  width: 100%;
+  height: calc(100% - 13.7rem);
+  padding-bottom: 3rem;
+  background: #fff;
+  border-radius: 2rem;
+  overflow: hidden;
+}
+.admin_page .admin_table_content .ant-table {
+  background: transparent;
+}
+.admin_page .admin_table_content .ant-table-body {
+  overflow-y: auto !important;
+  -ms-overflow-style: none;
+  overflow: -moz-scrollbars-none;
+}
+.admin_page .admin_table_content .ant-table-body::-webkit-scrollbar {
+  width: 0 !important;
+}
+.admin_page .admin_table_content .ant-table-thead > tr > th {
+  background: #ffffff00;
+  border-bottom: none;
+  backdrop-filter: blur(1rem);
+}
+.admin_page .admin_table_content .ant-table-tbody > tr > td {
+  border: none;
+  background: transparent;
+}
+.admin_page .admin_table_content .ant-table-tbody > tr:hover > td {
+  background: #ffffff3a;
+}
+.admin_page .admin_table_content .ant-table-pagination-right {
+  padding-right: 3.5rem;
+}
+.admin_page .admin_table_content .operate_list {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 1rem;
+}
+.admin_page .admin_table_content .operate_list .operate_item {
+  font-size: 1.4rem;
+  font-family: Roboto;
+  font-weight: 400;
+  color: #343579;
+  cursor: pointer;
+}
 .closeIcon {
   position: absolute;
   top: calc(2rem*1.2);

src/assets/style/style.less

@@ -707,6 +707,142 @@ input:focus{
 		margin-top: 4rem;
 	}
 }
+//管理员页面的查询
+.admin_page {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    // min-width: 1440px;
+    position: relative;
+	
+	.admin_table_search {
+		display: flex;
+		margin-top: 2rem;
+		padding: 2rem 3.5rem 5rem 2.8rem;
+		background: #fff;
+		display: flex;
+		justify-content: space-between;
+		.admin_search{
+			width: 40%;
+			.admin_search_item{
+				background: #343579;
+				border-color: #343579;
+				height: 4rem;
+				padding: .64rem 1.5rem;
+				font-size: 1.6rem;
+				border-radius: 2px;
+				display: inline-block;
+				color: #fff;
+				cursor: pointer;
+			}
+		}
+		.admin_state {
+			position: relative;
+			cursor: pointer;
+			width: 60%;
+			.admin_state_item{
+				margin-right: 2rem;
+				margin-bottom: 2rem;
+				display: flex;
+				align-items: center;
+				>span{
+					font-size: 1.6rem;
+					font-weight: 400;
+					color: #030303;
+					margin-right: 15px;
+					flex-shrink: 0;
+					display: block;
+					min-width: 13rem;
+					text-align: right;
+				}
+			}
+			.admin_current{
+				background: #fff;
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+			}
+			.header_user_content {
+				position: absolute;
+				border: 2px solid;
+				border-radius: 1rem;
+				overflow: hidden;
+				top: 0;
+				transform: translateY(6rem);
+				z-index: 2;
+				display: none;
+				margin-left: -2rem;
+				.username{
+					padding: 0 2rem;
+					color: #000;
+				}
+				.username:hover{
+					background: #e1e1e1;
+				}
+				&.active{
+					display: block;
+				}
+			}
+		}
+	}
+
+	.admin_table_content {
+		margin-top: 2.6rem;
+		width: 100%;
+		height: calc(100% - 13.7rem);
+		padding-bottom: 3rem;
+		background: #fff;
+		border-radius: 2rem;
+		overflow: hidden;
+		.ant-table {
+			background: transparent;
+		}
+
+		.ant-table-body {
+			overflow-y: auto !important;
+			-ms-overflow-style: none;
+			overflow: -moz-scrollbars-none;
+
+			&::-webkit-scrollbar {
+				width: 0 !important;
+			}
+		}
+		.ant-table-thead > tr > th {
+			background: #ffffff00;
+			border-bottom: none;
+			backdrop-filter: blur(1rem);
+		}
+
+		.ant-table-tbody > tr > td {
+			border: none;
+			background: transparent;
+			// color: #fff;
+		}
+		.ant-table-tbody > tr {
+			&:hover > td {
+				background: #ffffff3a;
+			}
+		}
+		.ant-table-pagination-right {
+			padding-right: 3.5rem;
+		}
+		.operate_list {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 1rem;
+
+			.operate_item {
+				font-size: 1.4rem;
+				font-family: Roboto;
+				font-weight: 400;
+				color: #343579;
+				cursor: pointer;
+			}
+		}
+	}
+}
 .closeIcon{
 	position: absolute;
 	top: calc(2rem*1.2);

src/component/Administrator/TestClickData.vue

@@ -1,108 +1,62 @@
 <template>
-    <div class="test_cli">
-        <div class="page_content">
-            <img
-                class="page_content_bg"
-                src="@/assets/images/homePage/bg1.jpg"
-            />
-            <div class="page_content_body">
-                <div class="test_cli_body">
-                    <div class="trial_table_search">
-                        <a-range-picker
-                            class="range_picker"
-                            v-model:value="rangePickerValue"
-                            :placeholder="[
-                                $t('HistoryPage.StartDate'),
-                                $t('HistoryPage.EndDate'),
-                            ]"
-                            valueFormat="YYYY-MM-DD"
-                        >
-                            <template #suffixIcon>
-                                <span
-                                    class="icon iconfont range_picker_icon icon-rili"
-                                ></span>
-                            </template>
-                        </a-range-picker>
-                        <div class="content_search_block">
-                            <input
-                                class="search_input"
-                                :placeholder="$t('HistoryPage.inputContent1')"
-                                v-model="searchCollectionName"
-                                @keydown.enter="searchHistoryList()"
-                            />
-                            <div
-                                class="search_icon_block"
-                                @click="searchHistoryList()"
-                            >
-                                <span class="icon iconfont icon-sousuo"></span>
-                            </div>
-                        </div>
-                    </div>
+    <div class="test_cli admin_page">
+		<div class="admin_table_search">
+			<div class="admin_state">
+			
+				<div class="admin_state_item">
+					<span>State:</span>
+					<a-range-picker
+						class="range_picker"
+						v-model:value="rangePickerValue"
+						:placeholder="[
+							$t('HistoryPage.StartDate'),
+							$t('HistoryPage.EndDate'),
+						]"
+						valueFormat="YYYY-MM-DD"
+					>
+						<template #suffixIcon>
+							<span
+								class="icon iconfont range_picker_icon icon-rili"
+							></span>
+						</template>
+					</a-range-picker>
+				</div>
+				<div class="admin_state_item">
+					<span>Time:</span>
+					<a-time-range-picker class="range_picker" valueFormat="HH:mm:ss" v-model:value="rangeTimeValue" />
+				</div>
 
-                    <div class="trial_table_content" ref="historyTable">
-                        <a-table
-                            :columns="columns"
-                            :data-source="collectionList"
-                            :scroll="{ y: historyTableHeight }"
-                            @change="changePage"
-                            :pagination="{
-                                showSizeChanger: true,
-                                current: currentPage,
-                                pageSize: pageSize,
-                                total: total,
-                                showQuickJumper: true,
-                                bordered: false,
-                            }"
-                        >
-                            <template
-                                #bodyCell="{ column, text, record, index }"
-                            >
-                                <div
-                                    class="operate_list"
-                                    v-if="column?.Operations"
-                                >
-                                    <div
-										v-show="status == 0"
-                                        class="operate_item"
-                                        @click="setConsent(record, index)"
-                                    >
-										consent
-                                    </div>
-									<div
-										v-show="status == 0"
-                                        class="operate_item"
-                                        @click="setRefuse(record, index)"
-                                    >
-										refuse
-                                    </div>
-                                    <!-- <div
-                                        class="operate_item"
-                                        @click="deleteGroup(record, index)"
-                                    >
-										Delete
-                                    </div> -->
-									
-                                </div>
-                            </template>
-                        </a-table>
-                    </div>
-                </div>
-            </div>
-        </div>
+			</div>
+			<div class="admin_search">
+				<div class="admin_search_item" @click="searchHistoryList">Search</div>
+			</div>
+		</div>
+
+		<div class="admin_table_content" ref="historyTable">
+			<a-table
+				:columns="columns"
+				:data-source="dataList"
+				:scroll="{ y: historyTableHeight }"
+				@change="changePage"
+				:pagination="{
+					showSizeChanger: true,
+					current: currentPage,
+					pageSize: pageSize,
+					total: total,
+					showQuickJumper: true,
+					bordered: false,
+				}"
+			>
+			</a-table>
+		</div>
     </div>
 </template>
 <script lang="ts">
 import { defineComponent, ref, createVNode, computed } from "vue";
-import { setCookie, getCookie, WriteCookie } from "@/tool/cookie";
 import HeaderComponent from "@/component/HomePage/Header.vue";
 import HistoryDetail from "@/component/Detail/HistoryDetail.vue";
-import router from "@/router/index";
 import { Https } from "@/tool/https";
-import { formatTime } from "@/tool/util";
-import { Modal, message } from "ant-design-vue";
 import RobotAssist from "@/component/HomePage/RobotAssist.vue";
-import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
-import { useI18n } from "vue-i18n";
 export default defineComponent({
     components: {
         HeaderComponent,
@@ -111,6 +65,7 @@ export default defineComponent({
     },
     setup() {
         let rangePickerValue: any = ref([]);
+        let rangeTimeValue: any = ref([]);
         let renameData: any = ref({}); //修改名字选中的数据
         const columns: any = computed(() => {
             return [
@@ -118,16 +73,22 @@ export default defineComponent({
                     title: 'Email',
                     align: "center",
                     ellipsis: true,
-                    width: 170,
-                    dataIndex: "email",
-                    key: "email",
+                    dataIndex: "userEmail",
+                    key: "userEmail",
+                },
+				{
+                    title: 'User Id',
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "accountId",
+                    key: "accountId",
                 },
                 {
-                    title: 'Create Time',
+                    title: 'User Name',
                     align: "center",
                     ellipsis: 200,
-                    dataIndex: "updateTime",
-                    key: "updateTime",
+                    dataIndex: "userName",
+                    key: "userName",
                     // customRender: (record: any) => {
                     //     let time = formatTime(
                     //         record.text / 1000,
@@ -137,56 +98,27 @@ export default defineComponent({
                     // },
                 },
 				{
-                    title: 'State',
+                    title: 'isTrial',
                     align: "center",
                     ellipsis: true,
-                    width: 150,
-                    dataIndex: "status",
-                    key: "status",
+                    dataIndex: "isTrial",
+                    key: "isTrial",
 					   customRender: (record: any) => {
                         let str
-						if(record.value == 0){
-							str ='pending'
-						}else if(record.value == 1){
-							str ='consent'
-						}else if(record.value == 2){
-							str ='reject'
+						if(record.value == 1){
+							str ='Yes'
+						}else{
+							str ='No'
 						}
                         return str;
                     },
                 },
                 {
-                    title: 'Address',
+                    title: 'Frequency',
                     align: "center",
                     ellipsis: true,
-                    width: 150,
-                    dataIndex: "country",
-                    key: "country",
-                },
-				{
-                    title: 'Surname',
-                    align: "center",
-                    ellipsis: true,
-                    width: 150,
-                    dataIndex: "surname",
-                    key: "surname",
-                },
-				{
-                    title: 'Name',
-                    align: "center",
-                    ellipsis: true,
-                    width: 150,
-                    dataIndex: "userName",
-                    key: "userName",
-                },
-                {
-                    title: 'Operations',
-                    key: "operation",
-                    align: "center",
-                    fixed: "right",
-                    width: 200,
-                    // slots:{customRender:'action'}
-                    Operations: true,
+                    dataIndex: "useDesignTimes",
+                    key: "useDesignTimes",
                 },
             ];
         });
@@ -209,17 +141,16 @@ export default defineComponent({
 				value:2,
 			},
 		])
-        let collectionList: any = ref([]);
+        let dataList: any = ref([]);
         let status: any = ref(0);
-        let voluntarily: any = ref(false);
         return {
             rangePickerValue,
+			rangeTimeValue,
             columns,
-            collectionList,
+            dataList,
             renameData,
             status,
 			state,
-			voluntarily,
         };
     },
     data() {
@@ -228,10 +159,6 @@ export default defineComponent({
             pageSize: 10,
             total: 0,
             historyTableHeight: 0,
-            newCollectionName: "",
-            renameVisivle: false, //修改名字弹窗
-            collectionName: "", //选中的名字
-            searchCollectionName: "",
         };
     },
     mounted() {
@@ -244,7 +171,7 @@ export default defineComponent({
         changePage(e: any) {
             this.currentPage = e.current;
             this.pageSize = e.pageSize;
-            this.gettrialList();
+            // this.gettrialList();
         },
 
         //查询列表
@@ -252,53 +179,33 @@ export default defineComponent({
             this.currentPage = 1;
             this.gettrialList();
         },
-		
-
 
 		//获取列表
         gettrialList() {
+			let startTime: any = this.rangeTimeValue[0]
+                ? this.rangeTimeValue[0]
+                : '00:00:00';
+            let endTime: any = this.rangeTimeValue[1]
+                ? this.rangeTimeValue[1]
+                : '00:00:00';
 			let startDate: any = this.rangePickerValue[0]
-                ? this.rangePickerValue[0]+' '+'00:00:00'
+                ? this.rangePickerValue[0]+' '+startTime
                 : "";
             let endDate: any = this.rangePickerValue[1]
-                ? this.rangePickerValue[1]+' '+'00:00:00'
+                ? this.rangePickerValue[1]+' '+endTime
                 : "";
 			let data = {
-				endTime:startDate,
-				startTime:endDate,
+				endTime:endDate,
+				startTime:startDate,
 			}
-			console.log(data);
-			
-			console.log(this.rangePickerValue,startDate,endDate);
 			Https.axiosGet(Https.httpUrls.getDesignStatistic,{params:data}).then((rv: any) => {
 				if (rv) {
-					console.log(rv);
-					
+					this.dataList = rv
 					// this.workspaceItem.position = this.singleTypeList[0].label
 				}
 			})
         },
-		setConsent(record: any, index: number){
-			const formData = new FormData()
-			formData.append('ids',record.id)
-			let config:any = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*'  }}
-			Https.axiosPost(Https.httpUrls.trialOrderApproval, {ids:record.id}).then(
-				(rv: any) => {
-					message.success('同意成功~')
-				}
-			);
-		},
-		setRefuse(record: any, index: number){
-			const formData = new FormData()
-			formData.append('ids',record.id)
-			let config:any = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*'  }}
-			Https.axiosPost(Https.httpUrls.trialOrderRefuse, formData,config).then(
-				(rv: any) => {
-					this.gettrialList();
-					message.success('拒绝成功~')
-				}
-			);
-		},
+		
         //删除分组
         // deleteGroup(record: any, index: number) {
         //     let deleteGroupFun = (id: any, index: number) => {
@@ -307,7 +214,7 @@ export default defineComponent({
         //         };
         //         Https.axiosPost(Https.httpUrls.deleteUserGroup, data).then(
         //             (rv: any) => {
-        //                 this.collectionList.splice(index, 1);
+        //                 this.dataList.splice(index, 1);
         //             }
         //         );
         //     };
@@ -329,144 +236,5 @@ export default defineComponent({
 });
 </script>
 <style lang="less">
-.test_cli {
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-    // min-width: 1440px;
-    position: relative;
-    .page_content {
-        position: relative;
-        .page_content_bg {
-            position: absolute;
-            width: 100%;
-            height: 100%;
-        }
 
-        .page_content_body {
-            position: absolute;
-            width: 100%;
-            height: 100%;
-            box-sizing: border-box;
-
-            .test_cli_body {
-                width: 100%;
-                height: calc(100% - 7rem);
-                box-sizing: border-box;
-                .trial_table_search {
-                    display: flex;
-                    align-items: center;
-                    margin-top: 5rem;
-					color: #fff;
-                    .range_picker {
-                        width: 36rem;
-                        height: 4.8rem;
-
-                        .ant-picker-input > input {
-                            font-size: 1.6rem;
-                        }
-
-                        .range_picker_icon {
-                            font-size: 2.2rem;
-                        }
-                    }
-                    .content_search_block {
-                        margin-left: 4rem;
-                        display: flex;
-
-                        .search_input {
-                            width: 32.8rem;
-                            padding-left: 1.5rem;
-                            height: 4.8rem;
-                            line-height: 4.6rem;
-                            background: #ffffff;
-                            border: 0.1rem solid #f1f1f1;
-                            font-size: 1.6rem;
-                            font-weight: 400;
-                            &::placeholder {
-                                color: #c2c2c2;
-                            }
-                        }
-
-                        .search_icon_block {
-                            width: 7.2rem;
-                            height: 4.8rem;
-                            line-height: 4.8rem;
-                            text-align: center;
-                            background: #343579;
-                            cursor: pointer;
-
-                            .icon-sousuo {
-                                font-size: 2rem;
-                                color: #ffffff;
-                            }
-                        }
-                    }
-                }
-
-                .trial_table_content {
-                    margin-top: 2.6rem;
-                    width: 100%;
-                    height: calc(100% - 13.7rem);
-                    background: rgba(255, 255, 255, 0.3);
-                    padding-bottom: 3rem;
-					border-radius: 2rem;
-					backdrop-filter: blur(3rem);
-					overflow: hidden;
-					box-shadow: 0px 0px 18px rgba(0, 0, 0, 0.38);
-                    .ant-table {
-                        background: transparent;
-                    }
-
-                    .ant-table-body {
-                        overflow-y: auto !important;
-                        -ms-overflow-style: none;
-                        overflow: -moz-scrollbars-none;
-
-                        &::-webkit-scrollbar {
-                            width: 0 !important;
-                        }
-                    }
-                    .ant-table-thead > tr > th {
-                        background: #ffffff00;
-						color: #fff;
-						border-bottom: none;
-						backdrop-filter: blur(1rem);
-                    }
-
-                    .ant-table-tbody > tr > td {
-                        border: none;
-                        background: transparent;
-						// color: #fff;
-                    }
-
-                    .ant-table-tbody > tr {
-                        &:hover > td {
-                            background: #ffffff3a;
-                        }
-                    }
-
-                    .ant-table-pagination-right {
-                        padding-right: 3.5rem;
-                    }
-
-                    .operate_list {
-                        display: flex;
-                        align-items: center;
-                        justify-content: space-between;
-                        padding: 0 1rem;
-
-                        .operate_item {
-                            font-size: 1.4rem;
-                            font-family: Roboto;
-                            font-weight: 400;
-                            color: #343579;
-                            cursor: pointer;
-                        }
-                    }
-                }
-            }
-        }
-    }
-}
 </style>

src/component/Administrator/allUser.vue

@@ -1,26 +1,13 @@
 <template>
     <div class="allUser_page">
 		<div class="allUser_table_search">
-			<!-- <div class="allUser_state">
-				<div class="allUser_state_item allUser_table_voluntarily">
-					<span>voluntarily:</span>
-					<a-switch v-model:checked="voluntarily" @change="setIsAutoApproval" />
-				</div>
-				<div class="allUser_state_item">
-					<span>State:</span>
-					<a-select v-model:value="currentState.value" size="large" style="width:280px" optionFilterProp="label" :options="state" placeholder="Please select" allowClear show-search></a-select>
-				</div>
-			</div>
-			<div class="allUser_search">
-				<div class="allUser_search_item" @click="searchHistoryList">Search</div>
-			</div> -->
 		</div>
 
 		<div class="allUser_table_content" ref="historyTable">
 			<a-table
 				:columns="columns"
-				:data-source="collectionList"
-				:scroll="{ y: historyTableHeight }"
+				:data-source="dataList"
+				:scroll="{ y: historyTableHeight}"
 				@change="changePage"
 				:pagination="{
 					showSizeChanger: true,
@@ -31,36 +18,11 @@
 					bordered: false,
 				}"
 			>
-				<template
+				<!-- <template
 					#bodyCell="{ column, text, record, index }"
 				>
-					<div
-						class="operate_list"
-						v-if="column?.Operations"
-					>
-						<div
-							v-show="status == 0"
-							class="operate_item"
-							@click="setConsent(record, index)"
-						>
-							consent
-						</div>
-						<div
-							v-show="status == 0"
-							class="operate_item"
-							@click="setRefuse(record, index)"
-						>
-							refuse
-						</div>
-						<!-- <div
-							class="operate_item"
-							@click="deleteGroup(record, index)"
-						>
-							Delete
-						</div> -->
-						
-					</div>
-				</template>
+					
+				</template> -->
 			</a-table>
 		</div>
     </div>
@@ -91,114 +53,68 @@ export default defineComponent({
                     title: 'Email',
                     align: "center",
                     ellipsis: true,
-                    width: 70,
+                    width: 30,
                     dataIndex: "email",
                     key: "email",
+					fixed: 'left',
+                },
+				{
+                    title: 'User Id',
+                    align: "center",
+                    width: 30,
+                    dataIndex: "id",
+                    key: "id",
+                },
+				{
+                    title: 'User Name',
+                    align: "center",
+                    ellipsis: true,
+                    width: 30,
+                    dataIndex: "userName",
+                    key: "userName",
+                },
+				{
+                    title: 'Given Name',
+                    align: "center",
+                    ellipsis: true,
+                    width: 30,
+                    dataIndex: "givenName",
+                    key: "givenName",
                 },
                 {
                     title: 'Create Time',
                     align: "center",
-                    width: 70,
-                    dataIndex: "updateTime",
-                    key: "updateTime",
-                    // customRender: (record: any) => {
-                    //     let time = formatTime(
-                    //         record.text / 1000,
-                    //         "YYYY-MM-DD hh:mm:ss"
-                    //     );
-                    //     return time;
-                    // },
+                    width: 30,
+                    dataIndex: "createTime",
+                    key: "createTime",
                 },
 				{
-                    title: 'State',
+                    title: 'Title',
                     align: "center",
                     ellipsis: true,
-                    width: 70,
-                    dataIndex: "status",
-                    key: "status",
-					   customRender: (record: any) => {
-                        let str
-						if(record.value == 0){
-							str ='pending'
-						}else if(record.value == 1){
-							str ='consent'
-						}else if(record.value == 2){
-							str ='reject'
-						}
-                        return str;
-                    },
+                    width: 30,
+                    dataIndex: "title",
+                    key: "title",
                 },
-                {
-                    title: 'Address',
+				{
+                    title: 'Country',
                     align: "center",
                     ellipsis: true,
-                    width: 70,
+                    width: 30,
                     dataIndex: "country",
                     key: "country",
+					fixed: 'right',
                 },
-				{
-                    title: 'Surname',
-                    align: "center",
-                    ellipsis: true,
-                    width: 70,
-                    dataIndex: "surname",
-                    key: "surname",
-                },
-				{
-                    title: 'Name',
-                    align: "center",
-                    ellipsis: true,
-                    width: 70,
-                    dataIndex: "userName",
-                    key: "userName",
-                },
-                {
-                    title: 'Operations',
-                    key: "operation",
-                    align: "center",
-                    fixed: "right",
-                    width: 70,
-                    // slots:{customRender:'action'}
-                    Operations: true,
-                },
+			
             ];
         });
-		let currentState = ref({
-				name:'all',
-				value:'',
-				state:false,
-			},)
-		let state:any = ref([
-			{
-				label:'all',
-				value:'',
-			},
-			{
-				label:'pending',
-				value:0,
-			},
-			{
-				label:'consent',
-				value:1,
-			},
-			{
-				label:'rejected',
-				value:2,
-			},
-		])
-        let collectionList: any = ref([]);
+        let dataList: any = ref([]);
         let userInfo: any = {};
-        let status: any = ref(0);
-        let voluntarily: any = ref(false);
         return {
             columns,
-            collectionList,
+            dataList,
             renameData,
             userInfo,
-            status,
-			currentState,
-			state,
-			voluntarily,
         };
     },
     data() {
@@ -219,80 +135,29 @@ export default defineComponent({
         this.gettrialList();
 		let userInfo:any = getCookie("userInfo")
         this.userInfo = JSON.parse(userInfo);
-		this.getIsAutoApproval()
     },
     methods: {
         //改变页码
         changePage(e: any) {
             this.currentPage = e.current;
             this.pageSize = e.pageSize;
-            this.gettrialList();
+            // this.gettrialList();
         },
-		//获取是否自动审批
-		getIsAutoApproval(){
-			Https.axiosPost(Https.httpUrls.getIsAutoApproval, {}).then(
-				(rv: any) => {
-					this.voluntarily = rv
-				}
-			);
-		},
 		//查询列表
 		searchHistoryList() {
             this.currentPage = 1;
             this.gettrialList();
         },
-		
-		setIsAutoApproval(){
-			Https.axiosPost(Https.httpUrls.switchIsAutoApproval, {}).then(
-				(rv: any) => {
-					this.getIsAutoApproval
-				}
-			);
-		},
 
 		//获取列表
         gettrialList() {
-            let data = {
-                page: this.currentPage,
-                size: this.pageSize,
-                status: this.currentState.value,
-                // startDate:startDate,
-                // endDate:endDate
-            };
-            Https.axiosPost(Https.httpUrls.trialOrderList, data).then(
-                (rv: any) => {
-                    this.collectionList = rv.content;
-                }
-            );
+			Https.axiosGet(Https.httpUrls.inquiryGetTrial).then((rv)=>{
+				console.log(rv);
+				this.dataList = rv
+				
+			})	
+           
         },
-		setConsent(record: any, index: number){
-			const formData = new FormData()
-			formData.append('ids',record.id)
-			let config:any = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*'  }}
-			Https.axiosPost(Https.httpUrls.trialOrderApproval, {ids:record.id}).then(
-				(rv: any) => {
-					message.success('同意成功~')
-				}
-			);
-		},
-		setRefuse(record: any, index: number){
-			const formData = new FormData()
-			formData.append('ids',record.id)
-			let config:any = {headers:{'Content-Type':'multipart/form-data','Accept':'*/*'  }}
-			Https.axiosPost(Https.httpUrls.trialOrderRefuse, formData,config).then(
-				(rv: any) => {
-					this.gettrialList();
-					message.success('拒绝成功~')
-				}
-			);
-		},
-		setState(){
-			this.currentState.state = true
-		},
-		setStateItem(item:any){
-			this.currentState = item
-			this.currentState.state = false
-		},
     },
 });
 </script>

src/component/Administrator/trialApproval.vue

@@ -1,22 +1,22 @@
 <template>
-    <div class="trial_page">
-		<div class="trial_table_search">
-			<div class="trial_state">
-				<div class="trial_state_item trial_table_voluntarily">
+    <div class="admin_page">
+		<div class="admin_table_search">
+			<div class="admin_state">
+				<div class="admin_state_item admin_table_voluntarily">
 					<span>voluntarily:</span>
 					<a-switch v-model:checked="voluntarily" @change="setIsAutoApproval" />
 				</div>
-				<div class="trial_state_item">
+				<div class="admin_state_item">
 					<span>State:</span>
 					<a-select v-model:value="currentState.value" size="large" style="width:280px" optionFilterProp="label" :options="state" placeholder="Please select" allowClear show-search></a-select>
 				</div>
 			</div>
-			<div class="trial_search">
-				<div class="trial_search_item" @click="searchHistoryList">Search</div>
+			<div class="admin_search">
+				<div class="admin_search_item" @click="searchHistoryList">Search</div>
 			</div>
 		</div>
 
-		<div class="trial_table_content" ref="historyTable">
+		<div class="admin_table_content" ref="historyTable">
 			<a-table
 				:columns="columns"
 				:data-source="collectionList"
@@ -297,139 +297,5 @@ export default defineComponent({
 });
 </script>
 <style lang="less">
-.trial_page {
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-    // min-width: 1440px;
-    position: relative;
-	
-	.trial_table_search {
-		display: flex;
-		margin-top: 2rem;
-		padding: 2rem 3.5rem 5rem 2.8rem;
-		background: #fff;
-		display: flex;
-		justify-content: space-between;
-		.trial_search{
-			width: 40%;
-			.trial_search_item{
-				background: #343579;
-				border-color: #343579;
-				height: 4rem;
-				padding: .64rem 1.5rem;
-				font-size: 1.6rem;
-				border-radius: 2px;
-				display: inline-block;
-				color: #fff;
-				cursor: pointer;
-			}
-		}
-		.trial_state {
-			position: relative;
-			cursor: pointer;
-			width: 60%;
-			.trial_state_item{
-				margin-right: 2rem;
-				margin-bottom: 2rem;
-				display: flex;
-				align-items: center;
-				>span{
-					font-size: 1.6rem;
-					font-weight: 400;
-					color: #030303;
-					margin-right: 15px;
-					flex-shrink: 0;
-					display: block;
-					min-width: 13rem;
-					text-align: right;
-				}
-			}
-			.trial_current{
-				background: #fff;
-				width: 100%;
-				display: flex;
-				align-items: center;
-				justify-content: space-between;
-			}
-			.header_user_content {
-				position: absolute;
-				border: 2px solid;
-				border-radius: 1rem;
-				overflow: hidden;
-				top: 0;
-				transform: translateY(6rem);
-				z-index: 2;
-				display: none;
-				margin-left: -2rem;
-				.username{
-					padding: 0 2rem;
-					color: #000;
-				}
-				.username:hover{
-					background: #e1e1e1;
-				}
-				&.active{
-					display: block;
-				}
-			}
-		}
-	}
 
-	.trial_table_content {
-		margin-top: 2.6rem;
-		width: 100%;
-		height: calc(100% - 13.7rem);
-		padding-bottom: 3rem;
-		background: #fff;
-		border-radius: 2rem;
-		overflow: hidden;
-		.ant-table {
-			background: transparent;
-		}
-
-		.ant-table-body {
-			overflow-y: auto !important;
-			-ms-overflow-style: none;
-			overflow: -moz-scrollbars-none;
-
-			&::-webkit-scrollbar {
-				width: 0 !important;
-			}
-		}
-		.ant-table-thead > tr > th {
-			background: #ffffff00;
-			border-bottom: none;
-			backdrop-filter: blur(1rem);
-		}
-
-		.ant-table-tbody > tr > td {
-			border: none;
-			background: transparent;
-			// color: #fff;
-		}
-		.ant-table-tbody > tr {
-			&:hover > td {
-				background: #ffffff3a;
-			}
-		}
-		.ant-table-pagination-right {
-			padding-right: 3.5rem;
-		}
-		.operate_list {
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-			padding: 0 1rem;
-
-			.operate_item {
-				font-size: 1.4rem;
-				font-family: Roboto;
-				font-weight: 400;
-				color: #343579;
-				cursor: pointer;
-			}
-		}
-	}
-}
 </style>

src/component/HomePage/ExportModel.vue

@@ -95,6 +95,30 @@
 							<div >Size:</div>
 							<input type="range" @input="setPencilWidth" min="1" max="50" v-model="canvasPencilWidth">
 						</label>
+						<label v-show="operation == 'pencil'">
+							<div >Brushwork:</div>
+							<a-select
+								ref="select"
+								class="label_select"
+								size="small"
+								v-model:value="brushworkValue"
+								style="flex: 1"
+								@change="brushworkChange"
+								>
+								<!-- v-model:value="brushwork" -->
+								<a-select-option class="label_select_item" v-for="item in brushList" :value="item.value">
+									<img :src="item.url" alt="">
+								</a-select-option>
+								<!-- <a-select-option value="Marking">Marking</a-select-option>
+								<a-select-option value="InkBrush">InkBrush</a-select-option>
+								<a-select-option value="CrayonBrush">CrayonBrush</a-select-option>
+								<a-select-option value="RibbonBrush">RibbonBrush</a-select-option>
+								<a-select-option value="MarkerBrush">MarkerBrush</a-select-option>
+								<a-select-option value="WritingBrush">WritingBrush</a-select-option>
+								<a-select-option value="LongfurBrush">LongfurBrush</a-select-option>
+								<a-select-option value="SpraypaintBrush">SpraypaintBrush</a-select-option> -->
+							</a-select>
+						</label>
 					</div>
 				</div>
 				<div class="exportCanvasBox_title" @click.stop="setCloseNav('move')">
@@ -577,6 +601,9 @@ export default defineComponent({
 				y: 0,
 				height: 0,
 			};
+			operation.value = 'move'
+			operation.value = 'fill'
+
 			
         };
         //设置画布宽高
@@ -720,6 +747,8 @@ export default defineComponent({
 					// reverseCanvasState.value.push(canvasAsJson);
 				}
 				normalCanvasState.value.push(canvasAsJson);
+				console.log(normalCanvasState.value);
+
 			if (isLoadCanvas) {
 				reverseCanvasState.value = []
 				isLoadCanvas = false;
@@ -747,12 +776,25 @@ export default defineComponent({
 		let operation = ref('move')
 		let operationMode = ref('fill')
 		//铅笔颜色 大小
+		let brushworkValue = ref('PencilBrush')
+		let brushworkChange = (value)=>{
+			brushworkValue.value = value
+			setPencil()
+		}
+
+		// let brushwork = ref('')
+		
 		let canvasPencilColor = ref('#000000')
 		let canvasPencilWidth = ref(20)
 		let setOperation = (str)=>{
 			operation.value = str
+			//折线图的时候切换其他形状或者笔触需要把未完成的折线图删掉
 			canvas.discardActiveObject();//取消所有选中边框
-			clearPatterning()//临时图形置为空并且添加撤回对象里面
+			if(createPatterningIs){
+				canvas.remove(currentPatterning)
+			}
+			canvas.remove(polyLineBtn)
+
 			if(str == 'pencil'){
 				setPencil()
 			}else if(str == 'move'){
@@ -779,15 +821,83 @@ export default defineComponent({
 			visible :true,
 			erasable: false,
         });
+		let hexToRgba=(hex, alpha)=> {
+			const r = parseInt(hex.slice(1, 3), 16);
+			const g = parseInt(hex.slice(3, 5), 16);
+			const b = parseInt(hex.slice(5, 7), 16);
+			return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+		}
+		let brushList = ref([
+			{
+				value:'PencilBrush',
+				url:'./image/brush/PencilBrush.jpg'
+			},{
+				value:'Marking',
+				url:'./image/brush/PencilBrush-2.jpg'
+			},{
+				value:'InkBrush',
+				url:'./image/brush/InkBrush.jpg'
+			},{
+				value:'CrayonBrush',
+				url:'./image/brush/CrayonBrush.jpg'
+			},{
+				value:'RibbonBrush',
+				url:'./image/brush/RibbonBrush.jpg'
+			},{
+				value:'MarkerBrush',
+				url:'./image/brush/MarkerBrush.jpg'
+			},{
+				value:'WritingBrush',
+				url:'./image/brush/WritingBrush.jpg'
+			},{
+				value:'LongfurBrush',
+				url:'./image/brush/LongfurBrush.jpg'
+			},{
+				value:'SpraypaintBrush',
+				url:'./image/brush/SpraypaintBrush.jpg'
+			},
+		])
 		let setPencil =()=>{
-            let pencil = new fabric.PencilBrush(canvas); //笔
+			let pencil
 			canvas.preserveObjectStacking = true;
 			canvas.isDrawingMode = true//开启绘画模式
+			if(brushworkValue.value == 'PencilBrush'){
+				pencil = new fabric.PencilBrush(canvas,{}); //普通笔
+			}else if(brushworkValue.value == 'Marking'){
+				pencil = new fabric.PencilBrush(canvas,); //记号笔
+			}else if(brushworkValue.value == 'InkBrush'){
+				pencil = new fabric.InkBrush(canvas,{}); //油画笔
+			}else if(brushworkValue.value=='CrayonBrush'){
+				pencil = new fabric.CrayonBrush(canvas,{}); //蜡笔
+			}else if(brushworkValue.value == 'RibbonBrush'){
+				pencil = new fabric.RibbonBrush(canvas,{width: 1,}); //色带
+			}else if(brushworkValue.value == 'MarkerBrush'){
+				pencil = new fabric.MarkerBrush(canvas,{}); //书写笔
+			}else if(brushworkValue.value == 'WritingBrush'){
+				pencil = new fabric.WritingBrush(canvas,{}); //毛笔
+			}else if(brushworkValue.value == 'LongfurBrush'){
+				pencil = new fabric.LongfurBrush(canvas,{width: 1,}); //色带
+			}else if(brushworkValue.value == 'SpraypaintBrush'){
+				pencil = new fabric.SpraypaintBrush(canvas,{}); //长毛刷
+			}
+			
             canvas.freeDrawingBrush = pencil
-            canvas.freeDrawingBrush.color = canvasPencilColor.value;
+			canvas.freeDrawingBrush.width = canvasPencilWidth.value;
+
+			if(brushworkValue.value == 'RibbonBrush' || brushworkValue.value == 'LongfurBrush'){
+				canvas.freeDrawingBrush.width = 1;
+			}
+			if(brushworkValue.value == 'Marking'){
+				canvas.freeDrawingBrush.color = hexToRgba(canvasPencilColor.value,.5);
+			}else if(brushworkValue.value == 'InkBrush'){
+				canvas.freeDrawingBrush.color = hexToRgba(canvasPencilColor.value,.2);
+			}else{
+				canvas.freeDrawingBrush.color = hexToRgba(canvasPencilColor.value,1);
+			}
+
 			brushIndicator.set('fill',canvasPencilColor.value)
 			canvas.freeDrawingBrush.isEraser = false
-			canvas.freeDrawingBrush.width = canvasPencilWidth.value;
+
 		}
 		
 		let setMove = () =>{
@@ -811,20 +921,32 @@ export default defineComponent({
 			clearTimeout(setTimeOut.color)
 			setTimeOut.color = setTimeout(()=>{
 				// brushIndicator.fill = canvasPencilColor.value;
+				
 				if(canvas.freeDrawingBrush.isEraser){
 
 				}else{
 					brushIndicator.set({fill: canvasPencilColor.value});
 				}
-				canvas.freeDrawingBrush.color = canvasPencilColor.value;
+				if(brushworkValue.value == 'Marking'){
+					canvas.freeDrawingBrush.color = hexToRgba(canvasPencilColor.value,.5);
+				}else if(brushworkValue.value == 'InkBrush'){
+					canvas.freeDrawingBrush.color = hexToRgba(canvasPencilColor.value,.2);
+				}else{
+					canvas.freeDrawingBrush.color = hexToRgba(canvasPencilColor.value,1);
+				}
 
-			},300)
+
+			},100)
 		}
 		let setPencilWidth = ()=>{//切换颜色给铅笔设置颜色
 			clearTimeout(setTimeOut.width)
 			canvasPencilWidth.value = Number(canvasPencilWidth.value)
 			setTimeOut.width = setTimeout(()=>{
-				canvas.freeDrawingBrush.width = canvasPencilWidth.value;
+				if(brushworkValue.value == 'LongfurBrush' || brushworkValue.value == 'RibbonBrush'){
+					canvas.freeDrawingBrush.width = 1;
+				}else{
+					canvas.freeDrawingBrush.width = canvasPencilWidth.value;
+				}
 				// setPencil()
 			},300)
 		}
@@ -912,8 +1034,10 @@ export default defineComponent({
 		let setCanvasUp = (event)=>{
 			upPoint = event.absolutePointer
 			if(canvas.isDrawingMode){
-				canvas.remove(brushIndicator)
-				updateCanvasState()
+				setTimeout(() => {
+					canvas.remove(brushIndicator)
+					updateCanvasState()
+				}, 100);
 			}else{
 				// event.target && (event.target.bringToFront())//设置优先级
 			}
@@ -946,47 +1070,56 @@ export default defineComponent({
 			}
 		}
 		let setHDExport = ()=>{
-			let selectedObject = canvas.getActiveObject();
-			if (selectedObject && selectedObject.type === 'image') {
-				// 如果是图片对象，则可以对其进行操作
-				let selectedImage = selectedObject;
-				let img = new Image
-				img.src = selectedImage.getSrc()
-				img.onload = ()=>{
-					console.log(img.width,img.height);
-				}
-				// 输出图片对象的 URL
-				console.log('Selected image URL:', selectedImage.getSrc());
-			} else {
-				console.log('No image selected.');
-			}
+			var activeObjects = canvas.getActiveObjects();
+			var group = new fabric.Group(activeObjects, {
+			// 组的属性设置
+			});
+
+			// 创建一个新的 Canvas
+			var exportCanvas = new fabric.StaticCanvas(null, {
+			width: group.width,
+			height: group.height
+			});
+
+			// 将组添加到新的 Canvas 上
+			canvas.add(group);
+
+			// 导出 Canvas 为图像数据
+			var imageDataURL = exportCanvas.toDataURL({
+			format: 'png',
+			quality: 1
+			});
+			console.log(imageDataURL);
 		}
         onMounted(() => {});
 
         return {
-            showUpgradePlan,
-            canvasWH,
-			credits,
-            init,
-            setExport,
-            cancelDsign,
-            setMaxInput,
-            isShowMark,
-            allBoardData,
-			closeNav,
-			setCloseNav,
-			multiselect,
-			onDragstart,
-			historyState,
-			operation,
-			operationMode,
-			setOperation,
-			setOperationMode,
-			canvasPencilColor,
-			canvasPencilWidth,
-			setPencilColor,
-			setPencilWidth,
-			setHDExport,
+            showUpgradePlan,//当前弹窗是否打开
+            canvasWH,//画布初始宽高
+			credits,//积分 用来判断HD导出积分是否够用
+            init,//首页点击导出后初始化
+            setExport,//导出所有内容
+            cancelDsign,//关闭画布
+            setMaxInput,//设置画布宽高
+            isShowMark,//加载遮罩
+            allBoardData,//选择画布所有内容
+			closeNav,//导航展开或者收起来状态
+			setCloseNav,//给图片导航或者工具收起来或者展开
+			multiselect,//获取整体高度
+			onDragstart,//拖拽函数
+			historyState,//执行撤回或者反撤回
+			operation,//设置当前鼠标状态绘画或者矩形或者移动
+			operationMode,//设置矩形是边框还是填充
+			setOperation,//设置当前鼠标状态绘画或者矩形或者移动方法
+			setOperationMode,//设置矩形是边框还是填充方法
+			brushList,//笔触列表
+			canvasPencilColor,//input选择颜色
+			canvasPencilWidth,//input选择宽度
+			setPencilColor,//切换颜色执行函数 给当前矩形或者笔触设置颜色
+			setPencilWidth,//切换宽度执行函数 给当前矩形或者笔触设置宽度
+			setHDExport,//高清导出选择的图片
+			brushworkChange,//切换笔触的回调
+			brushworkValue,//当前笔触
         };
     },
     data(prop) {
@@ -1090,12 +1223,20 @@ export default defineComponent({
                 display: flex;
 				align-items: center;
 				margin-bottom: 1rem;
+				width: 100%;
                 div {
-                    width: 5rem;
+                    width: 8rem;
                 }
                 input {
-                    width: 10em;
+                    // width: 10em;
+					flex: 1;
+					overflow: hidden;
                 }
+				.label_select{
+					img{
+						width: 100%;
+					}
+				}
             }
 			.exportCanvasBox_left_item.closeNav{
 				// max-height: 1000rem;
@@ -1163,6 +1304,7 @@ export default defineComponent({
 					&.leftAlign{
 						justify-content: flex-start;
 					}
+				
 					i{
 						font-size: 2.5rem;
 						cursor: pointer;
@@ -1243,5 +1385,17 @@ export default defineComponent({
             font-size: calc(1.6rem * 1.2);
         }
     }
+	.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector{
+		border-color: #d9d9d9;
+		box-shadow: none;
+	}
+	.ant-select:hover .ant-select-selector{
+		border-color: #d9d9d9;
+	}
+}
+.label_select_item{
+	img{
+		width: 100%;
+	}
 }
 </style>

src/component/HomePage/Header.vue

@@ -415,11 +415,11 @@ export default defineComponent({
 				})
 			}else{
 				await Https.axiosPost(Https.httpUrls.accountLogout, data).then((rv) => {
-					this.$router.replace("/login");
 					WriteCookie("token");
 				});
+				this.$router.replace("/login");
 			}
-			window.location.reload()
+			// window.location.reload()
             
         },
 

src/component/Pay/allOrder.vue

@@ -0,0 +1,338 @@
+<template>
+    <div class="allOrder_page">
+		<div class="allOrder_table_search">
+			<!-- <a-range-picker
+					class="range_picker"
+					v-model:value="rangePickerValue"
+					:placeholder="[
+						$t('HistoryPage.StartDate'),
+						$t('HistoryPage.EndDate'),
+					]"
+					valueFormat="YYYY-MM-DD"
+				>
+					<template #suffixIcon>
+						<span
+							class="icon iconfont range_picker_icon icon-rili"
+						></span>
+					</template>
+				</a-range-picker> -->
+				<!-- <div class="content_search_block">
+					<input
+						class="search_input"
+						:placeholder="
+							$t('HistoryPage.inputContent1')
+						"
+						v-model="searchCollectionName"
+						@keydown.enter="searchAllOrderList()"
+					/>
+					<div
+						class="search_icon_block"
+						@click="searchAllOrderList()"
+					>
+						<span
+							class="icon iconfont icon-sousuo"
+						></span>
+					</div>
+				</div> -->
+		</div>
+		<div class="allOrder_table_content" ref="historyTable">
+			<a-table
+				:columns="columns"
+				:data-source="collectionList"
+				:scroll="{ y: historyTableHeight }"
+				@change="changePage"
+				:pagination="{
+					showSizeChanger: true,
+					current: currentPage,
+					pageSize: pageSize,
+					total: total,
+					showQuickJumper: true,
+					bordered: false,
+				}"
+			>
+				<template
+					#bodyCell="{ column, text, record, index }"
+				>
+					<div
+						class="operate_list"
+						v-if="column?.Operations"
+					>
+						<!-- <div
+							v-if="record.orderStatus == '支付成功'"
+							class="operate_item"
+							@click="refund(record)"
+						>
+							refund
+						</div> -->
+						<div class="operate_item">{{ $t('HistoryPage.Delete') }}</div>
+					</div>
+				</template>
+			</a-table>
+		</div>
+    </div>
+</template>
+<script lang="ts">
+import { defineComponent, ref, createVNode, computed } from "vue";
+import { Https } from "@/tool/https";
+import { useI18n } from "vue-i18n";
+export default defineComponent({
+    components: {
+    },
+    setup() {
+        let renameData: any = ref({}); //修改名字选中的数据
+        const columns: any = computed(() => {
+            return [
+                {
+                    title: "Serial",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "orderNo",
+                    key: "orderNo",
+                },
+                {
+                    title: "Title",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "title",
+                    key: "title",
+                },
+                {
+                    title: "Money",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "totalFee",
+                    key: "totalFee",
+                },
+                {
+                    title: "Payment",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "paymentType",
+                    key: "paymentType",
+                },
+                {
+                    title: "State",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "orderStatus",
+                    key: "orderStatus",
+                },
+
+                // {
+                //     title: useI18n().t("HistoryPage.Operations"),
+                //     key: "operation",
+                //     align: "center",
+                //     // slots:{customRender:'action'}
+                //     Operations: true,
+                // },
+            ];
+        });
+        let dataList: any = ref([]);
+        let rangePickerValue: any = ref([]);
+        let collectionList: any = ref([]);
+        let allDataList: any = ref([]);
+        let userInfo: any = {};
+        return {
+            columns,
+            dataList,
+            renameData,
+			rangePickerValue,
+			collectionList,
+			allDataList,
+            userInfo,
+        };
+    },
+    data() {
+        return {
+            currentPage: 1,
+            pageSize: 10,
+            total: 0,
+            historyTableHeight: 0,
+            searchCollectionName: "",
+        };
+    },
+    mounted() {
+        let historyTable: any = this.$refs.historyTable;
+        this.historyTableHeight = historyTable.clientHeight - 130;
+    },
+    methods: {
+		init(){
+			this.currentPage = 1
+			this.pageSize = 10
+			this.getAllOrderList()
+		},
+        //改变页码
+        changePage(e: any) {
+            this.currentPage = e.current;
+            this.pageSize = e.pageSize;
+			this.collectionList = this.allDataList.slice(
+				(this.currentPage - 1) * this.pageSize,
+				(this.currentPage - 1) * this.pageSize + this.pageSize
+			);
+        },
+		//查询列表
+		searchAllOrderList() {
+            this.currentPage = 1;
+            this.getAllOrderList();
+        },
+		//获取列表
+        getAllOrderList() {
+            let startDate: any = this.rangePickerValue
+                ? new Date(this.rangePickerValue[0]).getTime()
+                : "";
+            let endDate: any = this.rangePickerValue
+                ? new Date(this.rangePickerValue[1]).getTime()
+                : "";
+        
+
+            Https.axiosGet(Https.httpUrls.orderInfoList).then((rv: any) => {
+                this.total = rv.length;
+                this.allDataList = rv
+				this.collectionList = this.allDataList.slice(
+					(this.currentPage - 1) * this.pageSize,
+					(this.currentPage - 1) * this.pageSize + this.pageSize
+				);
+				
+            });
+        },
+    },
+});
+</script>
+<style lang="less">
+.allOrder_page {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    // min-width: 1440px;
+    position: relative;
+	display: flex;
+	flex-direction: column;
+	.allOrder_table_search {
+		display: flex;
+		margin-top: 2rem;
+		padding: 2rem 3.5rem 5rem 2.8rem;
+		background: #fff;
+		display: flex;
+		justify-content: space-between;
+		.allOrder_search{
+			width: 40%;
+			.allOrder_search_item{
+				background: #343579;
+				border-color: #343579;
+				height: 4rem;
+				padding: .64rem 1.5rem;
+				font-size: 1.6rem;
+				border-radius: 2px;
+				display: inline-block;
+				color: #fff;
+				cursor: pointer;
+			}
+		}
+		.allOrder_state {
+			position: relative;
+			cursor: pointer;
+			width: 60%;
+			.allOrder_state_item{
+				margin-right: 2rem;
+				margin-bottom: 2rem;
+				display: flex;
+				align-items: center;
+				>span{
+					font-size: 1.6rem;
+					font-weight: 400;
+					color: #030303;
+					margin-right: 15px;
+					flex-shrink: 0;
+					display: block;
+					min-width: 13rem;
+					text-align: right;
+				}
+			}
+			.allOrder_current{
+				background: #fff;
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+			}
+			.header_user_content {
+				position: absolute;
+				border: 2px solid;
+				border-radius: 1rem;
+				overflow: hidden;
+				top: 0;
+				transform: translateY(6rem);
+				z-index: 2;
+				display: none;
+				margin-left: -2rem;
+				.username{
+					padding: 0 2rem;
+					color: #000;
+				}
+				.username:hover{
+					background: #e1e1e1;
+				}
+				&.active{
+					display: block;
+				}
+			}
+		}
+	}
+
+	.allOrder_table_content {
+		width: 100%;
+		// height: 100%;
+		flex: 1;
+		padding-bottom: 3rem;
+		background: #fff;
+		border-radius: 2rem;
+		overflow: hidden;
+		.ant-table {
+			background: transparent;
+		}
+
+		.ant-table-body {
+			overflow-y: auto !important;
+			-ms-overflow-style: none;
+			overflow: -moz-scrollbars-none;
+
+			&::-webkit-scrollbar {
+				width: 0 !important;
+			}
+		}
+		.ant-table-thead > tr > th {
+			background: #ffffff00;
+			border-bottom: none;
+			backdrop-filter: blur(1rem);
+		}
+
+		.ant-table-tbody > tr > td {
+			border: none;
+			background: transparent;
+			// color: #fff;
+		}
+		.ant-table-tbody > tr {
+			&:hover > td {
+				background: #ffffff3a;
+			}
+		}
+		.ant-table-pagination-right {
+			padding-right: 3.5rem;
+		}
+		.operate_list {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 1rem;
+
+			.operate_item {
+				font-size: 1.4rem;
+				font-family: Roboto;
+				font-weight: 400;
+				color: #343579;
+				cursor: pointer;
+			}
+		}
+	}
+}
+</style>

src/component/Pay/creditsDetail.vue

@@ -0,0 +1,339 @@
+<template>
+    <div class="creditsDetail_page">
+		<div class="creditsDetail_table_search">
+			<!-- <a-range-picker
+					class="range_picker"
+					v-model:value="rangePickerValue"
+					:placeholder="[
+						$t('HistoryPage.StartDate'),
+						$t('HistoryPage.EndDate'),
+					]"
+					valueFormat="YYYY-MM-DD"
+				>
+					<template #suffixIcon>
+						<span
+							class="icon iconfont range_picker_icon icon-rili"
+						></span>
+					</template>
+				</a-range-picker> -->
+				<!-- <div class="content_search_block">
+					<input
+						class="search_input"
+						:placeholder="
+							$t('HistoryPage.inputContent1')
+						"
+						v-model="searchCollectionName"
+						@keydown.enter="searchCreditDetailList()"
+					/>
+					<div
+						class="search_icon_block"
+						@click="searchCreditDetailList()"
+					>
+						<span
+							class="icon iconfont icon-sousuo"
+						></span>
+					</div>
+				</div> -->
+		</div>
+		<div class="creditsDetail_table_content" ref="historyTable">
+			<a-table
+				:columns="columns"
+				:data-source="collectionList"
+				:scroll="{ y: historyTableHeight }"
+				@change="changePage"
+				:pagination="{
+					showSizeChanger: true,
+					current: currentPage,
+					pageSize: pageSize,
+					total: total,
+					showQuickJumper: true,
+					bordered: false,
+				}"
+			>
+				<template
+					#bodyCell="{ column, text, record, index }"
+				>
+					<div
+						class="operate_list"
+						v-if="column?.Operations"
+					>
+						<!-- <div
+							v-if="record.orderStatus == '支付成功'"
+							class="operate_item"
+							@click="refund(record)"
+						>
+							refund
+						</div> -->
+						<div class="operate_item">{{ $t('HistoryPage.Delete') }}</div>
+					</div>
+				</template>
+			</a-table>
+		</div>
+    </div>
+</template>
+<script lang="ts">
+import { defineComponent, ref, createVNode, computed } from "vue";
+import { Https } from "@/tool/https";
+import { formatTime } from "@/tool/util";
+import { useI18n } from "vue-i18n";
+export default defineComponent({
+    components: {
+    },
+    setup() {
+        let renameData: any = ref({}); //修改名字选中的数据
+        const columns: any = computed(() => {
+            return [
+                {
+                    title: "Serial",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "orderNo",
+                    key: "orderNo",
+                },
+                {
+                    title: "Title",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "title",
+                    key: "title",
+                },
+                {
+                    title: "Money",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "totalFee",
+                    key: "totalFee",
+                },
+                {
+                    title: "Payment",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "paymentType",
+                    key: "paymentType",
+                },
+                {
+                    title: "State",
+                    align: "center",
+                    ellipsis: true,
+                    dataIndex: "orderStatus",
+                    key: "orderStatus",
+                },
+
+                // {
+                //     title: useI18n().t("HistoryPage.Operations"),
+                //     key: "operation",
+                //     align: "center",
+                //     // slots:{customRender:'action'}
+                //     Operations: true,
+                // },
+            ];
+        });
+        let dataList: any = ref([]);
+        let rangePickerValue: any = ref([]);
+        let allDataList: any = ref([]);
+        let collectionList: any = ref([]);
+        let userInfo: any = {};
+        return {
+            columns,
+            dataList,
+            renameData,
+			rangePickerValue,
+			allDataList,
+			collectionList,
+            userInfo,
+        };
+    },
+    data() {
+        return {
+            currentPage: 1,
+            pageSize: 10,
+            total: 0,
+            historyTableHeight: 0,
+            searchCollectionName: "",
+        };
+    },
+    mounted() {
+        let historyTable: any = this.$refs.historyTable;
+        this.historyTableHeight = historyTable.clientHeight - 130;
+    },
+    methods: {
+		init(){
+			this.currentPage = 1
+			this.pageSize = 10
+			this.getCreditDetailList()
+		},
+        //改变页码
+		changePage(e: any) {
+            this.currentPage = e.current;
+            this.pageSize = e.pageSize;
+			this.collectionList = this.allDataList.slice(
+				(this.currentPage - 1) * this.pageSize,
+				(this.currentPage - 1) * this.pageSize + this.pageSize
+			);
+        },
+		//查询列表
+		searchCreditDetailList() {
+            this.currentPage = 1;
+            this.getCreditDetailList();
+        },
+		//获取列表
+        getCreditDetailList() {
+            let startDate: any = this.rangePickerValue
+                ? new Date(this.rangePickerValue[0]).getTime()
+                : "";
+            let endDate: any = this.rangePickerValue
+                ? new Date(this.rangePickerValue[1]).getTime()
+                : "";
+        
+
+            Https.axiosGet(Https.httpUrls.orderInfoList).then((rv: any) => {
+                this.total = rv.length;
+                this.allDataList = rv
+				this.collectionList = this.allDataList.slice(
+					(this.currentPage - 1) * this.pageSize,
+					(this.currentPage - 1) * this.pageSize + this.pageSize
+				);
+				
+            });
+        },
+    },
+});
+</script>
+<style lang="less">
+.creditsDetail_page {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    // min-width: 1440px;
+    position: relative;
+	display: flex;
+	flex-direction: column;
+	.creditsDetail_table_search {
+		display: flex;
+		margin-top: 2rem;
+		padding: 2rem 3.5rem 5rem 2.8rem;
+		background: #fff;
+		display: flex;
+		justify-content: space-between;
+		.creditsDetail_search{
+			width: 40%;
+			.creditsDetail_search_item{
+				background: #343579;
+				border-color: #343579;
+				height: 4rem;
+				padding: .64rem 1.5rem;
+				font-size: 1.6rem;
+				border-radius: 2px;
+				display: inline-block;
+				color: #fff;
+				cursor: pointer;
+			}
+		}
+		.creditsDetail_state {
+			position: relative;
+			cursor: pointer;
+			width: 60%;
+			.creditsDetail_state_item{
+				margin-right: 2rem;
+				margin-bottom: 2rem;
+				display: flex;
+				align-items: center;
+				>span{
+					font-size: 1.6rem;
+					font-weight: 400;
+					color: #030303;
+					margin-right: 15px;
+					flex-shrink: 0;
+					display: block;
+					min-width: 13rem;
+					text-align: right;
+				}
+			}
+			.creditsDetail_current{
+				background: #fff;
+				width: 100%;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+			}
+			.header_user_content {
+				position: absolute;
+				border: 2px solid;
+				border-radius: 1rem;
+				overflow: hidden;
+				top: 0;
+				transform: translateY(6rem);
+				z-index: 2;
+				display: none;
+				margin-left: -2rem;
+				.username{
+					padding: 0 2rem;
+					color: #000;
+				}
+				.username:hover{
+					background: #e1e1e1;
+				}
+				&.active{
+					display: block;
+				}
+			}
+		}
+	}
+
+	.creditsDetail_table_content {
+		width: 100%;
+		// height: 100%;
+		flex: 1;
+		padding-bottom: 3rem;
+		background: #fff;
+		border-radius: 2rem;
+		overflow: hidden;
+		.ant-table {
+			background: transparent;
+		}
+
+		.ant-table-body {
+			overflow-y: auto !important;
+			-ms-overflow-style: none;
+			overflow: -moz-scrollbars-none;
+
+			&::-webkit-scrollbar {
+				width: 0 !important;
+			}
+		}
+		.ant-table-thead > tr > th {
+			background: #ffffff00;
+			border-bottom: none;
+			backdrop-filter: blur(1rem);
+		}
+
+		.ant-table-tbody > tr > td {
+			border: none;
+			background: transparent;
+			// color: #fff;
+		}
+		.ant-table-tbody > tr {
+			&:hover > td {
+				background: #ffffff3a;
+			}
+		}
+		.ant-table-pagination-right {
+			padding-right: 3.5rem;
+		}
+		.operate_list {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 1rem;
+
+			.operate_item {
+				font-size: 1.4rem;
+				font-family: Roboto;
+				font-weight: 400;
+				color: #343579;
+				cursor: pointer;
+			}
+		}
+	}
+}
+</style>

src/component/Pay/payOrder.vue

@@ -10,129 +10,22 @@
         wrapClassName="#app"
         :keyboard="false"
     >
+		
         <div class="closeIcon">
-            <!-- <div class="header_right_block" @click.stop="">
-			<div class="header_cancel_button" >Cancel</div>
-		</div> -->
             <i class="fi fi-rr-cross-small" @click.stop="cancelDsign()"></i>
         </div>
-        <div class="history_page">
-            <div class="page_content">
-                <div class="page_content_body">
-                    <div class="history_page_body">
-                        <div class="history_table_search">
-                            <!-- <a-range-picker
-                                class="range_picker"
-                                v-model:value="rangePickerValue"
-                                :placeholder="[
-                                    $t('HistoryPage.StartDate'),
-                                    $t('HistoryPage.EndDate'),
-                                ]"
-                                valueFormat="YYYY-MM-DD"
-                            >
-                                <template #suffixIcon>
-                                    <span
-                                        class="icon iconfont range_picker_icon icon-rili"
-                                    ></span>
-                                </template>
-                            </a-range-picker> -->
-                            <div class="content_search_block">
-                                <input
-                                    class="search_input"
-                                    :placeholder="
-                                        $t('HistoryPage.inputContent1')
-                                    "
-                                    v-model="searchCollectionName"
-                                    @keydown.enter="searchHistoryList()"
-                                />
-                                <div
-                                    class="search_icon_block"
-                                    @click="searchHistoryList()"
-                                >
-                                    <span
-                                        class="icon iconfont icon-sousuo"
-                                    ></span>
-                                </div>
-                            </div>
-                        </div>
+        <div class="payOrder_page">
+			<div class="payOrder_page_title">
+				<div class="payOrder_page_title_item" @click="setState('paypal')" :class="{active:presentState == 'paypal'}">订单信息</div>
+				<div class="payOrder_page_title_item" @click="setState('credits')" :class="{active:presentState == 'credits'}">积分信息</div>
+			</div>
 
-                        <div class="history_table_content" ref="historyTable">
-                            <a-table
-                                :columns="columns"
-                                :data-source="collectionList"
-                                :scroll="{ y: historyTableHeight }"
-                                @change="changePage"
-                                :pagination="{
-                                    showSizeChanger: true,
-                                    current: currentPage,
-                                    pageSize: pageSize,
-                                    total: total,
-                                    showQuickJumper: true,
-                                    bordered: false,
-                                }"
-                            >
-                                <template
-                                    #bodyCell="{ column, text, record, index }"
-                                >
-                                    <div
-                                        class="operate_list"
-                                        v-if="column?.Operations"
-                                    >
-                                        <div
-											v-if="record.orderStatus == '支付成功'"
-                                            class="operate_item"
-                                            @click="refund(record)"
-                                        >
-                                            refund
-                                        </div>
-                                        <div class="operate_item">{{ $t('HistoryPage.Delete') }}</div>
-                                    </div>
-                                </template>
-                            </a-table>
-                        </div>
-                    </div>
-                </div>
-            </div>
+			<div class="payOrder_table_content" ref="historyTable">
+				<creditsDetail ref="creditsDetail" v-show="presentState == 'credits'"></creditsDetail>
+				<allOrder ref="allOrder" v-show="presentState == 'paypal'"></allOrder>
+			</div>
         </div>
-		<a-modal
-			class="modal_component refund_reason"
-			v-model:visible="showRefundReason"
-			:footer="null"
-			width="50%"
-			:maskClosable="false"
-			:mask="false"
-			:centered="true"
-			:closable="false"
-			wrapClassName="#app"
-			:keyboard="false"
-		>
-			<div class="closeIcon">
-				<!-- <div class="header_right_block" @click.stop="">
-				<div class="header_cancel_button" >Cancel</div>
-			</div> -->
-				<i class="fi fi-rr-cross-small" @click.stop="cancelRefundreason()"></i>
-			</div>
-			<div class="modal_title_text">
-				Refund Reason
-			</div>
-			<div class="reason">
-				<label>
-					<div>
-						<input name="reason" type="radio" @click="getReasonCategory" value="noLike" v-model="reason">
-						<span>Dislike</span>
-					</div>
-				</label>
-				<label>
-					<div>
-						<input name="reason" type="radio" @click="getReasonCategory" value="Rests" v-model="reason">
-						<span>Rests</span>
-					</div>
-					
-					<textarea v-show="reason == 'Rests'" name="" id="" cols="40" rows="10" v-model="reasonTextarea"></textarea>
-				</label>
-			</div>
-			<div class="subitOkPreviewBtn" @click="setReason">OK</div>
-		</a-modal>
+	
     </a-modal>
 	<div class="mark_loading" v-show="loadingShow">
 		<a-spin size="large" />
@@ -144,234 +37,50 @@ import { Https } from "@/tool/https";
 import { formatTime } from "@/tool/util";
 import { Modal, message } from "ant-design-vue";
 import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
+import allOrder from "@/component/Pay/allOrder.vue";
+import creditsDetail from "@/component/Pay/creditsDetail.vue";
 import { useI18n } from "vue-i18n";
 export default defineComponent({
     components: {
+		creditsDetail,
+		allOrder,
     },
     setup() {
-        let rangePickerValue: any = ref([]);
-        let renameData: any = ref({}); //修改名字选中的数据
-        const columns: any = computed(() => {
-            return [
-                {
-                    title: "Serial",
-                    align: "center",
-                    ellipsis: true,
-                    width: 90,
-                    dataIndex: "orderNo",
-                    key: " ",
-                },
-                {
-                    title: "Title",
-                    align: "center",
-                    ellipsis: true,
-                    width: 90,
-                    dataIndex: "title",
-                    key: "sketchCounts",
-                },
-                // { title: useI18n().t('HistoryPage.UptateTime'), align:'center', ellipsis: true,width: 90, dataIndex: 'updateDate', key: 'updateTime',customRender:(record:any)=>{
-                // 	// let time = formatTime(record.text / 1000, 'YYYY-MM-DD hh:mm:ss')
-                // 	return record.record.updateTime
-                // }},
-                {
-                    title: "Money",
-                    align: "center",
-                    ellipsis: true,
-                    width: 90,
-                    dataIndex: "totalFee",
-                    key: "sketchCounts",
-                },
-                {
-                    title: "Payment",
-                    align: "center",
-                    ellipsis: true,
-                    width: 90,
-                    dataIndex: "paymentType",
-                    key: "sketchCounts",
-                },
-                {
-                    title: "State",
-                    align: "center",
-                    ellipsis: true,
-                    width: 90,
-                    dataIndex: "orderStatus",
-                    key: "sketchCounts",
-                },
-
-                {
-                    title: useI18n().t("HistoryPage.Operations"),
-                    key: "operation",
-                    align: "center",
-                    fixed: "left",
-                    width: 90,
-                    // slots:{customRender:'action'}
-                    Operations: true,
-                },
-            ];
-        });
+        let presentState: any = ref('paypal');
         let showPayOrder: any = ref(false);
-        let showRefundReason: any = ref(false);
-        let collectionList: any = ref([]);
-        let record: any = ref();//订单编号
-        let reason: any = ref('noLike');//原因
-        let reasonTextarea: any = ref();//原因
         let loadingShow: any = ref(false);//原因
         let { t } = useI18n();
         return {
-            rangePickerValue,
-            columns,
-            collectionList,
+            presentState,
             showPayOrder,
-			showRefundReason,
-			record,
-			reason,
-			reasonTextarea,
-            renameData,
 			loadingShow,
             t,
         };
     },
     data() {
         return {
-            currentPage: 1,
-            pageSize: 10,
-            total: 0,
-            historyTableHeight: 0,
-            newCollectionName: "",
-            groupDetails: {}, //每个collection的详情
-            collectionName: "", //选中的名字
-            searchCollectionName: "",
         };
     },
     mounted() {},
     methods: {
         init() {
             this.showPayOrder = true;
-            this.getHistoryList();
-            nextTick().then(() => {
-                let history_table_content = document.getElementsByClassName(
-                    "history_table_content"
-                )[0];
-                this.historyTableHeight =
-                    history_table_content.scrollHeight - 130;
-            });
         },
-        cancelDsign() {//关闭订单页面
-            this.showPayOrder = false;
-        },
-		cancelRefundreason(){//关闭退款页面
-			this.record = ''
-            this.showRefundReason = false;
-		},
-        //改变页码
-        changePage(e: any) {
-            this.currentPage = e.current;
-            this.pageSize = e.pageSize;
-            this.getHistoryList();
-        },
-
-        //查询列表
-        searchHistoryList() {
-            this.currentPage = 1;
-            this.getHistoryList();
-        },
-
-        getHistoryList() {
-            let startDate: any = this.rangePickerValue
-                ? new Date(this.rangePickerValue[0]).getTime()
-                : "";
-            let endDate: any = this.rangePickerValue
-                ? new Date(this.rangePickerValue[1]).getTime()
-                : "";
-            let data = {
-                page: this.currentPage,
-                size: this.pageSize,
-                collectionName: this.searchCollectionName,
-                startDate: startDate,
-                endDate: endDate,
-            };
-
-            Https.axiosGet(Https.httpUrls.orderInfoList).then((rv: any) => {
-                this.total = rv.length;
-                this.collectionList = rv.slice(
-                    (this.currentPage - 1) * this.pageSize,
-                    (this.currentPage - 1) * this.pageSize + this.pageSize
-                );
-				
-            });
-            // Https.axiosPost( Https.httpUrls.queryUserGroup, data).then(
-            //     (rv: any) => {
-            //         this.collectionList = rv.content
-            //         this.total = rv.total
-            //     }
-            // );
-        },
-
-        //删除分组
-        // deleteGroup(record:any,index:number){
-        //     let deleteGroupFun = (id:any,index:number) =>{
-        //         let data = {
-        //             userGroupId:id
-        //         }
-        //         Https.axiosPost(Https.httpUrls.deleteUserGroup,data).then(
-        //             (rv: any) => {
-        //                 message.success(this.t('HistoryPage.jsContent1'))
-        //                 this.collectionList.splice(index,1)
-        //             }
-        //         );
-        //     }
-        //     Modal.confirm({
-        //         title: this.t('HistoryPage.jsContent2'),
-        //         icon: createVNode(ExclamationCircleOutlined),
-        //         okText: 'Yes',
-        //         cancelText: 'No',
-        //         centered:true,
-        // 		mask:false,
-        //         onOk() {
-        //             deleteGroupFun(record.id,index)
-        //         }
-        //     });
-        // },
-
-        refund(record: any) {
-            // this.$router.push({name:'home',params: {id:record.id}})
-			this.record = record
-			this.showRefundReason = true
-        },
-		getReasonCategory(){
-			if(this.reason == 'Rests'){
+		setState(str:any){
+			this.presentState = str
+			let setInit:any
+			if(str == 'paypal'){
+				setInit = this.$refs.creditsDetail
 			}else{
-				this.reasonTextarea = ''
+				setInit = this.$refs.allOrder
 			}
-		},
-		setReason(){
-			let reason = this.reason
-			this.loadingShow = true
-			if(this.reason == 'Rests'){
-				reason = this.reasonTextarea?this.reasonTextarea:this.reason
-			}
-
-			// return
-			
-			let httpsUrl = Https.httpUrls.tradeRefundAlipay
-			if(this.record.paymentType == "PayPal"){
-				httpsUrl = Https.httpUrls.tradeRefundPaypal
-			}
-			Https.axiosPost(
-                httpsUrl + `/${this.record.orderNo}/${reason}`,
-                {}
-            ).then((rv: any) => {
-				this.getHistoryList()
-				this.loadingShow = false
-				this.showRefundReason = false
-			})
-			.catch((res) => {});
-		},
+			setInit.init()
+		}
     },
 });
 </script>
 <style lang="less">
-.payOrder_modal ,.refund_reason{
+.payOrder_modal {
     // max-width: 1200px ;
     // max-width: 1150px ;
     .ant-modal-content {
@@ -396,209 +105,53 @@ export default defineComponent({
         }
     }
 }
-
-.modal_component.refund_reason{
-    .ant-modal-content {
-		.ant-modal-body {
-			// height: calc(65vh - 6.4rem);
-			padding: 3rem;
-			height: calc(40rem * 1.2);
-		}
-	}
-	
-}
 </style>
 <style lang="less">
 .payOrder_modal {
     .closeIcon {
         z-index: 2;
     }
-    .history_page {
+    .payOrder_page {
         width: 100%;
         height: 100%;
         padding: 9rem;
         overflow: hidden;
         // min-width: 1440px;
         position: relative;
-
-        .page_content {
-            position: relative;
-
-            .page_content_bg {
-                position: absolute;
-                width: 100%;
-                height: 100%;
-            }
-
-            .page_content_body {
-                position: absolute;
-                width: 100%;
-                height: 100%;
-                box-sizing: border-box;
-
-                .history_page_body {
-                    width: 100%;
-                    // height: calc(100% - 7rem);
-                    height: 100%;
-                    box-sizing: border-box;
-
-                    .history_header {
-                        font-size: 1.8rem;
-                        height: 6.3rem;
-                        line-height: 6.3rem;
-                        font-weight: 500;
-                        color: #333333;
-                    }
-
-                    .history_table_search {
-                        display: flex;
-                        align-items: center;
-
-                        .range_picker {
-                            width: 36rem;
-                            height: 4.8rem;
-
-                            .ant-picker-input > input {
-                                font-size: 1.6rem;
-                            }
-
-                            .range_picker_icon {
-                                font-size: 2.2rem;
-                            }
-                        }
-
-                        .content_search_block {
-                            margin-left: 4rem;
-                            display: flex;
-
-                            .search_input {
-                                width: 32.8rem;
-                                padding-left: 1.5rem;
-                                height: 4.8rem;
-                                line-height: 4.6rem;
-                                background: #ffffff;
-                                border: 0.1rem solid #f1f1f1;
-                                font-size: 1.6rem;
-                                font-weight: 400;
-
-                                &::placeholder {
-                                    color: #c2c2c2;
-                                }
-                            }
-
-                            .search_icon_block {
-                                width: 7.2rem;
-                                height: 4.8rem;
-                                line-height: 4.8rem;
-                                text-align: center;
-                                background: #343579;
-                                cursor: pointer;
-
-                                .icon-sousuo {
-                                    font-size: 2rem;
-                                    color: #ffffff;
-                                }
-                            }
-                        }
-                    }
-
-                    .history_table_content {
-                        margin-top: 2.6rem;
-                        width: 100%;
-                        // height: calc(100% - 13.7rem);
-                        height: 100%;
-                        background: rgba(255, 255, 255, 0.6);
-                        padding-bottom: 3rem;
-                        .ant-table {
-                            background: transparent;
-                        }
-
-                        .ant-table-body {
-                            overflow-y: auto !important;
-                            -ms-overflow-style: none;
-                            overflow: -moz-scrollbars-none;
-
-                            &::-webkit-scrollbar {
-                                width: 0 !important;
-                            }
-                        }
-
-                        .ant-table-thead > tr > th {
-                            background: #ffffff;
-                        }
-
-                        .ant-table-tbody > tr > td {
-                            border: none;
-                            background: transparent;
-                        }
-
-                        .ant-table-tbody > tr {
-                            &:hover > td {
-                                background: #ffffff;
-                            }
-                        }
-
-                        .ant-table-pagination-right {
-                            padding-right: 3.5rem;
-                        }
-
-                        .operate_list {
-                            display: flex;
-                            align-items: center;
-                            justify-content: space-between;
-                            padding: 0 1rem;
-
-                            .operate_item {
-								flex: 1;
-                                font-size: 1.4rem;
-                                font-family: Roboto;
-                                font-weight: 400;
-                                color: #343579;
-                                cursor: pointer;
-                            }
-                        }
-                    }
-                }
-            }
-        }
-    }
-}
-.refund_reason{
-	.reason{
-		height: calc(27rem * 1.2);
-		display: flex;
-		flex-direction: column;
-		padding: 0 3rem;
-		font-size: 1.6rem;
-		label{
+		.payOrder_page_title{
 			display: flex;
-			align-items: flex-start;
-			flex-direction: column;
-			overflow: hidden;
-			div{
-				display: flex;
-				justify-content: center;
-				margin-bottom: 1rem;
-			}
-			input,span{
+			.payOrder_page_title_item{
+				padding: 2rem 1rem;
+				margin: 0 2rem;
+				position: relative;
 				cursor: pointer;
+				font-size: var(--aida-fsize1-8);
+				font-weight: 500;
+				transition: all .3s;
+				&.active{
+					font-weight: 600;
+				}
+				&.active::before{
+					width: 100%;
+					left: 0;
+					right: auto;
+				}
 			}
-			span{
-				margin: 0 1rem;
-			}
-			textarea{
-				flex: 1;
-				width: 100%;
-				outline-color:#767676;
-				resize: none;
-			}
-			textarea:focus-visible {
-				border-color: #767676;
+			.payOrder_page_title_item::before{
+				position: absolute;
+				content: "";
+				width: 0%;
+				height: 0.5rem;
+				background: #000;
+				bottom: .8rem;
+				left: auto;
+				right: 0;
+				transition: all .3s;
 			}
 		}
-	}
-	.subitOkPreviewBtn{
-		margin-top: 1rem;
+		.payOrder_table_content{
+			height: 100%;
+		}
 	}
 }
 </style>

src/component/Pay/refund.vue

@@ -0,0 +1,216 @@
+<template>
+   <a-modal
+		class="modal_component refund_reason"
+		v-model:visible="showRefundReason"
+		:footer="null"
+		width="50%"
+		:maskClosable="false"
+		:mask="false"
+		:centered="true"
+		:closable="false"
+		wrapClassName="#app"
+		:keyboard="false"
+	>
+		<div class="closeIcon">
+	
+			<i class="fi fi-rr-cross-small" @click.stop="cancelRefundreason()"></i>
+		</div>
+		<div class="modal_title_text">
+			Refund Reason
+		</div>
+		<div class="reason">
+			<label>
+				<div>
+					<input name="reason" type="radio" @click="getReasonCategory" value="noLike" v-model="reason">
+					<span>Dislike</span>
+				</div>
+			</label>
+			<label>
+				<div>
+					<input name="reason" type="radio" @click="getReasonCategory" value="Rests" v-model="reason">
+					<span>Rests</span>
+				</div>
+				
+				<textarea v-show="reason == 'Rests'" name="" id="" cols="40" rows="10" v-model="reasonTextarea"></textarea>
+			</label>
+		</div>
+		<div class="subitOkPreviewBtn" @click="setReason">OK</div>
+	</a-modal>
+</template>
+<script lang="ts">
+import { defineComponent, ref, createVNode, computed, nextTick } from "vue";
+import { Https } from "@/tool/https";
+import { formatTime } from "@/tool/util";
+import { Modal, message } from "ant-design-vue";
+import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
+import { useI18n } from "vue-i18n";
+export default defineComponent({
+    components: {
+    },
+    setup() {
+        let showRefundReason: any = ref(false);
+        let record: any = ref();//订单编号
+        let reason: any = ref('noLike');//原因
+        let reasonTextarea: any = ref();//原因
+        let loadingShow: any = ref(false);
+        let { t } = useI18n();
+        return {
+			showRefundReason,
+			record,
+			reason,
+			reasonTextarea,
+			loadingShow,
+            t,
+        };
+    },
+    data() {
+        return {
+          
+        };
+    },
+    mounted() {},
+    methods: {
+		cancelRefundreason(){//关闭退款页面
+			this.record = ''
+            this.showRefundReason = false;
+		},
+        //删除分组
+        // deleteGroup(record:any,index:number){
+        //     let deleteGroupFun = (id:any,index:number) =>{
+        //         let data = {
+        //             userGroupId:id
+        //         }
+        //         Https.axiosPost(Https.httpUrls.deleteUserGroup,data).then(
+        //             (rv: any) => {
+        //                 message.success(this.t('HistoryPage.jsContent1'))
+        //                 this.collectionList.splice(index,1)
+        //             }
+        //         );
+        //     }
+        //     Modal.confirm({
+        //         title: this.t('HistoryPage.jsContent2'),
+        //         icon: createVNode(ExclamationCircleOutlined),
+        //         okText: 'Yes',
+        //         cancelText: 'No',
+        //         centered:true,
+        // 		mask:false,
+        //         onOk() {
+        //             deleteGroupFun(record.id,index)
+        //         }
+        //     });
+        // },
+
+        refund(record: any) {
+            // this.$router.push({name:'home',params: {id:record.id}})
+			this.record = record
+			this.showRefundReason = true
+        },
+		getReasonCategory(){
+			if(this.reason == 'Rests'){
+			}else{
+				this.reasonTextarea = ''
+			}
+		},
+		setReason(){
+			let reason = this.reason
+			this.loadingShow = true
+			if(this.reason == 'Rests'){
+				reason = this.reasonTextarea?this.reasonTextarea:this.reason
+			}
+
+			// return
+			
+			let httpsUrl = Https.httpUrls.tradeRefundAlipay
+			if(this.record.paymentType == "PayPal"){
+				httpsUrl = Https.httpUrls.tradeRefundPaypal
+			}
+			Https.axiosPost(
+                httpsUrl + `/${this.record.orderNo}/${reason}`,
+                {}
+            ).then((rv: any) => {
+				this.loadingShow = false
+				this.showRefundReason = false
+			})
+			.catch((res) => {});
+		},
+    },
+});
+</script>
+<style lang="less">
+.refund_reason{
+    // max-width: 1200px ;
+    // max-width: 1150px ;
+    .ant-modal-content {
+        border-radius: calc(1rem * 1.2);
+        overflow: hidden;
+        .ant-modal-header {
+            background-color: #fff;
+            border-bottom: none;
+        }
+        .ant-modal-body {
+            // height: calc(65vh - 6.4rem);
+            height: calc(65rem * 1.2);
+        }
+        //进度完成字体颜色
+
+        .ant-progress-circle.ant-progress-status-success .ant-progress-text {
+            color: #000;
+        }
+        .ant-progress-circle .ant-progress-text {
+            color: rgba(0, 0, 0, 0.55);
+            font-size: calc(1.6rem * 1.2);
+        }
+    }
+}
+
+.modal_component.refund_reason{
+    .ant-modal-content {
+		.ant-modal-body {
+			// height: calc(65vh - 6.4rem);
+			padding: 3rem;
+			height: calc(40rem * 1.2);
+		}
+	}
+	
+}
+</style>
+<style lang="less">
+.refund_reason{
+	.reason{
+		height: calc(27rem * 1.2);
+		display: flex;
+		flex-direction: column;
+		padding: 0 3rem;
+		font-size: 1.6rem;
+		label{
+			display: flex;
+			align-items: flex-start;
+			flex-direction: column;
+			overflow: hidden;
+			div{
+				display: flex;
+				justify-content: center;
+				margin-bottom: 1rem;
+			}
+			input,span{
+				cursor: pointer;
+			}
+			span{
+				margin: 0 1rem;
+			}
+			textarea{
+				flex: 1;
+				width: 100%;
+				outline-color:#767676;
+				resize: none;
+			}
+			textarea:focus-visible {
+				border-color: #767676;
+			}
+		}
+	}
+	.subitOkPreviewBtn{
+		margin-top: 1rem;
+	}
+}
+</style>

src/router/index.ts

@@ -117,11 +117,10 @@ router.beforeEach((to, from, next) => {
 	let token = getCookie("token");
 	let isMurmur = JSON.parse(getIsMurmur)
     let routeList = ['/testClickData','/trialApproval']//指定页面需要指定id才能进入
-    let userIdList = [83,88,6]
+    let userIdList = [83,88,6,87]
 	const routeExists = router.getRoutes().some(({ name }) =>{
 		if(name){
-	console.log(name , to.name);
-	return  name === to.name
+			return  name === to.name
 		}else{
 			return false
 		}
@@ -141,7 +140,7 @@ router.beforeEach((to, from, next) => {
 				if(userIdList.indexOf(userInfo.userId) > -1){
 					next();
 				}else{
-					next({ name: 'home' });
+					next({ name: '/404' });
 				}
 			}else{
 				next();

src/tool/util.js

@@ -1,5 +1,5 @@
 import Fingerprint2 from 'fingerprintjs2';//获取浏览器唯一标识
-const isEmail = (email) => {
+const isEmail = (email) => {//判断邮箱格式
 	let reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
 	let result = reg.test(email)
 	return result
@@ -11,7 +11,7 @@ const getUploadUrl = () => {
 	return url
 }
 
-function dataURLtoBlob(dataurl) {
+function dataURLtoBlob(dataurl) {//吧data url转为blob对象
 	var arr = dataurl.split(',');
 	var mime = arr[0].match(/:(.*?);/)[1];
 	var bstr = atob(arr[1]);
@@ -23,7 +23,7 @@ function dataURLtoBlob(dataurl) {
 	return new Blob([u8arr], { type: mime });
 }
 
-function blobToFile(blob, fileName) {
+function blobToFile(blob, fileName) {//给blob文件设置名字和日期
 	blob.lastModifiedDate = new Date();
 	blob.name = fileName;
 	return blob;
@@ -51,7 +51,7 @@ function downloadIamge(imgsrc, name) { // 下载图片地址和图片名
 	image.src = imgsrc
 }
 
-function dataURLtoFile(dataurl, filename) {
+function dataURLtoFile(dataurl, filename) {//吧url转为文件对象，指定文件名称
 	var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
 		bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
 	while (n--) {
@@ -61,7 +61,7 @@ function dataURLtoFile(dataurl, filename) {
 	return blobToFile(blob, filename);
 }
 
-const base64toFile = (dataurl, filename = 'file') => {
+const base64toFile = (dataurl, filename = 'file') => {//转换base64
 	let arr = dataurl.split(',')
 	let mime = arr[0].match(/:(.*?);/)[1]
 	let suffix = mime.split('/')[1]
@@ -77,7 +77,7 @@ const base64toFile = (dataurl, filename = 'file') => {
 
 }
 
-function rgbToHsv([R, G, B]) {
+function rgbToHsv([R, G, B]) {//根据rgb获取hsv
 	R /= 255
 	G /= 255
 	B /= 255
@@ -108,7 +108,7 @@ function rgbToHsv([R, G, B]) {
 	return [H, S, V]
 }
 
-const formatTime = (timestamp, fmt) => {
+const formatTime = (timestamp, fmt) => {//吧时间戳转为YYYY-MM-DD hh:mm:ss格式
 	// date = new Date(), fmt = 'MM/dd/yyyy';
 	let date = new Date();
 	date.setTime(timestamp * 1000);
@@ -146,7 +146,7 @@ const formatTime = (timestamp, fmt) => {
 	return fmt;
 }
 
-const isMoible = () => {
+const isMoible = () => {//判断是否是移动端
 	let is_mobile = navigator.userAgent.toLowerCase().match(/(ipad|ipod|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|blackberry|wince)/i) != null;
 	// alert(navigator.userAgent.toLowerCase())
 	var isiPad = /iPad/.test(navigator.platform) || (navigator.maxTouchPoints && navigator.maxTouchPoints > 2);
@@ -184,7 +184,7 @@ function getBrowserInfo() {//获取是什么浏览器
 		return agent.match(regStr_saf);
 	}
 }
-async function murmur(){
+async function murmur(){//生成唯一标识 ，暂时没有使用
 	return await new Promise((resolve,reject)=>{
 		Fingerprint2.get(function (components) {
 			const values = components.map(function (

src/views/Administrator.vue

@@ -104,14 +104,14 @@ export default defineComponent({
 			//         },
 			//     ],
 		},{
-			name:'Trial User Approval',
+			name:'Design Frequency',
 			route:'/administrator/testClickData',
 			icon:'shenpi',
 			expandIcon:'icon-xiala',
 			key:'/administrator/testClickData',
 			isShow:true,
 		},{
-			name:'Design Frequency',
+			name:'Trial User Approval',
 			route:'/administrator/trialApproval',
 			icon:'usetime',
 			key:'/administrator/trialApproval',

src/views/HomeView.vue

@@ -1010,126 +1010,6 @@ export default defineComponent({
 			let exportModel:any = this.$refs.ExportModel
 			exportModel.init()
 		},
-		//导出合成图
-		// async exportCanvas() {
-		// 	let collectionReview: any = document.querySelector(
-		// 		"#exportNewCoolection"
-		// 	);
-		// 	let rightContentImgBlock: any = document.querySelector(
-		// 		"#right_content_img_block"
-		// 	);
-		// 	if(this.driver__.driver){
-		// 		nextTick().then(()=>{
-		// 			driverObj__.moveNext();
-		// 		})
-		// 	}
-			
-		// 	let a = document.createElement("a");
-		// 	// this.isShowMark = true;
-		// 	let img:any = []
-		// 	await html2canvas(collectionReview, { useCORS: true, scale: 3 }).then(
-		// 		async (canvas) => {
-		// 			let blob: any = dataURLtoBlob(
-		// 				canvas.toDataURL("image/png")
-		// 			);
-		// 			let allBoardData: any =
-		// 				this.store.state.UploadFilesModule.allBoardData;
-		// 			let index = 0;
-		// 			img.push({
-		// 					imgUrl: URL.createObjectURL(blob),
-		// 					name: "collection.png",
-		// 				})
-		// 			let num = 0
-		// 			for (let key in allBoardData) {
-		// 				if (key !== "colorBoards" && key !== "moodTemplateId") {
-		// 					if(this.exportNav[num]?.change || key == 'disposeMoodboard'){
-		// 						for (let item of allBoardData[key]) {
-		// 							if(key == 'disposeMoodboard' && allBoardData[key][0]==undefined){
-		// 								break
-		// 							}
-		// 							let nameTail = item?.imgUrl?.split(".").pop().split("?").shift();
-		// 							let data = {
-		// 								imgUrl: item.imgUrl,
-		// 								name:
-		// 									item?.resData?.name +
-		// 									index +
-		// 									"." +
-		// 									nameTail,
-		// 							};
-		// 							img.push(data);
-		// 							index++;
-		// 						}
-		// 					}else{
-		// 					}
-		// 					num++
-		// 				}
-		// 			}
-		// 			let dataList:any = []
-		// 			this.likeDesignCollectionList.forEach((item:any)=>{
-		// 				let nameTail = item?.designOutfitUrl?.split(".").pop().split("?").shift();
-		// 				let data = {
-		// 					imgUrl: item.designOutfitUrl,
-		// 					name:
-		// 						'result' +
-		// 						index +
-		// 						"." +
-		// 						nameTail,
-		// 				};
-		// 				dataList.push(item.designItemId)
-		// 				img.push(data);
-		// 				index++;
-		// 			})
-		// 			let mannequinList:any = []
-		// 			await Https.axiosPost(Https.httpUrls.designGetModel, dataList)
-		// 				.then((rv: any) => {
-		// 					mannequinList = rv
-		// 					})
-		// 				.catch((rv) => {
-		// 				});
-						
-		// 			mannequinList.forEach((item:any) => {
-		// 				let nameTail = item?.split(".").pop().split("?").shift();
-		// 				let data = {
-		// 					imgUrl: item,
-		// 					name:
-		// 						'mannequin' +
-		// 						index +
-		// 						"." +
-		// 						nameTail,
-		// 				};
-		// 				img.push(data);
-		// 				index++;	
-		// 			});
-		// 			// a.setAttribute('href', URL.createObjectURL(blob));
-		// 			// a.setAttribute('download', `collection.png`);
-		// 			// a.click();
-		// 		}
-		// 	);
-		// 	//单独导出模特图
-		// 	// await html2canvas(rightContentImgBlock, { useCORS: true, scale: 3 }).then(
-		// 	// 	(canvas) => {
-		// 	// 		let blob: any = dataURLtoBlob(
-		// 	// 			canvas.toDataURL("image/png")
-		// 	// 		);
-		// 	// 		let allBoardData: any =
-		// 	// 			this.store.state.UploadFilesModule.allBoardData;
-		// 	// 		let index = 0;
-		// 	// 		img.push({
-		// 	// 				imgUrl: URL.createObjectURL(blob),
-		// 	// 				name: "achievement.png",
-		// 	// 			},)
-		// 	// 		this.likeDesignCollectionList.forEach((item:any) => {
-		// 	// 			let data = {
-		// 	// 				imgUrl:item.designItemUrl,
-		// 	// 				name:item.pictureName
-		// 	// 			}
-		// 	// 			img.push(data)
-		// 	// 		});
-		// 	// 	}
-		// 	// );
-		// 	// return
-		// 	this.downImg(img);
-		// },
 
 		//打开图片详情
 		designDetail(
@@ -1166,54 +1046,6 @@ export default defineComponent({
 				});
 			}
 		},
-	
-		//通过url 转为blob格式的数据
-		getImgArrayBuffer(url: any) {
-			
-			return new Promise((resolve, reject) => {
-				//通过请求获取文件blob格式
-				let xmlhttp = new XMLHttpRequest();
-				xmlhttp.open("GET", url, true);
-				xmlhttp.responseType = "blob";
-				xmlhttp.onload = function () {
-					if (this.status == 200) {
-						resolve(this.response);
-					} else {
-						reject(this.status);
-					}
-				};
-				xmlhttp.send();
-			});
-		},
-		// imgDataUrl 数据的url数组
-		// downImg(imagesParams: any) {
-		// 	let _this: any = this;
-		// 	let zip = new JSZip();
-		// 	let cache: any = {};
-		// 	let promises = [];
-		// 	for (let item of imagesParams) {
-		// 		const promise = _this
-		// 			.getImgArrayBuffer(item.imgUrl)
-		// 			.then((data: any) => {
-		// 				// 下载文件, 并存成ArrayBuffer对象(blob)
-		// 				zip.file(item.name, data, { binary: true }); // 逐个添加文件
-		// 				cache[item.title] = data;
-		// 			});
-		// 		promises.push(promise);
-		// 	}
-		// 	Promise.all(promises)
-		// 		.then(() => {
-		// 			zip.generateAsync({ type: "blob" }).then((content: any) => {
-		// 				// 生成二进制流
-		// 				FileSaver.saveAs(content, "DesignFiles"); // 利用file-saver保存文件  自定义文件名
-		// 				this.isShowMark = false;
-		// 			});
-		// 		})
-		// 		.catch((res) => {
-		// 			message.warning(this.t('HomeView.jsContent3'));
-		// 			this.isShowMark = false;
-		// 		});
-		// },
 	},
 });
 </script>