后台布局调整：改为左侧结构

.env.development

@@ -1,6 +1,7 @@
 VITE_APP_NAME=后台管理系统
 VITE_SOCKET_URL=wss://server.gxwebsoft.com
 VITE_SERVER_URL=https://server.gxwebsoft.com/api
-#VITE_API_URL=https://modules.gxwebsoft.com/api
+VITE_API_URL=https://modules.gxwebsoft.com/api
 
-VITE_API_URL=http://127.0.0.1:9099/api
+#VITE_SERVER_URL=http://127.0.0.1:9091/api
+#VITE_API_URL=http://127.0.0.1:9099/api

package.json

@@ -8,7 +8,8 @@
     "build": "vite build",
     "lint:eslint": "eslint --cache --max-warnings 0  \"src/**/*.{vue,ts}\" --fix",
     "clean:cache": "rimraf node_modules/.cache/ && rimraf node_modules/.vite/",
-    "clean:lib": "rimraf node_modules"
+    "clean:lib": "rimraf node_modules",
+    "build-css": "tailwindcss -o ./dist/tailwind.css --minify"
   },
   "dependencies": {
     "@amap/amap-jsapi-loader": "^1.0.1",
@@ -60,15 +61,17 @@
     "@vitejs/plugin-legacy": "^2.0.1",
     "@vitejs/plugin-vue": "^3.0.3",
     "@vue/compiler-sfc": "^3.2.38",
+    "autoprefixer": "^10.4.19",
     "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-define-config": "^1.7.0",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-vue": "^9.4.0",
     "less": "^4.1.3",
-    "postcss": "^8.4.16",
+    "postcss": "^8.4.39",
     "prettier": "^2.7.1",
     "rimraf": "^3.0.2",
+    "tailwindcss": "^3.4.6",
     "terser": "^5.15.0",
     "typescript": "^4.8.2",
     "unplugin-vue-components": "^0.22.4",

postcss.config.js

@@ -1,3 +1,6 @@
 module.exports = {
-  plugins: {}
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {}
+  }
 };

src/components/SelectFile/components/select-data.vue

@@ -107,16 +107,10 @@
             <a-radio v-model:checked="checked" @click="onRadio(record)" />
           </template>
           <template v-else>
-            <a-space>
               <lebal>
                 <a-radio @click="onRadio(record)" />
                 <a class="ele-text-success">选择</a>
               </lebal>
-              <a-divider type="vertical" />
-              <a class="ele-text-placeholder">编辑</a>
-              <a-divider type="vertical" />
-              <a class="ele-text-placeholder">删除</a>
-            </a-space>
           </template>
         </template>
       </template>

src/store/modules/theme.ts

@@ -37,7 +37,7 @@ const DEFAULT_STATE: ThemeState = Object.freeze({
   // 是否折叠侧栏
   collapse: false,
   // 是否折叠一级侧栏
-  sideNavCollapse: false,
+  sideNavCollapse: true,
   // 内容区域是否全屏
   bodyFullscreen: false,
   // 是否开启页签栏
@@ -45,19 +45,19 @@ const DEFAULT_STATE: ThemeState = Object.freeze({
   // 是否开启页脚
   showFooter: true,
   // 顶栏风格: light(亮色), dark(暗色), primary(主色)
-  headStyle: 'dark',
+  headStyle: 'light',
   // 侧栏风格: light(亮色), dark(暗色)
-  sideStyle: 'light',
+  sideStyle: 'dark',
   // 布局风格: side(默认), top(顶栏导航), mix(混合导航)
-  layoutStyle: 'mix',
+  layoutStyle: 'side',
   // 侧栏菜单风格: default(默认), mix(双排侧栏)
   sideMenuStyle: 'default',
   // 页签风格: default(默认), dot(圆点), card(卡片)
-  tabStyle: 'dot',
+  tabStyle: 'card',
   // 路由切换动画
   transitionName: 'fade',
   // 是否固定顶栏
-  fixedHeader: false,
+  fixedHeader: true,
   // 是否固定侧栏
   fixedSidebar: true,
   // 是否固定主体
@@ -65,9 +65,9 @@ const DEFAULT_STATE: ThemeState = Object.freeze({
   // 内容区域宽度铺满
   bodyFull: true,
   // logo 是否自适应宽度
-  logoAutoSize: true,
+  logoAutoSize: false,
   // 侧栏是否彩色图标
-  colorfulIcon: true,
+  colorfulIcon: false,
   // 侧栏是否只保持一个子菜单展开
   sideUniqueOpen: false,
   // 是否是色弱模式

src/styles/index.less

@@ -1,3 +1,6 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
 /** 全局样式 */
 @style-entry-file: as-needed;
 @import './@{style-entry-file}.less';

src/views/booking/integral/index.vue

@@ -20,6 +20,9 @@
             />
           </template>
           <template #bodyCell="{ column, record }">
+            <template v-if="column.key === 'id'">
+              {{ record.id }}
+            </template>
             <template v-if="column.key === 'image'">
               <a-image :src="record.image" :width="50" />
             </template>
@@ -61,7 +64,11 @@
   } from 'ele-admin-pro/es/ele-pro-table/types';
   import Search from './components/search.vue';
   import IntegralEdit from './components/integralEdit.vue';
-  import { pageIntegral, removeIntegral, removeBatchIntegral } from '@/api/booking/integral';
+  import {
+    pageIntegral,
+    removeIntegral,
+    removeBatchIntegral
+  } from '@/api/booking/integral';
   import type { Integral, IntegralParam } from '@/api/booking/integral/model';
 
   // 表格实例
@@ -100,9 +107,9 @@
   // 表格列配置
   const columns = ref<ColumnItem[]>([
     {
-      title: '用户ID',
+      title: 'ID',
-      dataIndex: 'userId',
+      dataIndex: 'id',
-      key: 'userId',
+      key: 'id',
       width: 90
     },
     {

src/views/booking/users/index.vue

@@ -113,9 +113,10 @@
   // 表格列配置
   const columns = ref<ColumnItem[]>([
     {
-      title: 'ID',
+      title: 'UID',
-      dataIndex: 'uid',
+      dataIndex: 'id',
-      key: 'uid',
+      key: 'id',
+      sorter: true,
       width: 90
     },
     {
@@ -138,9 +139,10 @@
     },
     {
       title: '性别',
-      dataIndex: 'sexName',
+      dataIndex: 'gender',
-      key: 'sexName',
+      key: 'gender',
-      align: 'center'
+      align: 'center',
+      customRender: ({ text }) => ['未知', '男', '女'][text]
     },
     {
       title: '国家',
@@ -177,28 +179,42 @@
     },
     {
       title: '积分',
-      dataIndex: 'points',
+      dataIndex: 'integral',
-      key: 'points',
+      key: 'integral',
       sorter: true,
       align: 'center'
     },
     {
       title: '余额',
-      dataIndex: 'balance',
+      dataIndex: 'money',
-      key: 'balance',
+      key: 'money',
       sorter: true,
       align: 'center'
     },
     {
-      title: '状态',
+      title: '真实姓名',
-      dataIndex: 'status',
+      dataIndex: 'realName',
-      key: 'status',
+      key: 'realName',
+      sorter: true,
       align: 'center'
     },
+    {
+      title: '身份证号',
+      dataIndex: 'idCard',
+      key: 'idCard',
+      sorter: true,
+      align: 'center'
+    },
+    // {
+    //   title: '状态',
+    //   dataIndex: 'status',
+    //   key: 'status',
+    //   align: 'center'
+    // },
     {
       title: '注册时间',
-      dataIndex: 'addTime',
+      dataIndex: 'createTime',
-      key: 'addTime',
+      key: 'createTime',
       align: 'center',
       sorter: true,
       ellipsis: true,

src/views/cms/dashboard/index.vue

@@ -1,32 +1,37 @@
 <template>
   <div class="ele-body ele-body-card">
-    <a-card :bordered="false">
-      <template #title>
-        <SoundOutlined class="ele-text-danger" />
-        <span class="gg-title ele-text-heading">公告</span>
-        <a @click="openNew(`${domain}`)" class="ele-text-heading"
-          >网站首页</a
-        >
-      </template>
-      <template #extra>
-        <a @click="openNew('/cms/category/92')" class="ele-text-placeholder"
-          >更多<RightOutlined
-        /></a>
-      </template>
-    </a-card>
-    <LinkCard />
     <a-row :gutter="16" ref="wrapRef">
       <a-col :md="6">
-        <Article title="通知公告" :categoryId="92" />
+        <a-card hoverable>
+          <div class="flex justify-between leading-5">
+            <div class="title font-bold">文章</div>
+            <div class="count font-bold">20</div>
+          </div>
+        </a-card>
       </a-col>
       <a-col :md="6">
-        <Article title="公司动态" :categoryId="37" />
+        <a-card hoverable>
+          <div class="flex justify-between leading-5">
+            <div class="title font-bold">商品</div>
+            <div class="count font-bold">1</div>
+          </div>
+        </a-card>
       </a-col>
       <a-col :md="6">
-        <Article title="经验分享" :categoryId="93" />
+        <a-card hoverable>
+          <div class="flex justify-between leading-5">
+            <div class="title font-bold">用户</div>
+            <div class="count font-bold">658</div>
+          </div>
+        </a-card>
       </a-col>
       <a-col :md="6">
-        <Article title="API文档" :categoryId="90" />
+        <a-card hoverable>
+          <div class="flex justify-between leading-5">
+            <div class="title font-bold">订单</div>
+            <div class="count font-bold">1820</div>
+          </div>
+        </a-card>
       </a-col>
     </a-row>
     <!--    <a-row :gutter="16" ref="wrapRef">-->

src/views/cms/field/components/website-field-edit.vue

@@ -16,7 +16,7 @@
       :label-col="{ md: { span: 4 }, sm: { span: 4 }, xs: { span: 24 } }"
       :wrapper-col="{ md: { span: 21 }, sm: { span: 22 }, xs: { span: 24 } }"
     >
-      <a-form-item label="参数名称" name="name">
+      <a-form-item label="键" name="name">
         <a-input
           allow-clear
           placeholder="site_name"
@@ -24,21 +24,24 @@
           v-model:value="form.name"
         />
       </a-form-item>
-      <a-form-item label="参数值" name="value">
+      <a-form-item label="值" name="value">
-        <a-input
+        <a-input allow-clear placeholder="淘宝网" v-model:value="form.value" />
-          allow-clear
-          placeholder="填写参数内容，如：淘宝网"
-          v-model:value="form.value"
-        />
       </a-form-item>
       <a-form-item label="描述" name="comments">
-        <a-textarea
+        <a-input
-          :rows="4"
+          allow-clear
-          :maxlength="200"
+          placeholder="网站名称"
-          placeholder="填写参数用途"
           v-model:value="form.comments"
         />
       </a-form-item>
+      <a-form-item label="排序" name="sortNumber">
+        <a-input-number
+          :min="0"
+          :max="99999"
+          placeholder="请输入排序号"
+          v-model:value="form.sortNumber"
+        />
+      </a-form-item>
       <a-form-item label="(选填)">
         <SelectFile
           :placeholder="`请选择图片`"
@@ -48,14 +51,6 @@
           @del="onDeleteItem"
         />
       </a-form-item>
-      <a-form-item label="排序" name="sortNumber">
-        <a-input-number
-          :min="0"
-          :max="99999"
-          placeholder="请输入排序号"
-          v-model:value="form.sortNumber"
-        />
-      </a-form-item>
     </a-form>
   </ele-modal>
 </template>
@@ -112,13 +107,13 @@
         message: '请输入参数名称(英语)'
       }
     ],
-    comments: [
+    // comments: [
-      {
+    //   {
-        required: true,
+    //     required: true,
-        type: 'string',
+    //     type: 'string',
-        message: '请输入描述'
+    //     message: '请输入描述'
-      }
+    //   }
-    ],
+    // ],
     value: [
       {
         required: true,

src/views/cms/field/index.vue

@@ -29,7 +29,7 @@
               <span v-else>{{ record.value }}</span>
             </template>
             <template v-if="column.key === 'action'">
-              <a @click="moveUp(record)">上移<ArrowUpOutlined /></a>
+              <a @click="copyText('{{ config.' + record.name + ' }}')">调用</a>
               <a-divider type="vertical" />
               <a @click="openEdit(record)">编辑</a>
               <template v-if="record.deleted == 0">
@@ -82,8 +82,7 @@
     undeleteWebsiteField,
     updateWebsiteField
   } from '@/api/cms/website/field';
-  import { ArrowUpOutlined } from '@ant-design/icons-vue';
+  import { copyText, getPageTitle } from '@/utils/common';
-  import { getPageTitle } from '@/utils/common';
 
   const props = defineProps<{
     websiteId: any;
@@ -112,19 +111,19 @@
   // 表格列配置
   const columns = ref<any[]>([
     {
-      title: '参数名称',
+      title: '键',
       dataIndex: 'name',
       key: 'name'
     },
     {
-      title: '参数值',
+      title: '值',
       dataIndex: 'value',
       key: 'value'
     },
     {
       title: '排序',
       dataIndex: 'sortNumber',
-      width: 180,
+      width: 120,
       align: 'center'
     },
     {

src/views/system/profile/components/version.vue

@@ -0,0 +1,232 @@
+<!-- 用户编辑弹窗 -->
+<template>
+  <ele-modal
+    width="80%"
+    :visible="visible"
+    :confirm-loading="loading"
+    :title="`商业授权`"
+    :footer="null"
+    :body-style="{ paddingBottom: '16px' }"
+    @update:visible="updateVisible"
+    @ok="save"
+  >
+    <div class="version-select">
+      <div class="item">1 </div>
+      <div class="item">2</div>
+      <div class="item">3</div>
+    </div>
+  </ele-modal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive, watch } from 'vue';
+  import { Form, message, SelectProps } from 'ant-design-vue';
+  import { assignObject } from 'ele-admin-pro';
+  import { addCompany, updateCompany } from '@/api/system/company';
+  import { Company } from '@/api/system/company/model';
+
+  const useForm = Form.useForm;
+  // 是否是修改
+  const isUpdate = ref(false);
+  const props = defineProps<{
+    // 弹窗是否打开
+    visible: boolean;
+    data?: Company | null;
+    title?: string;
+    field?: string | null;
+  }>();
+
+  const emit = defineEmits<{
+    (e: 'done'): void;
+    (e: 'update:visible', visible: boolean): void;
+  }>();
+
+  // 提交状态
+  const loading = ref(false);
+  const content = ref();
+  const activeKey = ref('1');
+  const placeholder = ref('请输入修改内容');
+  // 用户信息
+  const form = reactive<Company>({
+    companyId: undefined,
+    shortName: '',
+    companyName: '',
+    companyType: undefined,
+    appType: '',
+    companyLogo: '',
+    domain: '',
+    phone: '',
+    InvoiceHeader: '',
+    startTime: '',
+    expirationTime: '',
+    version: undefined,
+    members: undefined,
+    departments: undefined,
+    country: '',
+    province: '',
+    city: '',
+    region: '',
+    address: '',
+    comments: '',
+    authentication: undefined,
+    modules: '',
+    requestUrl: '',
+    socketUrl: '',
+    serverUrl: '',
+    modulesUrl: '',
+    status: undefined,
+    userId: undefined,
+    tenantId: undefined,
+    code: undefined,
+    createTime: '',
+    updateTime: ''
+  });
+
+  // 省市区
+  const city = ref<string[]>([
+    String(form.province),
+    String(form.city),
+    String(form.region)
+  ]);
+
+  const industry = ref<string[]>([
+    String(form.industryParent),
+    String(form.industryChild)
+  ]);
+
+  const companyType = ref<SelectProps['options']>([
+    {
+      value: '企业',
+      label: '企业'
+    },
+    {
+      value: '政府',
+      label: '政府'
+    },
+    {
+      value: '个人',
+      label: '个人'
+    },
+    {
+      value: '其他组织',
+      label: '其他组织'
+    }
+  ]);
+
+  const appType = ref<SelectProps['options']>([
+    {
+      value: 'Tenant',
+      label: 'Tenant'
+    },
+    {
+      value: 'Vue',
+      label: 'Vue'
+    },
+    {
+      value: 'UniApp',
+      label: 'UniApp'
+    },
+    {
+      value: '网站应用',
+      label: '网站应用'
+    }
+  ]);
+
+  /* 更新visible */
+  const updateVisible = (value: boolean) => {
+    emit('update:visible', value);
+  };
+
+  const { resetFields, validate } = useForm(form);
+
+  const onInput = () => {
+    // 对象赋值
+    Object.keys(form).forEach((key) => {
+      if (key === props.field) {
+        form[key] = content.value;
+      }
+    });
+  };
+
+  const onCompanyType = (e) => {
+    form.companyType = e;
+  };
+
+  const onAppType = (e) => {
+    form.appType = e;
+  };
+
+  /* 保存编辑 */
+  const save = () => {
+    validate()
+      .then(() => {
+        loading.value = true;
+        form.province = city.value[0];
+        form.city = city.value[1];
+        form.region = city.value[2];
+        form.industryParent = industry.value[0];
+        form.industryChild = industry.value[1];
+        form.authoritative = true;
+        const saveOrUpdate = form.companyId ? updateCompany : addCompany;
+        saveOrUpdate(form)
+          .then(() => {
+            loading.value = false;
+            message.success('保存成功');
+            updateVisible(false);
+            emit('done');
+          })
+          .catch((e) => {
+            loading.value = false;
+            message.error(e.message);
+          });
+      })
+      .catch(() => {});
+  };
+
+  watch(
+    () => props.visible,
+    (visible) => {
+      if (visible) {
+        if (props.data) {
+          loading.value = false;
+          console.log(props.data);
+          city.value[0] = String(props.data.province);
+          city.value[1] = String(props.data.city);
+          city.value[2] = String(props.data.region);
+          industry.value[0] = String(props.data.industryParent);
+          industry.value[1] = String(props.data.industryChild);
+          assignObject(form, props.data);
+          // 对象赋值
+          Object.keys(form).forEach((key) => {
+            if (key === props.field) {
+              console.log(key);
+              console.log(form[key]);
+              content.value = form[key];
+            }
+          });
+          isUpdate.value = true;
+        } else {
+          isUpdate.value = false;
+        }
+      } else {
+        resetFields();
+      }
+
+      if (props.field == 'tenantCode') {
+        placeholder.value = '请输入要绑定的主体编号';
+        // content.value = undefined;
+      }
+    }
+  );
+</script>
+<style lang="less">
+  .version-select {
+    display: flex;
+    justify-content: space-around;
+    .item {
+      width: 300px;
+      border: 1px solid #f0f0f0;
+      display: block;
+    }
+  }
+</style>

src/views/system/profile/index.vue

@@ -23,13 +23,13 @@
                 @done="chooseFile"
                 @del="onDeleteItem"
               />
-<!--              <ele-image-upload-->
+              <!--              <ele-image-upload-->
-<!--                v-model:value="logo"-->
+              <!--                v-model:value="logo"-->
-<!--                :accept="'image/*'"-->
+              <!--                :accept="'image/*'"-->
-<!--                :item-style="{ width: '80px', height: '80px' }"-->
+              <!--                :item-style="{ width: '80px', height: '80px' }"-->
-<!--                :limit="1"-->
+              <!--                :limit="1"-->
-<!--                @upload="onUpload"-->
+              <!--                @upload="onUpload"-->
-<!--              />-->
+              <!--              />-->
             </a-form-item>
             <a-form-item label="应用名称">
               <a-space class="justify ele-text-secondary">
@@ -47,11 +47,11 @@
                 >
               </a-space>
             </a-form-item>
-<!--            <a-form-item label="应用类型">-->
+            <!--            <a-form-item label="应用类型">-->
-<!--              <a-space class="justify">-->
+            <!--              <a-space class="justify">-->
-<!--                <span>Tenant</span>-->
+            <!--                <span>Tenant</span>-->
-<!--              </a-space>-->
+            <!--              </a-space>-->
-<!--            </a-form-item>-->
+            <!--            </a-form-item>-->
             <a-form-item label="应用状态">
               <span v-if="form.status == 0" class="ele-text-success">已上线</span>
               <span v-if="form.status == 1" class="ele-text-warning">开发中</span>
@@ -60,8 +60,8 @@
             </a-form-item>
             <a-form-item label="当前版本">
               <a-space class="justify">
-                <a-tag color="red" v-if="form.version === 10">体验版</a-tag>
+                <a-tag color="red" v-if="form.version === 10" class="cursor-pointer" @click="updateVersion(form.version)">体验版</a-tag>
-                <a-tag color="blue" v-if="form.version === 20">授权版</a-tag>
+                <a-tag color="blue" v-if="form.version === 20" class="cursor-pointer" @click="updateVersion(form.version)">授权版</a-tag>
                 <a-tag color="cyan" v-if="form.version === 30">永久授权</a-tag>
               </a-space>
             </a-form-item>
@@ -81,50 +81,65 @@
             <a-form-item label="主体名称">
               <a-space class="justify">
                 <div class="ele-text-secondary">
-                  <span style="padding-right: 12px">{{ form.companyName ? form.companyName : '-' }}</span>
+                  <span style="padding-right: 12px">{{ form.companyName ? form.companyName : "-" }}</span>
                   <a-tag v-if="form.authentication == 1" color="green">已认证</a-tag>
                   <a-tag v-else color="orange">未认证</a-tag>
                 </div>
+                <a @click="onEdit('公司名称', 'companyName', form.companyName)"
+                >修改</a
+                >
               </a-space>
             </a-form-item>
             <a-form-item label="主体类型">
               <a-space class="justify">
-                <span class="ele-text-secondary">{{ form.companyType }}</span>
+                <a-tag>{{ form.companyType }}</a-tag>
+                <a @click="onEdit('主体类型', 'companyType', form.companyType)">修改</a>
               </a-space>
             </a-form-item>
             <a-form-item label="行业类型">
-              <a-space class="justify ele-text-secondary">
+              <a-space class="justify">
                 <span>{{ form.industryParent }} {{ form.industryChild ? form.industryChild : '-' }}</span>
-              </a-space>
+                <a @click="onEdit('行业类型', 'industryParent', form.industryParent)"
-            </a-form-item>
+                >修改</a
-            <a-form-item label="所属地区">
-              <a-space class="justify ele-text-secondary">
-                <span
-                  >{{ form.province }} {{ form.city }} {{ form.region ? form.region : '-' }}</span
                 >
               </a-space>
             </a-form-item>
+            <a-form-item label="所属地区">
+              <a-space class="justify">
+                <span
+                >{{ form.province }} {{ form.city }} {{ form.region ? form.region : '-' }}</span
+                >
+                <a @click="onEdit('所属地区', 'city', form.city)">修改</a>
+              </a-space>
+            </a-form-item>
             <a-form-item label="企业地址">
-              <a-space class="justify ele-text-secondary">
+              <a-space class="justify">
                 <span>{{ form.address ? form.address : '-' }}</span>
+                <a @click="onEdit('企业地址', 'address', form.address)">修改</a>
               </a-space>
             </a-form-item>
 <!--            <a-form-item label="企业域名">-->
-<!--              <a-space class="justify ele-text-secondary">-->
+<!--              <a-space class="justify">-->
 <!--                <span>{{ form.domain ? form.domain : '-' }}</span>-->
 <!--                <a @click="onEdit('企业域名', 'domain', form.domain)">修改</a>-->
 <!--              </a-space>-->
 <!--            </a-form-item>-->
-<!--            <a-form-item label="联系电话">-->
+            <!--            <a-form-item label="企业域名">-->
-<!--              <a-space class="justify ele-text-secondary">-->
+            <!--              <a-space class="justify ele-text-secondary">-->
-<!--                <span>{{ form.phone }}</span>-->
+            <!--                <span>{{ form.domain ? form.domain : '-' }}</span>-->
-<!--              </a-space>-->
+            <!--                <a @click="onEdit('企业域名', 'domain', form.domain)">修改</a>-->
-<!--            </a-form-item>-->
+            <!--              </a-space>-->
-<!--            <a-form-item label="电子邮箱">-->
+            <!--            </a-form-item>-->
-<!--              <a-space class="justify ele-text-secondary">-->
+            <!--            <a-form-item label="联系电话">-->
-<!--                <span>{{ form.email }}</span>-->
+            <!--              <a-space class="justify ele-text-secondary">-->
-<!--              </a-space>-->
+            <!--                <span>{{ form.phone }}</span>-->
-<!--            </a-form-item>-->
+            <!--              </a-space>-->
+            <!--            </a-form-item>-->
+            <!--            <a-form-item label="电子邮箱">-->
+            <!--              <a-space class="justify ele-text-secondary">-->
+            <!--                <span>{{ form.email }}</span>-->
+            <!--              </a-space>-->
+            <!--            </a-form-item>-->
             <a-divider style="padding-bottom: 20px" />
             <a-form-item label="用户数量">
               <a-space class="justify ele-text-secondary">
@@ -139,9 +154,9 @@
             <a-form-item label="存储空间">
               <a-space class="justify ele-text-secondary">
                 <span>{{ getFileSize(form.storage) }}</span>
-<!--                <span>{{ getFileSize(form.storage) }}/{{-->
+                <!--                <span>{{ getFileSize(form.storage) }}/{{-->
-<!--                    getFileSize(form.storageMax)-->
+                <!--                    getFileSize(form.storageMax)-->
-<!--                  }}</span>-->
+                <!--                  }}</span>-->
               </a-space>
 
             </a-form-item>
@@ -155,24 +170,24 @@
             <a-form-item label="模版ID" v-if="form.planId > 0">
               <span class="ele-text-heading ele-text-secondary">{{ form.planId }}</span>
             </a-form-item>
-<!--            <a-form-item label="request合法域名">-->
+            <!--            <a-form-item label="request合法域名">-->
-<!--              <a-space class="justify ele-text-secondary">-->
+            <!--              <a-space class="justify ele-text-secondary">-->
-<!--                <span>{{ form.requestUrl ? form.requestUrl : '-' }}</span>-->
+            <!--                <span>{{ form.requestUrl ? form.requestUrl : '-' }}</span>-->
-<!--                <a @click="onEdit('request合法域名', 'requestUrl', form.requestUrl)">修改</a>-->
+            <!--                <a @click="onEdit('request合法域名', 'requestUrl', form.requestUrl)">修改</a>-->
-<!--              </a-space>-->
+            <!--              </a-space>-->
-<!--            </a-form-item>-->
+            <!--            </a-form-item>-->
-<!--            <a-form-item label="socket合法域名">-->
+            <!--            <a-form-item label="socket合法域名">-->
-<!--              <a-space class="justify ele-text-secondary">-->
+            <!--              <a-space class="justify ele-text-secondary">-->
-<!--                <span>{{ form.socketUrl ? form.socketUrl : '-' }}</span>-->
+            <!--                <span>{{ form.socketUrl ? form.socketUrl : '-' }}</span>-->
-<!--                <a @click="onEdit('socket合法域名', 'socketUrl', form.socketUrl)">修改</a>-->
+            <!--                <a @click="onEdit('socket合法域名', 'socketUrl', form.socketUrl)">修改</a>-->
-<!--              </a-space>-->
+            <!--              </a-space>-->
-<!--            </a-form-item>-->
+            <!--            </a-form-item>-->
-<!--            <a-form-item label="业务域名">-->
+            <!--            <a-form-item label="业务域名">-->
-<!--              <a-space class="justify ele-text-secondary">-->
+            <!--              <a-space class="justify ele-text-secondary">-->
-<!--                <span>{{ form.modulesUrl ? form.modulesUrl : '-' }}</span>-->
+            <!--                <span>{{ form.modulesUrl ? form.modulesUrl : '-' }}</span>-->
-<!--                <a @click="onEdit('业务域名', 'modulesUrl', form.modulesUrl)">修改</a>-->
+            <!--                <a @click="onEdit('业务域名', 'modulesUrl', form.modulesUrl)">修改</a>-->
-<!--              </a-space>-->
+            <!--              </a-space>-->
-<!--            </a-form-item>-->
+            <!--            </a-form-item>-->
             <a-divider style="padding-bottom: 20px" />
             <a-form-item
               v-if="form.tenantId"
@@ -183,18 +198,18 @@
             </a-form-item>
           </a-form>
         </a-tab-pane>
-<!--        <a-tab-pane tab="开发设置" key="developer">-->
+        <!--        <a-tab-pane tab="开发设置" key="developer">-->
-<!--          <a-form-->
+        <!--          <a-form-->
-<!--            :label-col="-->
+        <!--            :label-col="-->
-<!--              styleResponsive-->
+        <!--              styleResponsive-->
-<!--                ? { lg: 2, md: 6, sm: 4, xs: 24 }-->
+        <!--                ? { lg: 2, md: 6, sm: 4, xs: 24 }-->
-<!--                : { flex: '100px' }-->
+        <!--                : { flex: '100px' }-->
-<!--            "-->
+        <!--            "-->
-<!--            :wrapper-col="styleResponsive ? { offset: 1 } : { offset: 1 }"-->
+        <!--            :wrapper-col="styleResponsive ? { offset: 1 } : { offset: 1 }"-->
-<!--            style="margin-top: 20px"-->
+        <!--            style="margin-top: 20px"-->
-<!--          >-->
+        <!--          >-->
-<!--          </a-form>-->
+        <!--          </a-form>-->
-<!--        </a-tab-pane>-->
+        <!--        </a-tab-pane>-->
       </a-tabs>
     </a-card>
     <Field
@@ -205,173 +220,183 @@
       :content="content"
       @done="query"
     />
+    <Version
+      v-model:visible="showVersionForm"
+      :data="form"
+      title="升级套餐"
+      :field="field"
+      :content="content"
+      @done="query"
+    />
   </div>
 </template>
 
 <script lang="ts" setup>
-import {ref, reactive, computed, createVNode} from 'vue';
+import { ref, reactive, computed, createVNode } from "vue";
-  import {Form, message, Modal} from "ant-design-vue";
+import { Form, message, Modal } from "ant-design-vue";
-  import { useUserStore } from '@/store/modules/user';
+import { useUserStore } from "@/store/modules/user";
-  import { storeToRefs } from 'pinia';
+import { storeToRefs } from "pinia";
-  import { useThemeStore } from '@/store/modules/theme';
+import { useThemeStore } from "@/store/modules/theme";
-  import { getCompany, updateCompany, destructionTenant } from "@/api/system/company";
+import { getCompany, updateCompany, destructionTenant } from "@/api/system/company";
-  import Field from './components/field.vue';
+import Field from "./components/field.vue";
+import Version from "./components/version.vue";
 
-  import { FILE_SERVER } from '@/config/setting';
+import { FILE_SERVER } from "@/config/setting";
-  import { assignObject } from 'ele-admin-pro';
+import { assignObject } from "ele-admin-pro";
-import {getFileSize, openUrl} from '@/utils/common';
+import { getFileSize, openUrl } from "@/utils/common";
-  import { Company } from '@/api/system/company/model';
+import { Company } from "@/api/system/company/model";
-  import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
+import { ItemType } from "ele-admin-pro/es/ele-image-upload/types";
-  import { uploadFile } from "@/api/system/file";
+import { uploadFile } from "@/api/system/file";
-  import { logout } from '@/utils/page-tab-util';
+import { logout } from "@/utils/page-tab-util";
-import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
+import { ExclamationCircleOutlined } from "@ant-design/icons-vue";
-import {FileRecord} from "@/api/system/file/model";
+import { FileRecord } from "@/api/system/file/model";
 
 
-  const useForm = Form.useForm;
+const useForm = Form.useForm;
 
-  // 是否开启响应式布局
+// 是否开启响应式布局
-  const themeStore = useThemeStore();
+const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
+const { styleResponsive } = storeToRefs(themeStore);
-  const userStore = useUserStore();
+const userStore = useUserStore();
-  // tab 页选中
+// tab 页选中
-  const active = ref('info');
+const active = ref("info");
-  // 保存按钮 loading
+// 保存按钮 loading
-  const loading = ref(false);
+const loading = ref(false);
-  // 是否显示裁剪弹窗
+// 是否显示裁剪弹窗
-  const visible = ref(false);
+const visible = ref(false);
-  const logo = ref<any>([]);
+const logo = ref<any>([]);
-  const field = ref('');
+const field = ref("");
-  const title = ref('');
+const title = ref("");
-  // 是否显示编辑弹窗
+// 是否显示编辑弹窗
-  const showEdit = ref(false);
+const showEdit = ref(false);
-  const content = ref('请输入要修改的内容');
+const content = ref("请输入要修改的内容");
-  const markdown = ref('请输入应用介绍');
+const markdown = ref("请输入应用介绍");
-  const showMarkdown = ref(false);
+const showMarkdown = ref(false);
-  // 登录用户信息
+const showVersionForm = ref(false);
-  const loginUser = computed(() => userStore.info ?? {});
+// 登录用户信息
+const loginUser = computed(() => userStore.info ?? {});
 
-  // 表单数据
+// 表单数据
-  const form = reactive<Company>({
+const form = reactive<Company>({
   companyId: undefined,
-    shortName: '',
+  shortName: "",
-    companyName: '',
+  companyName: "",
   companyType: undefined,
-    companyLogo: '',
+  companyLogo: "",
-    domain: '',
+  domain: "",
-    phone: '',
+  phone: "",
-    email: '',
+  email: "",
-    InvoiceHeader: '',
+  InvoiceHeader: "",
-    startTime: '',
+  startTime: "",
-    expirationTime: '',
+  expirationTime: "",
   appType: undefined,
   planId: 0,
-    businessEntity: '',
+  businessEntity: "",
   version: undefined,
-    versionName: '',
+  versionName: "",
-    versionCode: '',
+  versionCode: "",
   members: undefined,
   storage: undefined,
   storageMax: undefined,
   users: undefined,
   departments: undefined,
-    country: '',
+  country: "",
-    province: '',
+  province: "",
-    city: '',
+  city: "",
-    region: '',
+  region: "",
-    address: '',
+  address: "",
-    comments: '',
+  comments: "",
   authentication: undefined,
   industryParent: undefined,
   industryChild: undefined,
   status: undefined,
   userId: undefined,
   tenantId: undefined,
-    tenantCode: '',
+  tenantCode: "",
-    modules: '',
+  modules: "",
-    requestUrl: '',
+  requestUrl: "",
-    socketUrl: '',
+  socketUrl: "",
-    serverUrl: '',
+  serverUrl: "",
-    modulesUrl: '',
+  modulesUrl: "",
   code: undefined,
-    createTime: '',
+  createTime: "",
-    updateTime: ''
+  updateTime: ""
-  });
+});
-  // 省市区
+// 省市区
-  // const city = ref<string[]>([
+// const city = ref<string[]>([
-  //   String(loginUser.value.province),
+//   String(loginUser.value.province),
-  //   String(loginUser.value.city),
+//   String(loginUser.value.city),
-  //   String(loginUser.value.region)
+//   String(loginUser.value.region)
-  // ]);
+// ]);
 
-  // 省市区
+// 省市区
-  // const industry = ref<string[]>([
+// const industry = ref<string[]>([
-  //   String(loginUser.value.province),
+//   String(loginUser.value.province),
-  //   String(loginUser.value.city),
+//   String(loginUser.value.city),
-  //   String(loginUser.value.region)
+//   String(loginUser.value.region)
-  // ]);
+// ]);
 
-  // 表单验证规则
+// 表单验证规则
-  const rules = reactive({
+const rules = reactive({
   username: [
     {
       required: true,
-        message: '请输入昵称',
+      message: "请输入昵称",
-        type: 'string'
+      type: "string"
     }
   ],
   phone: [
     {
       required: true,
-        message: '请输入昵称',
+      message: "请输入昵称",
-        type: 'string'
+      type: "string"
     }
   ],
   nickname: [
     {
       required: true,
-        message: '请输入昵称',
+      message: "请输入昵称",
-        type: 'string'
+      type: "string"
     }
   ],
   email: [
     {
       required: true,
-        message: '请输入邮箱',
+      message: "请输入邮箱",
-        type: 'string'
+      type: "string"
     }
   ]
-  });
+});
 
-  const onEdit = (label, name, text) => {
+const onEdit = (label, name, text) => {
   title.value = label;
   field.value = name;
   content.value = text;
   showEdit.value = true;
-  };
+};
 
-  const chooseFile = (data: FileRecord) => {
+const chooseFile = (data: FileRecord) => {
   logo.value.push({
     uid: data.id,
     url: data.thumbnail,
-      status: 'done'
+    status: "done"
   });
   form.companyLogo = data.thumbnail;
   updateCompany(form).then(res => {
-      message.success('上传成功');
+    message.success("上传成功");
-    })
+  });
-  };
+};
 
-  const onDeleteItem = (index: number) => {
+const onDeleteItem = (index: number) => {
   logo.value.splice(index, 1);
-    form.companyLogo = '';
+  form.companyLogo = "";
-  };
+};
 
-  const onUpload = (d: ItemType) => {
+const onUpload = (d: ItemType) => {
   const file = d.file;
-    if(file){
+  if (file) {
     if (file.size / 1024 > 100) {
-        message.error('大小不能超过 100k');
+      message.error("大小不能超过 100k");
       return;
     }
   }
@@ -379,35 +404,50 @@ import {FileRecord} from "@/api/system/file/model";
     .then((result) => {
       form.companyLogo = result.url;
       updateCompany(form).then(res => {
-          message.success('上传成功');
+        message.success("上传成功");
-        })
+      });
 
     })
     .catch((e) => {
       message.error(e.message);
     });
-  };
+};
 
-  const destruction = (tenantId) => {
+/**
+ * 升级套餐
+ */
+const updateVersion = (version: any) => {
+  if(version === 30){
+    return ;
+  }
+  if(version === 20){
+    showVersionForm.value = true;
+  }
+  if(version === 10){
+    showVersionForm.value = true;
+  }
+};
+
+const destruction = (tenantId) => {
   Modal.confirm({
-      title: '确定要销毁吗?',
+    title: "确定要销毁吗?",
-      content: '销毁后，当前租户的相关数据将永久删除,且不可恢复，请谨慎操作！',
+    content: "销毁后，当前租户的相关数据将永久删除,且不可恢复，请谨慎操作！",
     icon: createVNode(ExclamationCircleOutlined),
     maskClosable: true,
     onOk: () => {
-        const hide = message.loading('正在销毁相关数据请等待...', 0);
+      const hide = message.loading("正在销毁相关数据请等待...", 0);
       setTimeout(() => {
         destructionTenant(tenantId).then(() => {
           logout();
-          })
+        });
       }, 5000);
 
     }
   });
 
-  }
+};
 
-  const query = () => {
+const query = () => {
   logo.value = [];
   getCompany().then((response) => {
     console.log(response.companyLogo);
@@ -415,24 +455,27 @@ import {FileRecord} from "@/api/system/file/model";
       logo.value.push({
         uid: 1,
         url: response.companyLogo,
-          status: 'done'
+        status: "done"
       });
     }
     assignObject(form, response);
   });
-  };
+};
 
-  query();
+query();
 </script>
 
 <script lang="ts">
-  export default {
+export default {
-    name: 'SystemProfile'
+  name: "SystemProfile"
-  };
+};
 </script>
 <style>
-  .justify{
+.justify {
   display: flex !important;
   justify-content: space-between;
-  }
+}
+.cursor-pointer{
+  cursor: pointer;
+}
 </style>

tailwind.config.js

@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
+  theme: {
+    extend: {}
+  },
+  plugins: [],
+  corePlugins: {
+    preflight: false
+  }
+};