refactor: vue3.3 defineOptions

src/views/Error/403.vue

@@ -1,6 +1,8 @@
 <template>
   <Error type="403" @error-click="push('/')" />
 </template>
-<script lang="ts" name="Error403" setup>
+<script lang="ts" setup>
+defineOptions({ name: 'Error403' })
+
 const { push } = useRouter()
 </script>

src/views/Error/404.vue

@@ -1,6 +1,8 @@
 <template>
   <Error @error-click="push('/')" />
 </template>
-<script lang="ts" name="Error404" setup>
+<script lang="ts" setup>
+defineOptions({ name: 'Error404' })
+
 const { push } = useRouter()
 </script>

src/views/Error/500.vue

@@ -1,6 +1,8 @@
 <template>
   <Error type="500" @error-click="push('/')" />
 </template>
-<script lang="ts" name="Error500" setup>
+<script lang="ts" setup>
+defineOptions({ name: 'Error500' })
+
 const { push } = useRouter()
 </script>

src/views/Profile/components/BasicInfo.vue

@@ -14,8 +14,6 @@
 </template>
 <script lang="ts" setup>
 import type { FormRules } from 'element-plus'
-import { ElMessage } from 'element-plus'
-
 import { FormSchema } from '@/types/form'
 import type { FormExpose } from '@/components/Form'
 import {
@@ -27,6 +25,7 @@ import {
 defineOptions({ name: 'BasicInfo' })
 
 const { t } = useI18n()
+const message = useMessage() // 消息弹窗
 // 表单校验
 const rules = reactive<FormRules>({
   nickname: [{ required: true, message: t('profile.rules.nickname'), trigger: 'blur' }],
@@ -78,7 +77,7 @@ const submit = () => {
     if (valid) {
       const data = unref(formRef)?.formModel as UserProfileUpdateReqVO
       await updateUserProfileApi(data)
-      ElMessage.success(t('common.updateSuccess'))
+      message.success(t('common.updateSuccess'))
       await init()
     }
   })

src/views/Profile/components/ProfileUser.vue

@@ -81,7 +81,7 @@ onMounted(async () => {
 }
 
 .list-group {
-  padding-left: 0px;
+  padding-left: 0;
   list-style: none;
 }
 
@@ -89,7 +89,7 @@ onMounted(async () => {
   border-bottom: 1px solid #e7eaec;
   border-top: 1px solid #e7eaec;
   margin-bottom: -1px;
-  padding: 11px 0px;
+  padding: 11px 0;
   font-size: 13px;
 }
 

src/views/Redirect/Redirect.vue

@@ -2,7 +2,6 @@
   <div></div>
 </template>
 <script setup lang="ts">
-
 defineOptions({ name: 'Redirect' })
 
 const { currentRoute, replace } = useRouter()

src/views/mall/product/spu/components/SkuList.vue

@@ -264,6 +264,7 @@ import { PropertyAndValues } from './index'
 import { ElTable } from 'element-plus'
 
 defineOptions({ name: 'SkuList' })
+
 const message = useMessage() // 消息弹窗
 
 const props = defineProps({

src/views/mall/trade/delivery/expressTemplate/index.vue

@@ -92,7 +92,7 @@
   <!-- 表单弹窗：添加/修改 -->
   <ExpressTemplateForm ref="formRef" @success="getList" />
 </template>
-<script lang="ts" setup>
+<script setup lang="ts">
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import * as DeliveryExpressTemplateApi from '@/api/mall/trade/delivery/expressTemplate'

src/views/mp/freePublish/index.vue

@@ -99,7 +99,7 @@ const handleDelete = async (item: any) => {
 }
 </script>
 <style lang="scss" scoped>
-@media (min-width: 992px) and (max-width: 1300px) {
+@media (width >= 992px) and (width <= 1300px) {
   .waterfall {
     column-count: 3;
   }
@@ -109,7 +109,7 @@ const handleDelete = async (item: any) => {
   }
 }
 
-@media (min-width: 768px) and (max-width: 991px) {
+@media (width >= 768px) and (width <= 991px) {
   .waterfall {
     column-count: 2;
   }
@@ -119,7 +119,7 @@ const handleDelete = async (item: any) => {
   }
 }
 
-@media (max-width: 767px) {
+@media (width <= 767px) {
   .waterfall {
     column-count: 1;
   }