优惠券增加发券数量参数及管理后台面包屑菜单

admin-web/src/layout/navBars/breadcrumb/breadcrumb.vue

@@ -1,150 +1,184 @@
 <template>
-	<div v-if="isShowBreadcrumb" class="layout-navbars-breadcrumb">
-		<SvgIcon
-			class="layout-navbars-breadcrumb-icon"
-			:name="themeConfig.isCollapse ? 'ele-Expand' : 'ele-Fold'"
-			:size="16"
-			@click="onThemeConfigChange"
-		/>
-		<el-breadcrumb class="layout-navbars-breadcrumb-hide">
-			<transition-group name="breadcrumb">
-				<el-breadcrumb-item v-for="(v, k) in state.breadcrumbList" :key="k">
-<!--				<el-breadcrumb-item v-for="(v, k) in state.breadcrumbList" :key="!v.meta.tagsViewName ? v.meta.title : v.meta.tagsViewName">-->
-					<span v-if="k === state.breadcrumbList.length - 1" class="layout-navbars-breadcrumb-span">
-						<SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon" />
+  <div v-if="isShowBreadcrumb" class="layout-navbars-breadcrumb">
+    <SvgIcon
+        class="layout-navbars-breadcrumb-icon"
+        :name="themeConfig.isCollapse ? 'ele-Expand' : 'ele-Fold'"
+        :size="16"
+        @click="onThemeConfigChange"
+    />
+    <el-breadcrumb class="layout-navbars-breadcrumb-hide">
+      <transition-group name="breadcrumb">
+        <el-breadcrumb-item v-for="(v, k) in state.breadcrumbList" :key="k">
+          <!--				<el-breadcrumb-item v-for="(v, k) in state.breadcrumbList" :key="!v.meta.tagsViewName ? v.meta.title : v.meta.tagsViewName">-->
+          <span v-if="k === state.breadcrumbList.length - 1" class="layout-navbars-breadcrumb-span">
+						<SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon"/>
 						<div v-if="!v.meta.tagsViewName">{{ $t(v.meta.title) }}</div>
 						<div v-else>{{ v.meta.tagsViewName }}</div>
 					</span>
-					<a v-else @click.prevent="onBreadcrumbClick(v)">
-						<SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon" />{{ $t(v.meta.title) }}
-					</a>
-				</el-breadcrumb-item>
-			</transition-group>
-		</el-breadcrumb>
-	</div>
+          <a v-else @click.prevent="onBreadcrumbClick(v)">
+            <SvgIcon :name="v.meta.icon" class="layout-navbars-breadcrumb-iconfont" v-if="themeConfig.isBreadcrumbIcon"/>
+            {{ $t(v.meta.title) }}
+          </a>
+        </el-breadcrumb-item>
+      </transition-group>
+    </el-breadcrumb>
+  </div>
 </template>
 
 <script setup lang="ts" name="layoutBreadcrumb">
-import { reactive, computed, onMounted } from 'vue';
-import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
-import { Local } from '/@/utils/storage';
+import {reactive, computed, onMounted} from 'vue';
+import {onBeforeRouteUpdate, useRoute, useRouter} from 'vue-router';
+import {Local} from '/@/utils/storage';
 import other from '/@/utils/other';
-import { storeToRefs } from 'pinia';
-import { useThemeConfig } from '/@/stores/themeConfig';
-import { useRoutesList } from '/@/stores/routesList';
+import {storeToRefs} from 'pinia';
+import {useThemeConfig} from '/@/stores/themeConfig';
+import {useRoutesList} from '/@/stores/routesList';
 
 // 定义变量内容
 const stores = useRoutesList();
 const storesThemeConfig = useThemeConfig();
-const { themeConfig } = storeToRefs(storesThemeConfig);
-const { routesList } = storeToRefs(stores);
+const {themeConfig} = storeToRefs(storesThemeConfig);
+const {routesList} = storeToRefs(stores);
 const route = useRoute();
 const router = useRouter();
 const state = reactive<BreadcrumbState>({
-	breadcrumbList: [],
-	routeSplit: [],
-	routeSplitFirst: '',
-	routeSplitIndex: 1,
+  breadcrumbList: [],
+  routeSplit: [],
+  routeSplitFirst: '',
+  routeSplitIndex: 1,
 });
 
 // 动态设置经典、横向布局不显示
 const isShowBreadcrumb = computed(() => {
-	initRouteSplit(route.path);
-	const { layout, isBreadcrumb } = themeConfig.value;
-	if (layout === 'classic' || layout === 'transverse') return false;
-	else return isBreadcrumb ? true : false;
+  initRouteSplit(route.path);
+  const {layout, isBreadcrumb} = themeConfig.value;
+  if (layout === 'classic' || layout === 'transverse') return false;
+  else return isBreadcrumb ? true : false;
 });
 // 面包屑点击时
 const onBreadcrumbClick = (v: RouteItem) => {
-	const { redirect, path } = v;
-	if (redirect) router.push(redirect);
-	else router.push(path);
+  const {redirect, path} = v;
+  if (redirect) router.push(redirect);
+  else router.push(path);
 };
 // 展开/收起左侧菜单点击
 const onThemeConfigChange = () => {
-	themeConfig.value.isCollapse = !themeConfig.value.isCollapse;
-	setLocalThemeConfig();
+  themeConfig.value.isCollapse = !themeConfig.value.isCollapse;
+  setLocalThemeConfig();
 };
 // 存储布局配置
 const setLocalThemeConfig = () => {
-	Local.remove('themeConfig');
-	Local.set('themeConfig', themeConfig.value);
+  Local.remove('themeConfig');
+  Local.set('themeConfig', themeConfig.value);
 };
 // 处理面包屑数据
 const getBreadcrumbList = (arr: RouteItems) => {
-	arr.forEach((item: RouteItem) => {
-		state.routeSplit.forEach((v: string, k: number, arrs: string[]) => {
-			if (state.routeSplitFirst === item.path) {
-				state.routeSplitFirst += `/${arrs[state.routeSplitIndex]}`;
-				state.breadcrumbList.push(item);
-				state.routeSplitIndex++;
-				if (item.children) getBreadcrumbList(item.children);
-			}
-		});
-	});
-};
+  console.log(route.path)
+  arr.forEach((item: RouteItem) => {
+    if (route.path.startsWith(item.path)) {
+      state.breadcrumbList.push(item);
+
+      if (item.children) {
+        item.children.forEach((son: RouteItem) => {
+          if (route.path.startsWith(son.path)) {
+            state.breadcrumbList.push(son);
+
+            if (son.children) {
+              son.children.forEach((grandSon: RouteItem) => {
+                if (route.path.startsWith(grandSon.path)) {
+                  state.breadcrumbList.push(grandSon);
+                }
+              })
+            }
+          }
+        })
+      }
+    }
+  })
+}
+// state.routeSplit.forEach((v: string, k: number, arrs: string[]) => {
+//   if (state.routeSplitFirst === item.path) {
+//     state.routeSplitFirst += `/${arrs[state.routeSplitIndex]}`;
+//     state.breadcrumbList.push(item);
+//     state.routeSplitIndex++;
+//     if (item.children) getBreadcrumbList(item.children);
+//   }
+// });
+// })
+// ;
+// }
+// ;
 // 当前路由字符串切割成数组，并删除第一项空内容
 const initRouteSplit = (path: string) => {
-	if (!themeConfig.value.isBreadcrumb) return false;
+  if (!themeConfig.value.isBreadcrumb) return false;
   // console.log(path)
   // console.log(routesList)
-	state.breadcrumbList = [];
-	// state.breadcrumbList = [routesList.value[0]];
-	state.routeSplit = path.split('/');
-	state.routeSplit.shift();
-	state.routeSplitFirst = `/${state.routeSplit[0]}`;
-	state.routeSplitIndex = 1;
-	getBreadcrumbList(routesList.value);
-	if (route.name === 'home' || (route.name === 'notFound' && state.breadcrumbList.length > 1)) state.breadcrumbList.shift();
-	if (state.breadcrumbList.length > 0)
-		state.breadcrumbList[state.breadcrumbList.length - 1].meta.tagsViewName = other.setTagsViewNameI18n(<RouteToFrom>route);
+  state.breadcrumbList = [];
+  // state.breadcrumbList = [routesList.value[0]];
+  state.routeSplit = path.split('/');
+  state.routeSplit.shift();
+  state.routeSplitFirst = `/${state.routeSplit[0]}`;
+  state.routeSplitIndex = 1;
+  console.log(routesList.value)
+  getBreadcrumbList(routesList.value);
+  if (route.name === 'home' || (route.name === 'notFound' && state.breadcrumbList.length > 1)) state.breadcrumbList.shift();
+  if (state.breadcrumbList.length > 0)
+    state.breadcrumbList[state.breadcrumbList.length - 1].meta.tagsViewName = other.setTagsViewNameI18n(<RouteToFrom>route);
 };
 // 页面加载时
 onMounted(() => {
-	initRouteSplit(route.path);
+  initRouteSplit(route.path);
 });
 // 路由更新时
 onBeforeRouteUpdate((to) => {
-	initRouteSplit(to.path);
+  initRouteSplit(to.path);
 });
 </script>
 
 <style scoped lang="scss">
 .layout-navbars-breadcrumb {
-	flex: 1;
-	height: inherit;
-	display: flex;
-	align-items: center;
-	.layout-navbars-breadcrumb-icon {
-		cursor: pointer;
-		font-size: 18px;
-		color: var(--next-bg-topBarColor);
-		height: 100%;
-		width: 40px;
-		opacity: 0.8;
-		&:hover {
-			opacity: 1;
-		}
-	}
-	.layout-navbars-breadcrumb-span {
-		display: flex;
-		opacity: 0.7;
-		color: var(--next-bg-topBarColor);
-	}
-	.layout-navbars-breadcrumb-iconfont {
-		font-size: 14px;
-		margin-right: 5px;
-	}
-	:deep(.el-breadcrumb__separator) {
-		opacity: 0.7;
-		color: var(--next-bg-topBarColor);
-	}
-	:deep(.el-breadcrumb__inner a, .el-breadcrumb__inner.is-link) {
-		font-weight: unset !important;
-		color: var(--next-bg-topBarColor);
-		&:hover {
-			color: var(--el-color-primary) !important;
-		}
-	}
+  flex: 1;
+  height: inherit;
+  display: flex;
+  align-items: center;
+
+  .layout-navbars-breadcrumb-icon {
+    cursor: pointer;
+    font-size: 18px;
+    color: var(--next-bg-topBarColor);
+    height: 100%;
+    width: 40px;
+    opacity: 0.8;
+
+    &:hover {
+      opacity: 1;
+    }
+  }
+
+  .layout-navbars-breadcrumb-span {
+    display: flex;
+    opacity: 0.7;
+    color: var(--next-bg-topBarColor);
+  }
+
+  .layout-navbars-breadcrumb-iconfont {
+    font-size: 14px;
+    margin-right: 5px;
+    color: black;
+  }
+
+  :deep(.el-breadcrumb__separator) {
+    opacity: 0.7;
+    color: var(--next-bg-topBarColor);
+  }
+
+  :deep(.el-breadcrumb__inner a, .el-breadcrumb__inner.is-link) {
+    font-weight: unset !important;
+    color: var(--next-bg-topBarColor);
+
+    &:hover {
+      color: var(--el-color-primary) !important;
+    }
+  }
 }
 </style>

admin-web/src/views/admin/activity/coupon/index.vue

@@ -40,20 +40,20 @@
             @blur="loadData(true)"
             class="wd150 mr10">
         </el-input>
-<!--        <ext-date-picker
-            v-model="state.formQuery.startTime"
-            placeholder="开始时间"
-            clearable
-            @blur="loadData(true)"
-            class="wd150 mr10">
-        </ext-date-picker>
-        <ext-date-picker
-            v-model="state.formQuery.endTime"
-            placeholder="结束时间"
-            clearable
-            @blur="loadData(true)"
-            class="wd150 mr10">
-        </ext-date-picker>-->
+        <!--        <ext-date-picker
+                    v-model="state.formQuery.startTime"
+                    placeholder="开始时间"
+                    clearable
+                    @blur="loadData(true)"
+                    class="wd150 mr10">
+                </ext-date-picker>
+                <ext-date-picker
+                    v-model="state.formQuery.endTime"
+                    placeholder="结束时间"
+                    clearable
+                    @blur="loadData(true)"
+                    class="wd150 mr10">
+                </ext-date-picker>-->
         <ext-d-select
             v-model="state.formQuery.couponType"
             placeholder="券种"
@@ -110,14 +110,14 @@
               <ext-d-label type="Coupon.status" v-model="row[field.prop]"></ext-d-label>
             </template>
             <template v-else-if="field.prop==='minServiceMoney'">
-              {{u.fmt.fmtMoney(row.minServiceMoney)}}
+              {{ u.fmt.fmtMoney(row.minServiceMoney) }}
             </template>
             <template v-else-if="field.prop==='allowStacke'">
-              {{row.allowStacke?'是':'否'}}
+              {{ row.allowStacke ? '是' : '否' }}
             </template>
             <template v-else-if="field.prop==='action'">
-<!--              <el-button v-auth="'coupon.list'" size="small" plain type="success" @click="onRowClick('view',row)">查看</el-button>-->
-              <el-button v-show="row.receiveType==='Release'" v-auth="'coupon.modify'"  size="small" plain type="danger" @click="onCouponDispatch(row)">发券</el-button>
+              <!--              <el-button v-auth="'coupon.list'" size="small" plain type="success" @click="onRowClick('view',row)">查看</el-button>-->
+              <el-button v-show="row.receiveType==='Release'" v-auth="'coupon.modify'" size="small" plain type="danger" @click="onCouponDispatch(row)">发券</el-button>
             </template>
             <template v-else>
               <div>{{ row[field.prop] }}</div>
@@ -161,7 +161,7 @@ const accountMobileUploadDialogRef = ref();
 //定义变量
 const state = reactive({
   formQuery: {
-    discountType:'Coupon'
+    discountType: 'Coupon'
   },
   pageQuery: {
     pageNum: 1,
@@ -192,7 +192,7 @@ const state = reactive({
       }
     ],
   },
-  handleCoupon:null
+  handleCoupon: null
 })
 
 
@@ -252,59 +252,74 @@ const onRowClick = (type: string, row: any) => {
 
 const onCouponDispatch = (row: any) => {
   state.handleCoupon = row;
-  Msg.confirm(`请选择发券方式`,'操作',{'ok':'选择用户发放','cancel':'导入号码发放'},'').then(() => {
+  Msg.confirm(`请选择发券方式`, '操作', {'ok': '选择用户发放', 'cancel': '导入号码发放'}, '').then(() => {
     //选择用户
-    let config ={
-      columns:[
-        {label: '手机号', query: true,width: 120, prop: 'mobilePhone', resizable: true,type:'text'},
+    let config = {
+      columns: [
+        {label: '手机号', query: true, width: 120, prop: 'mobilePhone', resizable: true, type: 'text'},
         // {label: '余额',query: false, width: 80, prop: 'balance', resizable: true,type:'number'},
-        {label: '状态', query: true,width: 80, prop: 'status', align: 'center',type:'dict',conf:{dict:'User.status'}},
+        {label: '状态', query: true, width: 80, prop: 'status', align: 'center', type: 'dict', conf: {dict: 'User.status'}},
       ],
-      query:{},
-      url:'custom/listUser',
-      method:'get'
+      query: {},
+      url: 'custom/listUser',
+      method: 'get'
     }
-      userSelectDialogRef.value.open(handleChooseAccount,true,config,[]);
-  }).catch(e=>{
+    userSelectDialogRef.value.open(handleChooseAccount, true, config, []);
+  }).catch(e => {
     console.log(e)
-    if('close'==e)return;
+    if ('close' == e) return;
     //上传用户手机号
     accountMobileUploadDialogRef.value?.open();
   });
 };
 
-const handleChooseAccount = (accountList:Array<any>)=>{
+const handleChooseAccount = (accountList: Array<any>) => {
   console.log(accountList)
-  if(u.isEmptyOrNull(accountList)){
-    Msg.message('请选择用户','error')
+  if (u.isEmptyOrNull(accountList)) {
+    Msg.message('请选择用户', 'error')
     return;
   }
-  let params ={
-    userIds:accountList.map(k=>k.userId),
-    couponId:state.handleCoupon.id
-  }
-  $body(`coupon/issueCoupons`,params).then(()=>{
-    Msg.message('发放成功')
-  }).catch(e=>{
-    Msg.message('发放失败','error')
+
+  Msg.prompt(`请输入发放数量`, '操作', {pattern: /^[0-9]*$/, error: '只能输入不小于1的数字'}).then((detail) => {
+    let count = detail.value;
+    if (detail.action != 'confirm' || !count || count < 1) return;
+    let params = {
+      userIds: accountList.map(k => k.userId),
+      couponId: state.handleCoupon.id,
+      couponCount: count
+    }
+    Msg.showLoading(`发放中`)
+    $body(`coupon/issueCoupons`, params).then(() => {
+      Msg.message('发放成功')
+    }).catch(e => {
+      Msg.message('发放失败', 'error')
+    })
   })
+
 }
 
-const handleImportAccountPhone = (phoneList:Array<any>) => {
+const handleImportAccountPhone = (phoneList: Array<any>) => {
   console.log(phoneList)
-  if(u.isEmptyOrNull(phoneList)||u.isEmptyOrNull(phoneList.dataList)){
-    Msg.message('请导入用户手机号','error')
+  if (u.isEmptyOrNull(phoneList) || u.isEmptyOrNull(phoneList.dataList)) {
+    Msg.message('请导入用户手机号', 'error')
     return;
   }
-  let params ={
-    phones:phoneList?.dataList?.map(k=>k.mobilePhone),
-    couponId:state.handleCoupon.id
-  }
-  $body(`coupon/issueCoupons`,params).then(()=>{
-    Msg.message('发放成功')
-  }).catch(e=>{
-    Msg.message('发放失败','error')
+  Msg.prompt(`请输入发放数量`, '操作', {pattern: /^[0-9]*$/, error: '只能输入不小于1的数字'}).then((detail:any) => {
+    let count = detail.value;
+    if (detail.action != 'confirm' || !count || count < 1) return;
+    let params = {
+      phones: phoneList?.dataList?.map(k => k.mobilePhone),
+      couponId: state.handleCoupon.id,
+      couponCount: count
+    }
+    Msg.showLoading(`发放中`)
+    $body(`coupon/issueCoupons`, params).then(() => {
+      Msg.message('发放成功')
+    }).catch(e => {
+      Msg.message('发放失败', 'error')
+    })
   })
+
 }
 
 const handleTableSelectionChange = (selection: any) => {