# AIS

**Repository Path**: hfq/AIS

## Basic Information

- **Project Name**: AIS
- **Description**: 海上船舶自动识别系统
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2016-11-02
- **Last Updated**: 2022-03-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# echo

> A Vue.js project
## 目录结构

```
|-src
|--assets
|--components
|--pages
|--utils
```
assets: 图片和字体资源

components: vue组件

pages: 标记为v-echo-page的vue组件即为page

utils: echo相关

## 源码说明

app.vue是顶层组件,入口函数

### VueEcho

源码:utils/echo.js

所有关于ais,有3种获取方式:

1. window.$ais
2. vue组件内部:this.$ais
3. import {ais} from './utils/ais.js'

推荐使用第二种

### vue-router

项目中关于页面跳转,使用vue-router(即router-view标签):
app.vue: #mainApp#screen

#### 如何跳转

this.$ais.routeTo

### page说明

标识为v-ais-page即为page页面,意义:需要单独处理按键事件

如果需要增加page，在main.js的router里面增加

#### 关联函数
1. VueAIS.currentPage: 当前页面
2. VueAIS.pushPage: 多层嵌套页面,旧页面压入栈并设置新页面
3. popPage: 当前页面出栈,并恢复旧页面
4. routeTo: vue-router跳转并设置currentPage

### 选项

1. 选项获取函数
  - getOptionValue
  - getOptionValueByPath

  获取失败,返回undefined

  获取成功,返回String类型

2. 选项设置函数
  - setOptionValue
  - setOptionValueByPath

> ByPath函数会查找shortcutTable,比如说获取XTL Line的颜色
```javascript
getOptionValue('menu/display/lines-color', 'xtl-line')
getOptionValueByPath('menu/display/lines-color/xtl-line')
getOptionValueByPath('xtl-line')  // xtl-line在shortcutTable中存在
```

### 按键处理

按键事件分为holdon和click事件,即长按和点击,对应long-press和short-press

#### 按键事件处理流程
1. app.vue触发
2. appPreprocess预处理,触发app.vue的按键事件和anykey
3. currentPage的按键事件和anykey

期间,evt.continue设置为false时,停止事件处理
evt.anykey设置为false时,不触发anykey处理

#### 添加按键事件处理

请参考app.vue中的写法

```javascript
import *  as SpeedLogKey from './utils/echo-key'

[AIS.PWR] (evt) {

}

[AIS.PWR] (evt + 'holdon') {

}

[AIS.ANYKEY] (evt) {

}

[AIS.ANYKEY + 'holdon'] (evt) {

}
```

evt变量
```javascript
let evt = {
  keyname: keyname,
  continue: true,
  anykey: true,
  currentPage: this.$ais.currentPage,
  app: this,
  vm: this,
  holdon: false
}
```

## Build Setup

``` bash
# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# run unit tests
npm run unit

# run e2e tests
npm run e2e

# run all tests
npm test
```

For detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).