项目管理平台前端改造

淩亂°似流年 2022-09-14 15:24 139阅读 0赞

# 一 项目名称 #

项目重命名为 vue-sdgt

# 二 修改 E:\\vue-sdgt\\package.json #

{
      "name": "vue-sdgt",
      "version": "3.8.0",
      "license": "MIT",
      "description": "业务数据生成工具",
      "author": "798103175@@qq.com>",
      "scripts": {
        "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
        "start": "npm run dev",
        "build": "node build/build.js",
        "build:report": "npm_config_report=true npm run build",
        "lint": "eslint --ext .js,.vue src",
        "test": "npm run lint",
        "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml"
      },

# 三 端口号修改 #

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_20_color_FFFFFF_t_70_g_se_x_16][]

#  四 项目目录说明 #

> .
> 
> ├── build // 构建脚本
> 
> ├── config // 全局配置
> 
> ├── node\_modules // 项目依赖模块
> 
> ├── src // 项目源代码
> 
> ├── static // 静态资源
> 
> └── package.jspon // 项目信息和依赖配置
> 
> src
> 
> ├── api // 各种接口
> 
> ├── assets // 图片等资源
> 
> ├── components // 各种公共组件，非公共组件在各自 view 下维护
> 
> ├── icons // svg icon
> 
> ├── router // 路由表
> 
> ├── store // 存储
> 
> ├── styles // 各种样式
> 
> ├── utils // 公共工具，非公共工具，在各自 view 下维护
> 
> ├── views // 各种 layout
> 
> ├── App.vue // 项目顶层组件
> 
> ├── main.js // 项目入口文件
> 
> └── permission.js  // 认证入口

# 五 页面其他修改 #

### 1 标题 ###

修改 E:\\vue-sdgt\\index.html

<!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <title>业务数据生成工具</title>
      </head>
      <body>
        <div id="app"></div>
        
      </body>
    </html>

### 2 国际化设置 ###

修改 E:\\vue-sdgt\\src\\main.js

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_17_color_FFFFFF_t_70_g_se_x_16][]

### 3 导航栏文字 ###

修改 E:\\vue-sdgt\\src\\views\\layout\\components\\Navbar.vue

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_20_color_FFFFFF_t_70_g_se_x_16 1][]

### 4 面包屑文字 ###

修改 E:\\vue-sdgt\\src\\components\\Breadcrumb\\index.vue

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_19_color_FFFFFF_t_70_g_se_x_16][]

### 5 关闭校验 ###

修改 E:\\vue-sdgt\\config\\index.js

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_15_color_FFFFFF_t_70_g_se_x_16][]

### 6 复制图标 ###

将 vue-element-admin/src/icons/svg 中的图标复制到本项目中

# 六 修改后看到的一些效果 #

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_20_color_FFFFFF_t_70_g_se_x_16 2][]

[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_20_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/dc89bfa6eb0141bd971c802d0a165184.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_17_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/f38ee6d082084edea824a943f69739f3.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_20_color_FFFFFF_t_70_g_se_x_16 1]: /images/20220828/a530eb56117c4535a806068cb1038add.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_19_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/c07034014e5245faa53965557ed96498.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_15_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/d58f73eadff94a0cabffdec62e62bf50.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBAY2hlbmdxaXVtaW5n_size_20_color_FFFFFF_t_70_g_se_x_16 2]: /images/20220828/325412bdb3af440dab23a383ac3ac7a4.png