Skip to content

T
template_vue
Commit c4634bc9 authored by kzy's avatar kzy
Browse files
Options

Merge branch 'project1' of http://gitlab.91isoft.com:90/yangshuo/template_vue into project1

parents a44a1868 056338e4
Hide whitespace changes
Inline Side-by-side
Showing with 424 additions and 139 deletions
src/api/processLibrary/InventoryRecord.js 0 → 100644
View file @ c4634bc9
import request from '@/utils/request'
export function listLog() {
return request({
url: '/wbwarehouselog/queryWbWarehouseLogs',
method: 'get'
})
}
src/components/Table/AllTableArguments/BaseTableArguments.js 0 → 100644
View file @ c4634bc9
// TODO: 查询条件 (检查查询条件的类型）
export function queryParamsType(pageNum, pageSize, pageTotal) {
if (typeof pageNum !== 'number' && typeof pageSize !== 'number' && typeof pageTotal !== 'number') {
console.warn('queryParams查询参数的type类型错误!请检查后重新赋值')
return null
} else {
this.pageNum = pageNum
this.pageSize = pageSize
this.pageTotal = pageTotal
}
}
// TODO: 操作选项的类型判断
export function operationType(type, label, icon, color, buttonClick, isShow) {
this.type = type
this.label = label
this.icon = icon
this.color = color
this.buttonClick = buttonClick | function() {}
this.isShow = isShow | function(row, $index) {
return true
}
}
// TODO: 列的类型以及参数判断
export function columnDataType(text, status, ownDefined, isSwitch, image, isOperation, prop, label, width, align, operation) {
this.text = text
this.status = status
this.ownDefined = ownDefined
this.isSwitch = isSwitch
this.image = image
this.isOperation = isOperation
this.prop = prop
this.label = label
this.width = width
this.align = align
if (operation instanceof operationType) {
this.operations = operationType
} else {
console.warn('operation参数的type类型错误!请检查后重新赋值')
}
}
// TODO: 组件表单所需的所有参数
export function BaseTableArguments(selection, loading, processList, queryParams, columnData) {
// TODO: 选择框是否需要存在 (selection判断表单选择框是否需要存在)
if (typeof selection !== 'boolean') {
console.warn('selection下拉框参数的type类型错误!请检查后重新赋值')
} else {
this.selection = selection
// TODO: 选择框 (根据条件是否可选)
this.selectable = (row, index) => {
if (row.isSwitch) {
return true
}
}
}
// TODO: 加载进度 (判断是否显示加载进度)
if (typeof loading !== 'boolean') {
console.warn('loading进度条参数的type类型错误!请检查后重新赋值')
} else {
this.loading = loading
}
// TODO: 查询参数 (判断查询条件是否符合类型)
if (queryParams instanceof queryParamsType) {
this.queryParams = queryParamsType
}
// TODO: 每一列的参数
if (columnData instanceof columnDataType) {
this.columnData = columnData
}
this.processList = processList
}
// TODO: 组件表单所需的所有参数
export function BaseTableArgumentsTest(selection, loading, processList, queryParams, columnData) {
// TODO: 选择框是否需要存在 (selection判断表单选择框是否需要存在)
if (typeof selection !== 'boolean') {
console.warn('selection下拉框参数的type类型错误!请检查后重新赋值')
} else {
this.selection = selection
// TODO: 选择框 (根据条件是否可选)
this.selectable = (row, index) => {
if (row.isSwitch) {
return true
}
}
}
// TODO: 加载进度 (判断是否显示加载进度)
if (typeof loading !== 'boolean') {
console.warn('loading进度条参数的type类型错误!请检查后重新赋值')
} else {
this.loading = loading
}
// TODO: 查询参数 (判断查询条件是否符合类型)
if (queryParams instanceof queryParamsType) {
this.queryParams = queryParamsType
}
this.columnData = columnData
this.processList = processList
}
src/components/Table/AllTableArguments/processTable.js 0 → 100644
View file @ c4634bc9
export function processTableArguments(processList, queryParams, nIndex, loading) {
this.processList = processList
this.queryParams = queryParams
this.nIndex = nIndex
this.loading = loading
}
src/components/Table/BaseTable/index.vue 0 → 100644
View file @ c4634bc9
<template>
<div>
<div class="mb12 font-small-bold">{{ allTableArguments.listName }}</div>
<div class="tableList" style="height:600px;">
<el-scrollbar style="height: 100%;">
<el-table
v-loading="allTableArguments.loading"
class="processList"
border
:data="allTableArguments.processList"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<!-- <el-table-column type="index" label="序号" width="50" :index="allTableArguments.nIndex" />-->
<!-- <el-table-column label="工序名称" prop="processName" :show-overflow-tooltip="true">-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.processName || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="生产车间" prop="workshop">-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.workshop || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="操作时间" :show-overflow-tooltip="true" align="center" prop="createTime">-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="操作人" prop="createBy" width="210px">-->
<!-- <template slot-scope="scope">-->
<!-- {{ scope.row.createBy || '-' }}-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column-->
<!-- label="操作"-->
<!-- class-name="small-padding fixed-width"-->
<!-- width="180px"-->
<!-- >-->
<!-- <template slot-scope="scope">-->
<!-- <div class="processListBtns">-->
<!-- <el-button :type="typeParent" :size="size" @click="handleDetail(scope.row)">-->
<!-- 详情-->
<!-- </el-button>-->
<!-- <el-button :type="typeParent" :size="size" @click="handleUpdate(scope.row)">-->
<!-- 修改-->
<!-- </el-button>-->
<!-- <el-button :type="typeParent" :size="size" @click="handleDelete(scope.row)">-->
<!-- 删除-->
<!-- </el-button>-->
<!-- </div>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- TODO: 选择框是否开启，selectable控制是否单行禁用 -->
<el-table-column v-if="allTableArguments.columObj.selection" type="selection" :selectable="allTableArguments.columObj.selectable" width="50px" />
<!-- TODO: 普通列 -->
<el-table-column
v-for="(column,columIndex) in allTableArguments.columObj.columnData"
:key="columIndex"
:prop="column.prop"
:label="column.label"
:width="column.width"
:fixed="column.fixed"
:align="column.align || 'center'"
:sortable="column.sortable"
:index="columIndex"
show-overflow-tooltip
>
<template v-slot="{row,$index}">
<!-- 默认展示 -->
<span v-if="column.text && column.editRow !== $index">{{ row[column.prop] || '-' }}</span>
<!-- 状态对象展示 -->
<span v-if="column.status && row[column.prop]">{{ row[column.prop].msg }}</span>
<!-- 自定义内容 -->
<span v-if="column.ownDefined">{{ column.ownDefinedReturn(row,$index) }}</span>
<!-- TODO: 时间数据 -->
<span v-if="column.time">{{ row[column.prop] | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
<!-- switch开关 -->
<el-switch v-if="column.switch" v-model="row[column.prop]" :inactive-text="row[column.prop] ? column.openText:column.closeText" @change="switchChange(row,$index,column.prop)" />
<!-- 图片展示 -->
<el-popover trigger="hover" placement="top" popper-class="popper">
<img v-if="column.image" :src="viewUrl + row[column.prop]" alt="">
<el-image v-if="column.image" slot="reference" :src="viewUrl + row[column.prop]" />
</el-popover>
<!-- 图片数组 -->
<el-popover v-if="column.imageArr" trigger="hover" placement="top" popper-class="popper">
<img v-if="row[column.prop].length>0" :src="row[column.prop][0]" alt="">
<el-image v-if="row[column.prop].length >0" slot="reference" :src="row[column.prop][0]" :preview-src-list="row[column.prop]" />
</el-popover>
<!-- 可编辑input，仅在text默认展示类型才可编辑-->
<el-input v-if="column.editRow === $index" v-model="row[column.prop]" v-focus @blur="editInputBlur(row,$index,column.prop,columIndex)" />
<!-- 操作按钮 -->
<span v-if="column.isOperation" class="processListBtns">
<span v-for="(operations, index) in column.operation" :key="index">
<el-button v-if="operations.isShow(row,$index)" :icon="operations.icon" :type="typeParent" :style="{color:operations.color}" :size="size" @click="operations.buttonClick(row,$index)">{{ operations.label }}</el-button>
</span>
</span>
</template>
</el-table-column>
</el-table>
</el-scrollbar>
<div />
</div>
</div>
</template>
<script>
import {BaseTableArgumentsTest} from '@/components/Table/AllTableArguments/BaseTableArguments'
export default {
name: 'BaseTable',
props: {
allTableArguments: {
type: BaseTableArgumentsTest,
default: () => {
return {
selection: Boolean,
loading: Boolean,
queryParams: Object,
processList: Array,
columnData: Array
}
}
},
allNamed: {
type: Object,
default: () => {
return {
listName: String,
label: {
SerialNumberNamed: String
}
}
}
}
},
data() {
return {
typeParent: 'text',
size: 'mini'
}
},
methods: {
handleDetail(row) {
this.$emit('handle-detail', row)
},
handleUpdate(row) {
this.$emit('handle-update', row)
},
handleDelete(row) {
this.$emit('handle-delete', row)
}
}
}
</script>
<style lang="scss" scoped>
/* TODO: 这里是控制内容列表的样式 */
.processListBtns {
.el-button {
margin: 0 7px;
}
}
/* TODO: 深层穿透，解决底部滚动条问题 */
.tableList{
/deep/ .el-scrollbar__wrap{
overflow-x: hidden;
}
/deep/ .is-horizontal {
display: none;
}
}
</style>
src/views/equipment/boundinout.vue
View file @ c4634bc9
...@@ -83,7 +83,7 @@ ...@@ -83,7 +83,7 @@
</el-form> </el-form>
<div class="placeholder" /> <div class="placeholder" />
<div style="padding:10px"> <div style="padding:10px">
<div class="mb12 font-small-bold">设备受入列表</div> <div class="mb12 font-small-bold">log列表</div>
<!-- <el-table v-loading="loading" border :data="list" @selection-change="handleSelectionChange"> --> <!-- <el-table v-loading="loading" border :data="list" @selection-change="handleSelectionChange"> -->
<!-- <el-table-column type="selection" width="55" align="center" />--> <!-- <el-table-column type="selection" width="55" align="center" />-->
<!-- &lt;!&ndash; <el-table-column type="index" label="序号" width="50" />&ndash;&gt;--> <!-- &lt;!&ndash; <el-table-column type="index" label="序号" width="50" />&ndash;&gt;-->
...@@ -160,37 +160,37 @@ ...@@ -160,37 +160,37 @@
<el-table-column type="index" label="序号" width="80" /> <el-table-column type="index" label="序号" width="80" />
<el-table-column label="工序名称" prop="processCode" :show-overflow-tooltip="true"> <el-table-column label="工序名称" prop="processCode" :show-overflow-tooltip="true">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.processCode || '-' }} {{ scope.row.remarks || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="编码" prop="lot"> <el-table-column label="编码" prop="lot">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.lot || '-' }} {{ scope.row.createBy || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="位置" prop="location"> <el-table-column label="位置" prop="location">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.location || '-' }} {{ scope.row.updateBy || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="位置" prop="location"> <el-table-column label="位置" prop="location">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.location || '-' }} {{ scope.row.delFlag || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="厚度" prop="thickness"> <el-table-column label="厚度" prop="thickness">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.thickness || '-' }} {{ scope.row.flag|| '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建人" prop="createBy"> <el-table-column label="创建人" prop="createBy">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.createBy || '-' }} {{ scope.row.businessId || '-' }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime"> <el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span> <span>{{ scope.row.ptype }}</span>
</template> </template>
</el-table-column> </el-table-column>
...@@ -259,13 +259,14 @@ ...@@ -259,13 +259,14 @@
</template> </template>
<script> <script>
import {cleanLogininfo, delLogininfo, exportLogininfo, list} from '@/api/monitor/loginInfo' import {cleanLogininfo, delLogininfo, exportLogininfo} from '@/api/monitor/loginInfo'
import {listLog} from '@/api/processLibrary/InventoryRecord'
export default { export default {
name: 'LoginInfo', name: 'LoginInfo',
data() { data() {
return { return {
processList: [{ processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '002', lot: 'xxx', location: '位置02', thickness: '70', createBy: '操作员02', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }, { processCode: '001', lot: 'xxx', location: '位置01', thickness: '50', createBy: '操作员01', createTime: new Date() }], processList: [],
endDatePicker: this.handelFixDate(), endDatePicker: this.handelFixDate(),
// 自定义按钮 // 自定义按钮
deletetypePrimary: 'danger', deletetypePrimary: 'danger',
...@@ -369,9 +370,14 @@ export default { ...@@ -369,9 +370,14 @@ export default {
this.loading = true this.loading = true
// const query = Object.assign({}, this.queryParams) // const query = Object.assign({}, this.queryParams)
// query.loginTime = query.loginTime ? this.$parseDate(new Date(query.loginTime), 'YYYY-MM-DD HH:mm:ss') : '' // query.loginTime = query.loginTime ? this.$parseDate(new Date(query.loginTime), 'YYYY-MM-DD HH:mm:ss') : ''
list(this.addDateRange(this.queryParams, this.dateRange)).then(response => { // list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
this.list = response.rows // this.list = response.rows
this.total = response.total // this.total = response.total
// this.loading = false
// })
listLog().then(response => {
this.processList = response.data
this.loading = false this.loading = false
}) })
}, },
......
src/views/processManagement/basicProcessManagement/componets/processTable.vue deleted 100644 → 0
View file @ a44a1868
<template>
<div>
<div class="mb12 font-small-bold">基础工序列表</div>
<div class="tableList" style="height:600px;">
<el-scrollbar style="height: 100%;">
<el-table
v-loading="allTableArguments.loading"
class="processList"
border
:data="allTableArguments.processList.slice((allTableArguments.queryParams.pageNum - 1) * allTableArguments.queryParams.pageSize, allTableArguments.queryParams.pageNum * allTableArguments.queryParams.pageSize)"
style="width: 100%"
@selection-change="handleSelectionChange"
>
<el-table-column type="index" label="序号" width="50" :index="allTableArguments.nIndex" />
<el-table-column label="工序名称" prop="processName" :show-overflow-tooltip="true">
<template slot-scope="scope">
{{ scope.row.processName || '-' }}
</template>
</el-table-column>
<el-table-column label="生产车间" prop="workshop">
<template slot-scope="scope">
{{ scope.row.workshop || '-' }}
</template>
</el-table-column>
<el-table-column label="操作时间" :show-overflow-tooltip="true" align="center" prop="createTime">
<template slot-scope="scope">
<span>{{ scope.row.createTime | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
</template>
</el-table-column>
<el-table-column label="操作人" prop="createBy" width="210px">
<template slot-scope="scope">
{{ scope.row.createBy || '-' }}
</template>
</el-table-column>
<el-table-column
label="操作"
class-name="small-padding fixed-width"
width="180px"
>
<template slot-scope="scope">
<div class="processListBtns">
<el-button :type="typeParent" :size="size" @click="handleDetail(scope.row)">
详情
</el-button>
<el-button :type="typeParent" :size="size" @click="handleUpdate(scope.row)">
修改
</el-button>
<el-button :type="typeParent" :size="size" @click="handleDelete(scope.row)">
删除
</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-scrollbar />
</el-scrollbar>
<div />
</div>
</div>
</template>
<script>
export default {
name: 'ProcessTable',
props: {
allTableArguments: {
type: Object,
default: () => {
return {
processList: [],
queryParams: {},
nIndex: 0,
loading: true
}
}
}
},
data() {
return {
typeParent: 'text',
size: 'mini'
}
},
methods: {
handleDetail(row) {
this.$emit('handle-detail', row)
},
handleUpdate(row) {
this.$emit('handle-update', row)
},
handleDelete(row) {
this.$emit('handle-delete', row)
}
}
}
</script>
<style lang="scss" scoped>
/* TODO: 这里是控制内容列表的样式 */
.processListBtns {
.el-button {
margin: 0 7px;
}
}
/* TODO: 深层穿透，解决底部滚动条问题 */
.tableList{
/deep/ .el-scrollbar__wrap{
overflow-x: hidden;
}
/deep/ .is-horizontal {
display: none;
}
}
</style>
src/views/processManagement/basicProcessManagement/index.vue
View file @ c4634bc9
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
</el-form-item> </el-form-item>
<div style="float: right"> <div style="float: right">
<el-form-item> <el-form-item>
<el-button style="padding: 8px 7px;" :type="typePrimary" :size="smallSize" :icon="addIcon" @btn-click="handleAdd"> <el-button style="padding: 8px 7px;" :type="typePrimary" :size="smallSize" :icon="addIcon" @click="handleAdd">
{{ addName }} {{ addName }}
</el-button> </el-button>
</el-form-item> </el-form-item>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
<!-- TODO: 以下为基础工序管理列表 --> <!-- TODO: 以下为基础工序管理列表 -->
<transition name="fade-transform" mode="out-in"> <transition name="fade-transform" mode="out-in">
<component <component
:is="ProcessTable" :is="BaseTable"
:key="queryParams.pageNum" :key="queryParams.pageNum"
:all-table-arguments="allTableArguments" :all-table-arguments="allTableArguments"
@handle-detail="handleDetail" @handle-detail="handleDetail"
...@@ -104,13 +104,13 @@ ...@@ -104,13 +104,13 @@
<script> <script>
// TODO: 引入封装好的通用table组件 // TODO: 引入封装好的通用table组件
import ProcessTable from '@/views/processManagement/basicProcessManagement/componets/processTable.vue' import BaseTable from '@/components/Table/BaseTable/index.vue'
// TODO: 通过json的形式，优化导入模拟数据，并增加模拟数据的数量 // TODO: 通过json的形式，优化导入模拟数据，并增加模拟数据的数量
const simulateDataList = require('../basicProcessManagement/simulateDataList/simulateProcessList.json') const simulateDataList = require('../basicProcessManagement/simulateDataList/simulateProcessList.json')
export default { export default {
name: 'Role', name: 'Role',
components: { ProcessTable }, components: { BaseTable },
data() { data() {
return { return {
// TODO: 动态按钮类型 // TODO: 动态按钮类型
...@@ -200,22 +200,103 @@ export default { ...@@ -200,22 +200,103 @@ export default {
pageSize: 10, pageSize: 10,
processName: '', processName: '',
workshop: '' workshop: ''
},
// TODO: 用来说明每一列的类型
columObj: {
// 选择框
selection: false,
// 选择框根据条件是否可选
selectable: (row, index) => {
if (row.switchs) {
return true
}
},
lazy: 'true',
// column列,columType(列类型,可选text(默认为普通文字模式),input(input可编辑框),switch(switch开关),image(图片),operation(操作按钮))
// prop(参数),label(列名),width(宽度),align(对齐方式),sortable(是否支持排序)
columnData: [{
text: true,
prop: 'processName',
label: '工序名称'
}, {
text: true,
prop: 'workshop',
label: '生产车间'
},
{
time: true,
prop: 'createTime',
label: '操作时间',
align: 'center'
},
{
text: true,
editRow: null,
prop: 'createBy',
label: '操作人',
sortable: false,
width: '210px'
},
// 如果为操作列,则需要填写需要的操作按钮,类型为Object。operation(操作类型,可选edit,delete,see),type(按钮样式,参考el—botton类型),label(按钮文字)icon(参考el-icon),color(字体颜色)
{
isOperation: true,
label: '操作',
width: '180px',
align: 'center',
sortable: false,
operation: [{
type: this.typeParent,
label: '详情',
icon: '',
color: '',
size: this.size,
buttonClick: this.handleDetail,
isShow: (row, $index) => {
return true
}
}, {
type: this.typeParent,
label: '修改',
icon: '',
color: '',
size: this.size,
buttonClick: this.handleUpdate,
isShow: (row, $index) => {
return true
}
}, {
type: this.typeParent,
label: '删除',
icon: '',
color: '',
size: this.size,
buttonClick: this.handleDelete,
isShow: (row, $index) => {
return true
}
}]
}
]
} }
// DONE:
} }
}, },
computed: { computed: {
ProcessTable() { BaseTable() {
return ProcessTable return BaseTable
}, },
// TODO: 用来汇总Table组件所需要的全部数据并一次性传输给子组件 // TODO: 用来汇总Table组件所需要的全部数据并一次性传输给子组件
allTableArguments() { allTableArguments() {
return { return {
listName: '基础工序列表',
loading: this.loading,
processList: this.processList, processList: this.processList,
queryParams: this.queryParams, queryParams: this.queryParams,
nIndex: this.nIndex, columObj: this.columObj
loading: this.loading
} }
} }
}, },
......
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