Commit 944654c1 authored by jiaxu.yan's avatar jiaxu.yan

Merge branch 'developer/yanjiaxu' into develop

# Conflicts:
#	README.md
parents 6c1595ff cd436e41
## 开发
```bash
# 克隆项目
git clone https://gitee.com/y_project/RuoYi-Vue
# 进入项目目录
cd ruoyi-ui
# 安装依赖
npm install
# 建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npmmirror.com
# 启动服务
npm run dev
# 代码风格确定
## 组件化
如果我们将一个页面中所有的处理逻辑全部放在一起,处理起来就会变得非常复杂,而且不利于后续的管理以及扩展。
但如果,我们将一个页面拆分成一个个小的功能块,每个功能块完成属于自己这部分独立的功能,那么之后整个页面的管理和维护就变得非常容易。
​它提供了一种抽象,让我们可以开发出一个个独立可复用的小组件来构造我们的应用。
任何的应用都会被抽象成一颗组件树。
组件化思想的应用:
​有了组件化的思想,我们在之后的开发中就要充分
尽可能的将页面拆分成一个个小的、可复用的组件
这样让我们的代码更加方便组织和管理,并且扩展性也更强
### 具体实现
对每个子页面进行拆分,并在主页面进行引用,个个子组件只完成当前子页面的功能,主页面负责衔接个个子组件,
## 逻辑函数化
对一个功能的实现,往往要有多个函数。而这些函数全部放在一个方法里会降低代码的可读性,项目会显得臃肿,某些地方会造成强耦合形成屎山
造成后续维护只能添加逻辑,原先的逻辑没人能维护的尴尬状况
### 函数柯里化
柯里化(Currying)是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数且返回结果的新函数的技术。这个技术以逻辑学家 Haskell Curry 命名的
什么意思?简单来说,柯里化是一项技术,它用来改造多参数的函数。比如:
```javascript
// 这是一个接受3个参数的函数
const add = function(x, y, z) {
return x + y + z
}
```
我们将它变换一下,可以得到这样一个函数:
```javascript
// 接收一个单一参数
const curryingAdd = function(x) {
// 并且返回接受余下的参数的函数
return function(y, z) {
return x + y + z
}
}
```
这样有什么区别呢?从调用上来对比:
```javascript
// 调用add
add(1, 2, 3)
浏览器访问 http://localhost:80
// 调用curryingAdd
curryingAdd(1)(2, 3)
// 看得更清楚一点,等价于下面
const fn = curryingAdd(1)
fn(2, 3)
```
可以看到,变换后的的函数可以分批次接受参数,先记住这一点,下面会讲用处。甚至fn(curryingAdd返回的函数)还可以继续变换:
```javascript
const curryingAdd = function(x) {
return function(y) {
return function(z) {
return x + y + z
}
}
}
```
// 调用
```javascript
curryingAdd(1)(2)(3)
// 即
const fn = curryingAdd(1)
const fn1 = fn(2)
fn1(3)
```
上面的两次变换过程,就是函数柯里化
### 函数复用
若是项目的组件中有多处地方采用同一种方式进行处理,例如处理如期格式化,校验规则,文件上传之类我们可以将这些复用较高的代码进行抽象
### 具体实现
我们可以在 src/utils 文件夹下收集这种可以重复使用的函数。根据其性质或者功能点进行归类,总结出自己的工具库
这是对后续项目大有帮助的
对已有公用组件的一些说明
### 列表页面函数集合组件
mixins/page.js
对列表页面的查询和加载,分页进行了一定程度的封装
在页面中通过
```javascript
import page from '@/mixins/page'
export default {
...
mixins: [page],
...
}
```
#### 参数说明
```javascript
listUrl: '',
//列表接口地址
queryParams: {
//接口所需参数
pageNum: 1,
//当前的页数
pageSize: 10
//分页的页数
},
tableId: false,
loading: false,
//是否显示加载
showSearch: true,
// 显示搜索条件
refreshTable: true,
// 重新渲染表格状态
tableData: [],
// 返回数据
total: 0
// 返回数据总条数
```
#### 方法介绍
```javascript
// 重制参数
resetQuery() {
},
//根据参数加载
handleQuery() {
},
//加载数据
loadData() {
}
## 发布
```
### 根据resful 规范衍生的对单一数据增删改查组件
```bash
# 构建测试环境
npm run build:stage
在页面中调用
```javascript
data() {
return {
...
model: this.$modelDataSource({
url: '/system/enterprise',//接口根地址
dataKey: 'model',
attributes: { //你需要获取的参数
id: ''
}
})
...
}
}
# 构建生产环境
npm run build:prod
```
```javascript
this.model.reset() //重置
this.model.fetch( // 根据id获取单条数据
newValue,
{}, //其他参数
(success) => { //成功回调
},
(err) => { //失败回调
}
)
```
\ No newline at end of file
import request from '@/utils/request'
/**
* 创建场景变更任务
* @param {} data
* @returns
*/
export function createScene(data) {
return request({
url: '/review/scene/change/task/create',
method: 'post',
data
})
}
import request from '@/utils/request'
// 获取任务详情
export function taskDetail(data) {
return request({
url: '/system/review/task/view',
method: 'post',
data
})
}
/**
* 细则提交
* @param {*} data
* @returns
*/
export function reviewDetailsSubmit(data) {
return request({
url: '/review/details/result/save',
method: 'post',
data
})
}
// 提交审查问卷
export function taskSubmit(data) {
return request({
url: '/system/review/task/submit',
method: 'post',
data
})
}
\ No newline at end of file
......@@ -138,7 +138,7 @@ export default {
data() {
return {
pageType: '1',
listUrl: '/finishTasklist',
listUrl: '/system/review/task/findInFinish',
showSearch: true,
tableData: []
}
......
......@@ -70,26 +70,26 @@
开始时间
</div>
<div class="cell-value">
{{ item.startTime ? item.startTime : '---' }}
{{ item.taskBeginTime ? parseTime(item.taskBeginTime) : '---' }}
</div>
</div>
<div class="card-cell">
<div class="cell-lable">任务编号</div>
<div class="cell-value">
{{ item.missionNo ? item.missionNo : '---' }}
{{ item.taskNo ? item.taskNo : '---' }}
</div>
</div>
<div class="card-cell">
<div class="cell-lable">任务名称</div>
<div class="cell-value">
{{ item.tit ? item.tit : '---' }}
{{ item.name ? item.name : '---' }}
</div>
</div>
<div class="card-cell">
<div class="cell-lable">任务组长</div>
<div class="cell-value">
<i class="el-icon-user"></i>
{{ item.owener ? item.owener : '---' }}
{{ item.leader ? item.leader : '---' }}
</div>
</div>
<div v-if="!isSysReview" class="card-cell">
......@@ -154,9 +154,9 @@
</div>
<div v-if="isSysReview" class="card-cell">
<div class="cell-lable">任务状态</div>
<div v-if="item.costTime === 0" class="cell-value">● 未开始</div>
<div v-else class="cell-value yellow">
● 已耗时({{ item.costTime }}小时)
<div v-if="item.taskStatus === 'NEW'" class="cell-value">● 未开始</div>
<div v-if="item.taskStatus === 'PENDING'" class="cell-value yellow">
● 已耗时({{ getHourDiff(item.taskBeginTime) }}小时)
</div>
</div>
<div v-if="isSysReview" class="card-cell">
......@@ -165,16 +165,13 @@
<el-link
v-if="item.progress === 0"
type="primary"
@click="handleReviewForm"
@click="handleReviewForm(item.id)"
>查看检查表单</el-link
>
<el-link
v-else-if="item.progress < 90"
type="primary"
@click="handleReviewQuestionnaire"
>填写审查问卷</el-link
>
<el-link v-else type="primary" @click="handleConfirmFindings"
><br />
<el-link type="primary" @click="handleReviewQuestionnaire(item.id)"
>填写检查表单</el-link
><br />
<el-link type="primary" @click="handleConfirmFindings(item.id)"
>确认审查结果</el-link
>
</div>
......@@ -195,6 +192,7 @@
icon="el-icon-arrow-right"
circle
title="任务详情"
@click="goDetail(item.id)"
></el-button>
<el-button
type="warning"
......@@ -228,11 +226,12 @@
@click="handleFileLibrary(item)"
></el-button>
<el-button
v-if="item.progress === 0"
v-if="item.taskStatus === 'NEW'"
type="danger"
icon="el-icon-video-play"
circle
title="开始"
@click="startTask(item)"
></el-button>
</div>
</div>
......@@ -255,6 +254,7 @@
<script>
import page from '@/mixins/page'
import taskDialog from './components/dialog'
import request from '@/utils/request'
export default {
dicts: ['sys_job_status', 'sys_scene_type', 'task_type'],
components: { taskDialog },
......@@ -273,7 +273,7 @@ export default {
},
dialogVisible: false,
pageType: '1', // 代办任务类型 1-体系审查 其他-车型测评
listUrl: '/tasklist',
listUrl: '/system/review/task/findInProcess',
showSearch: true,
tableData: []
}
......@@ -307,6 +307,24 @@ export default {
path: '/processing/fileLibrary'
})
},
startTask(item) {
request({
url: '/system/review/task/start',
method: 'post',
data: {
taskId: item.id
}
}).then(res => {
console.log(res)
this.loadData()
})
},
goDetail(id) {
this.$router.push({
path: '/task/task-detail?id=' + id
})
},
closeDialog() {
this.dialogVisible = false
},
......@@ -320,9 +338,9 @@ export default {
path: '/processing/reviewReport'
})
},
handleReviewQuestionnaire() {
handleReviewQuestionnaire(id) {
this.$router.push({
path: '/processing/write-check-form'
path: '/processing/write-check-form?id=' + id
})
},
handleReviewForm() {
......@@ -337,9 +355,9 @@ export default {
path: '/processing/review-form'
})
},
handleConfirmFindings() {
handleConfirmFindings(id) {
this.$router.push({
path: '/processing/confirm-result'
path: '/processing/confirm-result?id=' + id
})
},
handleTaskContent(msg) {
......@@ -348,6 +366,19 @@ export default {
path: '/processing/vehicle-type'
})
}
},
getHourDiff(time) {
// 获取当前时间
var now = new Date()
// 设置目标时间(这里为2021年9月30日)
var targetTime = new Date(time) // 注意月份从0开始计数,所以8表示九月
// 计算时间差(单位为毫秒)
var timeDiff = Math.abs(targetTime - now)
// 将时间差转换成小时
return Math.floor(timeDiff / (60 * 60 * 1000))
}
}
}
......@@ -363,19 +394,24 @@ export default {
flex-wrap: nowrap;
min-width: 111px;
}
.status-multiple-cell {
width: 150px;
}
.option-cell {
width: 240px;
}
.box-card {
margin-bottom: 15px;
font-size: 14px;
::v-deep .el-card__body {
display: flex;
justify-content: space-between;
}
::v-deep .el-link.is-underline::after {
position: absolute;
right: 0;
......@@ -385,20 +421,25 @@ export default {
border-bottom: 1px solid #1890ff;
content: '';
}
.cell-progress {
width: 200px;
}
.cell-lable {
color: #515a6e;
font-size: 13px;
}
.cell-value {
font-size: 14px;
color: #606266;
}
.cell-value.yellow {
color: #fea623;
}
.cell-value.green {
color: #19be6b;
}
......
<template>
<el-dialog
title="新增场景对话框"
:visible.sync="dialogManger.dialogVisible"
width="35%"
append-to-body
:close-on-click-modal="false"
:close-on-press-escape="false"
:before-close="handleSceneClose"
>
<div class="file-prompt">
<div>
<i
class="el-icon-info"
/>新增场景,需要组织评审,评审通过后新增场景自动进入场景库。
</div>
</div>
<el-form
ref="sceneForm"
:model="sceneForm"
:rules="sceneRules"
label-width="80px"
class="scene-form"
>
<el-form-item label="评审类型" prop="reviewType">
<!-- 下拉框 -->
<el-select
v-model="sceneForm.reviewType"
placeholder="请选择评审类型"
style="width: 100%"
>
<el-option
v-for="item in reviewTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="场景分类" prop="sceneClassification">
<el-select
v-model="sceneForm.sceneClassification"
placeholder="请选择评审类型"
style="width: 100%"
>
<el-option
v-for="item in reviewTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="场景内容" prop="sceneContent">
<el-input
v-model="sceneForm.sceneContent"
maxlength="100"
show-word-limit
type="textarea"
/>
</el-form-item>
<el-form-item label="评审人员" prop="assessor">
<div>组长-xxx</div>
<div>组员-xxx、xxx、xxx</div>
</el-form-item>
<el-form-item label="备注信息" prop="remark">
<el-input
v-model="sceneForm.remark"
maxlength="100"
show-word-limit
type="textarea"
/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="handleSceneClose()">取 消</el-button>
<el-button type="primary" @click="handleSaveNewScene()">
确 定
</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
dicts: ['file_status'],
props: {
dialogManger: {
type: Object,
default() {
return {
dialogVisible: false
}
}
}
},
data() {
return {
sceneForm: {},
sceneRules: {
reviewType: [
{ required: true, message: '请选择评审类型', trigger: 'change' }
],
sceneClassification: [
{ required: true, message: '请选择场景分类', trigger: 'change' }
],
sceneContent: [
{ required: true, message: '请输入场景内容', trigger: 'blur' }
]
},
reviewTypeOptions: []
}
},
methods: {
// 新增场景对话框关闭时触发的回调函数
handleSceneClose() {
this.dialogManger.dialogVisible = false
this.$refs.sceneForm.resetFields()
},
/**
* 保存新场景
*/
handleSaveNewScene() {
// vue表单校验vue表单校验
this.$refs.sceneForm.validate(valid => {
if (valid) {
this.handleSceneClose()
}
})
}
}
}
</script>
......@@ -29,7 +29,7 @@
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="任务编码" prop="status">
<el-input v-model="model.status" placeholder="请输入" clearable />
<el-input v-model="model.taskNo" placeholder="请输入" clearable />
</el-form-item>
</el-col>
<el-col :span="8">
......@@ -237,6 +237,7 @@
</template>
<script>
import image from '@/assets/images/login-background.jpg'
import request from '@/utils/request'
export default {
data() {
return {
......@@ -256,8 +257,23 @@ export default {
}
}
},
mounted() {
this.getTask(this.$route.query.id)
console.log(this.$route.query.id)
},
dicts: ['sys_task_status', 'sys_pro'],
methods: {
getTask(id) {
request({
url: '/system/review/task/view',
method: 'post',
data: {
taskId: id
}
}).then(res => {
console.log(res)
})
},
handleAvatarSuccess(res, file) {
this.imageUrl = URL.createObjectURL(file.raw)
},
......
......@@ -314,6 +314,7 @@
</page-standard>
</template>
<script>
import { taskDetail } from '@/api/task/task'
export default {
dicts: ['sys_task_status', 'sys_pro'],
data() {
......@@ -323,30 +324,8 @@ export default {
formType: 1,
/* 表单对象*/
model: {
no: '12345',
status: '资产审查任务',
taskStatus: '1',
pname: '广汽丰田',
carType: '油车',
weituo: '广汽丰田汽车有限公司',
weituoAddress: '广州市南沙区黄阁镇市南大道8号',
phonenumber: '15320986678',
youzheng: '233546',
type: '小型车',
shibie: 'ZGH6788',
yangpin: '全新第四代汉兰达',
shengchan: '广汽丰田汽车有限公司',
songyangzhe: '赵平',
songyangdata: '2023-08-05',
shangbiao: 'ZGH6788',
shuliang: '200',
riqi: '2022-12-23',
yijv: 'ZGH6788',
jianyan: '广汽丰田汽车有限公司',
qianfa: '2023-11-02',
bianhao: '91440101717852200L',
jielun:
'广汽丰田汽车有限公司(GAC TOYOTA),成立于2004年9月1日,由广汽集团股份有限公司与日本丰田汽车公司各出资50%组建,合作期限30年,注册资本16.92亿元。 公司位于中国极具活力的珠三角的几何中心--广州南沙区,占地面积187万平方米,建筑面积40万平方米,起步产能20万辆/年。共有员工5500余人,其中大专及其以上学历者达24.9%,平均年龄为26岁。'
systemReviewTask: {},
reviewSceneChangeTasks: {}
},
loading: false,
/* 表格对象*/
......@@ -463,7 +442,20 @@ export default {
]
}
},
mounted() {
this.getTask(this.$route.query.id)
console.log(this.$route.query.id)
},
methods: {
getTask(id) {
taskDetail({
taskId: id
}).then(res => {
if (res.code === 200) {
this.model = res.data
}
})
},
/**
* 小组信息修改
* @param row 行内信息
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment