71 lines
2.3 KiB
Markdown
71 lines
2.3 KiB
Markdown
#### 介绍
|
||
|
||
```
|
||
Vue 3 + TypeScript + Vite这个模板可以帮助您开始使用Vue 3和TypeScript在Vite中进行开发。该模板使用了Vue 3的<script setup>单文件组件，请查看script setup文档了解更多信息。
|
||
```
|
||
|
||
#### 安装依赖&运行项目
|
||
|
||
> node version:^18.17.0 || >=20.5.0"
|
||
|
||
```shell
|
||
#项目使用pnpm包管理器
|
||
npm i pnpm -g
|
||
|
||
#安装依赖
|
||
pnpm i
|
||
|
||
#运行项目
|
||
npm run dev
|
||
|
||
#因海南和冀北技术监督不同 通过修改文件的方式来区分
|
||
#海南打包 需要吧pqs目录下supervise_hn 文件夹改成supervise 原文件改成supervise_jb
|
||
#冀北打包 需要吧pqs目录下supervise_jb 文件夹改成supervise 原文件改成supervise_hn
|
||
```
|
||
|
||
#### 页面编写-示例
|
||
|
||
```
|
||
基础页面写法请查看`src/template`下的readme.md
|
||
```
|
||
|
||
#### 开发规范
|
||
|
||
> 初衷：养成合理的习惯，精力留在技术调研、业务开发中。
|
||
>
|
||
> 常见点如下描述，更多的规范待前端开发人员有时间后，慢慢丰富。
|
||
|
||
- 命名风格：所有的包（文件夹）、文件名以小驼峰的风格命名，比如 xxxAaa，禁止 XxxAaa 或者 xxx-aaa。
|
||
- 命名语义：禁止中文命名或拼音，英文命名借用下工具，稍微准确一点，不要与实际业务相差太远。
|
||
- 功能组件创建风格：以**功能名称**命名文件夹，每个功能下以**index.vue**作为该功能的组件入口。正确示例参考：/src/views/auth/menu/index.vue。
|
||
|
||
|
||
|
||
- todo...：待后续补充。
|
||
|
||
#### 开发助手
|
||
|
||
##### 1、表格系列
|
||
|
||
- 页面表格以及表格页面按钮的弹出等功能参考：/views/pqs/voltageSags/sagGovern/index.vue
|
||
- 表格中需要替换数据：
|
||
|
||
```js
|
||
// 通过formatter函数返回实际需要返回的值
|
||
{
|
||
title: '数据来源', field: 'dataSource', minWidth: '130',
|
||
formatter: (row: any) => {
|
||
return row.dataSource == 0 ? '离线导入' : '监测点同步'
|
||
}
|
||
}****
|
||
```
|
||
|
||
##### 2、样式系列
|
||
|
||
- 获取当前主体的高度：import { mainHeight } from '@/utils/layout'
|
||
- 弹框内输入框长度设置 1 行 1 个 class="form-one" 1 行 2 个 class="form-two"
|
||
|
||
#### 依赖变更记录
|
||
|
||
- 2024-04-25 新增 vform3，by 洪圣文，用于页面表单设计保存为 json，命令：pnpm i vform3-builds
|