Quellcode durchsuchen

refactor(component): 优化组件库消息提示和样式

- 在多个组件中统一消息提示样式,增加 icon 参数
- 调整消息提示的 plain 参数为 true
- 优化部分组件的布局结构
WanGxC vor 6 Monaten
Ursprung
Commit
dfd87ffa07
26 geänderte Dateien mit 584 neuen und 557 gelöschten Zeilen
  1. 8 8
      src/utils/useCopyText.ts
  2. 118 115
      src/views/product-manage/competitor-monitor/component/CreateDialog.vue
  3. 46 44
      src/views/product-manage/competitor-monitor/component/DataTable.vue
  4. 5 5
      src/views/product-manage/competitor-monitor/component/EditDrawer.vue
  5. 2 2
      src/views/product-manage/component/ProductInfo.vue
  6. 28 20
      src/views/product-manage/product-list/component/DataTable.vue
  7. 16 16
      src/views/product-manage/product-list/component/DataTableSlot.vue
  8. 4 4
      src/views/product-manage/product-list/component/EditDrawer.vue
  9. 5 5
      src/views/product-manage/product-list/component/NoticeDialog.vue
  10. 115 112
      src/views/product-manage/product-monitor/component/CreateDialog.vue
  11. 41 39
      src/views/product-manage/product-monitor/component/DataTable.vue
  12. 5 5
      src/views/product-manage/product-monitor/component/DataTableSlot.vue
  13. 2 2
      src/views/product-manage/product-monitor/component/EditDrawer.vue
  14. 22 17
      src/views/sku-manage/company-sku/component/DataTable.vue
  15. 2 2
      src/views/sku-manage/company-sku/component/DataTableSlot.vue
  16. 45 45
      src/views/sku-manage/product-attribute/component/CreateDialog.vue
  17. 8 8
      src/views/sku-manage/product-attribute/component/DataTable.vue
  18. 2 2
      src/views/sku-manage/product-attribute/component/EditDrawer.vue
  19. 38 38
      src/views/sku-manage/product-brand/component/CreateDialog.vue
  20. 3 3
      src/views/sku-manage/product-brand/component/DataTable.vue
  21. 1 1
      src/views/sku-manage/product-brand/component/EditDrawer.vue
  22. 25 21
      src/views/sku-manage/product-category/component/AttributeManage.vue
  23. 1 1
      src/views/sku-manage/product-category/component/AttributeManageEdit.vue
  24. 38 38
      src/views/sku-manage/product-category/component/CreateDialog.vue
  25. 3 3
      src/views/sku-manage/product-category/component/DataTable.vue
  26. 1 1
      src/views/sku-manage/product-category/component/EditDrawer.vue

+ 8 - 8
src/utils/useCopyText.ts

@@ -1,22 +1,22 @@
 export function handleCopy(copyText: string) {
-  const textarea = document.createElement("textarea");
+  const textarea = document.createElement('textarea');
   textarea.value = copyText; // 要复制的内容
-  textarea.style.position = "fixed"; // 避免页面滚动
-  textarea.style.opacity = "0";     // 隐藏元素
+  textarea.style.position = 'fixed'; // 避免页面滚动
+  textarea.style.opacity = '0';     // 隐藏元素
   document.body.appendChild(textarea);
 
   textarea.select(); // 选中内容
 
   try {
-    const successful = document.execCommand("copy"); // 执行复制命令
+    const successful = document.execCommand('copy'); // 执行复制命令
     if (successful) {
-      ElMessage.success({ message: "复制成功!", plain: true });
+      ElMessage.info({ message: '已复制至剪切板', plain: true, icon: 'DocumentCopy' });
     } else {
-      ElMessage.error({ message: "复制失败,请手动复制!", plain: true });
+      ElMessage.error({ message: '复制失败,请手动复制!', plain: true });
     }
   } catch (error) {
-    ElMessage.error({ message: "复制失败,请重试!", plain: true });
-    console.error("复制失败:", error);
+    ElMessage.error({ message: '复制失败,请重试!', plain: true });
+    console.error('复制失败:', error);
   }
 
   document.body.removeChild(textarea); // 清理临时元素

+ 118 - 115
src/views/product-manage/competitor-monitor/component/CreateDialog.vue

@@ -11,154 +11,157 @@ import { useResponse } from '/@/utils/useResponse';
 import * as api from '../api';
 import { Close, Finished } from '@element-plus/icons-vue';
 
+
 const shopOptions = <Ref>inject('shopOptions');
 const groupOptions = <Ref>inject('groupOptions');
-const statusOptions = [{ label: '正常', value: 1 }];
+const statusOptions = [ { label: '正常', value: 1 } ];
 const { data: staticData } = DictionaryStore();
 
 const loading = ref(false);
 const createDialog = <Ref>useTemplateRef('createDialog');
 const createOpen = defineModel({ default: false });
 
-const emit = defineEmits(['refresh']);
+const emit = defineEmits([ 'refresh' ]);
 
 interface RuleForm {
-	asin: any;
-	country: any;
-	shop: any;
-	group: any;
-	status: any;
-	frequency: any;
-	description: any;
+  asin: any;
+  country: any;
+  shop: any;
+  group: any;
+  status: any;
+  frequency: any;
+  description: any;
 }
 
 const ruleFormRef = ref<FormInstance>();
 const ruleForm = reactive<RuleForm>({
-	asin: '',
-	country: '',
-	shop: '',
-	group: '',
-	status: 1,
-	frequency: 6,
-	description: '',
+  asin: '',
+  country: '',
+  shop: '',
+  group: '',
+  status: 1,
+  frequency: 6,
+  description: ''
 });
 
 const rules = reactive<FormRules<RuleForm>>({
-	asin: [{ required: true, message: '请输入ASIN', trigger: 'blur' }],
-	country: [{ required: true, message: '请选择国家', trigger: 'change' }],
-	shop: [{ required: true, message: '请输入店铺', trigger: 'blur' }],
-	group: [{ required: true, message: '请输入分组', trigger: 'blur' }],
-	// status: [{ message: '请选择状态', trigger: 'blur' }],
-	// frequency: [ { message: '请选择更新频率', trigger: 'blur' } ]
+  asin: [ { required: true, message: '请输入ASIN', trigger: 'blur' } ],
+  country: [ { required: true, message: '请选择国家', trigger: 'change' } ],
+  shop: [ { required: true, message: '请输入店铺', trigger: 'blur' } ],
+  group: [ { required: true, message: '请输入分组', trigger: 'blur' } ]
+  // status: [{ message: '请选择状态', trigger: 'blur' }],
+  // frequency: [ { message: '请选择更新频率', trigger: 'blur' } ]
 });
 
 const submitForm = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	await formEl.validate(async (valid, fields) => {
-		if (valid) {
-			const body = {
-				asin: ruleForm.asin,
-				country_code: ruleForm.country,
-				shop_name: ruleForm.shop,
-				tag: ruleForm.group,
-				freq: ruleForm.frequency,
-				status: ruleForm.status,
-				// description: ruleForm.description,
-			};
-			const res = await useResponse(api.createCompetitorMonitor, body, loading);
-			if (res.code === 2000) {
-				ElMessage.success('创建成功');
-				createOpen.value = false;
-				emit('refresh');
-			}
-		} else {
-			// createOpen.value = false;
-			ElMessage.error('创建失败,请检查表单');
-		}
-	});
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const body = {
+        asin: ruleForm.asin,
+        country_code: ruleForm.country,
+        shop_name: ruleForm.shop,
+        tag: ruleForm.group,
+        freq: ruleForm.frequency,
+        status: ruleForm.status
+        // description: ruleForm.description,
+      };
+      const res = await useResponse(api.createCompetitorMonitor, body, loading);
+      if (res.code === 2000) {
+        ElMessage.success({ message: '创建成功', plain: true, icon: 'CirclePlus' });
+        createOpen.value = false;
+        emit('refresh');
+      }
+    } else {
+      // createOpen.value = false;
+      ElMessage.error('创建失败,请检查表单');
+    }
+  });
 };
 
 function cancelDialog() {
-	resetForm(ruleFormRef.value);
-	createDialog.value.visible = false;
+  resetForm(ruleFormRef.value);
+  createDialog.value.visible = false;
 }
 
 const resetForm = (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	formEl.resetFields();
+  if (!formEl) return;
+  formEl.resetFields();
 };
 </script>
 
 <template>
-	<el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false" :title="`竞品监控 - 创建 `" style="width: 40%">
-		<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-position="top" label-width="auto" status-icon>
-			<el-row :gutter="20">
-				<el-col :span="24">
-					<el-form-item class="font-medium" label="ASIN" prop="asin">
-						<el-input v-model="ruleForm.asin" placeholder="不再支持批量创建(批量创建使用Excel导入),请填写单个asin" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="国 家" prop="country">
-						<el-select v-model="ruleForm.country" placeholder="请选择国家">
-							<el-option v-for="item in staticData.country_code" :key="item.value" :label="item.label" :value="item.value" />
-						</el-select>
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="店 铺" prop="shop">
-						<!--<el-select v-model="ruleForm.shop" placeholder="请选择店铺">-->
-						<!--	<el-option v-for="item in shopOptions" :key="item.id" :label="item.name" :value="item.id" />-->
-						<!--</el-select>-->
-						<el-input v-model="ruleForm.shop" placeholder="请输入店铺" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="分 组" prop="group">
-						<el-select v-model="ruleForm.group" placeholder="请选择分组">
-							<el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
-						</el-select>
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="更新频率" prop="frequency">
-						<el-input-number v-model="ruleForm.frequency" min="3" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="状态" prop="status">
-						<el-select v-model="ruleForm.status" disabled>
-							<el-option
-								v-for="item in statusOptions"
-								:key="item.value"
-								:label="item.label"
-								:value="item.value"
-							/>
-						</el-select>
-					</el-form-item>
-				</el-col>
-
-				<!--<el-col :span="12">-->
-				<!--	<el-form-item class="font-medium" label="备注" prop="description">-->
-				<!--		<el-input v-model="ruleForm.description" maxlength="200" placeholder="请输入备注信息" show-word-limit type="textarea" />-->
-				<!--	</el-form-item>-->
-				<!--</el-col>-->
-			</el-row>
-		</el-form>
-		<template #footer>
-			<el-button :icon="Close" @click="cancelDialog">取 消</el-button>
-			<el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
-		</template>
-	</el-dialog>
+  <el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false"
+             :title="`竞品监控 - 创建 `" style="width: 40%">
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-position="top" label-width="auto"
+             status-icon>
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item class="font-medium" label="ASIN" prop="asin">
+            <el-input v-model="ruleForm.asin" placeholder="不再支持批量创建(批量创建使用Excel导入),请填写单个asin" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="国 家" prop="country">
+            <el-select v-model="ruleForm.country" placeholder="请选择国家">
+              <el-option v-for="item in staticData.country_code" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="店 铺" prop="shop">
+            <!--<el-select v-model="ruleForm.shop" placeholder="请选择店铺">-->
+            <!--	<el-option v-for="item in shopOptions" :key="item.id" :label="item.name" :value="item.id" />-->
+            <!--</el-select>-->
+            <el-input v-model="ruleForm.shop" placeholder="请输入店铺" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="分 组" prop="group">
+            <el-select v-model="ruleForm.group" placeholder="请选择分组">
+              <el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="更新频率" prop="frequency">
+            <el-input-number v-model="ruleForm.frequency" min="3" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="状态" prop="status">
+            <el-select v-model="ruleForm.status" disabled>
+              <el-option
+                  v-for="item in statusOptions"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <!--<el-col :span="12">-->
+        <!--	<el-form-item class="font-medium" label="备注" prop="description">-->
+        <!--		<el-input v-model="ruleForm.description" maxlength="200" placeholder="请输入备注信息" show-word-limit type="textarea" />-->
+        <!--	</el-form-item>-->
+        <!--</el-col>-->
+      </el-row>
+    </el-form>
+    <template #footer>
+      <el-button :icon="Close" @click="cancelDialog">取 消</el-button>
+      <el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>
 :deep(.el-drawer .el-drawer__header) {
-	border: none !important;
+  border: none !important;
 }
 </style>

+ 46 - 44
src/views/product-manage/competitor-monitor/component/DataTable.vue

@@ -94,7 +94,7 @@ const isShowHistory = ref(false);
 
 onBeforeMount(() => {
   gridOptions.pagerConfig.limit = 10;
-})
+});
 
 onMounted(() => {
   fetchList();
@@ -110,7 +110,7 @@ async function fetchList(isQuery = false) {
   // 清空数据和列
   gridOptions.data = [];
   gridOptions.columns = [];
-  
+
   const query = {
     country_code: queryParameter?.country,
     goods__brand: queryParameter?.brand,
@@ -122,9 +122,9 @@ async function fetchList(isQuery = false) {
     platform_number: queryParameter?.platformId,
     goods__all_ratings: queryParameter?.scoreNumber,
     goods__all_reviews: queryParameter?.commentNumber,
-    goods__all_score: queryParameter?.displayScore,
+    goods__all_score: queryParameter?.displayScore
   };
-  
+
   await useTableData(api.getTableData, query, gridOptions);
   await gridRef.value.loadColumn(CompetitorMonitorColumns);
 
@@ -139,17 +139,17 @@ async function handleDownload() {
   gridOptions.loading = true;
   try {
     const query = {
-			country_code: queryParameter?.country,
-			goods__brand: queryParameter?.brand,
-			goods__tag: queryParameter?.group,
-			status: queryParameter?.status,
-			shop: queryParameter?.shop,
-			asin: queryParameter?.asin,
-			goods__sku: queryParameter?.sku,
-			platform_number: queryParameter?.platformId,
-			goods__all_ratings: queryParameter?.scoreNumber,
-			goods__all_reviews: queryParameter?.commentNumber,
-			goods__all_score: queryParameter?.displayScore,
+      country_code: queryParameter?.country,
+      goods__brand: queryParameter?.brand,
+      goods__tag: queryParameter?.group,
+      status: queryParameter?.status,
+      shop: queryParameter?.shop,
+      asin: queryParameter?.asin,
+      goods__sku: queryParameter?.sku,
+      platform_number: queryParameter?.platformId,
+      goods__all_ratings: queryParameter?.scoreNumber,
+      goods__all_reviews: queryParameter?.commentNumber,
+      goods__all_score: queryParameter?.displayScore
     };
     const response = await api.exportData(query);
     const url = window.URL.createObjectURL(new Blob([ response.data ]));
@@ -172,7 +172,7 @@ async function batchDelete() {
   const res = await useResponse(api.batchDeleteRow, { keys: ids });
   checkedList.value.clear();
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '选中项已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -207,7 +207,7 @@ function handleEdit(row: any) {
 async function singleDelete(row: any) {
   const res = await useResponse(api.deleteRow, row);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -259,28 +259,30 @@ defineExpose({ fetchList });
             @checkbox-all="selectAllChangeEvent">
     <template #toolbar_buttons>
       <div class="flex gap-2">
-        <el-popconfirm
-            :icon="InfoFilled"
-            icon-color="#626AEF"
-            title="你确定要删除此项吗?"
-            width="220"
-            @confirm="batchDelete"
-        >
-          <template #reference>
-            <PermissionButton :disabled="!checkedList.size" :icon="Delete" plain round type="danger">
-              批量删除
-            </PermissionButton>
-          </template>
-          <template #actions="{ confirm, cancel }">
-            <el-button size="small" @click="cancel">No!</el-button>
-            <el-button size="small" type="danger" @click="confirm">
-              Yes?
-            </el-button>
-          </template>
-        </el-popconfirm>
-        <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">
-          新 增
-        </PermissionButton>
+        <div>
+          <el-popconfirm
+              :icon="InfoFilled"
+              icon-color="#626AEF"
+              title="你确定要删除此项吗?"
+              width="220"
+              @confirm="batchDelete"
+          >
+            <template #reference>
+              <PermissionButton :disabled="!checkedList.size" :icon="Delete" plain round type="danger">
+                批量删除
+              </PermissionButton>
+            </template>
+            <template #actions="{ confirm, cancel }">
+              <el-button size="small" @click="cancel">No!</el-button>
+              <el-button size="small" type="danger" @click="confirm">
+                Yes?
+              </el-button>
+            </template>
+          </el-popconfirm>
+        </div>
+        <div>
+          <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">新 增</PermissionButton>
+        </div>
         <div class="custom-el-input">
           <el-select v-model="templateType" placeholder="Select" style="width: 190px">
             <template #prefix>
@@ -312,11 +314,11 @@ defineExpose({ fetchList });
       <!--    @confirm="handleDownload"-->
       <!--&gt;-->
       <!--  <template #reference>-->
-          <el-button circle class="mr-3 toolbar-btn" @click="handleDownload">
-            <el-icon>
-              <Download />
-            </el-icon>
-          </el-button>
+      <el-button circle class="mr-3 toolbar-btn" @click="handleDownload">
+        <el-icon>
+          <Download />
+        </el-icon>
+      </el-button>
       <!--  </template>-->
       <!--  <template #actions="{ confirm, cancel }">-->
       <!--    <el-button size="small" @click="cancel">No!</el-button>-->

+ 5 - 5
src/views/product-manage/competitor-monitor/component/EditDrawer.vue

@@ -44,12 +44,12 @@ const ruleForm = reactive<RuleForm>({
   shop_name: rowData?.shop_name,
   tag: rowData?.goods.tag,
   status: rowData?.status.toString(),
-  freq: rowData?.freq,
+  freq: rowData?.freq
 });
 
 const rules = reactive<FormRules<RuleForm>>({
   shop_name: [ { required: true, message: '请输入店铺', trigger: 'blur' } ],
-  tag: [ { required: true, message: '请输入分组', trigger: 'blur' } ],
+  tag: [ { required: true, message: '请输入分组', trigger: 'blur' } ]
 });
 
 const submitForm = async (formEl: FormInstance | undefined) => {
@@ -60,7 +60,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         const res = await useResponse(api.updateRow, { id: rowData?.id, ...ruleForm }, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {
@@ -101,7 +101,7 @@ function closeDrawer() {
           <el-input v-model="ruleForm.shop_name" />
         </el-form-item>
         <el-form-item class="font-medium" label="分 组" prop="tag">
-          <el-select v-model="ruleForm.tag" filterable allow-create>
+          <el-select v-model="ruleForm.tag" allow-create filterable>
             <el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
           </el-select>
         </el-form-item>
@@ -112,7 +112,7 @@ function closeDrawer() {
           </el-select>
         </el-form-item>
         <el-form-item class="font-medium" label="国 家" prop="country_code">
-          <el-select v-model="ruleForm.country_code" placeholder="请选择国家" :disabled="true">
+          <el-select v-model="ruleForm.country_code" :disabled="true" placeholder="请选择国家">
             <el-option
                 v-for="item in staticData.country_code"
                 :key="item.value"

+ 2 - 2
src/views/product-manage/component/ProductInfo.vue

@@ -3,7 +3,7 @@
  * @Description: 商品列表-商品信息插槽
  * @Author: Cheney
  */
-import { DocumentCopy } from '@element-plus/icons-vue';
+import { CopyDocument } from '@element-plus/icons-vue';
 import { handleCopy } from '/@/utils/useCopyText';
 
 
@@ -70,7 +70,7 @@ const props = defineProps({
           <span class="font-semibold italic ml-1" style="color: #1d2129;">
             {{ item.asin || '--' }}
           </span>
-          <el-button :disabled="!item.asin" :icon="DocumentCopy" class="ml-1 cursor-pointer" link
+          <el-button :disabled="!item.asin" :icon="CopyDocument" class="ml-1 cursor-pointer" link
                      @click="handleCopy(item.asin || '')">
           </el-button>
         </div>

+ 28 - 20
src/views/product-manage/product-list/component/DataTable.vue

@@ -5,7 +5,7 @@
  * @Author: Cheney
  */
 
-import { Download, InfoFilled, Message, Money, Open, Refresh } from '@element-plus/icons-vue';
+import { Download, Message, Money, Open, Refresh } from '@element-plus/icons-vue';
 import { ElMessage } from 'element-plus';
 import { usePagination } from '/@/utils/usePagination';
 import { useTableData } from '/@/utils/useTableData';
@@ -131,15 +131,15 @@ async function handleDownload() {
   gridOptions.loading = true;
   try {
     const query = {
-			country_code: queryParameter?.country,
-			brand: queryParameter?.brand,
-			tag: queryParameter?.group,
-			status: queryParameter?.status,
-			asin: queryParameter?.asin,
-			sku: queryParameter?.sku,
-			shop: queryParameter?.shop,
-			is_competitors: queryParameter?.isCompetitors,
-			platform_number: queryParameter?.platformNumber
+      country_code: queryParameter?.country,
+      brand: queryParameter?.brand,
+      tag: queryParameter?.group,
+      status: queryParameter?.status,
+      asin: queryParameter?.asin,
+      sku: queryParameter?.sku,
+      shop: queryParameter?.shop,
+      is_competitors: queryParameter?.isCompetitors,
+      platform_number: queryParameter?.platformNumber
     };
     const response = await api.exportData(query);
     const url = window.URL.createObjectURL(new Blob([ response.data ]));
@@ -192,8 +192,15 @@ function handleNotice(row: any) {
 async function switchMonitor(row: any) {
   const res = await useResponse(api.postMonitor, { ids: [ row.id ], status: row.is_monitor ? 1 : 0 });
   if (res && res.code === 2000) {
-    ElMessage.success({ message: '操作成功!', plain: true });
+    // 根据 row.is_monitor 的值显示不同的提示信息
+    const message = row.is_monitor ? '已开启!' : '已关闭!';
+    if (row.is_monitor) {
+      ElMessage.success({ message, plain: true, icon: 'Open' });
+    } else {
+      ElMessage.warning({ message, plain: true, icon: 'TurnOff' });
+    }
   } else {
+    // 如果操作失败,恢复原始状态
     row.is_monitor = !row.is_monitor;
     ElMessage.error({ message: '操作失败!', plain: true });
   }
@@ -237,8 +244,8 @@ function downloadTemplate() {
 }
 
 function handleError(error: any) {
-	errorMsg.value = error;
-	showError.value = true;
+  errorMsg.value = error;
+  showError.value = true;
 }
 
 const gridEvents = {
@@ -288,7 +295,8 @@ defineExpose({ fetchList });
           <i class="bi bi-box-seam mr-3"></i>
           商品导入
         </ImportButton>
-        <ImportButton :icon="Money" :uploadFunction="api.uploadPrice" bg text @handelError="handleError">指导价格导入</ImportButton>
+        <ImportButton :icon="Money" :uploadFunction="api.uploadPrice" bg text @handelError="handleError">指导价格导入
+        </ImportButton>
       </div>
     </template>
     <!-- 工具栏右侧 -->
@@ -298,11 +306,11 @@ defineExpose({ fetchList });
           <Refresh />
         </el-icon>
       </el-button>
-			<el-button circle class="mr-3 toolbar-btn" @click="handleDownload">
-				<el-icon>
-					<Download />
-				</el-icon>
-			</el-button>
+      <el-button circle class="mr-3 toolbar-btn" @click="handleDownload">
+        <el-icon>
+          <Download />
+        </el-icon>
+      </el-button>
     </template>
     <template #top>
       <div class="mb-2"></div>
@@ -328,7 +336,7 @@ defineExpose({ fetchList });
   </vxe-grid>
   <EditDrawer v-if="editOpen" v-model="editOpen" :row-data="rowData" @refresh="handleRefresh" />
   <NoticeDialog v-if="dialogVisible" v-model="dialogVisible" :row-data="rowData" />
-	<DownloadError v-if="showError" v-model="showError" :errorMsg="errorMsg"></DownloadError>
+  <DownloadError v-if="showError" v-model="showError" :errorMsg="errorMsg" />
 </template>
 
 <style scoped>

+ 16 - 16
src/views/product-manage/product-list/component/DataTableSlot.vue

@@ -6,7 +6,7 @@
  */
 
 import { useCountryInfoStore } from '/@/stores/countryInfo';
-import { DocumentCopy, Message, MessageBox, Operation } from '@element-plus/icons-vue';
+import { CopyDocument, Message, Operation } from '@element-plus/icons-vue';
 import { getTagType } from '/@/utils/useTagColor';
 import PermissionButton from '/@/components/PermissionButton/index.vue';
 import ProductInfo from '/@/views/product-manage/component/ProductInfo.vue';
@@ -50,22 +50,22 @@ function handleMonitor() {
       <el-switch v-model=row.is_monitor @change="handleMonitor" />
     </div>
     <div v-else-if="field === 'product_info'">
-      <ProductInfo :img-width="60" :item="row" :displayCompetitor="true" />
+      <ProductInfo :displayCompetitor="true" :img-width="60" :item="row" />
     </div>
     <div v-else-if="field === 'sku'" style="color: #1d2129;">
       <div class="flex items-center justify-center max-h-5">
         {{ row.sku ? row.sku : '-' }}
-        <el-button v-if="row.sku" :icon="DocumentCopy" class="ml-1 cursor-pointer" link @click="handleCopy(row.sku || '')">
+        <el-button v-if="row.sku" :icon="CopyDocument" class="ml-1 cursor-pointer" link @click="handleCopy(row.sku || '')">
         </el-button>
       </div>
       <div v-if="row.sku2" class="flex items-center justify-center max-h-5">
         {{ row.sku2 ? row.sku2 : '-' }}
-        <el-button v-if="row.sku2" :icon="DocumentCopy" class="ml-1 cursor-pointer" link @click="handleCopy(row.sku2 || '')">
+        <el-button v-if="row.sku2" :icon="CopyDocument" class="ml-1 cursor-pointer" link @click="handleCopy(row.sku2 || '')">
         </el-button>
       </div>
       <div v-if="row.sku3" class="flex items-center justify-center max-h-5">
         {{ row.sku3 ? row.sku3 : '-' }}
-        <el-button v-if="row.sku3" :icon="DocumentCopy" class="ml-1 cursor-pointer" link @click="handleCopy(row.sku3 || '')">
+        <el-button v-if="row.sku3" :icon="CopyDocument" class="ml-1 cursor-pointer" link @click="handleCopy(row.sku3 || '')">
         </el-button>
       </div>
     </div>
@@ -114,22 +114,22 @@ function handleMonitor() {
     <div v-else-if="field === 'operate'">
       <div class="flex justify-center gap-2">
         <div>
-          <PermissionButton circle plain type="warning" @click="handleEdit" :disabled="row.is_competitors">
+          <PermissionButton :disabled="row.is_competitors" circle plain type="warning" @click="handleEdit">
             <el-icon>
               <Operation />
             </el-icon>
           </PermissionButton>
         </div>
-       <div>
-         <el-tooltip :enterable="false" :show-arrow="false" content="变更通知" hide-after="0"
-                     placement="top" popper-class="custom-btn-tooltip-info">
-           <PermissionButton circle plain type="info" @click="handleNotice">
-             <el-icon>
-               <Message />
-             </el-icon>
-           </PermissionButton>
-         </el-tooltip>
-       </div>
+        <div>
+          <el-tooltip :enterable="false" :show-arrow="false" content="变更通知" hide-after="0"
+                      placement="top" popper-class="custom-btn-tooltip-info">
+            <PermissionButton circle plain type="info" @click="handleNotice">
+              <el-icon>
+                <Message />
+              </el-icon>
+            </PermissionButton>
+          </el-tooltip>
+        </div>
       </div>
     </div>
     <div v-else>

+ 4 - 4
src/views/product-manage/product-list/component/EditDrawer.vue

@@ -51,7 +51,7 @@ const ruleForm = reactive<RuleForm>({
 const rules = reactive<FormRules<RuleForm>>({});
 
 // 构造sku数据格式
-ruleForm.sku = [rowData.sku, rowData.sku2, rowData.sku3]
+ruleForm.sku = [ rowData.sku, rowData.sku2, rowData.sku3 ]
     .filter(Boolean)
     .join(',');
 
@@ -64,14 +64,14 @@ const submitForm = async (formEl: FormInstance | undefined) => {
     ElMessage.warning('SKU 输入不能超过三个,请检查 SKU');
     return;
   }
-  
+
   await formEl.validate(async (valid, fields) => {
     if (valid) {
       try {
         const res = await useResponse(api.updateRow, { id: rowData?.id, ...ruleForm }, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {
@@ -128,7 +128,7 @@ function mappingShopId(val: any) {
           </el-select>
         </el-form-item>
         <el-form-item class="font-medium" label="分 组:" prop="tag">
-          <el-select v-model="ruleForm.tag" filterable allow-create>
+          <el-select v-model="ruleForm.tag" allow-create filterable>
             <el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
           </el-select>
         </el-form-item>

+ 5 - 5
src/views/product-manage/product-list/component/NoticeDialog.vue

@@ -73,13 +73,13 @@ async function addStaffs() {
     user_ids: staffTags.value.map((tag: any) => tag.id)
   };
   try {
-    const resp = await useResponse(api.postStaffs, body, staffLoading)
+    const resp = await useResponse(api.postStaffs, body, staffLoading);
     if (resp.code === 2000) {
-      ElMessage.success('编辑成功!');
+      ElMessage.success({ message: '操作成功', plain: true });
       fetchExistingStaff();
     }
   } catch (error) {
-    ElMessage.error('编辑失败!');
+    ElMessage.error('操作失败!');
   } finally {
     staffSelect.value = '';
   }
@@ -96,11 +96,11 @@ function cancelDialog() {
   <div>
     <el-dialog
         ref="noticeDialog"
-        class="notice-dialog"
         v-model="dialogVisible"
         :before-close="handleClose"
         :close-on-click-modal="false"
         :close-on-press-escape="false"
+        class="notice-dialog"
         title="变更通知"
         width="35%"
     >
@@ -132,8 +132,8 @@ function cancelDialog() {
             v-for="tag in staffTags"
             :key="tag.id"
             closable
-            round
             effect="plain"
+            round
             @close="removeTag(tag)">
           {{ tag.username }}
         </el-tag>

+ 115 - 112
src/views/product-manage/product-monitor/component/CreateDialog.vue

@@ -11,6 +11,7 @@ import { useResponse } from '/@/utils/useResponse';
 import * as api from '../api';
 import { Close, Finished } from '@element-plus/icons-vue';
 
+
 const shopOptions = <Ref>inject('shopOptions');
 const groupOptions = <Ref>inject('groupOptions');
 const { data: staticData } = DictionaryStore();
@@ -19,143 +20,145 @@ const loading = ref(false);
 const createDialog = <Ref>useTemplateRef('createDialog');
 const createOpen = defineModel({ default: false });
 
-const emit = defineEmits(['refresh']);
+const emit = defineEmits([ 'refresh' ]);
 
 interface RuleForm {
-	asin: any;
-	sku: any;
-	country: any;
-	shop: any;
-	group: any;
-	// status: any;
-	frequency: any;
-	description: any;
+  asin: any;
+  sku: any;
+  country: any;
+  shop: any;
+  group: any;
+  // status: any;
+  frequency: any;
+  description: any;
 }
 
 const ruleFormRef = ref<FormInstance>();
 const ruleForm = reactive<RuleForm>({
-	asin: '',
-	sku: '',
-	country: '',
-	shop: '',
-	group: '',
-	// status: '',
-	frequency: 6,
-	description: '',
+  asin: '',
+  sku: '',
+  country: '',
+  shop: '',
+  group: '',
+  // status: '',
+  frequency: 6,
+  description: ''
 });
 
 const rules = reactive<FormRules<RuleForm>>({
-	asin: [{ required: true, message: '请输入ASIN', trigger: 'blur' }],
-	sku: [{ required: true, message: '请输入SKU', trigger: 'blur' }],
-	country: [{ required: true, message: '请选择国家', trigger: 'change' }],
-	shop: [{ required: true, message: '请输入店铺', trigger: 'blur' }],
-	group: [{ required: true, message: '请输入分组', trigger: 'blur' }],
-	// frequency: [ { message: '请选择更新频率', trigger: 'blur' } ]
+  asin: [ { required: true, message: '请输入ASIN', trigger: 'blur' } ],
+  sku: [ { required: true, message: '请输入SKU', trigger: 'blur' } ],
+  country: [ { required: true, message: '请选择国家', trigger: 'change' } ],
+  shop: [ { required: true, message: '请输入店铺', trigger: 'blur' } ],
+  group: [ { required: true, message: '请输入分组', trigger: 'blur' } ]
+  // frequency: [ { message: '请选择更新频率', trigger: 'blur' } ]
 });
 
 const submitForm = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	await formEl.validate(async (valid, fields) => {
-		if (valid) {
-			const body = {
-				asin: ruleForm.asin,
-				sku: ruleForm.sku,
-				country_code: ruleForm.country,
-				shop_id: ruleForm.shop,
-				tag: ruleForm.group,
-				goods: {
-					sku: ruleForm.sku,
-					tag: ruleForm.group,
-				},
-				freq: ruleForm.frequency,
-				// description: ruleForm.description,
-			};
-			const res = await useResponse(api.createProductMonitor, body, loading);
-			if (res.code === 2000){
-				ElMessage.success('创建成功');
-				createOpen.value = false;
-				emit('refresh');
-			}
-		} else {
-			// createOpen.value = false;
-			ElMessage.error('创建失败,请检查表单');
-		}
-	});
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const body = {
+        asin: ruleForm.asin,
+        sku: ruleForm.sku,
+        country_code: ruleForm.country,
+        shop_id: ruleForm.shop,
+        tag: ruleForm.group,
+        goods: {
+          sku: ruleForm.sku,
+          tag: ruleForm.group
+        },
+        freq: ruleForm.frequency
+        // description: ruleForm.description,
+      };
+      const res = await useResponse(api.createProductMonitor, body, loading);
+      if (res.code === 2000) {
+        ElMessage.success({ message: '创建成功', plain: true, icon: 'CirclePlus' });
+        createOpen.value = false;
+        emit('refresh');
+      }
+    } else {
+      // createOpen.value = false;
+      ElMessage.error('创建失败,请检查表单');
+    }
+  });
 };
 
 function cancelDialog() {
-	resetForm(ruleFormRef.value);
-	createDialog.value.visible = false;
+  resetForm(ruleFormRef.value);
+  createDialog.value.visible = false;
 }
 
 const resetForm = (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	formEl.resetFields();
+  if (!formEl) return;
+  formEl.resetFields();
 };
 </script>
 
 <template>
-	<el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false" :title="`商品监控 - 创建 `" style="width: 40%">
-		<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-position="top" label-width="auto" class="mx-2.5 mt-5" status-icon>
-			<el-row :gutter="20">
-				<el-col :span="24">
-					<el-form-item class="font-medium" label="ASIN" prop="asin">
-						<el-input v-model="ruleForm.asin" placeholder="不再支持批量创建(批量创建使用Excel导入),请填写单个asin" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="SKU" prop="sku">
-						<el-input v-model="ruleForm.sku" placeholder="请输入SKU" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="店 铺" prop="shop">
-						<el-select v-model="ruleForm.shop" placeholder="请选择店铺">
-							<el-option v-for="item in shopOptions" :key="item.id" :label="item.name" :value="item.id" />
-						</el-select>
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="分 组" prop="group">
-						<el-select v-model="ruleForm.group" placeholder="请选择分组">
-							<el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
-						</el-select>
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="国 家" prop="country">
-						<el-select v-model="ruleForm.country" placeholder="请选择国家">
-							<el-option v-for="item in staticData.country_code" :key="item.value" :label="item.label" :value="item.value" />
-						</el-select>
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="12">
-					<el-form-item class="font-medium" label="更新频率" prop="frequency">
-						<el-input-number v-model="ruleForm.frequency" min="3" />
-					</el-form-item>
-				</el-col>
-
-				<!--<el-col :span="12">-->
-				<!--	<el-form-item class="font-medium" label="备注" prop="description">-->
-				<!--		<el-input v-model="ruleForm.description" type="textarea" placeholder="请输入备注信息" maxlength="200" show-word-limit />-->
-				<!--	</el-form-item>-->
-				<!--</el-col>-->
-			</el-row>
-		</el-form>
-		<template #footer>
-			<el-button :icon="Close" @click="cancelDialog">取 消</el-button>
-			<el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
-		</template>
-	</el-dialog>
+  <el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false"
+             :title="`商品监控 - 创建 `" style="width: 40%">
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-position="top" label-width="auto"
+             status-icon>
+      <el-row :gutter="20">
+        <el-col :span="24">
+          <el-form-item class="font-medium" label="ASIN" prop="asin">
+            <el-input v-model="ruleForm.asin" placeholder="不再支持批量创建(批量创建使用Excel导入),请填写单个asin" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="SKU" prop="sku">
+            <el-input v-model="ruleForm.sku" placeholder="请输入SKU" />
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="店 铺" prop="shop">
+            <el-select v-model="ruleForm.shop" placeholder="请选择店铺">
+              <el-option v-for="item in shopOptions" :key="item.id" :label="item.name" :value="item.id" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="分 组" prop="group">
+            <el-select v-model="ruleForm.group" placeholder="请选择分组">
+              <el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="国 家" prop="country">
+            <el-select v-model="ruleForm.country" placeholder="请选择国家">
+              <el-option v-for="item in staticData.country_code" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+        </el-col>
+
+        <el-col :span="12">
+          <el-form-item class="font-medium" label="更新频率" prop="frequency">
+            <el-input-number v-model="ruleForm.frequency" min="3" />
+          </el-form-item>
+        </el-col>
+
+        <!--<el-col :span="12">-->
+        <!--	<el-form-item class="font-medium" label="备注" prop="description">-->
+        <!--		<el-input v-model="ruleForm.description" type="textarea" placeholder="请输入备注信息" maxlength="200" show-word-limit />-->
+        <!--	</el-form-item>-->
+        <!--</el-col>-->
+      </el-row>
+    </el-form>
+    <template #footer>
+      <el-button :icon="Close" @click="cancelDialog">取 消</el-button>
+      <el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>
 :deep(.el-drawer .el-drawer__header) {
-	border: none !important;
+  border: none !important;
 }
 </style>

+ 41 - 39
src/views/product-manage/product-monitor/component/DataTable.vue

@@ -94,7 +94,7 @@ const isShowHistory = ref(false);
 
 onBeforeMount(() => {
   gridOptions.pagerConfig.limit = 10;
-})
+});
 
 onMounted(() => {
   fetchList();
@@ -104,7 +104,7 @@ async function fetchList(isQuery = false) {
   if (isQuery) {
     gridOptions.pagerConfig.page = 1;
   }
-  
+
   gridOptions.data = [];
   gridOptions.columns = [];
 
@@ -135,17 +135,17 @@ async function handleDownload() {
   gridOptions.loading = true;
   try {
     const query = {
-			country_code: queryParameter?.country,
-			brand: queryParameter?.brand,
-			tag: queryParameter?.group,
-			status: queryParameter?.status,
-			shop_id: queryParameter?.shop,
-			asin: queryParameter?.asin,
-			sku: queryParameter?.sku,
-			platform_number: queryParameter?.platformId,
-			scoreNumber: queryParameter?.scoreNumber,
-			commentNumber: queryParameter?.commentNumber,
-			displayScore: queryParameter?.displayScore
+      country_code: queryParameter?.country,
+      brand: queryParameter?.brand,
+      tag: queryParameter?.group,
+      status: queryParameter?.status,
+      shop_id: queryParameter?.shop,
+      asin: queryParameter?.asin,
+      sku: queryParameter?.sku,
+      platform_number: queryParameter?.platformId,
+      scoreNumber: queryParameter?.scoreNumber,
+      commentNumber: queryParameter?.commentNumber,
+      displayScore: queryParameter?.displayScore
     };
     const response = await api.exportData(query);
     const url = window.URL.createObjectURL(new Blob([ response.data ]));
@@ -203,7 +203,7 @@ function handleEdit(row: any) {
 async function singleDelete(row: any) {
   const res = await useResponse(api.deleteRow, row);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -255,26 +255,28 @@ defineExpose({ fetchList });
             @checkbox-all="selectAllChangeEvent">
     <template #toolbar_buttons>
       <div class="flex gap-2">
-        <el-popconfirm
-            :icon="InfoFilled"
-            icon-color="#626AEF"
-            title="你确定要删除此项吗?"
-            width="220"
-            @confirm="batchDelete"
-        >
-          <template #reference>
-            <PermissionButton :disabled="!checkedList.size" :icon="Delete" plain round type="danger">
-              批量删除
-            </PermissionButton>
-          </template>
-          <template #actions="{ confirm, cancel }">
-            <el-button size="small" @click="cancel">No!</el-button>
-            <el-button size="small" type="danger" @click="confirm">Yes?</el-button>
-          </template>
-        </el-popconfirm>
-        <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">
-          新 增
-        </PermissionButton>
+        <div>
+          <el-popconfirm
+              :icon="InfoFilled"
+              icon-color="#626AEF"
+              title="你确定要删除此项吗?"
+              width="220"
+              @confirm="batchDelete"
+          >
+            <template #reference>
+              <PermissionButton :disabled="!checkedList.size" :icon="Delete" plain round type="danger">
+                批量删除
+              </PermissionButton>
+            </template>
+            <template #actions="{ confirm, cancel }">
+              <el-button size="small" @click="cancel">No!</el-button>
+              <el-button size="small" type="danger" @click="confirm">Yes?</el-button>
+            </template>
+          </el-popconfirm>
+        </div>
+        <div>
+          <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">新 增</PermissionButton>
+        </div>
         <div class="custom-el-input">
           <el-select v-model="templateType" style="width: 190px">
             <template #prefix>
@@ -300,11 +302,11 @@ defineExpose({ fetchList });
           <Refresh />
         </el-icon>
       </el-button>
-			<el-button circle class="mr-3 toolbar-btn" @click="handleDownload">
-				<el-icon>
-					<Download />
-				</el-icon>
-			</el-button>
+      <el-button circle class="mr-3 toolbar-btn" @click="handleDownload">
+        <el-icon>
+          <Download />
+        </el-icon>
+      </el-button>
     </template>
     <template #top>
       <div class="mb-2"></div>

+ 5 - 5
src/views/product-manage/product-monitor/component/DataTableSlot.vue

@@ -6,7 +6,7 @@
  */
 
 import { useCountryInfoStore } from '/@/stores/countryInfo';
-import { Delete, DocumentCopy, InfoFilled, Operation, Tickets, Timer } from '@element-plus/icons-vue';
+import { CopyDocument, Delete, InfoFilled, Operation, Tickets, Timer } from '@element-plus/icons-vue';
 import { getTagType } from '/@/utils/useTagColor';
 import PermissionButton from '/@/components/PermissionButton/index.vue';
 import ProductInfo from '/@/views/product-manage/component/ProductInfo.vue';
@@ -70,17 +70,17 @@ function goto() {
     <div v-else-if="field === 'sku'" style="color: #1d2129;">
       <div v-if="row.goods.sku" class="flex items-center justify-center max-h-5">
         {{ row.goods.sku }}
-        <el-button :icon="DocumentCopy" class="ml-1 cursor-pointer" link @click="handleCopy(row.goods.sku || '')">
+        <el-button :icon="CopyDocument" class="ml-1 cursor-pointer" link @click="handleCopy(row.goods.sku || '')">
         </el-button>
       </div>
       <div v-if="row.goods.sku2" class="flex items-center justify-center max-h-5">
         {{ row.goods.sku2 }}
-        <el-button :icon="DocumentCopy" class="ml-1 cursor-pointer" link @click="handleCopy(row.goods.sku2 || '')">
+        <el-button :icon="CopyDocument" class="ml-1 cursor-pointer" link @click="handleCopy(row.goods.sku2 || '')">
         </el-button>
       </div>
       <div v-if="row.goods.sku3" class="flex items-center justify-center max-h-5">
         {{ row.goods.sku3 }}
-        <el-button :icon="DocumentCopy" class="ml-1 cursor-pointer" link @click="handleCopy(row.goods.sku3 || '')">
+        <el-button :icon="CopyDocument" class="ml-1 cursor-pointer" link @click="handleCopy(row.goods.sku3 || '')">
         </el-button>
       </div>
     </div>
@@ -222,7 +222,7 @@ function goto() {
             </template>
           </el-popconfirm>
         </div>
-        
+
       </div>
     </div>
     <div v-else>

+ 2 - 2
src/views/product-manage/product-monitor/component/EditDrawer.vue

@@ -78,7 +78,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         const res = await useResponse(api.updateRow, { id: rowData?.id, ...ruleForm }, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {
@@ -132,7 +132,7 @@ function closeDrawer() {
           <el-input v-model="ruleForm.shop" />
         </el-form-item>
         <el-form-item class="font-medium" label="分 组" prop="tag">
-          <el-select v-model="ruleForm.tag" filterable allow-create>
+          <el-select v-model="ruleForm.tag" allow-create filterable>
             <el-option v-for="item in groupOptions" :label="item.tag" :value="item.tag" />
           </el-select>
         </el-form-item>

+ 22 - 17
src/views/sku-manage/company-sku/component/DataTable.vue

@@ -130,7 +130,7 @@ function handleCreate() {
 async function singleDelete(row: any) {
   const res = await useResponse(api.deleteRow, row.id);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -139,7 +139,7 @@ async function singleDelete(row: any) {
 async function handleReleaseSku(row: any) {
   const res = await useResponse(api.releaseSku, { id: row.id, status: 3, kind: row.kind.id });
   if (res.code === 2000) {
-    ElMessage.success({ message: '发布成功', plain: true });
+    ElMessage.success({ message: '发布成功', plain: true, icon: 'Position' });
     handleRefresh();
   }
 }
@@ -217,20 +217,25 @@ defineExpose({ fetchList });
             @checkbox-all="selectAllChangeEvent">
     <template #toolbar_buttons>
       <div class="flex gap-2">
-        <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">新 增</PermissionButton>
-        <el-popconfirm :icon="InfoFilled" icon-color="#626AEF" title="此操作将会把所有选中的SKU全部发布, 是否继续?"
-                       width="360" @confirm="batchRelease">
-          <template #reference>
-            <PermissionButton :color="'#6466F1'" :disabled="!checkedList.size || isBatchReleaseDisabled" :icon="Position"
-                              plain round>
-              批量发布
-            </PermissionButton>
-          </template>
-          <template #actions="{ confirm, cancel }">
-            <el-button size="small" @click="cancel">No!</el-button>
-            <el-button :color="'#6466F1'" size="small" @click="confirm">Yes?</el-button>
-          </template>
-        </el-popconfirm>
+        <div>
+          <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">新 增</PermissionButton>
+        </div>
+        <div>
+          <el-popconfirm :icon="InfoFilled" icon-color="#626AEF" title="此操作将会把所有选中的SKU全部发布, 是否继续?"
+                         width="360" @confirm="batchRelease">
+            <template #reference>
+              <PermissionButton :color="'#6466F1'" :disabled="!checkedList.size || isBatchReleaseDisabled" :icon="Position"
+                                plain round>
+                批量发布
+              </PermissionButton>
+            </template>
+            <template #actions="{ confirm, cancel }">
+              <el-button size="small" @click="cancel">No!</el-button>
+              <el-button :color="'#6466F1'" size="small" @click="confirm">Yes?</el-button>
+            </template>
+          </el-popconfirm>
+        </div>
+
       </div>
     </template>
     <!-- 工具栏右侧 -->
@@ -268,7 +273,7 @@ defineExpose({ fetchList });
   </vxe-grid>
   <SkuBuilder v-if="showSkuBuilder" v-model="showSkuBuilder" :row-data="rowData" :skuData="skuData"
               @refresh="handleRefresh" />
-  <ShowSkuDrawer v-if="showOpen" v-model="showOpen" :row-data="rowData" :skuData="skuData"></ShowSkuDrawer>
+  <ShowSkuDrawer v-if="showOpen" v-model="showOpen" :row-data="rowData" :skuData="skuData" />
 </template>
 
 <style scoped>

+ 2 - 2
src/views/sku-manage/company-sku/component/DataTableSlot.vue

@@ -5,7 +5,7 @@
  * @Author: Cheney
  */
 
-import { Delete, DocumentCopy, InfoFilled, Operation, Position, View } from '@element-plus/icons-vue';
+import { CopyDocument, Delete, InfoFilled, Operation, Position, View } from '@element-plus/icons-vue';
 import PermissionButton from '/@/components/PermissionButton/index.vue';
 import { getTagType } from '/@/utils/useTagColor';
 import { handleCopy } from '/@/utils/useCopyText';
@@ -96,7 +96,7 @@ function showDetail() {
     </div>
     <div v-else-if="field === 'sku'" class="flex flex-nowrap">
       {{ row.sku }}
-      <el-button :disabled="!row.sku" :icon="DocumentCopy" class="ml-2 cursor-pointer" link
+      <el-button :disabled="!row.sku" :icon="CopyDocument" class="ml-1 cursor-pointer" link
                  @click="handleCopy(row.sku || '')"></el-button>
     </div>
     <div v-else-if="field === 'brand'">

+ 45 - 45
src/views/sku-manage/product-attribute/component/CreateDialog.vue

@@ -6,81 +6,81 @@
  */
 
 import { ElMessage, FormInstance, FormRules } from 'element-plus';
-import { DictionaryStore } from '/@/stores/dictionary';
 import { useResponse } from '/@/utils/useResponse';
 import * as api from '../api';
 import { Close, Finished } from '@element-plus/icons-vue';
-import { createAttr, createBrand } from '../api';
+
 
 const loading = ref(false);
 const createDialog = <Ref>useTemplateRef('createDialog');
 const createOpen = defineModel({ default: false });
 
-const emit = defineEmits(['refresh']);
+const emit = defineEmits([ 'refresh' ]);
 
 interface RuleForm {
-	name: any;
-	key: any;
+  name: any;
+  key: any;
 }
 
 const ruleFormRef = ref<FormInstance>();
 const ruleForm = reactive<RuleForm>({
-	name: '',
-	key: '',
+  name: '',
+  key: ''
 });
 
 const rules = reactive<FormRules<RuleForm>>({
-	name: [{ required: true, message: '请输入属性名称', trigger: 'blur' }],
-	key: [{ required: true, message: '请输入属性标识', trigger: 'blur' }],
+  name: [ { required: true, message: '请输入属性名称', trigger: 'blur' } ],
+  key: [ { required: true, message: '请输入属性标识', trigger: 'blur' } ]
 });
 
 const submitForm = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	await formEl.validate(async (valid, fields) => {
-		if (valid) {
-			const body = {
-				name: ruleForm.name,
-				key: ruleForm.key,
-			};
-			const res = await useResponse(api.createAttr, body, loading);
-			if (res.code === 2000) {
-				ElMessage.success('创建成功');
-				createOpen.value = false;
-				emit('refresh');
-			}
-		} else {
-			// createOpen.value = false;
-			ElMessage.error('创建失败,请检查表单');
-		}
-	});
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const body = {
+        name: ruleForm.name,
+        key: ruleForm.key
+      };
+      const res = await useResponse(api.createAttr, body, loading);
+      if (res.code === 2000) {
+        ElMessage.success({ message: '创建成功', plain: true, icon: 'CirclePlus' });
+        createOpen.value = false;
+        emit('refresh');
+      }
+    } else {
+      // createOpen.value = false;
+      ElMessage.error('创建失败,请检查表单');
+    }
+  });
 };
 
 function cancelDialog() {
-	resetForm(ruleFormRef.value);
-	createDialog.value.visible = false;
+  resetForm(ruleFormRef.value);
+  createDialog.value.visible = false;
 }
 
 const resetForm = (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	formEl.resetFields();
+  if (!formEl) return;
+  formEl.resetFields();
 };
 </script>
 
 <template>
-	<el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false" :title="`产品属性 - 创建 `" style="width: 30%">
-		<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-width="auto" status-icon>
-					<el-form-item class="font-medium" label="属性名称" prop="name">
-						<el-input v-model="ruleForm.name" placeholder="请输入属性名称" style="width:328px"/>
-					</el-form-item>
-				<el-form-item class="font-medium" label="属性标识" prop="key">
-						<el-input v-model="ruleForm.key" placeholder="请输入属性标识" style="width:328px"/>
-					</el-form-item>
-		</el-form>
-		<template #footer>
-			<el-button :icon="Close" @click="cancelDialog">取 消</el-button>
-			<el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
-		</template>
-	</el-dialog>
+  <el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false"
+             :title="`产品属性 - 创建 `" style="width: 30%">
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-width="auto" status-icon>
+      <el-form-item class="font-medium" label="属性名称" prop="name">
+        <el-input v-model="ruleForm.name" placeholder="请输入属性名称" style="width:328px" />
+      </el-form-item>
+      <el-form-item class="font-medium" label="属性标识" prop="key">
+        <el-input v-model="ruleForm.key" placeholder="请输入属性标识" style="width:328px" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button :icon="Close" @click="cancelDialog">取 消</el-button>
+      <el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>

+ 8 - 8
src/views/sku-manage/product-attribute/component/DataTable.vue

@@ -19,7 +19,6 @@ import * as api from '../api';
 import CreateDialog from '/src/views/sku-manage/product-attribute/component/CreateDialog.vue';
 import ManageEnumDrawer from '/src/views/sku-manage/product-attribute/component/manage-enum/index.vue';
 import ShowDetailDrawer from '/@/views/sku-manage/product-attribute/component/ShowDetailDrawer.vue';
-import ShowEnumDrawer from '/@/views/sku-manage/product-attribute/component/manage-enum/component/ShowEnumDrawer.vue';
 
 
 interface Parameter {
@@ -83,7 +82,7 @@ const dialogVisible = ref(false);
 
 onBeforeMount(() => {
   gridOptions.pagerConfig.limit = 20;
-})
+});
 
 onMounted(() => {
   fetchList();
@@ -93,7 +92,7 @@ async function fetchList(isQuery = false) {
   if (isQuery) {
     gridOptions.pagerConfig.page = 1;
   }
-  
+
   gridOptions.data = [];
   gridOptions.columns = [];
 
@@ -117,7 +116,7 @@ function handleEdit(row: any) {
 }
 
 function handleManage(row: any) {
-	manageOpen.value = true;
+  manageOpen.value = true;
   rowData.value = row;
 }
 
@@ -133,7 +132,7 @@ function handleView(row: any) {
 async function singleDelete(row: any) {
   const res = await useResponse(api.deleteRow, row);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -177,14 +176,15 @@ defineExpose({ fetchList });
     </template>
     <!-- 自定义列插槽 -->
     <template v-for="col in AttributeColumns" #[`${col.field}`]="{ row }">
-      <DataTableSlot :key="row.id" :field="col.field" :row="row" @edit-row="handleEdit" @handle-delete="singleDelete" @handle-manage="handleManage" @show-detail="handleView" />
+      <DataTableSlot :key="row.id" :field="col.field" :row="row" @edit-row="handleEdit" @handle-delete="singleDelete"
+                     @handle-manage="handleManage" @show-detail="handleView" />
     </template>
   </vxe-grid>
   <EditDrawer v-if="editOpen" v-model="editOpen" :row-data="rowData" @refresh="handleRefresh" />
   <NoticeDialog v-if="dialogVisible" v-model="dialogVisible" :row-data="rowData" />
   <CreateDialog v-if="createOpen" v-model="createOpen" @refresh="fetchList" />
-	<ManageEnumDrawer v-if="manageOpen" v-model="manageOpen" :row-data="rowData" />
-	<ShowDetailDrawer v-if="viewOpen" v-model="viewOpen" :row-data="rowData" ></ShowDetailDrawer>
+  <ManageEnumDrawer v-if="manageOpen" v-model="manageOpen" :row-data="rowData" />
+  <ShowDetailDrawer v-if="viewOpen" v-model="viewOpen" :row-data="rowData" />
 </template>
 
 <style scoped>

+ 2 - 2
src/views/sku-manage/product-attribute/component/EditDrawer.vue

@@ -31,7 +31,7 @@ interface RuleForm {
 const ruleFormRef = ref<FormInstance>();
 const ruleForm = reactive<RuleForm>({
   name: rowData?.name,
-  key: rowData?.key,
+  key: rowData?.key
 });
 
 const rules = reactive<FormRules<RuleForm>>({
@@ -46,7 +46,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         const res = await useResponse(api.updateRow, { id: rowData?.id, ...ruleForm }, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {

+ 38 - 38
src/views/sku-manage/product-brand/component/CreateDialog.vue

@@ -6,75 +6,75 @@
  */
 
 import { ElMessage, FormInstance, FormRules } from 'element-plus';
-import { DictionaryStore } from '/@/stores/dictionary';
 import { useResponse } from '/@/utils/useResponse';
 import * as api from '../api';
 import { Close, Finished } from '@element-plus/icons-vue';
-import { createBrand } from '../api';
+
 
 const loading = ref(false);
 const createDialog = <Ref>useTemplateRef('createDialog');
 const createOpen = defineModel({ default: false });
 
-const emit = defineEmits(['refresh']);
+const emit = defineEmits([ 'refresh' ]);
 
 interface RuleForm {
-	brand: any;
+  brand: any;
 }
 
 const ruleFormRef = ref<FormInstance>();
 const ruleForm = reactive<RuleForm>({
-	brand: '',
+  brand: ''
 });
 
 const rules = reactive<FormRules<RuleForm>>({
-	brand: [{ required: true, message: '请输入品牌名称', trigger: 'blur' }],
+  brand: [ { required: true, message: '请输入品牌名称', trigger: 'blur' } ]
 });
 
 const submitForm = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	await formEl.validate(async (valid, fields) => {
-		if (valid) {
-			const body = {
-				brand_name: ruleForm.brand,
-			};
-			const res = await useResponse(api.createBrand, body, loading);
-			if (res.code === 2000) {
-				ElMessage.success('创建成功');
-				createOpen.value = false;
-				emit('refresh');
-			}
-		} else {
-			// createOpen.value = false;
-			ElMessage.error('创建失败,请检查表单');
-		}
-	});
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const body = {
+        brand_name: ruleForm.brand
+      };
+      const res = await useResponse(api.createBrand, body, loading);
+      if (res.code === 2000) {
+        ElMessage.success({ message: '创建成功', plain: true, icon: 'CirclePlus' });
+        createOpen.value = false;
+        emit('refresh');
+      }
+    } else {
+      // createOpen.value = false;
+      ElMessage.error('创建失败,请检查表单');
+    }
+  });
 };
 
 function cancelDialog() {
-	resetForm(ruleFormRef.value);
-	createDialog.value.visible = false;
+  resetForm(ruleFormRef.value);
+  createDialog.value.visible = false;
 }
 
 const resetForm = (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	formEl.resetFields();
+  if (!formEl) return;
+  formEl.resetFields();
 };
 </script>
 
 <template>
-	<el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false" :title="`产品品牌 - 创建 `" style="width: 30%">
-		<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-width="auto" status-icon>
-					<el-form-item class="font-medium" label="品牌名称" prop="brand">
-						<el-input v-model="ruleForm.brand" placeholder="请输入品牌名称" style="width:328px"/>
-					</el-form-item>
-		</el-form>
-		<template #footer>
+  <el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false"
+             :title="`产品品牌 - 创建 `" style="width: 30%">
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-width="auto" status-icon>
+      <el-form-item class="font-medium" label="品牌名称" prop="brand">
+        <el-input v-model="ruleForm.brand" placeholder="请输入品牌名称" style="width:328px" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
 
-			<el-button :icon="Close" @click="cancelDialog">取 消</el-button>
-			<el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
-		</template>
-	</el-dialog>
+      <el-button :icon="Close" @click="cancelDialog">取 消</el-button>
+      <el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>

+ 3 - 3
src/views/sku-manage/product-brand/component/DataTable.vue

@@ -75,7 +75,7 @@ const dialogVisible = ref(false);
 
 onBeforeMount(() => {
   gridOptions.pagerConfig.limit = 20;
-})
+});
 
 onMounted(() => {
   fetchList();
@@ -85,7 +85,7 @@ async function fetchList(isQuery = false) {
   if (isQuery) {
     gridOptions.pagerConfig.page = 1;
   }
-  
+
   gridOptions.data = [];
   gridOptions.columns = [];
 
@@ -114,7 +114,7 @@ function handleCreate() {
 async function singleDelete(row: any) {
   const res = await useResponse(api.deleteRow, row);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }

+ 1 - 1
src/views/sku-manage/product-brand/component/EditDrawer.vue

@@ -44,7 +44,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         const res = await useResponse(api.updateRow, { id: rowData?.id, ...ruleForm }, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {

+ 25 - 21
src/views/sku-manage/product-category/component/AttributeManage.vue

@@ -109,7 +109,7 @@ function handleEdit(row: any) {
 async function onConfirm(row: any) {
   const res = await useResponse(api.deleteProductAttr, row.id);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -127,7 +127,7 @@ async function handleRelease() {
 
   const res = await useResponse(api.release, query);
   if (res.code === 2000) {
-    ElMessage.success({ message: '发布成功', plain: true });
+    ElMessage.success({ message: '发布成功', plain: true, icon: 'Position' });
     closeDrawer();
     emit('refresh');
   }
@@ -145,7 +145,7 @@ async function handleUpdate(row: any) {
 
   const res = await useResponse(api.updateOrder, query);
   if (res.code === 2000) {
-    ElMessage.success({ message: '修改成功', plain: true });
+    ElMessage.success({ message: '修改成功', plain: true, icon: 'EditPen' });
     handleRefresh();
   }
 }
@@ -181,7 +181,7 @@ const gridEvents = {
       <template #title>
         <div class="font-medium text-xl flex">
           产品属性管理:
-          <el-check-tag type="primary" :checked="true" class="italic" style="pointer-events: none;">
+          <el-check-tag :checked="true" class="italic" style="pointer-events: none;" type="primary">
             <span style="font-size: 1.1rem">
               {{ rowData.name }}
             </span>
@@ -193,22 +193,26 @@ const gridEvents = {
                   v-bind="gridOptions"
                   v-on="gridEvents">
           <template #toolbar_buttons>
-            <div class="flex gap-3">
-              <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">
-                新 增
-              </PermissionButton>
-              <el-popconfirm :icon="InfoFilled" icon-color="#626AEF" title="发布后将无法更改, 是否继续?"
-                             width="230" @confirm="handleRelease">
-                <template #reference>
-                  <PermissionButton :color="'#6466F1'" :icon="Position" plain round>
-                    发 布
-                  </PermissionButton>
-                </template>
-                <template #actions="{ confirm, cancel }">
-                  <el-button size="small" @click="cancel">No!</el-button>
-                  <el-button :color="'#6466F1'" size="small" @click="confirm">Yes?</el-button>
-                </template>
-              </el-popconfirm>
+            <div class="flex gap-2">
+              <div>
+                <PermissionButton :icon="Plus" plain round type="primary" @click="handleCreate">
+                  新 增
+                </PermissionButton>
+              </div>
+              <div>
+                <el-popconfirm :icon="InfoFilled" icon-color="#626AEF" title="发布后将无法更改, 是否继续?"
+                               width="230" @confirm="handleRelease">
+                  <template #reference>
+                    <PermissionButton :color="'#6466F1'" :icon="Position" plain round>
+                      发 布
+                    </PermissionButton>
+                  </template>
+                  <template #actions="{ confirm, cancel }">
+                    <el-button size="small" @click="cancel">No!</el-button>
+                    <el-button :color="'#6466F1'" size="small" @click="confirm">Yes?</el-button>
+                  </template>
+                </el-popconfirm>
+              </div>
             </div>
           </template>
           <template #toolbar_tools>
@@ -285,7 +289,7 @@ const gridEvents = {
                   </template>
                 </el-popconfirm>
               </div>
-              
+
             </div>
           </template>
         </vxe-grid>

+ 1 - 1
src/views/sku-manage/product-category/component/AttributeManageEdit.vue

@@ -58,7 +58,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         const res = await useResponse(api.updateAttributeRow, query, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {

+ 38 - 38
src/views/sku-manage/product-category/component/CreateDialog.vue

@@ -6,75 +6,75 @@
  */
 
 import { ElMessage, FormInstance, FormRules } from 'element-plus';
-import { DictionaryStore } from '/@/stores/dictionary';
 import { useResponse } from '/@/utils/useResponse';
 import * as api from '../api';
 import { Close, Finished } from '@element-plus/icons-vue';
-import { create, createBrand } from '../api';
+
 
 const loading = ref(false);
 const createDialog = <Ref>useTemplateRef('createDialog');
 const createOpen = defineModel({ default: false });
 
-const emit = defineEmits(['refresh']);
+const emit = defineEmits([ 'refresh' ]);
 
 interface RuleForm {
-	name: any;
+  name: any;
 }
 
 const ruleFormRef = ref<FormInstance>();
 const ruleForm = reactive<RuleForm>({
-	name: '',
+  name: ''
 });
 
 const rules = reactive<FormRules<RuleForm>>({
-	name: [{ required: true, message: '请输入种类名称', trigger: 'blur' }],
+  name: [ { required: true, message: '请输入种类名称', trigger: 'blur' } ]
 });
 
 const submitForm = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	await formEl.validate(async (valid, fields) => {
-		if (valid) {
-			const body = {
-				name: ruleForm.name,
-			};
-			const res = await useResponse(api.create, body, loading);
-			if (res.code === 2000) {
-				ElMessage.success('创建成功');
-				createOpen.value = false;
-				emit('refresh');
-			}
-		} else {
-			// createOpen.value = false;
-			ElMessage.error('创建失败,请检查表单');
-		}
-	});
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const body = {
+        name: ruleForm.name
+      };
+      const res = await useResponse(api.create, body, loading);
+      if (res.code === 2000) {
+        ElMessage.success({ message: '创建成功', plain: true, icon: 'CirclePlus' });
+        createOpen.value = false;
+        emit('refresh');
+      }
+    } else {
+      // createOpen.value = false;
+      ElMessage.error('创建失败,请检查表单');
+    }
+  });
 };
 
 function cancelDialog() {
-	resetForm(ruleFormRef.value);
-	createDialog.value.visible = false;
+  resetForm(ruleFormRef.value);
+  createDialog.value.visible = false;
 }
 
 const resetForm = (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	formEl.resetFields();
+  if (!formEl) return;
+  formEl.resetFields();
 };
 </script>
 
 <template>
-	<el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false" :title="`产品种类 - 创建 `" style="width: 30%">
-		<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-width="auto" status-icon>
-					<el-form-item class="font-medium" label="种类名称" prop="name">
-						<el-input v-model="ruleForm.name" placeholder="请输入种类名称" style="width:328px"/>
-					</el-form-item>
-		</el-form>
-		<template #footer>
+  <el-dialog ref="createDialog" v-model="createOpen" :close-on-click-modal="false" :close-on-press-escape="false"
+             :title="`产品种类 - 创建 `" style="width: 30%">
+    <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" class="mx-2.5 mt-5" label-width="auto" status-icon>
+      <el-form-item class="font-medium" label="种类名称" prop="name">
+        <el-input v-model="ruleForm.name" placeholder="请输入种类名称" style="width:328px" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
 
-			<el-button :icon="Close" @click="cancelDialog">取 消</el-button>
-			<el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
-		</template>
-	</el-dialog>
+      <el-button :icon="Close" @click="cancelDialog">取 消</el-button>
+      <el-button :icon="Finished" :loading="loading" type="primary" @click="submitForm(ruleFormRef)">确 定</el-button>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped>

+ 3 - 3
src/views/sku-manage/product-category/component/DataTable.vue

@@ -124,7 +124,7 @@ function handleCreate() {
 async function singleDelete(row: any) {
   const res = await useResponse(api.deleteRow, row);
   if (res.code === 2000) {
-    ElMessage.success({ message: '删除成功', plain: true });
+    ElMessage.error({ message: '已删除!', plain: true, icon: 'Delete' });
     handleRefresh();
   }
 }
@@ -168,14 +168,14 @@ defineExpose({ fetchList });
     </template>
     <!-- 自定义列插槽 -->
     <template v-for="col in ProductCategoryColumns" #[`${col.field}`]="{ row }">
-      <DataTableSlot :key="row.id" :field="col.field" :row="row" @edit-row="handleEdit" @handle-delete="singleDelete" 
+      <DataTableSlot :key="row.id" :field="col.field" :row="row" @edit-row="handleEdit" @handle-delete="singleDelete"
                      @handle-attribute="handleAttribute" />
     </template>
   </vxe-grid>
   <EditDrawer v-if="editOpen" v-model="editOpen" :row-data="rowData" @refresh="handleRefresh" />
   <NoticeDialog v-if="dialogVisible" v-model="dialogVisible" :row-data="rowData" />
   <CreateDialog v-if="createOpen" v-model="createOpen" @refresh="fetchList" />
-  <AttributeManage v-if="visible" v-model="visible" :row-data="rowData" @refresh="handleRefresh"  />
+  <AttributeManage v-if="visible" v-model="visible" :row-data="rowData" @refresh="handleRefresh" />
 </template>
 
 <style scoped>

+ 1 - 1
src/views/sku-manage/product-category/component/EditDrawer.vue

@@ -44,7 +44,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
         const res = await useResponse(api.updateRow, { id: rowData?.id, ...ruleForm }, btnLoading);
         if (res && res.code == 2000) {
           editOpen.value = false;
-          ElMessage.success('编辑成功');
+          ElMessage.success({ message: '编辑成功', plain: true, icon: 'Operation' });
           emit('refresh');
         }
       } catch (error) {