mt-ck-00a/mt-ck-wms-ui
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

init

Browse Source
This commit is contained in:
gtz217
2021-09-13 14:56:28 +08:00
commit ac0d6e9083
777 changed files with 90286 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
src/views/basicData/components/CodeRules-add.vue Normal file
View File

@@ -0,0 +1,119 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-03-25 16:23:14
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.CodeRules.RuleName')" prop="name">
<el-input v-model="dataForm.name" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.CodeRules.RuleName')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.CodeRules.RuleCode')" prop="code">
<el-input v-model="dataForm.code" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.CodeRules.RuleCode')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.Abbreviation')" prop="abbreviation">
<el-input v-model="dataForm.abbreviation" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Abbreviation')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.Remarks')" prop="description">
<el-input v-model="dataForm.description" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Remarks')])" clearable />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { CodeRulesDetail, CodeRulesUpdate, CodeRulesAdd, CodeRulesCode } from '@/api/basicData/CodeRules'
export default {
data() {
return {
visible: false,
dataForm: {
id: 0,
name: '',
code: '',
abbreviation: '',
description: ''
},
dataRule: {
name: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.CodeRules.RuleName')]), trigger: 'blur' }
],
code: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.CodeRules.RuleCode')]), trigger: 'blur' }
]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
CodeRulesDetail(this.dataForm.id).then(res => {
this.dataForm.name = res.data.name
this.dataForm.code = res.data.code
this.dataForm.abbreviation = res.data.abbreviation
this.dataForm.description = res.data.description
})
} else {
CodeRulesCode().then(res => {
this.dataForm.code = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'name': this.dataForm.name,
'code': this.dataForm.code,
'abbreviation': this.dataForm.abbreviation,
'description': this.dataForm.description,
'id': this.dataForm.id
}
if (this.dataForm.id) {
CodeRulesUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
CodeRulesAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

128
src/views/basicData/components/CodeRulesAttr-add.vue Normal file
View File

@@ -0,0 +1,128 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-03-25 16:23:24
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.CodeRules.PropertyName')" prop="name">
<el-input v-model="dataForm.name" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.CodeRules.PropertyName')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.CodeRules.PropertyCode')" prop="code">
<el-input v-model="dataForm.code" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.CodeRules.PropertyCode')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.AttributeValue')" prop="value">
<el-input v-model="dataForm.value" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.AttributeValue')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.CodeRules.Length')" prop="codeLength">
<el-input v-model="dataForm.codeLength" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.CodeRules.Length')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.CodeRules.order')" prop="codeOrder">
<el-input v-model="dataForm.codeOrder" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.CodeRules.order')])" clearable />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { CodeRulesAttrDetail, CodeRulesAttrUpdate, CodeRulesAttrAdd, CodeRulesAttrCode } from '@/api/basicData/CodeRulesAttr'
export default {
props: {
codeRuleId: {
type: String,
default: () => ({})
}
},
data() {
return {
visible: false,
dataForm: {
id: 0,
name: '',
code: '',
value: '',
codeOrder: '',
codeLength: ''
},
dataRule: {
name: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.CodeRules.PropertyName')]), trigger: 'blur' }
],
code: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.CodeRules.PropertyCode')]), trigger: 'blur' }
]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
CodeRulesAttrDetail(this.dataForm.id).then(res => {
this.dataForm = res.data
})
} else {
CodeRulesAttrCode().then(res => {
this.dataForm.code = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'name': this.dataForm.name,
'code': this.dataForm.code,
'value': this.dataForm.value,
'codeLength': this.dataForm.codeLength,
'codeOrder': this.dataForm.codeOrder,
'id': this.dataForm.id,
'codeRuleId': this.codeRuleId
}
if (this.dataForm.id) {
CodeRulesAttrUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
CodeRulesAttrAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

187
src/views/basicData/components/CodeRulesAttr.vue Normal file
View File

@@ -0,0 +1,187 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 15:41:11
* @LastEditors: zwq
* @LastEditTime: 2021-03-11 16:44:24
* @Description:
-->
<template>
<div class="app-container">
<div style="margin:10px 50px">
<el-button type="success" @click="goback()">{{ 'btn.back' | i18nFilter }}</el-button>
<el-button type="primary" @click="addNew()">{{ 'btn.add' | i18nFilter }}</el-button>
</div>
<base-table
:page="listQuery.current"
:limit="listQuery.size"
:table-config="tableProps"
:table-data="list"
:is-loading="listLoading"
>
<method-btn
slot="handleBtn"
:width="trueWidth"
:method-list="tableBtn"
@clickBtn="handleClick"
/>
</base-table>
<CodeRulesAttr-add v-if="addOrUpdateVisible" ref="addOrUpdate" :code-rule-id="listQuery.codeRuleId" @refreshDataList="getList" />
</div>
</template>
<script>import i18n from '@/lang'
import { CodeRulesAttrList, CodeRulesAttrDelete } from '@/api/basicData/CodeRulesAttr'
import CodeRulesAttrAdd from './CodeRulesAttr-add.vue'
import BaseTable from '@/components/BaseTable'
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
import { timeFormatter } from '@/filters'
/**
* 表格表头配置项 TypeScript接口注释
* tableConfig<ConfigItem> = []
*
* Interface ConfigItem = {
* prop: string,
* label: string,
* width: string,
* align: string,
* subcomponent: function,
* filter: function
* }
*
*
*/
const tableBtn = [
{
type: 'edit',
btnName: 'btn.edit'
},
{
type: 'delete',
btnName: 'btn.delete'
}
]
const tableProps = [
{
prop: 'createTime',
label: i18n.t('module.basicData.factory.createTime'),
filter: timeFormatter,
align: 'center'
},
{
prop: 'name',
label: i18n.t('module.basicData.CodeRules.PropertyName'),
align: 'center'
},
{
prop: 'code',
label: i18n.t('module.basicData.CodeRules.PropertyCode'),
align: 'center'
},
{
prop: 'value',
label: i18n.t('module.basicData.visual.AttributeValue'),
align: 'center'
},
{
prop: 'codeLength',
label: i18n.t('module.basicData.CodeRules.Length'),
align: 'center'
},
{
prop: 'codeOrder',
label: i18n.t('module.basicData.CodeRules.order'),
align: 'center'
}
]
export default {
name: 'CodeRulesAttr',
components: { BaseTable, MethodBtn, CodeRulesAttrAdd },
filters: {
statusFilter(status) {
const statusMap = {
published: 'success',
draft: 'info',
deleted: 'danger'
}
return statusMap[status]
}
},
data() {
return {
addOrUpdateVisible: false,
tableBtn,
trueWidth: 200,
tableProps,
list: [],
listLoading: true,
listQuery: {
current: 1,
size: 990,
codeRuleId: ''
}
}
},
created() {
this.listQuery.codeRuleId = this.$route.query.id
this.getList()
},
methods: {
handleClick(raw) {
if (raw.type === 'delete') {
this.$confirm(`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.name}]?`, this.$t('module.basicData.visual.Tips'), {
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
type: 'warning'
}).then(() => {
CodeRulesAttrDelete(raw.data.id).then(response => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.getList()
}
})
})
}).catch(() => {})
} else {
this.addNew(raw.data.id)
}
},
getList() {
this.listLoading = true
CodeRulesAttrList(this.listQuery).then(response => {
if (response.data.records) {
this.list = response.data.records
} else {
this.list.splice(0, this.list.length)
}
this.listLoading = false
})
},
// 新增 / 修改
addNew(codeRuleId) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(codeRuleId)
})
},
goback() {
this.$router.go(-1)
}
}
}
</script>
<style scoped>
.edit-input {
padding-right: 100px;
}
.cancel-btn {
position: absolute;
right: 15px;
top: 10px;
}
</style>

144
src/views/basicData/components/EquipmentScrapGrade-add.vue Normal file
View File

@@ -0,0 +1,144 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-07-06 11:26:28
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="140px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.equipment.EquipmentName')" prop="equipmentId">
<el-select v-model="dataForm.equipmentId" filterable :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.equipment.EquipmentName')])" clearable>
<el-option
v-for="item in equipmentArr"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="$t('module.basicData.EquipmentScrapGrade.ScrapGrade')" prop="scrapsGradeId">
<el-select v-model="dataForm.scrapsGradeId" filterable :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.EquipmentScrapGrade.ScrapGrade')])" clearable>
<el-option
v-for="item in scrapsArr"
:key="item.id"
:label="item.dataName"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { EquipmentScrapGradeDetail, EquipmentScrapGradeUpdate, EquipmentScrapGradeAdd } from '@/api/basicData/EquipmentScrapGrade'
import { equipmentInfoList } from '@/api/basicData/Equipment/equipmentInfo'
import { dataDictionaryDataList } from '@/api/basicData/dataDictionary'
export default {
data() {
return {
visible: false,
scrapsArr: [],
equipmentArr: [],
dataForm: {
id: 0,
equipmentId: '',
scrapsGradeId: '',
remark: ''
},
dataRule: {
equipmentId: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.equipment.EquipmentName')]), trigger: 'blur' }
],
scrapsGradeId: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.EquipmentScrapGrade.ScrapGrade')]), trigger: 'change' }
]
}
}
},
methods: {
init(id) {
equipmentInfoList({
current: 1,
size: 999
}).then(response => {
if (response.data.records) {
this.equipmentArr = response.data.records
} else {
this.equipmentArr.splice(0, this.equipmentArr.length)
}
})
dataDictionaryDataList({
current: 1,
size: 999,
dictTypeId: '1412216979622785026'
}).then(response => {
if (response.data.records) {
this.scrapsArr = response.data.records
} else {
this.scrapsArr.splice(0, this.scrapsArr.length)
}
})
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
EquipmentScrapGradeDetail(this.dataForm.id).then(res => {
this.dataForm = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'equipmentId': this.dataForm.equipmentId,
'scrapsGradeId': this.dataForm.scrapsGradeId,
'id': this.dataForm.id
}
if (this.dataForm.id) {
EquipmentScrapGradeUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
EquipmentScrapGradeAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

134
src/views/basicData/components/ProductAttr-add.vue Normal file
View File

@@ -0,0 +1,134 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-04-07 17:00:50
* @Description:
-->
<template>
<el-drawer
:append-to-body="true"
:show-close="false"
:visible.sync="visible"
size="38%"
>
<div slot="title" style=" background-color:#02BCFF;font-size:1.5em;color:white;padding:5px 20px">{{ !dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter }}</div>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.visual.AttributeName')" prop="name">
<el-input v-model="dataForm.name" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.AttributeName')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.AttributeValue')" prop="value">
<el-input v-model="dataForm.value" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.AttributeValue')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.AttributeCode')" prop="code">
<el-input v-model="dataForm.code" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.AttributeCode')])" clearable />
</el-form-item>
</el-form>
<div class="drawer-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</div>
</el-drawer>
</template>
<script>
import { productDetail, productUpdate, productAdd, productCode } from '@/api/basicData/ProductAttr'
export default {
props: {
productId: {
type: String,
default: () => ({})
}
},
data() {
return {
visible: false,
dataForm: {
id: 0,
name: '',
value: '',
code: ''
},
dataRule: {
name: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.visual.AttributeName')]), trigger: 'blur' }
],
code: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.visual.AttributeCode')]), trigger: 'blur' }
]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
productDetail(this.dataForm.id).then(res => {
this.dataForm.name = res.data.name
this.dataForm.value = res.data.value
this.dataForm.code = res.data.code
})
} else {
productCode().then(res => {
this.dataForm.code = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'name': this.dataForm.name,
'value': this.dataForm.value,
'productId': this.productId,
'code': this.dataForm.code,
'id': this.dataForm.id
}
if (this.dataForm.id) {
productUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
productAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>
<style scoped>
.drawer-footer {
width: 100%;
margin-top: 50px;
border-top: 1px solid #e8e8e8;
padding: 10px 50px;
text-align: left;
background: #fff;
}
</style>

252
src/views/basicData/components/ProductPool-add.vue Normal file
View File

@@ -0,0 +1,252 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: gtz
* @LastEditTime: 2021-04-16 15:01:37
* @specifications:
-->
<template>
<el-drawer
:visible.sync="visible"
:show-close="false"
:wrapper-closable="false"
size="65%"
>
<div slot="title" style=" background-color:#02BCFF;font-size:1.5em;color:white;padding:5px 20px">{{ isdetail? 'btn.detail' : !dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter }}</div>
<div style="margin:0 15px">
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.productPool.productName')" prop="name">
<el-input v-model="dataForm.name" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.productPool.productName')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.productPool.productCode')" prop="code">
<el-input v-model="dataForm.code" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.productPool.productCode')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.Specs')" prop="specifications">
<el-input v-model="dataForm.specifications" :disabled="isdetail" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Specs')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.unit')" prop="dictDataId">
<el-select v-model="dataForm.dictDataId" :disabled="isdetail" filterable :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.unit')])" clearable>
<el-option
v-for="item in unitArr"
:key="item.id"
:label="item.dataName"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-form>
<div style="margin:20px">
<el-button type="success" @click="goback()">{{ 'btn.back' | i18nFilter }}</el-button>
<el-button v-if="isdetail" type="primary" @click="goEdit()">{{ 'btn.edit' | i18nFilter }}</el-button>
<span v-if="!isdetail">
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.save' | i18nFilter }}</el-button>
<el-button v-if="listQuery.productId" type="primary" @click="addNew()">{{ 'btn.addattr' | i18nFilter }}</el-button>
</span>
</div>
<div style="height:380px;overflow:auto">
<base-table
:page="listQuery.current"
:limit="listQuery.size"
:table-config="tableProps"
:table-data="list"
>
<method-btn
v-if="!isdetail"
slot="handleBtn"
:method-list="tableBtn"
@clickBtn="handleClick"
/>
</base-table>
</div>
</div>
<product-attr-add v-if="addOrUpdateVisible" ref="addOrUpdate" :product-id="listQuery.productId" @refreshDataList="getList" />
</el-drawer>
</template>
<script>import i18n from '@/lang'
import { ProductPoolDetail, ProductPoolUpdate, ProductPoolAdd, ProductPoolCode, ProductPoolUnit } from '@/api/basicData/ProductPool'
import { productList, productDelete } from '@/api/basicData/ProductAttr'
import BaseTable from '@/components/BaseTable'
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
import productAttrAdd from './ProductAttr-add'
import { timeFormatter } from '@/filters'
const tableBtn = [
{
type: 'delete',
btnName: 'btn.delete'
}
]
const tableProps = [
{
prop: 'createTime',
label: i18n.t('module.basicData.factory.createTime'),
filter: timeFormatter,
align: 'center'
},
{
prop: 'name',
label: i18n.t('module.basicData.visual.AttributeName'),
align: 'center'
},
{
prop: 'value',
label: i18n.t('module.basicData.visual.AttributeValue'),
align: 'center'
},
{
prop: 'code',
label: i18n.t('module.basicData.visual.AttributeCode'),
align: 'center'
}
]
export default {
components: { BaseTable, MethodBtn, productAttrAdd },
data() {
return {
visible: false,
addOrUpdateVisible: false,
tableBtn,
trueWidth: 200,
tableProps,
list: [],
unitArr: [],
dataForm: {
id: 0,
name: '',
code: '',
specifications: '',
dictDataId: ''
},
listQuery: {
current: 1,
size: 10,
productId: ''
},
dataRule: {
name: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.productPool.productName')]), trigger: 'blur' }
],
code: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.productPool.productCode')]), trigger: 'blur' }
]
},
isdetail: false
}
},
methods: {
init(id, isdetail) {
this.isdetail = false
this.isdetail = isdetail
this.dataForm.id = id || ''
this.listQuery.productId = ''
this.list.splice(0, this.list.length)
ProductPoolUnit().then(res => {
this.unitArr = res.data
})
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
ProductPoolDetail(this.dataForm.id).then(res => {
this.dataForm.name = res.data.name
this.dataForm.code = res.data.code
this.dataForm.specifications = res.data.specifications
this.dataForm.dictDataId = res.data.dictDataId
})
this.listQuery.productId = this.dataForm.id
productList(this.listQuery).then(response => {
if (response.data.records) {
this.list = response.data.records
} else {
this.list.splice(0, this.list.length)
}
})
} else {
ProductPoolCode().then(res => {
this.dataForm.code = res.data
})
}
})
},
getList() {
productList(this.listQuery).then(response => {
if (response.data.records) {
this.list = response.data.records
} else {
this.list.splice(0, this.list.length)
}
})
},
handleClick(raw) {
if (raw.type === 'delete') {
this.$confirm(`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.name}]?`, this.$t('module.basicData.visual.Tips'), {
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
type: 'warning'
}).then(() => {
productDelete(raw.data.id).then(response => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.getList()
}
})
})
}).catch(() => {})
} else {
this.addNew(raw.data.id)
}
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'name': this.dataForm.name,
'code': this.dataForm.code,
'specifications': this.dataForm.specifications,
'dictDataId': this.dataForm.dictDataId,
'id': this.dataForm.id
}
if (this.dataForm.id) {
ProductPoolUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500
})
})
} else {
ProductPoolAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500
})
this.listQuery.productId = res.data.id
})
}
}
})
},
goEdit() {
this.isdetail = false
},
// 新增 / 修改
addNew(id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id)
})
},
goback() {
this.$emit('refreshDataList')
this.visible = false
}
}
}
</script>

198
src/views/basicData/components/ScrapInfo-add.vue Normal file
View File

@@ -0,0 +1,198 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-03-25 16:23:37
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-row :gutter="15">
<el-form
ref="dataForm"
:model="dataForm"
:rules="rules"
size="medium"
label-width="110px"
label-position="left"
>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.WasteName')" prop="name">
<el-input v-model="dataForm.name" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.WasteName')])" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.WasteCode')" prop="code">
<el-input v-model="dataForm.code" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.WasteCode')])" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item v-if="false" :label="$t('module.basicData.ScrapInfo.PlateId')" prop="basalId">
<el-input v-model="dataForm.basalId" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.PlateId')])" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.updateTime')" prop="boardTime">
<el-date-picker
v-model="dataForm.boardTime"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:style="{width: '100%'}"
:placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.updateTime')])"
clearable
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.RegisterPerson')" prop="creatorName">
<el-input v-model="dataForm.creatorName" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.RegisterPerson')])" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.source')" prop="source">
<el-input v-model="dataForm.source" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.source')])" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.wasteGrade')" prop="wasteGrade">
<el-select
v-model="dataForm.wasteGrade"
:placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.wasteGrade')])"
clearable
:style="{width: '100%'}"
>
<el-option
v-for="item in wasteGradeArr"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :label="$t('module.basicData.ScrapInfo.cause')" prop="description">
<el-input
v-model="dataForm.description"
type="textarea"
:placeholder="$i18nForm(['placeholder.input', $t('module.basicData.ScrapInfo.cause')])"
:autosize="{minRows: 4, maxRows: 4}"
:style="{width: '100%'}"
/>
</el-form-item>
</el-col>
</el-form>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { ScrapInfoDetail, ScrapInfoUpdate, ScrapInfoAdd, ScrapInfoCode } from '@/api/basicData/ScrapInfo'
export default {
data() {
return {
visible: false,
dataForm: {
id: 0,
name: '',
code: '',
basalId: '',
source: '',
boardTime: '',
creatorName: '',
wasteGrade: '',
description: ''
},
wasteGradeArr: [{
value: 0,
label: '加工可用'
},
{
value: 1,
label: '完全废品'
}],
rules: {
name: [{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.ScrapInfo.WasteName')]),
trigger: 'blur'
}],
code: [{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.ScrapInfo.WasteCode')]),
trigger: 'blur'
}]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
ScrapInfoDetail(this.dataForm.id).then(res => {
this.dataForm = res.data
})
} else {
ScrapInfoCode().then(res => {
this.dataForm.code = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'basalId': this.dataForm.basalId,
'source': this.dataForm.source,
'boardTime': this.dataForm.boardTime,
'creatorName': this.dataForm.creatorName,
'wasteGrade': this.dataForm.wasteGrade,
'description': this.dataForm.description,
'name': this.dataForm.name,
'code': this.dataForm.code,
'id': this.dataForm.id
}
if (this.dataForm.id) {
ScrapInfoUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
ScrapInfoAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

45
src/views/basicData/components/ScrapInfoCause.vue Normal file
View File

@@ -0,0 +1,45 @@
<!--
* @Date: 2021-01-07 20:09:37
* @LastEditors: zwq
* @LastEditTime: 2021-03-06 14:58:10
* @FilePath: \basic-admin\src\components\BaseTable\subcomponents\CheckDetail.vue
* @Description:
-->
<template>
<span>
<el-button type="text" size="small" @click="emitClick">{{ $t('module.basicData.ScrapInfo.cause') }}</el-button>
</span>
</template>
<script>
export default {
props: {
injectData: {
type: Object,
default: () => ({})
}
},
methods: {
emitClick() {
console.log(this.injectData)
const h = this.$createElement
this.$msgbox({
title: this.$t('module.basicData.ScrapInfo.cause'),
message: h('div', null, [
h('span', null, `${this.$t('module.basicData.ScrapInfo.PlateId')}:${this.injectData.basalId}`),
h('br'),
h('span', null, `${this.$t('module.basicData.ScrapInfo.source')}:${this.injectData.source}`),
h('br'),
h('span', null, `${this.$t('module.basicData.ScrapInfo.updateTime')}:${this.injectData.createTime}`),
h('br'),
h('div', null, `${this.$t('module.basicData.ScrapInfo.cause')}:${this.injectData.description}`)
]),
showCancelButton: true,
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
cancelButtonText: '取消'
}).then(action => {
})
}
}
}
</script>

114
src/views/basicData/components/StateConfig-add.vue Normal file
View File

@@ -0,0 +1,114 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-04-07 13:42:54
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="120px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.StateConfig.status')" prop="status">
<el-input v-model="dataForm.status" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.StateConfig.status')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.StateConfig.DisplayColor')" prop="colour">
<el-color-picker v-model="dataForm.colour" />
</el-form-item>
<el-form-item :label="$t('module.basicData.StateConfig.Twinkle')" prop="twinkle">
<el-switch
v-model="dataForm.twinkle"
:active-value="0"
:inactive-value="1"
active-color="#13ce66"
inactive-color="#AAAAAA"
/>
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.Remarks')" prop="description">
<el-input v-model="dataForm.description" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Remarks')])" clearable />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { StateConfigDetail, StateConfigUpdate, StateConfigAdd } from '@/api/basicData/StateConfig'
export default {
data() {
return {
visible: false,
dataForm: {
id: 0,
status: '',
colour: '',
twinkle: '',
description: ''
},
dataRule: {
status: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.StateConfig.status')]), trigger: 'blur' }
],
colour: [
{ required: true, message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.StateConfig.DisplayColor')]), trigger: 'change' }
]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
StateConfigDetail(this.dataForm.id).then(res => {
this.dataForm.status = res.data.status
this.dataForm.colour = res.data.colour
this.dataForm.description = res.data.description
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = this.dataForm
if (this.dataForm.id) {
StateConfigUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
StateConfigAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

48
src/views/basicData/components/VisualImgInfo.vue Normal file
View File

@@ -0,0 +1,48 @@
<!--
* @Date: 2021-01-07 20:09:37
* @LastEditors: gtz
* @LastEditTime: 2021-03-12 16:32:06
* @FilePath: \basic-admin\src\components\BaseTable\subcomponents\CheckDetail.vue
* @Description:
-->
<template>
<span>
<el-button type="text" size="small" @click="emitClick">{{ 'btn.see' | i18nFilter }}</el-button>
<el-dialog width="1000px" top="50px" :title="$t('module.basicData.visual.annex')" :visible.sync="showPic">
<img :src="imageUrl" style="width: 100%" alt="">
</el-dialog>
</span>
</template>
<script>
import { getUrl } from '@/api/file'
import { blobToBase64 } from '@/utils/blobToBase64'
export default {
props: {
injectData: {
type: Object,
default: () => ({})
}
},
data() {
return {
showPic: false,
imageUrl: null
}
},
methods: {
emitClick() {
getUrl({
attachmentId: this.injectData.annexId,
type: 0
}).then(blob => {
blobToBase64(blob.data).then(res => {
this.imageUrl = res
this.showPic = true
})
})
}
}
}
</script>

171
src/views/basicData/components/VisualInfo-add.vue Normal file
View File

@@ -0,0 +1,171 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: gtz
* @LastEditTime: 2021-03-15 10:48:36
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:close-on-click-modal="false"
:visible.sync="visible"
@close="clearAnnex"
>
<el-row :gutter="15">
<el-form
ref="dataForm"
:model="dataForm"
:rules="rules"
size="medium"
label-width="160px"
label-position="left"
>
<el-col :span="24">
<el-form-item :label="$t('module.basicData.visual.areaName')" prop="name">
<el-input v-model="dataForm.name" :placeholder="['placeholder.input', $t('module.basicData.visual.areaName')] | i18nFilterForm" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<!-- <el-col v-if="!dataForm.id" :span="24">
<el-form-item :label="$t('module.basicData.visual.baseRouteName')" prop="trajectory">
<el-input v-model="baseRouteName" :placeholder="['placeholder.input', $t('module.basicData.visual.baseRouteName')] | i18nFilterForm" clearable :style="{width: '100%'}" @change="changeTrajectory" />
</el-form-item>
</el-col> -->
<el-col :span="24">
<el-form-item :label="$t('module.basicData.visual.isStock')" prop="stock">
<el-switch v-model="dataForm.stock" :active-value="1" :inactive-value="0" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item :label="$t('module.basicData.visual.annex')" prop="annexId">
<Single-image v-if="visible" :file-id="dataForm.annexId" @input="updateAnnex" />
</el-form-item>
</el-col>
</el-form>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import Vue from 'vue'
import SingleImage from '@/components/Upload/SingleImage'
import { VisualDetail, VisualUpdate, VisualAdd } from '@/api/basicData/visual'
export default {
components: {
SingleImage
},
data() {
return {
visible: false,
baseRouteName: null,
dataForm: {
id: 0,
name: null,
annexId: null,
stock: 0
},
rules: {
name: [{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.visual.areaName')]),
trigger: 'blur'
}],
annexId: [{
required: true,
message: this.$i18nForm(['placeholder.upload', this.$t('module.basicData.visual.annex')]),
trigger: 'blur'
}],
stock: [{
required: true,
message: this.$i18nForm(['placeholder.select', this.$t('module.basicData.visual.isStock')]),
trigger: 'blur'
}]
// trajectory: [{
// required: true,
// message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.visual.baseRouteName')]),
// trigger: 'blur'
// }]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
VisualDetail(this.dataForm.id).then(res => {
this.dataForm = res.data
})
}
})
},
// 附件变更
updateAnnex(fileInfo) {
if (fileInfo) {
this.dataForm.annexId = fileInfo.id
} else {
this.dataForm.annexId = ''
}
},
changeTrajectory(val) {
if (val || val === 0) {
this.dataForm.trajectory = JSON.stringify([
{ lineName: this.baseRouteName, list: [] }
])
} else {
this.dataForm.trajectory = null
}
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'name': this.dataForm.name,
'annexId': this.dataForm.annexId,
'id': this.dataForm.id,
'stock': this.dataForm.stock,
'type': 1
}
if (this.dataForm.id) {
VisualUpdate(data).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
VisualAdd(data).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
},
// 清除附件信息
clearAnnex() {
Vue.set(this.dataForm, 'annexId', null)
}
}
}
</script>

194
src/views/basicData/components/VisualLocationInfo.vue Normal file
View File

@@ -0,0 +1,194 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: gtz
* @LastEditTime: 2021-03-15 10:48:36
* @Description:
-->
<template>
<span v-if="injectData.stock">
<el-button type="text" size="small" @click="emitClick">{{ 'btn.edit' | i18nFilter }}</el-button>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:close-on-click-modal="false"
:visible.sync="visible"
top="10vh"
@close="clearAnnex"
>
<div class="location-box">
<el-row class="location-form" :gutter="15">
<el-form
ref="dataForm"
:model="dataForm"
:rules="rules"
size="medium"
label-width="160px"
label-position="left"
>
<el-col :span="24">
<el-form-item :label="$t('module.basicData.visual.areaName')" prop="name">
<el-input v-model="areaName" disabled :placeholder="['placeholder.input', $t('module.basicData.visual.areaName')] | i18nFilterForm" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
<!-- <el-col v-if="!dataForm.id" :span="24">
<el-form-item :label="$t('module.basicData.visual.baseRouteName')" prop="trajectory">
<el-input v-model="baseRouteName" :placeholder="['placeholder.input', $t('module.basicData.visual.baseRouteName')] | i18nFilterForm" clearable :style="{width: '100%'}" @change="changeTrajectory" />
</el-form-item>
</el-col> -->
<el-col :span="24">
<el-form-item :label="$t('module.basicData.visual.annex')" prop="annexId">
<Single-image v-if="visible" :file-id="dataForm.annexId" @input="updateAnnex" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item v-if="dataForm.id" :label="$t('module.basicData.visual.editLocation')">
<el-button style="float: left" type="primary" @click="showPointModel">{{ $t('module.basicData.visual.editLocation') }}</el-button>
</el-form-item>
</el-col>
</el-form>
</el-row>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
<Visual-location-info-point ref="locationpoint" :inject-data="dataForm" @emitData="emitData" />
</el-dialog>
</span>
</template>
<script>
import Vue from 'vue'
import SingleImage from '@/components/Upload/SingleImage'
import VisualLocationInfoPoint from './VisualLocationInfoPoint'
import { VisualUpdate, VisualAdd, VisualList } from '@/api/basicData/visual'
export default {
components: {
SingleImage,
VisualLocationInfoPoint
},
props: {
injectData: {
type: Object,
default: () => ({})
}
},
data() {
return {
visible: false,
baseRouteName: null,
areaName: null,
dataForm: {
id: null,
annexId: null
},
rules: {
annexId: [{
required: true,
message: this.$i18nForm(['placeholder.upload', this.$t('module.basicData.visual.annex')]),
trigger: 'blur'
}],
trajectory: [{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.visual.baseRouteName')]),
trigger: 'blur'
}]
}
}
},
methods: {
emitClick() {
this.areaName = this.injectData.name
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.injectData.id) {
VisualList({
parentId: this.injectData.id,
current: 1,
size: 10
}).then(res => {
if (res.data.records.length) {
this.dataForm = res.data.records[0]
}
})
}
})
},
// 附件变更
updateAnnex(fileInfo) {
if (fileInfo) {
this.dataForm.annexId = fileInfo.id
} else {
this.dataForm.annexId = ''
}
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = {
'annexId': this.dataForm.annexId,
'id': this.dataForm.id,
'parentId': this.injectData.id,
'type': 2
}
if (this.dataForm.id) {
VisualUpdate(data).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('emitData', {
type: ['refresh']
})
}
})
})
} else {
VisualAdd(data).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
},
// 清除附件信息
clearAnnex() {
Vue.set(this.dataForm, 'annexId', null)
},
showPointModel() {
this.$refs.locationpoint.emitClick()
},
emitData(v) {
console.log(v)
if (v.type.indexOf('refresh') >= 0) {
this.emitClick()
}
}
}
}
</script>
<style lang="scss" scoped>
.location-box {
width: 100%;
overflow: hidden;
.location-form{
width: calc(100% + 24px);
max-height: calc(80vh - 181px);
overflow-y: scroll;
}
}
</style>

279
src/views/basicData/components/VisualLocationInfoPoint.vue Normal file
View File

@@ -0,0 +1,279 @@
<!--
* @Date: 2021-01-07 20:09:37
* @LastEditors: gtz
* @LastEditTime: 2021-04-16 15:00:51
* @FilePath: \basic-admin\src\components\BaseTable\subcomponents\CheckDetail.vue
* @Description:
-->
<template>
<span>
<el-dialog
:id="'imgbox' + injectData.id"
:close-on-click-modal="false"
:modal="false"
width="60%"
top="50px"
:title="$t('module.basicData.visual.locationInformation')"
:visible.sync="showPic"
>
<div slot="title">
{{ $t('module.basicData.visual.locationInformation') }}
<el-popover
placement="top-start"
:title="$t('module.basicData.visual.help')"
width="400"
trigger="hover"
:content="$t('module.basicData.visual.tip')"
>
<svg-icon slot="reference" class-name="international-icon" icon-class="helptitle" style="cursor: pointer" />
</el-popover>
</div>
<div class="imgbox">
<img id="lingImg" :src="imageUrl" style="width: 100%" alt="" @click="setPoint">
<el-popover
v-for="(item, index) in pointList"
:key="index"
v-model="item.show"
placement="right"
trigger="click"
@hide="clearIndex"
>
<el-select v-model="eqId" clearable filterable>
<el-option v-for="i in equipmentList" :key="i.id" :value="i.id" :label="i.name" />
</el-select>
<div style="text-align: right; margin-top: 5px">
<el-button type="danger" @click="delEqPoint(index)">{{ 'btn.delete' | i18nFilter }}</el-button>
<el-button type="primary" @click="confirmPointEq(index)">{{ 'btn.confirm' | i18nFilter }}</el-button>
</div>
<el-button
slot="reference"
class="point-badge"
:style="{left: `calc(${item.pointX} - 10px)`, top: `calc(${item.pointY} - 10px)`}"
type="danger"
@click="handleIndex(index)"
>
{{ index + 1 }}
</el-button>
</el-popover>
</div>
<el-row style="text-align:left">
<vuedraggable v-model="pointList" group="route">
<el-tag v-for="(item, index) in pointList" :key="index" type="info" closable style="margin: 5px" @close="delEqPoint(index)">
{{ index + 1 }}、{{ $t('module.basicData.visual.location') }}：{{ equipmentObj[item.id] }}
</el-tag>
</vuedraggable>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="showPic = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button @click="resetPoint()">{{ 'btn.reset' | i18nFilter }}</el-button>
<el-button type="primary" @click="pointConfirm()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</span>
</template>
<script>
import Vue from 'vue'
import vuedraggable from 'vuedraggable'
import { getUrl } from '@/api/file'
import { locationList, VisualUpdate } from '@/api/basicData/visual'
import { blobToBase64 } from '@/utils/blobToBase64'
export default {
components: {
vuedraggable
},
props: {
injectData: {
type: Object,
default: () => ({})
}
},
data() {
return {
showPic: false,
imageUrl: null,
windowWidth: null,
pointList: [],
resetPointList: [],
equipmentList: [],
equipmentObj: {},
addNow: false,
eqId: null,
pointIndex: null
}
},
watch: {
pointIndex: function(val) {
if (val || val === 0) {
this.eqId = this.pointList[val].id
} else {
this.eqId = null
}
},
showPic: function(val) {
if (val && this.injectData.equipmentPoint) {
this.pointList = JSON.parse(this.injectData.equipmentPoint).map(item => {
item.show = false
return item
})
this.resetPointList = JSON.parse(this.injectData.equipmentPoint).map(item => {
item.show = false
return item
})
}
if (!val) {
this.addNow = false
this.eqId = null
this.pointIndex = null
this.pointList = []
this.resetPointList = []
}
}
},
mounted() {
this.windowWidth = window.innerWidth
this.getEqList()
window.addEventListener('resize', () => {
this.windowWidth = window.innerWidth
})
},
methods: {
// 获取设备数据字典
getEqList() {
locationList({}).then(res => {
this.equipmentList = res.data
this.equipmentList.map(item => {
this.equipmentObj[item.id] = item.name
})
}).catch(() => {
setTimeout(() => {
this.getEqList()
}, 10000)
})
},
emitClick() {
getUrl({
attachmentId: this.injectData.annexId,
type: 0
}).then(blob => {
blobToBase64(blob.data).then(res => {
this.imageUrl = res
this.showPic = true
})
})
},
// 添加位置点
setPoint(e) {
if (!this.addNow) {
const windowWidth = document.getElementById('imgbox' + this.injectData.id).clientWidth
const scrollY = document.getElementById('imgbox' + this.injectData.id).scrollTop
const [imgX, imgY] = [document.getElementById('lingImg').width, document.getElementById('lingImg').height]
const pointY = ((e.clientY + scrollY - 135) / imgY) * 100 + '%'
const pointX = ((e.clientX - windowWidth * 0.2 - 20) / imgX) * 100 + '%'
this.pointList.push({
id: null,
pointX,
pointY,
show: false
})
setTimeout(() => {
Vue.set(this.pointList[this.pointList.length - 1], 'show', true)
this.pointIndex = this.pointList.length - 1
}, 100)
this.addNow = true
} else {
this.$message.warning(this.$t('module.basicData.visual.addNow'))
}
},
// 删除位置点
delEqPoint(index) {
if (index === this.pointList.length - 1) {
this.addNow = false
} else {
Vue.set(this.pointList[index], 'show', false)
}
this.pointList.splice(index, 1)
},
// 确认位置点
confirmPointEq(index) {
if (index === this.pointList.length - 1) {
this.addNow = false
}
for (let i = 0; i < this.pointList.length; i++) {
if (this.eqId === null) {
this.$message.error(this.$t('module.basicData.visual.unSelect'))
return false
} else if (this.pointList[i].id === this.eqId) {
this.$message.error(this.$t('module.basicData.visual.choiseError'))
return false
}
}
Vue.set(this.pointList[index], 'id', this.eqId)
Vue.set(this.pointList[index], 'show', false)
this.clearIndex()
this.$message.success(this.$t('module.basicData.visual.choiseSucc'))
},
// 保存点击的气泡index
handleIndex(index) {
this.pointIndex = index
},
// 清除保存的index
clearIndex() {
this.pointIndex = null
},
// 提交位置点信息
pointConfirm() {
if (this.addNow) {
this.$message.warning(this.$t('module.basicData.visual.addNow'))
} else {
VisualUpdate({
id: this.injectData.id,
name: this.injectData.name,
annexId: this.injectData.annexId,
equipmentPoint: JSON.stringify(this.pointList)
}).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.showPic = false
this.$emit('emitData', {
type: ['refresh']
})
}
})
})
}
},
// 重置
resetPoint() {
Object.assign(this.pointList, this.resetPointList)
this.showPic = false
setTimeout(() => {
this.showPic = true
}, 100)
}
}
}
</script>
<style lang="scss">
.imgbox{
position: relative;
.point-badge{
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
border-radius: 100%;
line-height: 20px;
font-size: 12px;
text-align: center;
padding: 0;
cursor: pointer;
}
}
</style>

282
src/views/basicData/components/VisualPointInfo.vue Normal file
View File

@@ -0,0 +1,282 @@
<!--
* @Date: 2021-01-07 20:09:37
* @LastEditors: gtz
* @LastEditTime: 2021-04-16 15:00:51
* @FilePath: \basic-admin\src\components\BaseTable\subcomponents\CheckDetail.vue
* @Description:
-->
<template>
<span>
<el-button type="text" size="small" @click="emitClick">{{ 'btn.edit' | i18nFilter }}</el-button>
<el-dialog
:id="'imgbox' + injectData.id"
:close-on-click-modal="false"
width="60%"
top="50px"
:title="$t('module.basicData.visual.locationInformation')"
:visible.sync="showPic"
>
<div slot="title">
{{ $t('module.basicData.visual.locationInformation') }}
<el-popover
placement="top-start"
:title="$t('module.basicData.visual.help')"
width="400"
trigger="hover"
:content="$t('module.basicData.visual.tip')"
>
<svg-icon slot="reference" class-name="international-icon" icon-class="helptitle" style="cursor: pointer" />
</el-popover>
</div>
<div v-if="showPic" class="imgbox">
<img id="lingImg" :src="imageUrl" style="width: 100%" alt="" @click="setPoint">
<el-popover
v-for="(item, index) in pointList"
:key="index"
v-model="item.show"
placement="right"
trigger="click"
@hide="clearIndex"
>
<el-select v-model="eqId" clearable filterable>
<el-option v-for="i in equipmentList" :key="i.id" :value="i.id" :label="i.name" />
</el-select>
<div style="text-align: right; margin-top: 5px">
<el-button type="danger" @click="delEqPoint(index)">{{ 'btn.delete' | i18nFilter }}</el-button>
<el-button type="primary" @click="confirmPointEq(index)">{{ 'btn.confirm' | i18nFilter }}</el-button>
</div>
<el-button
slot="reference"
class="point-badge"
:style="{left: `calc(${item.pointX} - 10px)`, top: `calc(${item.pointY} - 10px)`}"
type="danger"
@click="handleIndex(index)"
>
{{ index + 1 }}
</el-button>
</el-popover>
</div>
<el-row style="text-align:left">
<vuedraggable v-model="pointList" group="route">
<el-tag v-for="(item, index) in pointList" :key="index" type="info" closable style="margin: 5px" @close="delEqPoint(index)">
{{ index + 1 }}、{{ 'module.basicData.visual.equipment' | i18nFilter }}：{{ equipmentObj[item.id] }}
</el-tag>
</vuedraggable>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="showPic = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button @click="resetPoint()">{{ 'btn.reset' | i18nFilter }}</el-button>
<el-button type="primary" @click="pointConfirm()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</span>
</template>
<script>
import Vue from 'vue'
import vuedraggable from 'vuedraggable'
import { getUrl } from '@/api/file'
import { eqList, VisualUpdate } from '@/api/basicData/visual'
import { blobToBase64 } from '@/utils/blobToBase64'
export default {
components: {
vuedraggable
},
props: {
injectData: {
type: Object,
default: () => ({})
}
},
data() {
return {
showPic: false,
imageUrl: null,
windowWidth: null,
pointList: [],
resetPointList: [],
equipmentList: [],
equipmentObj: {},
addNow: false,
eqId: null,
pointIndex: null
}
},
watch: {
pointIndex: function(val) {
if (val || val === 0) {
this.eqId = this.pointList[val].id
} else {
this.eqId = null
}
},
showPic: function(val) {
if (val && this.injectData.equipmentPoint) {
this.pointList = JSON.parse(this.injectData.equipmentPoint).map(item => {
item.show = false
return item
})
this.resetPointList = JSON.parse(this.injectData.equipmentPoint).map(item => {
item.show = false
return item
})
}
if (!val) {
this.addNow = false
this.eqId = null
this.pointIndex = null
this.pointList = []
this.resetPointList = []
}
}
},
mounted() {
this.windowWidth = window.innerWidth
this.getEqList()
window.addEventListener('resize', () => {
this.windowWidth = window.innerWidth
})
},
methods: {
// 获取设备数据字典
getEqList() {
eqList({
current: 1,
size: 999
}).then(res => {
this.equipmentList = res.data.records
this.equipmentList.map(item => {
this.equipmentObj[item.id] = item.name
})
}).catch(() => {
setTimeout(() => {
this.getEqList()
}, 10000)
})
},
emitClick() {
getUrl({
attachmentId: this.injectData.annexId,
type: 0
}).then(blob => {
blobToBase64(blob.data).then(res => {
this.imageUrl = res
this.showPic = true
})
})
},
// 添加位置点
setPoint(e) {
if (!this.addNow) {
const windowWidth = document.getElementById('imgbox' + this.injectData.id).clientWidth
const scrollY = document.getElementById('imgbox' + this.injectData.id).scrollTop
const [imgX, imgY] = [document.getElementById('lingImg').width, document.getElementById('lingImg').height]
const pointY = ((e.clientY + scrollY - 135) / imgY) * 100 + '%'
const pointX = ((e.clientX - windowWidth * 0.2 - 20) / imgX) * 100 + '%'
this.pointList.push({
id: null,
pointX,
pointY,
show: false
})
setTimeout(() => {
Vue.set(this.pointList[this.pointList.length - 1], 'show', true)
this.pointIndex = this.pointList.length - 1
}, 100)
this.addNow = true
} else {
this.$message.warning(this.$t('module.basicData.visual.addNow'))
}
},
// 删除位置点
delEqPoint(index) {
if (index === this.pointList.length - 1) {
this.addNow = false
} else {
Vue.set(this.pointList[index], 'show', false)
}
this.pointList.splice(index, 1)
},
// 确认位置点
confirmPointEq(index) {
if (index === this.pointList.length - 1) {
this.addNow = false
}
for (let i = 0; i < this.pointList.length; i++) {
if (this.eqId === null) {
this.$message.error(this.$t('module.basicData.visual.unSelect'))
return false
} else if (this.pointList[i].id === this.eqId) {
this.$message.error(this.$t('module.basicData.visual.choiseError'))
return false
}
}
Vue.set(this.pointList[index], 'id', this.eqId)
Vue.set(this.pointList[index], 'show', false)
this.clearIndex()
this.$message.success(this.$t('module.basicData.visual.choiseSucc'))
},
// 保存点击的气泡index
handleIndex(index) {
this.pointIndex = index
},
// 清除保存的index
clearIndex() {
this.pointIndex = null
},
// 提交位置点信息
pointConfirm() {
if (this.addNow) {
this.$message.warning(this.$t('module.basicData.visual.addNow'))
} else {
VisualUpdate({
id: this.injectData.id,
name: this.injectData.name,
annexId: this.injectData.annexId,
equipmentPoint: JSON.stringify(this.pointList)
}).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.showPic = false
this.$emit('emitData', {
type: ['refresh']
})
}
})
})
}
},
// 重置
resetPoint() {
Object.assign(this.pointList, this.resetPointList)
this.showPic = false
setTimeout(() => {
this.showPic = true
}, 100)
}
}
}
</script>
<style lang="scss">
.imgbox{
position: relative;
.point-badge{
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
border-radius: 100%;
line-height: 20px;
font-size: 12px;
text-align: center;
padding: 0;
cursor: pointer;
}
}
</style>

475
src/views/basicData/components/VisualRouteInfo.vue Normal file
View File

@@ -0,0 +1,475 @@
<!--
* @Date: 2021-01-07 20:09:37
* @LastEditors: gtz
* @LastEditTime: 2021-04-16 15:01:03
* @FilePath: \basic-admin\src\components\BaseTable\subcomponents\CheckDetail.vue
* @Description:
-->
<template>
<span>
<el-button type="text" size="small" @click="emitClick">{{ 'btn.edit' | i18nFilter }}</el-button>
<el-dialog
:id="'imgbox-route-' + injectData.id"
:close-on-click-modal="false"
width="60%"
top="50px"
:visible.sync="showPic"
>
<div slot="title">
{{ $t('module.basicData.visual.runningTrack') }}
<el-popover
placement="top-start"
:title="$t('module.basicData.visual.help')"
width="400"
trigger="hover"
:content="$t('module.basicData.visual.tip') + $t('module.basicData.visual.routeTip')"
>
<svg-icon slot="reference" class-name="international-icon" icon-class="helptitle" style="cursor: pointer" />
</el-popover>
</div>
<el-row :id="'lineSelect' + injectData.id" style="text-align: left; margin-bottom: 10px">
<el-select v-model="lineIndex" clearable filterable @change="resetAllStadus">
<el-option v-for="(item, index) in routeList" :key="index" :value="index" :label="item.lineName" />
</el-select>
<el-button type="primary" @click="addLine">{{ 'btn.add' | i18nFilter }}</el-button>
<el-button type="primary" @click="editLine">{{ 'btn.edit' | i18nFilter }}</el-button>
<el-button type="danger" @click="deleteLine">{{ 'btn.delete' | i18nFilter }}</el-button>
</el-row>
<div v-if="showPic && lineIndex >= 0" class="imgbox">
<canvas :id="'canvas' + injectData.id" class="visual-canvas" width="500" height="500" />
<img id="lingImg" :src="imageUrl" style="width: 100%" alt="" @click="setRoute">
<el-popover
v-for="(item, index) in routeList[lineIndex].list"
:key="index"
v-model="item.show"
placement="right"
trigger="click"
@hide="clearIndex"
>
<el-select v-model="eqId" clearable filterable>
<el-option v-for="i in equipmentList" :key="i.id" :value="i.id" :label="i.name" />
</el-select>
<div style="text-align: right; margin-top: 5px">
<el-button type="danger" @click="delEqRoute(index)">{{ 'btn.delete' | i18nFilter }}</el-button>
<el-button type="primary" @click="confirmRouteEq(index)">{{ 'btn.confirm' | i18nFilter }}</el-button>
</div>
<el-button
slot="reference"
class="route-badge"
:style="{left: `calc(${item.routeX} - 10px)`, top: `calc(${item.routeY} - 10px)`}"
type="success"
@click="handleIndex(index)"
>
{{ index + 1 }}
</el-button>
</el-popover>
</div>
<el-row v-if="showPic && lineIndex >= 0" style="text-align:left">
<vuedraggable v-model="routeList" group="route">
<el-tag v-for="(item, index) in routeList[lineIndex].list" :key="index" type="info" closable style="margin: 5px" @close="delEqRoute(index)">
{{ index + 1 }}、{{ 'module.basicData.visual.equipment' | i18nFilter }}：{{ equipmentObj[item.id] }}
</el-tag>
</vuedraggable>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="showPic = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button @click="resetRoute()">{{ 'btn.reset' | i18nFilter }}</el-button>
<el-button type="primary" @click="routeConfirm()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
<el-dialog
:title="addLineStatus ? 'btn.add' : 'btn.edit' | i18nFilter"
:close-on-click-modal="false"
:visible.sync="lineShow"
>
<el-form
ref="lineData"
:model="lineData"
:rules="lineDataRules"
size="medium"
label-width="120px"
label-position="left"
>
<el-col :span="24">
<el-form-item :label="$t('module.basicData.visual.editLineName')" prop="name">
<el-input v-model="lineData.editLineName" :placeholder="['placeholder.input', $t('module.basicData.visual.editLineName')] | i18nFilterForm" clearable :style="{width: '100%'}" />
</el-form-item>
</el-col>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="lineShow = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="lineFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</span>
</template>
<script>
import Vue from 'vue'
import vuedraggable from 'vuedraggable'
import { getUrl } from '@/api/file'
import { eqList, VisualUpdate } from '@/api/basicData/visual'
import { blobToBase64 } from '@/utils/blobToBase64'
export default {
components: {
vuedraggable
},
props: {
injectData: {
type: Object,
default: () => ({})
}
},
data() {
return {
showPic: false,
imageUrl: null,
windowWidth: null,
routeList: [],
resetRouteList: [],
equipmentList: [],
equipmentObj: {},
addNow: false,
eqId: null,
routeIndex: null,
lineIndex: null,
lineShow: false,
addLineStatus: false,
imgW: 400,
imgH: 400,
lineData: {
editLineName: null
},
drawloading: false,
lineDataRules: {
editLineName: [{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.visual.editLineName')]),
trigger: 'blur'
}]
}
}
},
watch: {
routeIndex: function(val) {
if (val || val === 0) {
this.eqId = this.routeList[this.lineIndex].list[val].id
} else {
this.eqId = null
}
},
showPic: function(val) {
if (val && this.injectData.trajectory) {
this.routeList = JSON.parse(this.injectData.trajectory)
for (let i = 0; i < this.routeList.length; i++) {
this.routeList[i].list.map(item => {
item.show = false
return item
})
}
this.addNow = false
this.lineIndex = 0
this.resetRouteList = JSON.parse(this.injectData.trajectory)
for (let i = 0; i < this.resetRouteList.length; i++) {
this.resetRouteList[i].list.map(item => {
item.show = false
return item
})
}
}
}
},
mounted() {
this.windowWidth = window.innerWidth
this.getEqList()
window.addEventListener('resize', () => {
this.windowWidth = window.innerWidth
if (this.showPic) {
this.imgW = document.getElementById('lingImg').width
this.imgH = document.getElementById('lingImg').height
if (!this.drawloading) {
this.drawCanvas()
this.drawloading = true
setTimeout(() => {
this.drawloading = false
}, 100)
}
}
})
},
methods: {
// 获取设备数据字典
getEqList() {
eqList().then(res => {
this.equipmentList = res.data
this.equipmentList.splice(0, 0, { id: 'daogui', name: '导轨' }, { id: 'zhuanzhedian', name: '转折点' })
this.equipmentList.map(item => {
this.equipmentObj[item.id] = item.name
})
}).catch(() => {
setTimeout(() => {
this.getEqList()
}, 10000)
})
},
emitClick() {
getUrl({
attachmentId: this.injectData.annexId,
type: 0
}).then(blob => {
blobToBase64(blob.data).then(res => {
this.imageUrl = res
this.showPic = true
setTimeout(() => {
this.imgW = document.getElementById('lingImg').width
this.imgH = document.getElementById('lingImg').height
this.drawCanvas()
}, 10)
})
}).catch(err => {
this.$message.error(err)
})
},
// 绘制辅助线
drawCanvas() {
const c = document.getElementById('canvas' + this.injectData.id)
c.width = this.imgW
c.height = this.imgH
const cxt = c.getContext('2d')
for (let i = 0; i < this.routeList[this.lineIndex].list.length; i++) {
if (i === 0) {
cxt.moveTo(this.toNumber(this.routeList[this.lineIndex].list[i].routeX) * this.imgW + 0.5, this.toNumber(this.routeList[this.lineIndex].list[i].routeY) * this.imgH + 0.5)
} else if (i === this.routeList[this.lineIndex].list.length - 1) {
cxt.lineTo(this.toNumber(this.routeList[this.lineIndex].list[i].routeX) * this.imgW + 0.5, this.toNumber(this.routeList[this.lineIndex].list[i].routeY) * this.imgH + 0.5)
cxt.strokeStyle = '#000000'
cxt.lineWidth = '6'
cxt.stroke()
} else if (i > 0) {
cxt.lineTo(this.toNumber(this.routeList[this.lineIndex].list[i].routeX) * this.imgW + 0.5, this.toNumber(this.routeList[this.lineIndex].list[i].routeY) * this.imgH + 0.5)
}
}
for (let i = 0; i < this.routeList[this.lineIndex].list.length; i++) {
if (i === 0) {
cxt.moveTo(this.toNumber(this.routeList[this.lineIndex].list[i].routeX) * this.imgW, this.toNumber(this.routeList[this.lineIndex].list[i].routeY) * this.imgH)
} else if (i === this.routeList[this.lineIndex].list.length - 1) {
cxt.lineTo(this.toNumber(this.routeList[this.lineIndex].list[i].routeX) * this.imgW, this.toNumber(this.routeList[this.lineIndex].list[i].routeY) * this.imgH)
cxt.strokeStyle = '#13ce66'
cxt.lineWidth = '2'
cxt.stroke()
} else if (i > 0) {
cxt.lineTo(this.toNumber(this.routeList[this.lineIndex].list[i].routeX) * this.imgW, this.toNumber(this.routeList[this.lineIndex].list[i].routeY) * this.imgH)
}
}
},
// 去除百分号，除以100通用方法
toNumber(v) {
return Number(v.substring(0, v.length - 1)) / 100
},
// 添加位置点
setRoute(e) {
if (!this.addNow) {
const windowWidth = document.getElementById('imgbox-route-' + this.injectData.id).clientWidth
const scrollY = document.getElementById('imgbox-route-' + this.injectData.id).scrollTop
const routeY = ((e.clientY + scrollY - (145 + document.getElementById('lineSelect' + this.injectData.id).clientHeight)) / this.imgH) * 100 + '%'
const routeX = ((e.clientX - windowWidth * 0.2 - 20) / this.imgW) * 100 + '%'
this.routeList[this.lineIndex].list.push({
id: null,
routeX,
routeY,
show: false
})
setTimeout(() => {
Vue.set(this.routeList[this.lineIndex].list[this.routeList[this.lineIndex].list.length - 1], 'show', true)
this.routeIndex = this.routeList[this.lineIndex].list.length - 1
this.drawCanvas()
}, 100)
this.addNow = true
} else {
this.$message.warning(this.$t('module.basicData.visual.addNow'))
}
},
// 删除位置点
delEqRoute(index) {
if (index === this.routeList[this.lineIndex].list.length - 1) {
this.addNow = false
} else {
Vue.set(this.routeList[this.lineIndex].list[index], 'show', false)
}
this.routeList[this.lineIndex].list.splice(index, 1)
this.drawCanvas()
this.clearIndex()
},
// 确认位置点
confirmRouteEq(index) {
if (index === this.routeList[this.lineIndex].list.length - 1) {
this.addNow = false
}
for (let i = 0; i < this.routeList[this.lineIndex].list.length; i++) {
if (this.eqId === null) {
this.$message.error(this.$t('module.basicData.visual.unSelect'))
return false
} else if (this.routeList[this.lineIndex].list[i].id === this.eqId && this.eqId !== 'daogui' && this.eqId !== 'zhuanzhedian') {
this.$message.error(this.$t('module.basicData.visual.choiseError'))
return false
}
}
Vue.set(this.routeList[this.lineIndex].list[index], 'id', this.eqId)
Vue.set(this.routeList[this.lineIndex].list[index], 'show', false)
this.clearIndex()
this.$message.success(this.$t('module.basicData.visual.choiseSucc'))
},
// 保存点击的气泡index
handleIndex(index) {
this.routeIndex = index
},
// 清除保存的index
clearIndex() {
this.routeIndex = null
},
// 提交位置点信息
routeConfirm() {
if (this.addNow) {
this.$message.warning(this.$t('module.basicData.visual.addNow'))
} else {
VisualUpdate({
id: this.injectData.id,
name: this.injectData.name,
annexId: this.injectData.annexId,
trajectory: JSON.stringify(this.routeList)
}).then(res => {
this.$message({
message: this.$t('baseTip.OperationSucc'),
type: 'success',
duration: 1500,
onClose: () => {
this.showPic = false
this.$emit('emitData', {
type: ['refresh']
})
}
})
})
}
},
// 重置 待完善
resetRoute() {
new Promise(resolve => {
Object.assign(this.routeList, this.resetRouteList)
this.showPic = false
setTimeout(() => {
this.showPic = true
resolve()
}, 100)
}).then(() => {
this.lineIndex = 0
this.drawCanvas()
})
},
// 切换轨迹时清除所有虚拟状态
resetAllStadus() {
if (this.addNow) {
this.$message.warning(this.$t('module.basicData.visual.changeLine'))
} else {
this.clearIndex()
this.drawCanvas()
}
},
// 添加产线
addLine() {
this.addLineStatus = true
this.lineData.editLineName = null
this.lineShow = true
},
editLine() {
this.addLineStatus = false
this.lineData.editLineName = this.routeList[this.lineIndex].lineName
this.lineShow = true
},
// 删除产线
deleteLine() {
if (this.routeList.length === 1) {
this.$message.error(this.$t('module.basicData.visual.oneLineTip'))
} else {
this.$confirm(`${this.$t('deleteTip.header')}${this.routeList[this.lineIndex].lineName}${this.$t('deleteTip.footer')}`, this.$t('deleteTip.tip'), {
confirmButtonText: this.$t('deleteTip.confirm'),
cancelButtonText: this.$t('deleteTip.cancel'),
type: 'warning'
}).then(() => {
new Promise(resolve => {
this.routeList.splice(this.lineIndex, 1)
resolve()
}).then(() => {
this.lineIndex = 0
this.addNow = false
this.routeIndex = null
this.drawCanvas()
this.clearIndex()
this.$message.success(this.$t('baseTip.OperationSucc'))
})
})
}
},
// 新增、修改路径名
lineFormSubmit() {
if (this.addLineStatus) {
for (let i = 0; i < this.routeList.length; i++) {
if (this.routeList[i].lineName === this.lineData.editLineName) {
this.$message.error(this.$t('module.basicData.visual.oneLineNameTip'))
return false
}
}
if (this.lineData.editLineName) {
this.routeList.push({
lineName: this.lineData.editLineName,
list: []
})
this.$message.success(this.$t('baseTip.OperationSucc'))
this.lineShow = false
} else {
this.$message.error(this.$t('module.basicData.visual.lineNameNotNullTip'))
}
} else {
for (let i = 0; i < this.routeList.length; i++) {
if (this.routeList[i].lineName === this.lineData.editLineName && this.lineIndex !== i) {
this.$message.error(this.$t('module.basicData.visual.oneLineNameTip'))
return false
}
}
if (this.lineData.editLineName) {
Vue.set(this.routeList[this.lineIndex], 'lineName', this.lineData.editLineName)
this.$message.success(this.$t('baseTip.OperationSucc'))
this.lineShow = false
} else {
this.$message.error(this.$t('module.basicData.visual.lineNameNotNullTip'))
}
}
}
}
}
</script>
<style lang="scss">
.imgbox{
position: relative;
.route-badge{
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
border-radius: 100%;
line-height: 20px;
font-size: 12px;
text-align: center;
padding: 0;
cursor: pointer;
}
.visual-canvas{
position: absolute;
top: 0;
left: 0;
pointer-events: none;
}
}
</style>

34
src/views/basicData/components/attrBtn.vue Normal file
View File

@@ -0,0 +1,34 @@
<!--
* @Date: 2021-01-07 20:09:37
* @LastEditors: zwq
* @LastEditTime: 2021-03-06 16:16:12
* @FilePath: \basic-admin\src\components\BaseTable\subcomponents\CheckDetail.vue
* @Description:
-->
<template>
<span>
<el-button type="text" size="small" @click="emitClick">{{ $t('module.basicData.CodeRules.manageProperty') }}</el-button>
</span>
</template>
<script>
export default {
props: {
injectData: {
type: Object,
default: () => ({})
}
},
methods: {
emitClick() {
console.log(this.injectData)
this.$router.push({
name: 'codeAttr',
query: {
id: this.injectData.id
}
})
}
}
}
</script>

25
src/views/basicData/components/colorDiv.vue Normal file
View File

@@ -0,0 +1,25 @@
<!--
* @Author: zwq
* @Date: 2021-01-18 15:29:04
* @LastEditors: zwq
* @LastEditTime: 2021-03-22 15:04:32
* @Description:
-->
<template>
<div style="width:100px;height:20px;margin:auto" :style="{background:injectData.colour}" />
</template>
<script>
export default {
props: {
injectData: {
type: Object,
default: () => ({})
}
},
methods: {
emitClick() {
}
}
}
</script>

114
src/views/basicData/components/dataDictionary-add.vue Normal file
View File

@@ -0,0 +1,114 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: zwq
* @LastEditTime: 2021-04-16 13:20:20
* @remark:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="100px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.materialsType.TypeName')" prop="typeName">
<el-input v-model="dataForm.typeName" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.materialsType.TypeName')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.materialsType.TypeCode')" prop="typeCode">
<el-input v-model="dataForm.typeCode" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.materialsType.TypeCode')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.Remarks')" prop="remark">
<el-input
v-model="dataForm.remark"
type="textarea"
:rows="2"
:placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Remarks')])"
clearable
/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { dataDictionaryTypeDetail, dataDictionaryTypeUpdate, dataDictionaryTypeAdd } from '@/api/basicData/dataDictionaryType'
export default {
data() {
return {
visible: false,
dataForm: {
id: 0,
typeName: '',
typeCode: '',
remark: ''
},
dataRule: {
typeName: [
{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.materialsType.TypeName')]),
trigger: 'blur' }
],
typeCode: [
{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.materialsType.TypeCode')]),
trigger: 'blur' }
]
}
}
},
methods: {
init(id) {
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
dataDictionaryTypeDetail(this.dataForm.id).then(res => {
this.dataForm = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = this.dataForm
if (this.dataForm.id) {
dataDictionaryTypeUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
dataDictionaryTypeAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

116
src/views/basicData/components/dataDictionaryData-add.vue Normal file
View File

@@ -0,0 +1,116 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 16:37:56
* @LastEditors: gtz
* @LastEditTime: 2021-04-17 15:25:35
* @remark:
-->
<template>
<el-dialog
:title="!dataForm.id ? 'btn.add' : 'btn.edit' | i18nFilter"
:visible.sync="visible"
>
<el-form ref="dataForm" :model="dataForm" :rules="dataRule" label-width="170px" @keyup.enter.native="dataFormSubmit()">
<el-form-item :label="$t('module.basicData.dataDictionary.dataDictionaryName')" prop="dataName">
<el-input v-model="dataForm.dataName" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.dataDictionary.dataDictionaryName')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.dataDictionary.dataDictionaryCode')" prop="dataCode">
<el-input v-model="dataForm.dataCode" :placeholder="$i18nForm(['placeholder.input', $t('module.basicData.dataDictionary.dataDictionaryCode')])" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.visual.Remarks')" prop="remark">
<el-input
v-model="dataForm.remark"
type="textarea"
:rows="2"
:placeholder="$i18nForm(['placeholder.input', $t('module.basicData.visual.Remarks')])"
clearable
/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">{{ 'btn.cancel' | i18nFilter }}</el-button>
<el-button type="primary" @click="dataFormSubmit()">{{ 'btn.confirm' | i18nFilter }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { dataDictionaryDataDetail, dataDictionaryDataUpdate, dataDictionaryDataAdd } from '@/api/basicData/dataDictionary'
export default {
data() {
return {
visible: false,
dataForm: {
id: 0,
dataName: '',
dataCode: '',
remark: '',
dictTypeId: ''
},
dataRule: {
dataName: [
{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.dataDictionary.dataDictionaryName')]),
trigger: 'blur' }
],
dataCode: [
{
required: true,
message: this.$i18nForm(['placeholder.input', this.$t('module.basicData.dataDictionary.dataDictionaryCode')]),
trigger: 'blur' }
]
}
}
},
methods: {
init(id) {
this.dataForm.dictTypeId = this.$route.query.dictTypeId
this.dataForm.id = id || ''
this.visible = true
this.$nextTick(() => {
this.$refs['dataForm'].resetFields()
if (this.dataForm.id) {
dataDictionaryDataDetail(this.dataForm.id).then(res => {
this.dataForm = res.data
})
}
})
},
// 表单提交
dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => {
if (valid) {
const data = this.dataForm
if (this.dataForm.id) {
dataDictionaryDataUpdate(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
} else {
dataDictionaryDataAdd(data).then(res => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.visible = false
this.$emit('refreshDataList')
}
})
})
}
}
})
}
}
}
</script>

202
src/views/basicData/components/dataDictionaryData.vue Normal file
View File

@@ -0,0 +1,202 @@
<!--
* @Author: zwq
* @Date: 2020-12-29 15:41:11
* @LastEditors: zwq
* @LastEditTime: 2021-04-16 13:23:15
* @Description:
-->
<template>
<div class="app-container">
<el-form
:model="listQuery"
:inline="true"
size="medium"
label-width="160px"
>
<el-form-item :label="$t('module.basicData.dataDictionary.dataDictionaryName')" prop="dataName">
<el-input v-model="listQuery.dataName" :placeholder="$i18nForm(['placeholder.input', this.$t('module.basicData.dataDictionary.dataDictionaryName')])" style="width:200px" clearable />
</el-form-item>
<el-form-item :label="$t('module.basicData.dataDictionary.dataDictionaryCode')" prop="dataCode">
<el-input v-model="listQuery.dataCode" :placeholder="$i18nForm(['placeholder.input', this.$t('module.basicData.dataDictionary.dataDictionaryCode')])" style="width:200px" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getList()"> {{ 'btn.search' | i18nFilter }} </el-button>
<el-button type="primary" @click="addNew()"> {{ 'btn.add' | i18nFilter }} </el-button>
<el-button type="success" @click="goback()">{{ 'btn.back' | i18nFilter }}</el-button>
</el-form-item>
</el-form>
<base-table
:page="listQuery.current"
:limit="listQuery.size"
:table-config="tableProps"
:table-data="list"
:is-loading="listLoading"
>
<method-btn
slot="handleBtn"
:width="trueWidth"
:method-list="tableBtn"
@clickBtn="handleClick"
/>
</base-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="listQuery.current"
:limit.sync="listQuery.size"
@pagination="getList()"
/>
<dataDictionaryData-add v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
</div>
</template>
<script>
import { dataDictionaryDataList, dataDictionaryDataDelete } from '@/api/basicData/dataDictionary'
import DataDictionaryDataAdd from './dataDictionaryData-add.vue'
import BaseTable from '@/components/BaseTable'
import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
import i18n from '@/lang'
/**
* 表格表头配置项 TypeScript接口注释
* tableConfig<ConfigItem> = []
*
* Interface ConfigItem = {
* prop: string,
* label: string,
* width: string,
* align: string,
* subcomponent: function,
* filter: function
* }
*
*
*/
const tableBtn = [
{
type: 'edit',
btnName: 'btn.edit'
},
{
type: 'delete',
btnName: 'btn.delete'
}
]
const tableProps = [
{
prop: 'typeCode',
label: i18n.t('module.basicData.materialsType.TypeCode'),
align: 'center'
},
{
prop: 'dataName',
label: i18n.t('module.basicData.dataDictionary.dataDictionaryName'),
align: 'center'
},
{
prop: 'dataCode',
label: i18n.t('module.basicData.dataDictionary.dataDictionaryCode'),
align: 'center'
},
{
prop: 'remark',
label: i18n.t('module.basicData.visual.Remarks'),
align: 'center'
}
]
export default {
name: 'Factory',
components: { Pagination, BaseTable, MethodBtn, DataDictionaryDataAdd },
filters: {
statusFilter(status) {
const statusMap = {
published: 'success',
draft: 'info',
deleted: 'danger'
}
return statusMap[status]
}
},
data() {
return {
addOrUpdateVisible: false,
tableBtn,
trueWidth: 200,
tableProps,
list: [],
total: 0,
listLoading: true,
listQuery: {
current: 1,
size: 10,
dictTypeId: '',
dataName: '',
dataCode: ''
}
}
},
created() {
this.listQuery.dictTypeId = this.$route.query.dictTypeId
this.getList()
},
methods: {
handleClick(raw) {
if (raw.type === 'delete') {
this.$confirm(`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.dataName}]?`, this.$t('module.basicData.visual.Tips'), {
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
type: 'warning'
}).then(() => {
dataDictionaryDataDelete(raw.data.id).then(response => {
this.$message({
message: this.$t('module.basicData.visual.success'),
type: 'success',
duration: 1500,
onClose: () => {
this.getList()
}
})
})
}).catch(() => {})
} else {
this.addNew(raw.data.id)
}
},
getList() {
this.listLoading = true
dataDictionaryDataList(this.listQuery).then(response => {
if (response.data.records) {
this.list = response.data.records
} else {
this.list.splice(0, this.list.length)
}
this.total = response.data.total
this.listLoading = false
})
},
// 新增 / 修改
addNew(id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id)
})
},
goback() {
this.$router.go(-1)
}
}
}
</script>
<style scoped>
.edit-input {
padding-right: 100px;
}
.cancel-btn {
position: absolute;
right: 15px;
top: 10px;
}
</style>