<template>
|
<GlobalWindow
|
:title="title"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<el-form :model="form" ref="form" :rules="rules">
|
<el-form-item label="属性名称:" prop="name">
|
<el-input v-model="form.name" placeholder="请输入属性名称" max="20" v-trim/>
|
</el-form-item>
|
<el-form-item label="工序:" prop="procedureId">
|
<el-select style="width:48%;" v-model="factory" placeholder="请选择工厂" @visible-change="visibleChange" :loading="loading" filterable clearable @change="selectFactory">
|
<el-option
|
v-for="item in factoreis"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
>
|
</el-option>
|
</el-select>
|
<div style="width:4%;display: inline-block;"></div>
|
<el-select style="width:48%" v-model="form.procedureId" filterable clearable placeholder="请选择工序">
|
<el-option
|
v-for="item in productes"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="字段类型:" prop="type">
|
<el-select v-model="form.type" filterable clearable placeholder="请选择字段类型">
|
<el-option
|
v-for="item in options"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item v-if="form.type==0||form.type==1" label="选项内容:" prop="remark">
|
<el-input v-model="form.remark" placeholder="每个选项最多10个字,同时新建多个选项时,请用“空格”隔开" v-trim/>
|
</el-form-item>
|
<el-form-item label="提示文字:" prop="tips">
|
<el-input v-model="form.tips" placeholder="请输入提示文字" v-trim/>
|
</el-form-item>
|
<el-form-item label="排序码:" prop="sortnum">
|
<el-input v-model="form.sortnum" placeholder="请输入排序码,升序,只能输入数字" v-trim/>
|
</el-form-item>
|
<el-form-item label="是否启用:" prop="status" >
|
<el-switch v-model="form.status" :inactive-value="0" :active-value="1"></el-switch>
|
</el-form-item>
|
<!-- <el-form-item label="是否必填:" prop="isRequired" >
|
<el-switch v-model="form.isRequired" :inactive-value="0" :active-value="1"></el-switch>
|
</el-form-item> -->
|
</el-form>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import { getDepartmentListByConditon } from '@/api/ext/departmentExt'
|
import { productesGroup } from '@/api/ext/proceduresExt'
|
export default {
|
name: 'OperaCheckAttrExtWindow',
|
extends: BaseOpera,
|
components: { GlobalWindow },
|
|
data () {
|
const valEndValue = (rule, value, callback) => {
|
if (this.form.remark === '' || this.form.remark === null) {
|
return callback(new Error('请输入选项类容'))
|
}
|
const array = this.form.remark.split(' ')
|
for (const item of array) {
|
if (item.length > 10) {
|
return callback(new Error('选项长度不能超过10'))
|
}
|
}
|
return callback()
|
}
|
return {
|
options: [
|
// 0单选 1多选 2文本 3数字 4日期
|
{ name: '单选', id: 0 },
|
{ name: '多选', id: 1 },
|
{ name: '文本', id: 2 },
|
{ name: '数字', id: 3 },
|
{ name: '日期', id: 4 }
|
],
|
factoreis: [],
|
factory: null,
|
loading: false,
|
productes: [],
|
// 表单数据
|
form: {
|
id: '',
|
remark: '',
|
procedureId: null,
|
type: null,
|
sortnum: '',
|
isRequired: 1,
|
status: 1,
|
tips: '',
|
name: ''
|
},
|
// 验证规则
|
rules: {
|
name: [
|
{ required: true, message: '请输入属性名称', trigger: 'blur' },
|
{ max: 20, message: '输入字数不超过20', trigger: 'blur' }
|
],
|
procedureId: [{ required: true, message: '请选择工序', trigger: 'change' }],
|
type: [{ required: true, message: "请选择类型", trigger: 'change' }],
|
remark: [{ required: true, validator: valEndValue, trigger: 'change' }],
|
tips: [{ max: 10, message: '输入字数不超过10', trigger: 'blur' }],
|
sortnum: [{ pattern: /^[0-9]+$/, message: '只能输入数字', trigger: 'change' }]
|
}
|
}
|
},
|
created () {
|
this.config({
|
api: '/ext/checkAttrExt',
|
'field.id': 'id'
|
})
|
|
},
|
methods: {
|
visibleChange(e) {
|
if (e) {
|
this.loading = true
|
getDepartmentListByConditon({
|
type: 1
|
})
|
.then(res => {
|
// console.log(res)
|
this.factoreis = res
|
this.loading = false
|
})
|
.catch(err => {
|
this.loading = false
|
console.log(err)
|
})
|
}
|
},
|
open (title, target) {
|
this.title = title
|
this.visibleChange(true)
|
this.visible = true
|
// 新建
|
if (target == null) {
|
this.$nextTick(() => {
|
this.$refs.form.resetFields()
|
this.factory = null
|
this.form.remark = null
|
this.$refs.form.clearValidate()
|
this.form[this.configData['field.id']] = null
|
})
|
return
|
}
|
// 编辑
|
this.$nextTick(() => {
|
for (const key in this.form) {
|
this.form[key] = target[key]
|
}
|
this.factory = target.pmodel.orgId
|
this.getProcedure(target.pmodel.orgId)
|
})
|
},
|
selectFactory (v) {
|
// console.log(this.form.remark);
|
this.form.procedureId = null
|
this.getProcedure(v)
|
},
|
getProcedure (v) {
|
productesGroup({ orgId: v })
|
.then(res => {
|
this.productes = res
|
})
|
.catch(err => {
|
console.log(err)
|
})
|
}
|
}
|
}
|
</script>
|