From 99b55452c7b79486be1804e8fd51388b4ab1c327 Mon Sep 17 00:00:00 2001
From: lzyyj <lzyyj@sina.com>
Date: Fri, 11 Oct 2024 10:21:12 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E5=8F=A3=EF=BC=9A=201?=
 =?UTF-8?q?=E3=80=81=E7=99=BB=E5=BD=95=E6=8E=A5=E5=8F=A3=202=E3=80=81?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=8E=A5=E5=8F=A3=E6=94=B9=E6=A8=A1=E6=8B=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/modules/index.js   |   4 +-
 src/api/request.js         | 117 ++++++++++++++++++++++++++++---------
 src/layout/menu/index.vue  |  10 ++--
 src/store/modules/users.js |   8 +--
 4 files changed, 100 insertions(+), 39 deletions(-)

diff --git a/src/api/modules/index.js b/src/api/modules/index.js
index 09432bb..23b0876 100644
--- a/src/api/modules/index.js
+++ b/src/api/modules/index.js
@@ -5,7 +5,7 @@ import service from "../request.js";
 export function LoginInfo(query) {
   return service({
     method: "POST",
-    url: "/permission/LoginInfo",
+    url: "/login",
     data: query,
   });
 }
@@ -72,4 +72,4 @@ export function cardlists(query) {
     url: "/permission/cardlists",
     data: query,
   });
-}
\ No newline at end of file
+}
diff --git a/src/api/request.js b/src/api/request.js
index e9c8055..52d3ccb 100644
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -1,44 +1,105 @@
 import axios from "axios";
-import {
-  ElMessage
-} from "element-plus";
+import { ElMessage, ElMessageBox } from "element-plus";
+import router from "../router/router";
 
+const errorCode = {
+    401: "登录状态已过期,即将返回首页重新登录。",
+    403: "当前操作没有权限",
+    404: "访问资源不存在",
+    default: "系统未知错误，请反馈给管理员",
+};
+
+const url = "https://repair.cpolar.top"; // "https://hazard.cpolar.top";
 
 const service = axios.create({
-  timeout: 5000,
+    baseURL: url,
+    timeout: 5000,
 });
 
 // Request interceptors
 service.interceptors.request.use(
-  (config) => {
-    if (localStorage.getItem('token'))
-      config.headers.token = localStorage.getItem('token')
+    (config) => {
+        if (localStorage.getItem("token")) {
+            config.headers["Authorization"] =
+                "Bearer " + localStorage.getItem("token");
+        }
 
-    return config;
-  },
-  (error) => {
-    Promise.reject(error);
-  }
+        if (config.url === "/login") {
+            config.headers["Content-Type"] = "multipart/form-data";
+        } else {
+            config.headers["Content-Type"] = "application/json";
+        }
+
+        let params = config.params;
+        let newData = {};
+        for (let key in params) {
+            if (params[key] !== null && params[key] !== "") {
+                newData[key] = params[key];
+            }
+        }
+        config.params = newData;
+        return config;
+    },
+    (error) => {
+        Promise.reject(error);
+    }
 );
 
 // Response interceptors
 service.interceptors.response.use(
-  (response) => {
-
-    if (response.status !== 200) {
-      ElMessage({
-        type: "error",
-        message: "服务器忙,请稍后再试~",
-      });
-      return;
+    (res) => {
+        // 对响应数据做点什么
+        const response = res.data;
+        const code = res.data.code || 200;
+        const message = errorCode[code] || res.data.msg || errorCode["default"];
+        if (code === 401) {
+            if (res.code === 401 || res.code === 4001) {
+                // 清除浏览器全部临时缓存
+                sessionStorage.clear();
+                localStorage.clear();
+                router.push("/login");
+                // store.commit('setMenuData', {});
+                // resetRouter(); // 重置路由
+                ElMessageBox.alert("你已被登出，请重新登录", "提示", {})
+                    .then(() => {})
+                    .catch(() => {});
+            }
+        } else if (code === 500) {
+            // Message({ message: msg, type: 'error' })
+            ElMessage.error(message);
+            return Promise.reject(new Error(msg));
+        } else if (code === 601) {
+            // Message({ message: msg, type: 'warning' })
+            ElMessage.error(message);
+            return Promise.reject("error");
+        } else if (code != 200) {
+            ElMessage.error(message);
+            return Promise.reject("error");
+        } else {
+            return response;
+        }
+    },
+    (error) => {
+        console.log(error.response.data); // 获取错误状态码
+        // 对响应错误做点什么
+        if (error.message.indexOf("timeout") != -1) {
+            ElMessage.error("网络超时");
+        } else if (error.message == "Network Error") {
+            ElMessage.error("网络连接错误");
+        } else if (error.response.data.code == "401") {
+            sessionStorage.clear();
+            localStorage.clear();
+            router.push("/login");
+            ElMessage.error(error.response.data.msg);
+        } else {
+            ElMessage.error(
+                error.response.data.msg ||
+                error.response.data.error ||
+                error.response.data.errMessage
+            );
+        }
+        return Promise.reject(error);
     }
-
-    return response;
-  },
-  (error) => {
-    // do something
-    return Promise.reject(error);
-  }
 );
 
-export default service;
\ No newline at end of file
+export default service;
diff --git a/src/layout/menu/index.vue b/src/layout/menu/index.vue
index 3d6f105..5fb440b 100644
--- a/src/layout/menu/index.vue
+++ b/src/layout/menu/index.vue
@@ -54,12 +54,12 @@ const themeConfig = store.getters.themeConfig;
 
 // 菜单表存在后端的操作方式
 onMounted(() => {
-  getMenuList().then((res) => {
-    menuList.value = res.data.data.menuList;
-    console.log(menuItems.value);
-  });
+  // getMenuList().then((res) => {
+  //   menuList.value = res.data.data.menuList;
+  //   console.log(menuItems.value);
+  // });
   // 获取本地菜单表渲染
-  // menuList.value = menuTable;
+  menuList.value = menuTable;
 });
 </script>
 
diff --git a/src/store/modules/users.js b/src/store/modules/users.js
index fda0b97..739c54c 100644
--- a/src/store/modules/users.js
+++ b/src/store/modules/users.js
@@ -64,10 +64,10 @@ export default {
         LoginInfo(userInfo)
           .then((res) => {
             console.log(res.data.data);
-            sessionStorage.setItem("token", res.data.data.token);
-            sessionStorage.setItem("UserInfo", JSON.stringify(res.data.data));
-            commit("setToken", res.data.data.token);
-            commit("setUserInfo", res.data.data);
+            sessionStorage.setItem("token", res.data.token);
+            sessionStorage.setItem("UserInfo", JSON.stringify(res.data));
+            commit("setToken", res.data.token);
+            commit("setUserInfo", res.data);
             router.replace("/");
             ElMessage({
               message: "登录成功",

From d099a265340dc0b9f2e43627b355d994cd0a9441 Mon Sep 17 00:00:00 2001
From: lzyyj <lzyyj@sina.com>
Date: Fri, 11 Oct 2024 16:34:59 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E5=8F=A3=EF=BC=9A=201?=
 =?UTF-8?q?=E3=80=81=E7=99=BB=E5=BD=95=E6=8E=A5=E5=8F=A3=202=E3=80=81?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=8E=A5=E5=8F=A3=E6=94=B9=E6=A8=A1=E6=8B=9F?=
 =?UTF-8?q?=203=E3=80=81=E6=9C=8D=E5=8A=A1=E9=A1=B9=E7=9B=AE=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86(=E5=A4=B4=E5=83=8F=E4=B8=8A=E4=BC=A0=E5=8F=8A?=
 =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=9C=AA=E5=AE=9E=E7=8E=B0)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/modules/goods.js           |  25 +++
 src/api/request.js                 |   1 +
 src/layout/menu/menuTable.js       |   5 +
 src/router/originalRoutingTable.js |   2 +-
 src/store/modules/users.js         |   3 +-
 src/views/goods/index.vue          | 294 ++++++++++++++++++++++++++++-
 src/views/goods/options.js         |  34 ++++
 7 files changed, 359 insertions(+), 5 deletions(-)
 create mode 100644 src/api/modules/goods.js
 create mode 100644 src/views/goods/options.js

diff --git a/src/api/modules/goods.js b/src/api/modules/goods.js
new file mode 100644
index 0000000..1fb7207
--- /dev/null
+++ b/src/api/modules/goods.js
@@ -0,0 +1,25 @@
+import service from "../request.js";
+const API_BASE_URL = '/goods';
+
+// 客户列表
+export function getGoodsList(query) {
+    return service({
+        method: "get",
+        url: `${API_BASE_URL}/list`,
+        data: query,
+    });
+}
+export function addGoods(query) {
+    return service({
+        method: "post",
+        url: `${API_BASE_URL}`,
+        data: query,
+    });
+}
+export function updateGoods(query) {
+    return service({
+        method: "put",
+        url: `${API_BASE_URL}`,
+        data: query,
+    });
+}
diff --git a/src/api/request.js b/src/api/request.js
index 52d3ccb..0d95725 100644
--- a/src/api/request.js
+++ b/src/api/request.js
@@ -19,6 +19,7 @@ const service = axios.create({
 // Request interceptors
 service.interceptors.request.use(
     (config) => {
+
         if (localStorage.getItem("token")) {
             config.headers["Authorization"] =
                 "Bearer " + localStorage.getItem("token");
diff --git a/src/layout/menu/menuTable.js b/src/layout/menu/menuTable.js
index 8af9332..985bd02 100644
--- a/src/layout/menu/menuTable.js
+++ b/src/layout/menu/menuTable.js
@@ -10,6 +10,11 @@ const menuTable = [
     url: "/home",
     icon: "HomeFilled",
   },
+  {
+    title: "服务项目",
+    url: "/goods",
+    icon: "HomeFilled",
+  },
   {
     title: "页面管理",
     url: "/page",
diff --git a/src/router/originalRoutingTable.js b/src/router/originalRoutingTable.js
index aca06ea..febbd77 100644
--- a/src/router/originalRoutingTable.js
+++ b/src/router/originalRoutingTable.js
@@ -90,7 +90,7 @@ const routerList = [
         component: () => import("../views/goods/index.vue"),
         meta: {
           requiresAuth: true, //有一些页面是否登录才能进去
-          name: "项目列表",
+          name: "服务项目",
         },
       },
     ],
diff --git a/src/store/modules/users.js b/src/store/modules/users.js
index 739c54c..1d9aa15 100644
--- a/src/store/modules/users.js
+++ b/src/store/modules/users.js
@@ -63,8 +63,9 @@ export default {
       return new Promise((resolve, reject) => {
         LoginInfo(userInfo)
           .then((res) => {
-            console.log(res.data.data);
+            console.log(res.data.token, "111");
             sessionStorage.setItem("token", res.data.token);
+            localStorage.setItem("token", res.data.token);
             sessionStorage.setItem("UserInfo", JSON.stringify(res.data));
             commit("setToken", res.data.token);
             commit("setUserInfo", res.data);
diff --git a/src/views/goods/index.vue b/src/views/goods/index.vue
index 1ba4cd5..89b01a6 100644
--- a/src/views/goods/index.vue
+++ b/src/views/goods/index.vue
@@ -1,10 +1,298 @@
 <template>
-  <el-card>
-    <div>服务项目管理222</div>
+  <el-card shadow="never" class="henader-card">
+    <div class="flx-row">
+      <el-form :inline="true" :model="queryData" style="flex: 1">
+        <el-input placeholder="请输入搜索内容" v-model="queryData.keyWord">
+        </el-input>
+        <el-date-picker
+          class="ml20"
+          v-model="queryData.date"
+          type="datetimerange"
+          :shortcuts="shortcuts"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        />
+      </el-form>
+      <div class="flex-right">
+        <el-button type="primary" :icon="Search" @click="initData" class="ml20"
+          >搜索</el-button
+        >
+        <el-button type="primary" @click="dialogVisibleShow">+添加</el-button>
+      </div>
+    </div>
   </el-card>
+  <el-card shadow="never">
+    <el-table
+      :data="tableData"
+      :header-cell-style="{ backgroundColor: '#ecf5ff' }"
+      border
+      stripe
+      style="width: 100%"
+    >
+      <el-table-column
+        v-for="item in options"
+        :key="item.type"
+        :prop="item.props"
+        :label="item.label"
+        :width="item.width"
+        :align="item.align"
+        show-overflow-tooltip
+        :fixed="item.fixed"
+      >
+        <template v-slot:default="scope" v-if="item.props === 'actions'">
+          <el-icon class="icon-view" @click="ItemView(scope.row)"
+            ><View
+          /></el-icon>
+          <el-icon class="icon-edit" @click="editorClick(scope.row)"
+            ><Edit
+          /></el-icon>
+          <el-popconfirm
+            confirm-button-text="确认"
+            cancel-button-text="取消"
+            :icon="InfoFilled"
+            icon-color="#626AEF"
+            title="确定要除该服务项目?"
+            @confirm="DeleteItem(index)"
+          >
+            <template #reference>
+              <el-icon class="icon-dele"><Delete /></el-icon>
+            </template>
+          </el-popconfirm>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      small
+      background
+      :page-size="queryData.size"
+      layout="prev, pager, next"
+      :total="total"
+      class="mt-4"
+      @current-change="handleCurrentChange"
+    />
+  </el-card>
+
+  <el-dialog
+    v-model="dialogVisible"
+    :title="`${dialogData.title}服务项目`"
+    :width="dialogWidth"
+    :hide-required-asterisk="dialogData.isView"
+    draggable
+  >
+    <el-form
+      :model="dialogData.FormData"
+      :rules="rules"
+      ref="FormRef"
+      class="demo-ruleForm"
+    >
+      <el-form-item
+        label="服务名称"
+        :label-width="formLabelWidth"
+        prop="goodsName"
+      >
+        <el-input v-model="dialogData.FormData.goodsName" autocomplete="off" />
+      </el-form-item>
+      <el-form-item label="服务价格" :label-width="formLabelWidth" prop="price">
+        <el-input v-model="dialogData.FormData.price" autocomplete="off" />
+      </el-form-item>
+
+      <el-form-item label="标题图片" :label-width="formLabelWidth" prop="carouselImage">
+        <el-input v-model="dialogData.FormData.carouselImage" type="textarea" />
+      </el-form-item>
+      <el-form-item label="服务说明" :label-width="formLabelWidth" prop="details">
+        <el-input v-model="dialogData.FormData.details" type="textarea" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="onSubmit()">确认</el-button>
+      </span>
+    </template>
+  </el-dialog>
 </template>
 
 <script setup>
+import {
+  Search,
+  Edit,
+  Delete,
+  UserFilled,
+  InfoFilled,
+  View,
+} from '@element-plus/icons-vue'
+import {
+  getGoodsList,
+  addGoods,
+  updateGoods,
+} from '../../api/modules/goods.js'
+import { options } from './options.js'
+import { onMounted, reactive, ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import { getDateTime } from '../../utils'
+const queryData = ref({
+  keyWord: '',
+  page: 1,
+  size: 10,
+})
+const FormRef = ref()
+const formLabelWidth = '140px'
+const dialogData = reactive({
+  isView: true,
+  title: '添加',
+  FormData: {
+    id: 1,
+    goodsName: '',
+    price: '',
+    carouselImage: '',
+    details: '',
+  },
+})
+
+const dialogWidth = ref('0')
+const rules = reactive({
+  goodsName: [{ required: true, message: '请填写服务项目姓名', trigger: 'change' }],
+  price: [{ required: true, message: '请填写价格', trigger: 'change' }],
+  carouselImage: [{ required: true, message: '请填写服务说明', trigger: 'change' }],
+  details: [{ required: true, message: '请填写说明信息', trigger: 'change' }],
+})
+const oldTableData = ref([])
+const dialogVisible = ref(false)
+const tableData = ref([])
+const total = ref(0)
+
+const initData = () => {
+  getGoodsList(queryData.value).then((res) => {
+    total.value = res.total
+    tableData.value = res.data
+  })
+}
+
+const dialogVisibleShow = () => {
+  dialogData.FormData = {
+    goodsName: '',
+    price: '',
+    carouselImage: '',
+    details: '',
+  }
+  dialogVisible.value = true
+}
+const onSubmit = () => {
+  FormRef.value.validate(async (valid) => {
+    if (!valid) return
+    try {
+      if (dialogData.FormData.id) {
+        updateGoods(dialogData.FormData).then((res) => {
+          console.log('编辑数据成功')
+          console.log(ElMessage)
+          ElMessage({
+            message: '编辑服务项目成功',
+            type: 'success',
+          })
+          // tableData.value = res.data
+        })
+      } else {
+        dialogData.FormData.date = getDateTime('')
+        addGoods(dialogData.FormData)
+          .then((res) => {
+            ElMessage({
+              message: '添加服务项目成功',
+              type: 'success',
+            })
+            dialogData.FormData.id = res.data.data.id
+            tableData.value.unshift(dialogData.FormData)
+          })
+          .catch((err) => {})
+      }
+      dialogVisible.value = false
+    } catch (error) {
+      console.log(error)
+    }
+  })
+}
+const handleCurrentChange = (val) => {
+  queryData.value.page = val
+  initData(queryData.value)
+}
+const editorClick = (item) => {
+  dialogVisible.value = true
+
+  dialogData.FormData = item
+  console.log(dialogData.FormData)
+  dialogData.isView = false
+  dialogData.title = '编辑'
+}
+
+const ItemView = (item) => {
+  dialogVisible.value = true
+  dialogData.FormData = item
+  dialogData.isView = false
+  dialogData.title = ''
+}
+
+const DeleteItem = (index) => {
+  console.log(index)
+  tableData.value.splice(index, 1)
+}
+const cancelEvent = () => {
+  console.log('cancel!')
+}
+const setDialogWidth = () => {
+  console.log(document.body.clientWidth)
+  var val = document.body.clientWidth
+  const def = 800 // 默认宽度
+  if (val < def) {
+    dialogWidth.value = '100%'
+  } else {
+    dialogWidth.value = def + 'px'
+  }
+}
+onMounted(() => {
+  setDialogWidth()
+  window.onresize = () => {
+    return (() => {
+      setDialogWidth()
+    })()
+  }
+  initData()
+})
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.henader-card {
+  margin-bottom: 20px;
+}
+.icon-view {
+  font-size: 20px;
+  color: #673ab7;
+  margin: 0 10px;
+}
+.icon-edit {
+  font-size: 20px;
+  color: #2f60c2;
+  margin: 0 10px;
+}
+.icon-dele {
+  font-size: 20px;
+  color: #ff5722;
+}
+.mt-4 {
+  float: right;
+  text-align: right;
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+.el-button--text {
+  margin-right: 15px;
+}
+.el-select {
+  width: 300px;
+}
+.el-input {
+  width: 300px;
+}
+.dialog-footer button:first-child {
+  margin-right: 10px;
+}
+</style>
diff --git a/src/views/goods/options.js b/src/views/goods/options.js
new file mode 100644
index 0000000..e58c9a4
--- /dev/null
+++ b/src/views/goods/options.js
@@ -0,0 +1,34 @@
+export const options = [
+  {
+    label: '标题图片',
+    props: 'carouselImage',
+    width: '200',
+    align: 'left'
+  },
+  {
+    label: '服务名称',
+    props: 'goodsName',
+    width: 'auto',
+    align: 'left'
+  },
+  {
+    label: '服务价格',
+    props: 'price',
+    width: '150',
+    align: 'left'
+  },
+  {
+    label: '服务说明',
+    props: 'details',
+    width: 'auto',
+    align: 'left',
+    show: true
+  },
+  {
+    label: '操作',
+    props: 'actions',
+    width: '150',
+    align: 'center',
+    fixed: 'right',
+  }
+]

From ff457233e9e2a6911aaff1c0351821cf847d27aa Mon Sep 17 00:00:00 2001
From: lzyyj <lzyyj@sina.com>
Date: Fri, 11 Oct 2024 18:06:37 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E5=8F=A3=EF=BC=9A=201?=
 =?UTF-8?q?=E3=80=81=E7=99=BB=E5=BD=95=E6=8E=A5=E5=8F=A3=202=E3=80=81?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=8E=A5=E5=8F=A3=E6=94=B9=E6=A8=A1=E6=8B=9F?=
 =?UTF-8?q?=203=E3=80=81=E6=9C=8D=E5=8A=A1=E9=A1=B9=E7=9B=AE=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E5=AE=8C=E6=88=9090%(=E6=A0=87=E9=A2=98=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E4=B8=8A=E4=BC=A0=E6=9C=AA=E5=A4=84=E7=90=86)=204?=
 =?UTF-8?q?=E3=80=81=E6=9C=8D=E5=8A=A1=E9=85=8D=E7=BD=AE=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=EF=BC=8C=E5=AE=8C=E6=88=9090%=EF=BC=88=E7=95=8C=E9=9D=A2?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=9C=AA=E5=AE=8C=E6=88=90=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/modules/config.js          |  18 ++
 src/layout/menu/menuTable.js       |   5 +
 src/router/originalRoutingTable.js |  20 +++
 src/views/config/index.vue         | 259 +++++++++++++++++++++++++++++
 src/views/config/options.js        |  21 +++
 src/views/goods/index.vue          |  19 +--
 6 files changed, 328 insertions(+), 14 deletions(-)
 create mode 100644 src/api/modules/config.js
 create mode 100644 src/views/config/index.vue
 create mode 100644 src/views/config/options.js

diff --git a/src/api/modules/config.js b/src/api/modules/config.js
new file mode 100644
index 0000000..a3e9906
--- /dev/null
+++ b/src/api/modules/config.js
@@ -0,0 +1,18 @@
+import service from "../request.js";
+const API_BASE_URL = '/config';
+
+// 客户列表
+export function getConfigList(query) {
+    return service({
+        method: "get",
+        url: `${API_BASE_URL}/list`,
+        data: query,
+    });
+}
+export function updateConfig(query) {
+    return service({
+        method: "put",
+        url: `${API_BASE_URL}`,
+        data: query,
+    });
+}
diff --git a/src/layout/menu/menuTable.js b/src/layout/menu/menuTable.js
index 985bd02..1a044d3 100644
--- a/src/layout/menu/menuTable.js
+++ b/src/layout/menu/menuTable.js
@@ -10,6 +10,11 @@ const menuTable = [
     url: "/home",
     icon: "HomeFilled",
   },
+  {
+    title: "服务配置",
+    url: "/config",
+    icon: "HomeFilled",
+  },
   {
     title: "服务项目",
     url: "/goods",
diff --git a/src/router/originalRoutingTable.js b/src/router/originalRoutingTable.js
index febbd77..845924f 100644
--- a/src/router/originalRoutingTable.js
+++ b/src/router/originalRoutingTable.js
@@ -75,6 +75,26 @@ const routerList = [
       },
     ],
   },
+  {
+    path: "/config",
+    component: Layout,
+    redirect: "config",
+    meta: {
+      requiresAuth: true, //有一些页面是否登录才能进去
+      name: "服务配置",
+    },
+    children: [
+      {
+        path: "/config",
+        name: "config",
+        component: () => import("../views/config/index.vue"),
+        meta: {
+          requiresAuth: true, //有一些页面是否登录才能进去
+          name: "服务配置",
+        },
+      },
+    ],
+  },
   {
     path: "/goods",
     component: Layout,
diff --git a/src/views/config/index.vue b/src/views/config/index.vue
new file mode 100644
index 0000000..720e898
--- /dev/null
+++ b/src/views/config/index.vue
@@ -0,0 +1,259 @@
+<template>
+  <el-card shadow="never">
+    <el-table
+      :data="tableData"
+      :header-cell-style="{ backgroundColor: '#ecf5ff' }"
+      border
+      stripe
+      style="width: 100%"
+    >
+      <el-table-column
+        v-for="item in options"
+        :key="item.type"
+        :prop="item.props"
+        :label="item.label"
+        :width="item.width"
+        :align="item.align"
+        show-overflow-tooltip
+        :fixed="item.fixed"
+      >
+        <template v-slot:default="scope" v-if="item.props === 'actions'">
+          <el-icon class="icon-view" @click="ItemView(scope.row)"
+            ><View
+          /></el-icon>
+          <el-icon class="icon-edit" @click="editorClick(scope.row)"
+            ><Edit
+          /></el-icon>
+          <el-popconfirm
+            confirm-button-text="确认"
+            cancel-button-text="取消"
+            :icon="InfoFilled"
+            icon-color="#626AEF"
+            title="确定要除该服务项目?"
+            @confirm="DeleteItem(index)"
+          >
+            <template #reference>
+              <el-icon class="icon-dele"><Delete /></el-icon>
+            </template>
+          </el-popconfirm>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination
+      small
+      background
+      :page-size="queryData.size"
+      layout="prev, pager, next"
+      :total="total"
+      class="mt-4"
+      @current-change="handleCurrentChange"
+    />
+  </el-card>
+
+  <el-dialog
+    v-model="dialogVisible"
+    :title="`${dialogData.title}服务配置`"
+    :width="dialogWidth"
+    :hide-required-asterisk="dialogData.isView"
+    draggable
+  >
+    <el-form
+      :model="dialogData.FormData"
+      :rules="rules"
+      ref="FormRef"
+      class="demo-ruleForm"
+    >
+      <el-form-item
+        label="配置项目"
+        :label-width="formLabelWidth"
+        prop="title"
+      >
+        <el-input v-model="dialogData.FormData.title" autocomplete="off" disabled />
+      </el-form-item>
+      <el-form-item label="配置内容" :label-width="formLabelWidth" prop="content">
+        <el-input v-model="dialogData.FormData.content" autocomplete="off" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogVisible = false">取消</el-button>
+        <el-button type="primary" @click="onSubmit()">确认</el-button>
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script setup>
+import {
+  Search,
+  Edit,
+  Delete,
+  UserFilled,
+  InfoFilled,
+  View,
+} from '@element-plus/icons-vue'
+import {
+  getConfigList,
+  updateConfig,
+} from '../../api/modules/config.js'
+import { options } from './options.js'
+import { onMounted, reactive, ref } from 'vue'
+import { ElMessage } from 'element-plus'
+import { getDateTime } from '../../utils'
+const queryData = ref({
+  keyWord: '',
+  page: 1,
+  size: 10,
+})
+const FormRef = ref()
+const formLabelWidth = '140px'
+const dialogData = reactive({
+  isView: true,
+  title: '添加',
+  FormData: {
+    title: '',
+    content: '',
+  },
+})
+
+const dialogWidth = ref('0')
+const rules = reactive({
+  content: [{ required: true, message: '请填写配置内容', trigger: 'change' }],
+})
+const oldTableData = ref([])
+const dialogVisible = ref(false)
+const tableData = ref([])
+const total = ref(0)
+
+const initData = () => {
+  getConfigList(queryData.value).then((res) => {
+    total.value = res.total
+    tableData.value = res.data
+  })
+}
+
+const dialogVisibleShow = () => {
+  dialogData.FormData = {
+    title: '',
+    content: '',
+  }
+  dialogVisible.value = true
+}
+const onSubmit = () => {
+  FormRef.value.validate(async (valid) => {
+    if (!valid) return
+    try {
+      if (dialogData.FormData.id) {
+        updateConfig(dialogData.FormData).then((res) => {
+          console.log('编辑数据成功')
+          console.log(ElMessage)
+          ElMessage({
+            message: '编辑服务项目成功',
+            type: 'success',
+          })
+          // tableData.value = res.data
+        })
+      } else {
+        dialogData.FormData.date = getDateTime('')
+        addGoods(dialogData.FormData)
+          .then((res) => {
+            ElMessage({
+              message: '添加服务项目成功',
+              type: 'success',
+            })
+            dialogData.FormData.id = res.data.data.id
+            tableData.value.unshift(dialogData.FormData)
+          })
+          .catch((err) => {})
+      }
+      dialogVisible.value = false
+    } catch (error) {
+      console.log(error)
+    }
+  })
+}
+const handleCurrentChange = (val) => {
+  queryData.value.page = val
+  initData(queryData.value)
+}
+const editorClick = (item) => {
+  dialogVisible.value = true
+
+  dialogData.FormData = item
+  console.log(dialogData.FormData)
+  dialogData.isView = false
+  dialogData.title = '编辑'
+}
+
+const ItemView = (item) => {
+  dialogVisible.value = true
+  dialogData.FormData = item
+  dialogData.isView = false
+  dialogData.title = ''
+}
+
+const DeleteItem = (index) => {
+  console.log(index)
+  tableData.value.splice(index, 1)
+}
+const cancelEvent = () => {
+  console.log('cancel!')
+}
+const setDialogWidth = () => {
+  console.log(document.body.clientWidth)
+  var val = document.body.clientWidth
+  const def = 800 // 默认宽度
+  if (val < def) {
+    dialogWidth.value = '100%'
+  } else {
+    dialogWidth.value = def + 'px'
+  }
+}
+onMounted(() => {
+  setDialogWidth()
+  window.onresize = () => {
+    return (() => {
+      setDialogWidth()
+    })()
+  }
+  initData()
+})
+</script>
+
+<style lang="scss" scoped>
+.henader-card {
+  margin-bottom: 20px;
+}
+.icon-view {
+  font-size: 20px;
+  color: #673ab7;
+  margin: 0 10px;
+}
+.icon-edit {
+  font-size: 20px;
+  color: #2f60c2;
+  margin: 0 10px;
+}
+.icon-dele {
+  font-size: 20px;
+  color: #ff5722;
+}
+.mt-4 {
+  float: right;
+  text-align: right;
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+.el-button--text {
+  margin-right: 15px;
+}
+.el-select {
+  width: 300px;
+}
+.el-input {
+  width: 300px;
+}
+.dialog-footer button:first-child {
+  margin-right: 10px;
+}
+</style>
diff --git a/src/views/config/options.js b/src/views/config/options.js
new file mode 100644
index 0000000..989d037
--- /dev/null
+++ b/src/views/config/options.js
@@ -0,0 +1,21 @@
+export const options = [
+  {
+    label: '配置项目',
+    props: 'title',
+    width: 'auto',
+    align: 'left'
+  },
+  {
+    label: '配置内容',
+    props: 'content',
+    width: 'auto',
+    align: 'left'
+  },
+  {
+    label: '操作',
+    props: 'actions',
+    width: '150',
+    align: 'center',
+    fixed: 'right',
+  }
+]
diff --git a/src/views/goods/index.vue b/src/views/goods/index.vue
index 89b01a6..77c3d02 100644
--- a/src/views/goods/index.vue
+++ b/src/views/goods/index.vue
@@ -2,22 +2,13 @@
   <el-card shadow="never" class="henader-card">
     <div class="flx-row">
       <el-form :inline="true" :model="queryData" style="flex: 1">
-        <el-input placeholder="请输入搜索内容" v-model="queryData.keyWord">
-        </el-input>
-        <el-date-picker
-          class="ml20"
-          v-model="queryData.date"
-          type="datetimerange"
-          :shortcuts="shortcuts"
-          range-separator="至"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-        />
+<!--        <el-input placeholder="请输入搜索内容" v-model="queryData.keyWord">-->
+<!--        </el-input>-->
       </el-form>
       <div class="flex-right">
-        <el-button type="primary" :icon="Search" @click="initData" class="ml20"
-          >搜索</el-button
-        >
+<!--        <el-button type="primary" :icon="Search" @click="initData" class="ml20"-->
+<!--          >搜索</el-button-->
+<!--        >-->
         <el-button type="primary" @click="dialogVisibleShow">+添加</el-button>
       </div>
     </div>