会员详情取消按钮关闭页面

src/views/dgtmedicine/member/detail.vue

@@ -41,7 +41,9 @@
             <el-row :gutter="20">
               <el-col :span="8">
                 <el-form-item label="申请会员等级" prop="applyLevel">
-                  <el-input v-model="form.applyLevel" placeholder="请输入申请会员等级" />
+                  <el-select v-model="form.applyLevel" placeholder="请选择" clearable>
+                    <el-option v-for="dict in vip_level" :key="dict.value" :label="dict.label" :value="dict.value" />
+                  </el-select>
                 </el-form-item>
               </el-col>
               <el-col :span="8">
@@ -129,7 +131,7 @@
           </el-form>
           <div class="dialog-footer" style="text-align: center;">
             <el-button :loading="buttonLoading" type="primary" @click="submitForm">提 交</el-button>
-            <el-button @click="cancel">取 消</el-button>
+            <el-button @click="cancel(selectedTag)">取 消</el-button>
           </div>
         </el-tab-pane>
 
@@ -143,7 +145,8 @@
                 </el-select>
               </el-form-item>
               <el-form-item label="开票状态" prop="invoiceStatus">
-                <el-select v-model="vipPaymentQueryParams.invoiceStatus" placeholder="请选择" clearable style="width: 240px">
+                <el-select v-model="vipPaymentQueryParams.invoiceStatus" placeholder="请选择" clearable
+                  style="width: 240px">
                   <el-option v-for="dict in invoice_status" :key="dict.value" :label="dict.label" :value="dict.value"
                     @keyup.enter="handleQueryVipPayment" />
                 </el-select>
@@ -232,9 +235,9 @@
 <script setup name="Member" lang="ts">
 import { listMember, getMember, addMember, updateMember } from '@/api/dgtmedicine/member';
 import { MemberVO, MemberQuery, MemberForm } from '@/api/dgtmedicine/member/types';
-import { listVipPayment, getVipPayment, delVipPayment, uploadInvoice, updateVipPayment } from '@/api/dgtmedicine/vipPayment';
+import { listVipPayment, delVipPayment, uploadInvoice } from '@/api/dgtmedicine/vipPayment';
 import { VipPaymentVO, VipPaymentQuery, VipPaymentForm } from '@/api/dgtmedicine/vipPayment/types';
-import { useRouter } from 'vue-router';
+import { useRouter,RouteLocationNormalized } from 'vue-router';
 
 const { query } = useRoute();
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -242,21 +245,23 @@ const { vip_level, invoice_status, payment_status, payment_type } =
   toRefs<any>(proxy?.useDict("vip_level", "invoice_status", "payment_status", "payment_type"));
 const router = useRouter();
 
+const selectedTag = ref<RouteLocationNormalized>();
 const vipPaymentList = ref<VipPaymentVO[]>([]);
 const memberList = ref<MemberVO[]>([]);
 const buttonLoading = ref(false);
 const loading = ref(true);
-const refuseShow = ref(false);
 const ids = ref<Array<string | number>>([]);
 const memberId = ref('');
-const single = ref(true);
-const multiple = ref(true);
 const total = ref(0);
-const approvalLogFormRef = ref<ElFormInstance>();
 const activeTab = ref('meberInfo')
 const vipPaymentFormRef = ref<ElFormInstance>();
 const memberFormRef = ref<ElFormInstance>();
 const payMentFormRef = ref<ElFormInstance>();
+const route = useRoute();
+import useTagsViewStore from '@/store/modules/tagsView';
+import { debug } from 'console';
+const visitedViews = computed(() => useTagsViewStore().getVisitedViews());
+
 
 const dialog = reactive<DialogOption>({
   visible: false,
@@ -306,32 +311,6 @@ const initPayFormData: VipPaymentForm = {
 const data = reactive<PageData<MemberForm, MemberQuery>>({
   form: { ...initFormData },
   queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    cpyName: undefined,
-    legalPersonName: undefined,
-    legalPersonPhone: undefined,
-    legalPersonPosition: undefined,
-    legalPersonIdFront: undefined,
-    legalPersonIdBack: undefined,
-    companyCertificate: undefined,
-    email: undefined,
-    department: undefined,
-    totalAssets: undefined,
-    introduction: undefined,
-    regType: undefined,
-    membershipPurpose: undefined,
-    plantingInfo: undefined,
-    vipLevel: undefined,
-    startDate: undefined,
-    endDate: undefined,
-    reviewStatus: undefined,
-    reviewMsg: undefined,
-    reviewBy: undefined,
-    reviewTime: undefined,
-    partnerId: undefined,
-    cpyBusType: undefined,
-    applyLevel: undefined,
     params: {
     }
   },
@@ -348,7 +327,7 @@ const vipPaymentData = reactive<PageData<VipPaymentForm, VipPaymentQuery>>({
     memberId: undefined,
     paymentAmount: undefined,
     paymentTime: undefined,
-    paymentType: undefined,
+    paymentType: '',
     paymentStatus: undefined,
     paymentRemark: undefined,
     invoiceStatus: undefined,
@@ -400,6 +379,7 @@ const reset = () => {
 
 /** 查询会员缴费记录列表 */
 const getVipPaymentList = async () => {
+  console.log('memberId.value', memberId.value)
   loading.value = true;
   vipPaymentQueryParams.value.memberId = memberId.value;
   const res = await listVipPayment(vipPaymentQueryParams.value);
@@ -471,14 +451,36 @@ const submitForm = () => {
 }
 
 /** 取消按钮 */
-const cancel = () => {
-  // reset();
+const cancel = (view: RouteLocationNormalized) => {
+  reset();
+  closeSelectedTag(view);
 }
 
+/** */
+const closeSelectedTag = (view: RouteLocationNormalized) => {
+  proxy?.$tab.closePage(view).then((result: any) => {
+    const { visitedViews } = result || {};
+  });
+};
 
 onMounted(() => {
   memberId.value = (query.memberId as string)
   getMemberInfo();
   getVipPaymentList();
 });
+
+/** 监听路由 */
+watch(
+  () => route.query.memberId,
+  (newMemberId) => {
+    if (newMemberId == undefined) {
+      return;
+    }
+    memberId.value = newMemberId as string;
+    getMemberInfo();
+    getVipPaymentList();
+  }
+);
+
+
 </script>

src/views/dgtmedicine/member/index.vue

@@ -31,7 +31,9 @@
       <template #header>
         <el-row :gutter="20" class="mb8">
           <el-col :span="2" v-for="level in memberLevelCountList" :key="level.type">
-            <el-button type="text" @click="handleQuery(level)">{{ level.name }}({{ level.num }})</el-button>
+            <el-button type="text" @click="handleQuery(level)"
+              :style="{ fontWeight: queryParams.vipLevel === level.type ? 'bold' : 'normal', color: queryParams.vipLevel === level.type ? 'black' : 'inherit' }">{{
+              level.name }}({{ level.num }})</el-button>
           </el-col>
           <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
         </el-row>
@@ -187,25 +189,6 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <!-- <el-row :gutter="20">
-          <el-col :span="8">
-            <el-form-item label="审核信息" prop="reviewMsg">
-              <el-input v-model="form.reviewMsg" placeholder="请输入审核信息" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="审核人" prop="reviewBy">
-              <el-input v-model="form.reviewBy" placeholder="请输入审核人" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="8">
-            <el-form-item label="审核时间" prop="reviewTime">
-              <el-date-picker clearable v-model="form.reviewTime" type="datetime" value-format="YYYY-MM-DD HH:mm:ss"
-                placeholder="请选择审核时间">
-              </el-date-picker>
-            </el-form-item>
-          </el-col>
-        </el-row> -->
         <el-table v-loading="loading" :data="form.plantingInfo">
           <el-table-column label="品种名称" align="center" prop="variety" />
           <el-table-column label="种植面积" align="center" prop="plantingArea" />
@@ -250,7 +233,6 @@ import { approvalMember } from '@/api/dgtmedicine/approvalLog';
 import { MemberVO, MemberQuery, MemberForm, MemberLevelCountVO } from '@/api/dgtmedicine/member/types';
 import { ApprovalLogQuery, ApprovalLogForm } from '@/api/dgtmedicine/approvalLog/types';
 import { useRouter } from 'vue-router';
-import { debug } from 'console';
 const router = useRouter();
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 
@@ -306,60 +288,60 @@ const approvalData = reactive<PageData<ApprovalLogForm, ApprovalLogQuery>>({
 
 const initFormData: MemberForm = {
   id: undefined,
-  cpyName: undefined,
-  legalPersonName: undefined,
-  legalPersonPhone: undefined,
-  legalPersonPosition: undefined,
-  legalPersonIdFront: undefined,
-  legalPersonIdBack: undefined,
-  companyCertificate: undefined,
-  email: undefined,
-  department: undefined,
-  totalAssets: undefined,
-  introduction: undefined,
-  regType: undefined,
-  membershipPurpose: undefined,
-  plantingInfo: undefined,
-  vipLevel: undefined,
-  startDate: undefined,
-  endDate: undefined,
-  reviewStatus: undefined,
-  reviewMsg: undefined,
-  reviewBy: undefined,
-  reviewTime: undefined,
-  partnerId: undefined,
-  cpyBusType: undefined,
-  applyLevel: undefined
+  cpyName: '',
+  legalPersonName: '',
+  legalPersonPhone: '',
+  legalPersonPosition: '',
+  legalPersonIdFront: '',
+  legalPersonIdBack: '',
+  companyCertificate: '',
+  email: '',
+  department: '',
+  totalAssets: '',
+  introduction: '',
+  regType: '',
+  membershipPurpose: '',
+  plantingInfo: [],
+  vipLevel: '',
+  startDate: '',
+  endDate: '',
+  reviewStatus: '',
+  reviewMsg: '',
+  reviewBy: '',
+  reviewTime: '',
+  partnerId: '',
+  cpyBusType: '',
+  applyLevel: ''
 }
 const data = reactive<PageData<MemberForm, MemberQuery>>({
   form: { ...initFormData },
   queryParams: {
     pageNum: 1,
     pageSize: 10,
-    cpyName: undefined,
-    legalPersonName: undefined,
-    legalPersonPhone: undefined,
-    legalPersonPosition: undefined,
-    legalPersonIdFront: undefined,
-    legalPersonIdBack: undefined,
-    companyCertificate: undefined,
-    email: undefined,
-    department: undefined,
-    totalAssets: undefined,
-    introduction: undefined,
-    regType: undefined,
-    membershipPurpose: undefined,
-    plantingInfo: undefined,
-    vipLevel: undefined,
-    startDate: undefined,
-    endDate: undefined,
-    reviewStatus: undefined,
-    reviewMsg: undefined,
-    reviewBy: undefined,
-    reviewTime: undefined,
-    partnerId: undefined,
-    cpyBusType: undefined,
-    applyLevel: undefined,
+    cpyName: '',
+    legalPersonName: '',
+    legalPersonPhone: '',
+    legalPersonPosition: '',
+    legalPersonIdFront: '',
+    legalPersonIdBack: '',
+    companyCertificate: '',
+    email: '',
+    department: '',
+    totalAssets: '',
+    introduction: '',
+    regType: '',
+    membershipPurpose: '',
+    plantingInfo: '',
+    vipLevel: '',
+    startDate: '',
+    endDate: '',
+    reviewStatus: '',
+    reviewMsg: '',
+    reviewBy: '',
+    reviewTime: '',
+    partnerId: '',
+    cpyBusType: '',
+    applyLevel: '',
     params: {
     }
   },
@@ -396,7 +378,6 @@ const getMemberLevelList = async () => {
   loading.value = true;
   const res = await countLevelMember(queryParams.value);
   memberLevelCountList.value = res.data;
-  console.log(memberLevelCountList.value)
   loading.value = false;
 }