update

src/views/product/stock/index.vue

@@ -4,10 +4,13 @@ import {
   loadStockList,
   loadStockLogList,
 } from "@/api/product/stock";
-import {computed, reactive, ref, toRefs} from "vue";
+import modal from "@/plugins/modal";
-import {dayjs} from "element-plus";
+import { computed, reactive, ref, toRefs } from "vue";
+import { dayjs } from "element-plus";
 import ImagePreview from "@/components/ImagePreview/index.vue";
-import {Table as ATable} from "ant-design-vue";
+import { Table as ATable } from "ant-design-vue";
+import { download } from "@/utils/request";
+import { getToken } from "@/utils/auth";
 
 const queryRef = ref();
 const showSearch = ref(false);
@@ -18,8 +21,9 @@ const data = reactive({
     type: 1,
   },
 });
+
 const total = ref(0);
-const {queryParams} = toRefs(data);
+const { queryParams } = toRefs(data);
 const expandedRowKeys = ref([]);
 const columns = [
   {
@@ -32,6 +36,11 @@ const columns = [
     dataIndex: "modelName",
     key: "modelName",
   },
+  {
+    title: "产品编号",
+    dataIndex: "serialNumber",
+    key: "serialNumber",
+  },
   {
     title: "库存",
     dataIndex: "stock",
@@ -57,12 +66,13 @@ const columns = [
 const columnsFilter = computed(() => {
   if (queryParams.value.type === 0) {
     return columns.filter(
-        ({dataIndex}) => !["total", "provePic", "date"].includes(dataIndex)
+      ({ dataIndex }) =>
+        !["total", "provePic", "date", "serialNumber"].includes(dataIndex)
     );
   } else if (queryParams.value.type === 1) {
-    return columns.filter(({dataIndex}) => !["stock"].includes(dataIndex));
+    return columns.filter(({ dataIndex }) => !["stock"].includes(dataIndex));
   } else if (queryParams.value.type === 2) {
-    return columns.filter(({dataIndex}) => !["stock"].includes(dataIndex));
+    return columns.filter(({ dataIndex }) => !["stock"].includes(dataIndex));
   } else {
     return columns;
   }
@@ -76,7 +86,6 @@ const getStockList = () => {
       stockLogList.value = resp.rows.map((el) => ({
         ...el,
         key: el.modelId,
-        children: [],
       }));
     });
   } else {
@@ -85,7 +94,6 @@ const getStockList = () => {
       stockLogList.value = resp.rows.map((el) => ({
         ...el,
         key: el.logId,
-        children: [],
       }));
     });
   }
@@ -104,14 +112,14 @@ function resetQuery() {
 
 const loadChildren = (row) => {
   if (queryParams.value.type === 0) {
-    loadProductSerialList({modelId: row.modelId, type: '1'}).then((resp) => {
+    loadProductSerialList({ modelId: row.modelId, type: "1" }).then((resp) => {
       row.series = resp.data.map((el) => ({
         ...el,
         key: el.serialId,
       }));
     });
   } else if (queryParams.value.type === 1 || queryParams.value.type === 2) {
-    loadProductSerialList({logId: row.logId}).then((resp) => {
+    loadProductSerialList({ logId: row.logId }).then((resp) => {
       row.series = resp.data.map((el) => ({
         ...el,
         key: el.serialId,
@@ -123,28 +131,86 @@ const loadChildren = (row) => {
 const handleExpandTable = (expanded, record) => {
   expanded && loadChildren(record);
 };
+
+const uploadRef = ref();
+/*** 用户导入参数 */
+const upload = reactive({
+  // 是否显示弹出层（用户导入）
+  open: false,
+  // 弹出层标题（用户导入）
+  title: "",
+  // 是否禁用上传
+  isUploading: false,
+  // 是否更新已经存在的用户数据
+  updateSupport: 0,
+  // 设置上传的请求头部
+  headers: { Authorization: "Bearer " + getToken() },
+  // 上传的地址
+  url: import.meta.env.VITE_APP_BASE_API + "/product/stocklog/importData",
+});
+
+/** 导入按钮操作 */
+function handleImport() {
+  upload.title = "入库记录导入";
+  upload.open = true;
+}
+
+/** 下载模板操作 */
+function importTemplate() {
+  download(
+    "/product/stocklog/importTemplate",
+    {},
+    `user_template_${new Date().getTime()}.xlsx`
+  );
+}
+
+/**文件上传中处理 */
+const handleFileUploadProgress = (event, file, fileList) => {
+  upload.isUploading = true;
+};
+
+/** 文件上传成功处理 */
+const handleFileSuccess = (response, file, fileList) => {
+  upload.open = false;
+  upload.isUploading = false;
+  uploadRef.value.handleRemove(file);
+  modal.alert(
+    "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
+      response.msg +
+      "</div>",
+    "导入结果",
+    { dangerouslyUseHTMLString: true }
+  );
+  getStockList();
+};
+
+/** 提交上传文件 */
+function submitFileForm() {
+  uploadRef.value.submit();
+}
+
 getStockList();
 </script>
 
 <template>
   <div class="app-container">
     <el-form
-        :model="queryParams"
+      :model="queryParams"
-        ref="queryRef"
+      ref="queryRef"
-        :inline="true"
+      :inline="true"
-        v-show="showSearch"
+      v-show="showSearch"
-        label-width="68px"
+      label-width="68px"
     >
       <el-form-item label="类型" prop="type">
         <el-select v-model="queryParams.type">
-          <el-option label="库存" :value="0"/>
+          <el-option label="库存" :value="0" />
-          <el-option label="入库" :value="1"/>
+          <el-option label="入库" :value="1" />
-          <el-option label="出库" :value="2"/>
+          <el-option label="出库" :value="2" />
         </el-select>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery"
-        >搜索
+          >搜索
         </el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
@@ -158,39 +224,44 @@ getStockList();
         </el-radio-group>
       </el-col>
       <right-toolbar
-          v-model:showSearch="showSearch"
+        v-model:showSearch="showSearch"
-          @queryTable="getStockList"
+        @queryTable="getStockList"
       ></right-toolbar>
     </el-row>
-    <el-row :gutter="10" class="mb8">
+    <el-row v-if="queryParams.type === 1" :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button icon="plus" type="primary">添加入库</el-button>
       </el-col>
+      <el-col :span="1.5">
+        <el-button icon="list" type="primary" @click="handleImport"
+          >Excel导入</el-button
+        >
+      </el-col>
     </el-row>
+    <!--        v-model:expanded-row-keys="expandedRowKeys"-->
     <a-table
-        v-model:expanded-row-keys="expandedRowKeys"
+      :pagination="false"
-        :pagination="false"
+      :data-source="stockLogList"
-        :columns="columnsFilter"
+      :columns="columnsFilter"
-        :data-source="stockLogList"
-        @expand="handleExpandTable"
     >
-      <template #expandedRowRender="{ record }">
+      <!--        @expand="handleExpandTable"-->
-        <a-table
+      <!--      <template #expandedRowRender="{ record }">-->
-            :row-selection="{}"
+      <!--        <a-table-->
-            :pagination="false"
+      <!--            :row-selection="{}"-->
-            :columns="[
+      <!--            :pagination="false"-->
-            {
+      <!--            :columns="[-->
-              title: '产品编号',
+      <!--            {-->
-              dataIndex: 'serialNumber',
+      <!--              title: '产品编号',-->
-              key: 'serialNumber',
+      <!--              dataIndex: 'serialNumber',-->
-            },
+      <!--              key: 'serialNumber',-->
-          ]"
+      <!--            },-->
-            :data-source="record.series"
+      <!--          ]"-->
-        ></a-table>
+      <!--            :data-source="record.series"-->
-      </template>
+      <!--        ></a-table>-->
+      <!--      </template>-->
       <template #bodyCell="{ column, text, record }">
         <template v-if="column.dataIndex === 'provePic'">
-          <image-preview :width="50" :height="50" :src="record.provePic"/>
+          <image-preview :width="50" :height="50" :src="record.provePic" />
         </template>
       </template>
     </a-table>
@@ -226,12 +297,68 @@ getStockList();
     <!--      </el-table-column>-->
     <!--    </el-table>-->
     <pagination
-        v-show="total > 0"
+      v-show="total > 0"
-        :total="total"
+      :total="total"
-        v-model:page="queryParams.pageNum"
+      v-model:page="queryParams.pageNum"
-        v-model:limit="queryParams.pageSize"
+      v-model:limit="queryParams.pageSize"
-        @pagination="getStockList"
+      @pagination="getStockList"
     />
+
+    <!-- 入库日志导入对话框 -->
+    <el-dialog
+      draggable
+      v-model="upload.open"
+      :title="upload.title"
+      append-to-body
+      width="400px"
+    >
+      <el-upload
+        ref="uploadRef"
+        :action="upload.url + '?updateSupport=' + upload.updateSupport"
+        :auto-upload="false"
+        :disabled="upload.isUploading"
+        :headers="upload.headers"
+        :limit="1"
+        :on-progress="handleFileUploadProgress"
+        :on-success="handleFileSuccess"
+        accept=".xlsx, .xls"
+        drag
+      >
+        <el-icon class="el-icon--upload">
+          <upload-filled />
+        </el-icon>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <template #tip>
+          <div class="el-upload__tip text-center">
+            <ol style="text-align: start; margin-left: 20px">
+              <!--<li>(*)为必填项</li>
+                <li>部门,角色,岗位请填数字编号</li>
+                <li>角色,岗位若存在多个,请以英文逗号隔开</li>
+                <li>禁止任何的换行或空格</li>
+                <li style="color: #f00; font-size: 13px">
+                  请手动更改单元格格式为文本格式
+               </li>-->
+              <li>
+                <span>仅允许导入xls、xlsx格式文件。</span>
+                <el-link
+                  :underline="false"
+                  style="font-size: 12px; vertical-align: baseline"
+                  type="primary"
+                  @click="importTemplate"
+                  >下载模板
+                </el-link>
+              </li>
+            </ol>
+          </div>
+        </template>
+      </el-upload>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitFileForm">确 定</el-button>
+          <el-button @click="upload.open = false">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 

src/views/sales/contract/index.vue

@@ -1,43 +1,42 @@
 <template>
   <div class="app-container">
     <el-form
-        :model="queryParams"
+      :model="queryParams"
-        ref="queryRef"
+      ref="queryRef"
-        :inline="true"
+      :inline="true"
-        v-show="showSearch"
+      v-show="showSearch"
-        label-width="68px"
+      label-width="68px"
     >
       <el-form-item label="客户" prop="customer">
         <el-input
-            v-model="queryParams.customer"
+          v-model="queryParams.customer"
-            placeholder="请输入客户"
+          placeholder="请输入客户"
-            clearable
+          clearable
-            @keyup.enter="handleQuery"
+          @keyup.enter="handleQuery"
         />
       </el-form-item>
       <el-form-item label="税点" prop="taxPoint">
         <el-input
-            v-model="queryParams.taxPoint"
+          v-model="queryParams.taxPoint"
-            placeholder="请输入税点"
+          placeholder="请输入税点"
-            clearable
+          clearable
-            @keyup.enter="handleQuery"
+          @keyup.enter="handleQuery"
         />
       </el-form-item>
       <el-form-item label="时间" prop="date">
         <el-date-picker
-            clearable
+          clearable
-            v-model="queryParams.date"
+          v-model="queryParams.date"
-            type="date"
+          type="date"
-            value-format="YYYY-MM-DD"
+          value-format="YYYY-MM-DD"
-            placeholder="请选择时间"
+          placeholder="请选择时间"
         >
         </el-date-picker>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="Search" @click="handleQuery"
-        >搜索
+          >搜索
-        </el-button
+        </el-button>
-        >
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -45,133 +44,128 @@
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
-            type="primary"
+          type="primary"
-            plain
+          plain
-            icon="Plus"
+          icon="Plus"
-            @click="handleAdd"
+          @click="handleAdd"
-            v-hasPermi="['sales:contract:add']"
+          v-hasPermi="['sales:contract:add']"
-        >新增
+          >新增
-        </el-button
+        </el-button>
-        >
       </el-col>
       <el-col :span="1.5">
         <el-button
-            type="success"
+          type="success"
-            plain
+          plain
-            icon="Edit"
+          icon="Edit"
-            :disabled="single"
+          :disabled="single"
-            @click="handleUpdate"
+          @click="handleUpdate"
-            v-hasPermi="['sales:contract:edit']"
+          v-hasPermi="['sales:contract:edit']"
-        >修改
+          >修改
-        </el-button
+        </el-button>
-        >
       </el-col>
       <el-col :span="1.5">
         <el-button
-            type="danger"
+          type="danger"
-            plain
+          plain
-            icon="Delete"
+          icon="Delete"
-            :disabled="multiple"
+          :disabled="multiple"
-            @click="handleDelete"
+          @click="handleDelete"
-            v-hasPermi="['sales:contract:remove']"
+          v-hasPermi="['sales:contract:remove']"
-        >删除
+          >删除
-        </el-button
+        </el-button>
-        >
       </el-col>
       <right-toolbar
-          v-model:showSearch="showSearch"
+        v-model:showSearch="showSearch"
-          @queryTable="getList"
+        @queryTable="getList"
       ></right-toolbar>
     </el-row>
 
     <el-table
-        v-loading="loading"
+      v-loading="loading"
-        :data="contractList"
+      :data="contractList"
-        @selection-change="handleSelectionChange"
+      @selection-change="handleSelectionChange"
     >
-      <el-table-column type="selection" width="55" align="center"/>
+      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="客户" align="center" prop="customer"/>
+      <el-table-column label="客户" align="center" prop="customer" />
-      <el-table-column label="总额" align="center" prop="amount"/>
+      <el-table-column label="总额" align="center" prop="amount" />
-      <el-table-column label="税点" align="center" prop="taxPoint"/>
+      <el-table-column label="税点" align="center" prop="taxPoint" />
-      <el-table-column label="地点" align="center" prop="location"/>
+      <el-table-column label="地点" align="center" prop="location" />
       <el-table-column label="时间" align="center" prop="date" width="180">
         <template #default="{ row }">
           <span>{{ row.date }}</span>
         </template>
       </el-table-column>
       <el-table-column
-          label="创建时间"
+        label="创建时间"
-          align="center"
+        align="center"
-          prop="createTime"
+        prop="createTime"
-          width="180"
+        width="180"
       >
-        <template #default="{row}">
+        <template #default="{ row }">
           <span>{{ row.createTime }}</span>
         </template>
       </el-table-column>
       <el-table-column
-          label="操作"
+        label="操作"
-          align="center"
+        align="center"
-          class-name="small-padding fixed-width"
+        class-name="small-padding fixed-width"
       >
         <template #default="scope">
           <el-button
-              link
+            link
-              type="primary"
+            type="primary"
-              icon="Edit"
+            icon="Edit"
-              @click="handleUpdate(scope.row)"
+            @click="handleUpdate(scope.row)"
-              v-hasPermi="['sales:contract:edit']"
+            v-hasPermi="['sales:contract:edit']"
-          >修改
+            >修改
-          </el-button
+          </el-button>
-          >
           <el-button
-              link
+            link
-              type="primary"
+            type="primary"
-              icon="Delete"
+            icon="Delete"
-              @click="handleDelete(scope.row)"
+            @click="handleDelete(scope.row)"
-              v-hasPermi="['sales:contract:remove']"
+            v-hasPermi="['sales:contract:remove']"
-          >删除
+            >删除
-          </el-button
+          </el-button>
-          >
         </template>
       </el-table-column>
     </el-table>
 
     <pagination
-        v-show="total > 0"
+      v-show="total > 0"
-        :total="total"
+      :total="total"
-        v-model:page="queryParams.pageNum"
+      v-model:page="queryParams.pageNum"
-        v-model:limit="queryParams.pageSize"
+      v-model:limit="queryParams.pageSize"
-        @pagination="getList"
+      @pagination="getList"
     />
 
     <!-- 添加或修改contract对话框 -->
     <el-dialog :title="title" v-model="open" width="500px" append-to-body>
       <el-form
-          ref="contractRef"
+        ref="contractRef"
-          :model="form"
+        :model="form"
-          :rules="rules"
+        :rules="rules"
-          label-width="80px"
+        label-width="80px"
       >
         <el-form-item label="地点" prop="location">
-          <el-input v-model="form.location" placeholder="请输入地点"/>
+          <el-input v-model="form.location" placeholder="请输入地点" />
         </el-form-item>
         <el-form-item label="客户" prop="customer">
-          <el-input v-model="form.customer" placeholder="请输入客户"/>
+          <el-input v-model="form.customer" placeholder="请输入客户" />
         </el-form-item>
         <el-form-item label="总额" prop="amount">
-          <el-input v-model="form.amount" placeholder="请输入总额"/>
+          <el-input v-model="form.amount" placeholder="请输入总额" />
         </el-form-item>
         <el-form-item label="税点" prop="taxPoint">
-          <el-input v-model="form.taxPoint" placeholder="请输入税点"/>
+          <el-input v-model="form.taxPoint" placeholder="请输入税点" />
         </el-form-item>
         <el-form-item label="时间" prop="date">
           <el-date-picker
-              clearable
+            clearable
-              v-model="form.date"
+            v-model="form.date"
-              type="date"
+            type="date"
-              value-format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
-              placeholder="请选择时间"
+            placeholder="请选择时间"
           >
           </el-date-picker>
         </el-form-item>
@@ -195,7 +189,7 @@ import {
   updateContract,
 } from "@/api/sales/contract";
 
-const {proxy} = getCurrentInstance();
+const { proxy } = getCurrentInstance();
 
 const contractList = ref([]);
 const open = ref(false);
@@ -222,22 +216,22 @@ const data = reactive({
     createUser: null,
   },
   rules: {
-    contractId: [{required: true, message: "不能为空", trigger: "blur"}],
+    contractId: [{ required: true, message: "不能为空", trigger: "blur" }],
-    location: [{required: true, message: "地点不能为空", trigger: "blur"}],
+    location: [{ required: true, message: "地点不能为空", trigger: "blur" }],
-    customer: [{required: true, message: "客户不能为空", trigger: "blur"}],
+    customer: [{ required: true, message: "客户不能为空", trigger: "blur" }],
-    amount: [{required: true, message: "总额不能为空", trigger: "blur"}],
+    amount: [{ required: true, message: "总额不能为空", trigger: "blur" }],
-    taxPoint: [{required: true, message: "税点不能为空", trigger: "blur"}],
+    taxPoint: [{ required: true, message: "税点不能为空", trigger: "blur" }],
-    date: [{required: true, message: "时间不能为空", trigger: "blur"}],
+    date: [{ required: true, message: "时间不能为空", trigger: "blur" }],
     createDate: [
-      {required: true, message: "创建时间不能为空", trigger: "blur"},
+      { required: true, message: "创建时间不能为空", trigger: "blur" },
     ],
     createUser: [
-      {required: true, message: "创建人不能为空", trigger: "blur"},
+      { required: true, message: "创建人不能为空", trigger: "blur" },
     ],
   },
 });
 
-const {queryParams, form, rules} = toRefs(data);
+const { queryParams, form, rules } = toRefs(data);
 
 /** 查询contract列表 */
 function getList() {
@@ -331,16 +325,15 @@ function submitForm() {
 function handleDelete(row) {
   const _contractIds = row.contractId || ids.value;
   proxy.$modal
-      .confirm('是否确认删除contract编号为"' + _contractIds + '"的数据项？')
+    .confirm('是否确认删除contract编号为"' + _contractIds + '"的数据项？')
-      .then(function () {
+    .then(function () {
-        return delContract(_contractIds);
+      return delContract(_contractIds);
-      })
+    })
-      .then(() => {
+    .then(() => {
-        getList();
+      getList();
-        proxy.$modal.msgSuccess("删除成功");
+      proxy.$modal.msgSuccess("删除成功");
-      })
+    })
-      .catch(() => {
+    .catch(() => {});
-      });
 }
 
 getList();

src/views/sales/team/index.vue

@@ -1,287 +1,26 @@
+<script setup>
+import person from "./person.vue";
+import team from "./team.vue";
+import { ref } from "vue";
+
+const components = [team, person];
+const queryType = ref(0);
+const handleQuery = () => {};
+</script>
+
 <template>
   <div class="app-container">
-    <el-form
+    <el-radio-group
-      :model="queryParams"
+      size="small"
-      ref="queryRef"
+      class="mb8"
-      :inline="true"
+      v-model="queryType"
-      v-show="showSearch"
+      @change="handleQuery"
-      label-width="120px"
     >
-      <el-form-item label="销售团队名称" prop="name">
+      <el-radio-button :label="0">销售团队</el-radio-button>
-        <el-input
+      <el-radio-button :label="1">销售人员</el-radio-button>
-          v-model="queryParams.name"
+    </el-radio-group>
-          placeholder="请输入销售团队名称"
+    <component :is="components[queryType]"></component>
-          clearable
-          @keyup.enter="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="Search" @click="handleQuery"
-          >搜索</el-button
-        >
-        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button type="primary" plain icon="Plus" @click="handleAdd"
-          >新增
-        </el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="Edit"
-          :disabled="single"
-          @click="handleUpdate"
-          >修改
-        </el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="Delete"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['sales:team:remove']"
-          >删除
-        </el-button>
-      </el-col>
-      <right-toolbar
-        v-model:showSearch="showSearch"
-        @queryTable="getList"
-      ></right-toolbar>
-    </el-row>
-
-    <a-table
-      :pagination="false"
-      :columns="[
-        {
-          title: '名称',
-          dataIndex: 'name',
-          key: 'name',
-        },
-        {
-          title: '角色',
-          dataIndex: 'role',
-          key: 'role',
-        },
-        {
-          title: '操作',
-          dataIndex: 'operation',
-          width: '320px',
-        },
-      ]"
-      @expand="handleExpandTable"
-      :data-source="teamList"
-    >
-      <template #bodyCell="{ column, text, record }">
-        <template v-if="column.dataIndex === 'role'">
-          <dict-tag :options="sales_person_dict" :value="record.role" />
-        </template>
-        <template
-          v-else-if="column.dataIndex === 'operation' && !record.personId"
-        >
-          <el-button link type="primary" icon="plus">添加销售</el-button>
-          <el-button link type="primary" icon="plus">添加主管</el-button>
-        </template>
-      </template>
-    </a-table>
-
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
-      v-model:limit="queryParams.pageSize"
-      @pagination="getList"
-    />
-
-    <!-- 添加或修改销售团队对话框 -->
-    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
-      <el-form ref="teamRef" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="团队名称" prop="name">
-          <el-input v-model="form.name" placeholder="请输入团队名称" />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button type="primary" @click="submitForm">确 定</el-button>
-          <el-button @click="cancel">取 消</el-button>
-        </div>
-      </template>
-    </el-dialog>
   </div>
 </template>
 
-<script setup name="Team">
+<style scoped lang="scss"></style>
-import {
-  listTeam,
-  getTeam,
-  delTeam,
-  addTeam,
-  updateTeam,
-} from "@/api/sales/team";
-import { getCurrentInstance, reactive, ref, toRefs } from "vue";
-import { Table as ATable } from "ant-design-vue";
-import { modelList } from "@/api/product/product";
-import { listPerson } from "@/api/sales/person";
-import DictTag from "@/components/DictTag/index.vue";
-import { sales_person_dict } from "@/constant/dict";
-
-const { proxy } = getCurrentInstance();
-
-const teamList = ref([]);
-const open = ref(false);
-const loading = ref(true);
-const showSearch = ref(true);
-const ids = ref([]);
-const single = ref(true);
-const multiple = ref(true);
-const total = ref(0);
-const title = ref("");
-
-const data = reactive({
-  form: {},
-  queryParams: {
-    pageNum: 1,
-    pageSize: 10,
-    teamId: null,
-    name: null,
-  },
-  rules: {
-    teamId: [
-      { required: true, message: "销售团队id不能为空", trigger: "blur" },
-    ],
-    name: [
-      { required: true, message: "销售团队名称不能为空", trigger: "blur" },
-    ],
-  },
-});
-
-const { queryParams, form, rules } = toRefs(data);
-
-/** 查询销售团队列表 */
-function getList() {
-  loading.value = true;
-  listTeam(queryParams.value).then((response) => {
-    teamList.value = response.rows.map((el) => ({
-      ...el,
-      key: el.teamId,
-      children: [],
-    }));
-    total.value = response.total;
-    loading.value = false;
-  });
-}
-
-const loadChildren = (row) => {
-  if (row.teamId) {
-    /*加载型号*/
-    listPerson({
-      teamId: row.teamId,
-    }).then(({ rows }) => {
-      row.children = rows.map((el) => ({
-        ...el,
-        key: el.personId,
-      }));
-    });
-  }
-};
-
-const handleExpandTable = (expanded, record) => {
-  expanded && loadChildren(record);
-};
-
-// 取消按钮
-function cancel() {
-  open.value = false;
-  reset();
-}
-
-// 表单重置
-function reset() {
-  form.value = {
-    teamId: null,
-    name: null,
-  };
-  proxy.resetForm("teamRef");
-}
-
-/** 搜索按钮操作 */
-function handleQuery() {
-  queryParams.value.pageNum = 1;
-  getList();
-}
-
-/** 重置按钮操作 */
-function resetQuery() {
-  proxy.resetForm("queryRef");
-  handleQuery();
-}
-
-// 多选框选中数据
-function handleSelectionChange(selection) {
-  ids.value = selection.map((item) => item.teamId);
-  single.value = selection.length != 1;
-  multiple.value = !selection.length;
-}
-
-/** 新增按钮操作 */
-function handleAdd() {
-  reset();
-  open.value = true;
-  title.value = "添加销售团队";
-}
-
-/** 修改按钮操作 */
-function handleUpdate(row) {
-  reset();
-  const _teamId = row.teamId || ids.value;
-  getTeam(_teamId).then((response) => {
-    form.value = response.data;
-    open.value = true;
-    title.value = "修改销售团队";
-  });
-}
-
-/** 提交按钮 */
-function submitForm() {
-  proxy.$refs["teamRef"].validate((valid) => {
-    if (valid) {
-      if (form.value.teamId != null) {
-        updateTeam(form.value).then((response) => {
-          proxy.$modal.msgSuccess("修改成功");
-          open.value = false;
-          getList();
-        });
-      } else {
-        addTeam(form.value).then((response) => {
-          proxy.$modal.msgSuccess("新增成功");
-          open.value = false;
-          getList();
-        });
-      }
-    }
-  });
-}
-
-/** 删除按钮操作 */
-function handleDelete(row) {
-  const _teamIds = row.teamId || ids.value;
-  proxy.$modal
-    .confirm('是否确认删除销售团队编号为"' + _teamIds + '"的数据项？')
-    .then(function () {
-      return delTeam(_teamIds);
-    })
-    .then(() => {
-      getList();
-      proxy.$modal.msgSuccess("删除成功");
-    })
-    .catch(() => {});
-}
-
-getList();
-</script>

src/views/sales/team/person.vue

@@ -0,0 +1,93 @@
+<script setup>
+import {listPerson} from "@/api/sales/person";
+import {reactive, ref, toRefs} from "vue";
+import {Table as ATable} from "ant-design-vue";
+import Pagination from "@/components/Pagination/index.vue";
+
+const columns = [
+  {
+    title: "名称",
+    dataIndex: "name",
+    key: "name",
+  },
+];
+const total = ref(0);
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    teamId: null,
+    name: null,
+  },
+});
+const {form, queryParams} = toRefs(data);
+const loading = ref(false);
+const showSearch = ref(false)
+const personList = ref([]);
+const title = ref("")
+const showDialog = ref(false)
+const getList = () => {
+  loading.value = true;
+  listPerson(queryParams.value)
+      .then((resp) => {
+        personList.value = resp.rows;
+        total.value = resp.total;
+      })
+      .finally(() => {
+        loading.value = false;
+      });
+};
+
+const handleQuery = () => {
+
+}
+const resetQuery = () => {
+}
+const reset = () => {
+}
+const handleAdd = () => {
+
+}
+getList();
+</script>
+
+<template>
+  <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="120px"
+  >
+    <el-form-item label="姓名" prop="name">
+      <el-input
+          v-model="queryParams.name"
+          placeholder="请输入销售人员姓名"
+          clearable
+          @keyup.enter="handleQuery"
+      />
+    </el-form-item>
+    <el-form-item>
+      <el-button type="primary" icon="Search" @click="handleQuery"
+      >搜索
+      </el-button>
+      <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+    </el-form-item>
+  </el-form>
+  <el-row class="mb8">
+    <el-col :span="1.5">
+      <el-button type="primary" @click="handleAdd" plain>新增销售人员</el-button>
+    </el-col>
+  </el-row>
+  <a-table
+      :columns="columns"
+      :data-source="personList"
+      :pagination="false"
+  ></a-table>
+  <pagination :total="total"/>
+
+  <el-dialog v-model="showDialog" :title="title"></el-dialog>
+</template>
+
+<style scoped lang="scss"></style>

src/views/sales/team/team.vue

@@ -0,0 +1,326 @@
+<template>
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      :inline="true"
+      v-show="showSearch"
+      label-width="120px"
+    >
+      <el-form-item label="销售团队名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入销售团队名称"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="Search" @click="handleQuery"
+          >搜索
+        </el-button>
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button type="primary" plain icon="Plus" @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['sales:team:remove']"
+          >删除
+        </el-button>
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <a-table
+      :pagination="false"
+      :columns="[
+        {
+          title: '名称',
+          dataIndex: 'name',
+          key: 'name',
+        },
+        {
+          title: '主管',
+          dataIndex: 'manager',
+          key: 'manager',
+        },
+        {
+          title: '操作',
+          dataIndex: 'operation',
+          width: '320px',
+        },
+      ]"
+      @expand="handleExpandTable"
+      :data-source="teamList"
+    >
+      <!--      <template #expandedRowRender="{ record }">-->
+      <!--        <a-table :columns="[-->
+      <!--            {-->
+      <!--          title: '姓名',-->
+      <!--          dataIndex: 'name',-->
+      <!--          key: 'name',-->
+      <!--        },-->
+      <!--        ]"-->
+      <!--                 :data-source="record.children"-->
+      <!--        ></a-table>-->
+      <!--      </template>-->
+      <template #bodyCell="{ column, text, record }">
+        <template v-if="column.dataIndex === 'role'">
+          <dict-tag :options="sales_person_dict" :value="record.role" />
+        </template>
+        <template
+          v-else-if="column.dataIndex === 'operation' && !record.personId"
+        >
+          <el-button link type="primary" icon="plus">添加销售</el-button>
+          <el-button link type="primary" icon="plus" @click="setManager"
+            >设置主管</el-button
+          >
+        </template>
+      </template>
+    </a-table>
+
+    <pagination
+      v-show="total > 0"
+      :total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改销售团队对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="teamRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="团队名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入团队名称" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+</template>
+
+<script setup name="Team">
+import {
+  listTeam,
+  getTeam,
+  delTeam,
+  addTeam,
+  updateTeam,
+} from "@/api/sales/team";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+import { Table as ATable } from "ant-design-vue";
+import { modelList } from "@/api/product/product";
+import { listPerson } from "@/api/sales/person";
+import DictTag from "@/components/DictTag/index.vue";
+import { sales_person_dict } from "@/constant/dict";
+
+const { proxy } = getCurrentInstance();
+
+const teamList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const personTotal = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    teamId: null,
+    name: null,
+  },
+  personQueryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    teamId: null,
+    name: null,
+  },
+  rules: {
+    teamId: [
+      { required: true, message: "销售团队id不能为空", trigger: "blur" },
+    ],
+    name: [
+      { required: true, message: "销售团队名称不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, personQueryParams, form, rules } = toRefs(data);
+const queryType = ref(0);
+
+/** 查询销售团队列表 */
+function getList() {
+  loading.value = true;
+  listTeam(queryParams.value).then((response) => {
+    teamList.value = response.rows.map((el) => ({
+      ...el,
+      key: el.teamId,
+      children: [],
+    }));
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+const personList = ref([]);
+const getPersonList = () => {
+  loading.value = true;
+  listPerson(personQueryParams.value)
+    .then((resp) => {
+      personList.value = resp.rows;
+      personTotal.value = resp.total;
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+};
+
+const loadChildren = (row) => {
+  if (row.teamId) {
+    /*加载型号*/
+    listPerson({
+      teamId: row.teamId,
+    }).then(({ rows }) => {
+      row.children = rows.map((el) => ({
+        ...el,
+        key: el.personId,
+      }));
+    });
+  }
+};
+
+const handleExpandTable = (expanded, record) => {
+  expanded && loadChildren(record);
+};
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    teamId: null,
+    name: null,
+  };
+  proxy.resetForm("teamRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  // queryParams.value.pageNum = 1;
+
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.teamId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加销售团队";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _teamId = row.teamId || ids.value;
+  getTeam(_teamId).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改销售团队";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["teamRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.teamId != null) {
+        updateTeam(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addTeam(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _teamIds = row.teamId || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除销售团队编号为"' + _teamIds + '"的数据项？')
+    .then(function () {
+      return delTeam(_teamIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/**
+ * 设置主管
+ */
+const setManager = () => {};
+
+getList();
+</script>