add 文件上传
This commit is contained in:
parent
6063f40606
commit
cb3e47a45e
@ -46,6 +46,19 @@
|
|||||||
:disabled="detailMode"
|
:disabled="detailMode"
|
||||||
/>
|
/>
|
||||||
<el-input v-if="col.textarea" type="textarea" v-model="dataForm[col.prop]" :disabled="detailMode" v-bind="col.elparams" />
|
<el-input v-if="col.textarea" type="textarea" v-model="dataForm[col.prop]" :disabled="detailMode" v-bind="col.elparams" />
|
||||||
|
<el-upload
|
||||||
|
v-if="col.upload"
|
||||||
|
:key="'upload_' + Math.random()"
|
||||||
|
:action="col.actionUrl"
|
||||||
|
:file-list="col.fileList"
|
||||||
|
:disabled="detailMode || !dataForm.id"
|
||||||
|
:on-change="handleUploadChange"
|
||||||
|
v-bind="col.elparams"
|
||||||
|
:headers="uploadHeaders"
|
||||||
|
>
|
||||||
|
<el-button type="primary" size="small">选择文件</el-button>
|
||||||
|
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
|
||||||
|
</el-upload>
|
||||||
<div class="" v-if="col.component" style="margin: 42px 0 0">
|
<div class="" v-if="col.component" style="margin: 42px 0 0">
|
||||||
<!-- 下面这个 component 几乎是为 富文本 quill 定制的了... TODO:后续可能会根据业务需求创建新的版本 -->
|
<!-- 下面这个 component 几乎是为 富文本 quill 定制的了... TODO:后续可能会根据业务需求创建新的版本 -->
|
||||||
<component
|
<component
|
||||||
@ -76,6 +89,7 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { pick as __pick } from "@/utils/filters";
|
import { pick as __pick } from "@/utils/filters";
|
||||||
|
import Cookies from 'js-cookie'
|
||||||
|
|
||||||
function reConstructTreeData(listObj) {
|
function reConstructTreeData(listObj) {
|
||||||
const entry = [];
|
const entry = [];
|
||||||
@ -112,7 +126,8 @@ export default {
|
|||||||
const dataForm = {};
|
const dataForm = {};
|
||||||
this.configs.form.rows.forEach((row) => {
|
this.configs.form.rows.forEach((row) => {
|
||||||
row.forEach((col) => {
|
row.forEach((col) => {
|
||||||
dataForm[col.prop] = col.default ?? null;
|
if (col.upload) dataForm[col.prop] = col.default ?? [];
|
||||||
|
else dataForm[col.prop] = col.default ?? null;
|
||||||
|
|
||||||
if (col.fetchData)
|
if (col.fetchData)
|
||||||
col.fetchData().then(({ data: res }) => {
|
col.fetchData().then(({ data: res }) => {
|
||||||
@ -148,7 +163,7 @@ export default {
|
|||||||
col.options.splice(0);
|
col.options.splice(0);
|
||||||
}
|
}
|
||||||
|
|
||||||
return col
|
return col;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@ -164,6 +179,13 @@ export default {
|
|||||||
created() {
|
created() {
|
||||||
// console.log('[dialog] created!!! wouldn\'t create again...')
|
// console.log('[dialog] created!!! wouldn\'t create again...')
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
uploadHeaders() {
|
||||||
|
return {
|
||||||
|
token: Cookies.get('token') || ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
/** utitilities */
|
/** utitilities */
|
||||||
showButton(operate) {
|
showButton(operate) {
|
||||||
@ -213,7 +235,7 @@ export default {
|
|||||||
if (res && res.code === 0) {
|
if (res && res.code === 0) {
|
||||||
const dataFormKeys = Object.keys(this.dataForm);
|
const dataFormKeys = Object.keys(this.dataForm);
|
||||||
console.log("keys ===> ", dataFormKeys);
|
console.log("keys ===> ", dataFormKeys);
|
||||||
|
|
||||||
// console.log('data form keys: ', dataFormKeys, pick(res.data, dataFormKeys))
|
// console.log('data form keys: ', dataFormKeys, pick(res.data, dataFormKeys))
|
||||||
this.dataForm = __pick(res.data, dataFormKeys);
|
this.dataForm = __pick(res.data, dataFormKeys);
|
||||||
console.log("pick(res.data, dataFormKeys) ===> ", __pick(res.data, dataFormKeys));
|
console.log("pick(res.data, dataFormKeys) ===> ", __pick(res.data, dataFormKeys));
|
||||||
@ -297,6 +319,10 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
handleUploadChange(file, fileList) {
|
||||||
|
console.log('[Upload] handleUploadChange...', file, fileList)
|
||||||
|
},
|
||||||
|
|
||||||
handleClose() {
|
handleClose() {
|
||||||
// this.resetForm();
|
// this.resetForm();
|
||||||
this.selfVisible = false;
|
this.selfVisible = false;
|
||||||
|
39
src/components/noTemplateComponents/uploadComponent.js
Normal file
39
src/components/noTemplateComponents/uploadComponent.js
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
export default {
|
||||||
|
name: 'UploadComponent',
|
||||||
|
props: {
|
||||||
|
existingFiles: {
|
||||||
|
type: Array,
|
||||||
|
default: () => [ /** { }, { }, ... */]
|
||||||
|
},
|
||||||
|
typeCode: {
|
||||||
|
type: String,
|
||||||
|
default: '' // 文件类型编码
|
||||||
|
},
|
||||||
|
bind: { // element-ui 的 props
|
||||||
|
type: Object,
|
||||||
|
default: () => ({})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
fileList: {
|
||||||
|
set(list) { },
|
||||||
|
get() {
|
||||||
|
// TODO:计划要根据 existingFiles 来过滤
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
},
|
||||||
|
render: function (h) {
|
||||||
|
return h('el-upload', { props: { action: this.bind.action ?? '#', 'file-list': this.fileList } }, [
|
||||||
|
h('el-button', { props: { size: 'small', type: 'primary' } }, '选择文件'),
|
||||||
|
h('div', { slot: 'tip', 'class': 'el-upload__tip' }, '只能上传jpg/png文件,且不超过500kb')
|
||||||
|
])
|
||||||
|
}
|
||||||
|
}
|
@ -94,7 +94,7 @@ export default function () {
|
|||||||
],
|
],
|
||||||
// [{ textarea: true, label: "描述信息", prop: "description", elparams: { placeholder: "描述信息" } }],
|
// [{ textarea: true, label: "描述信息", prop: "description", elparams: { placeholder: "描述信息" } }],
|
||||||
[{ input: true, label: "备注", prop: "remark", elparams: { placeholder: "备注" } }],
|
[{ input: true, label: "备注", prop: "remark", elparams: { placeholder: "备注" } }],
|
||||||
[{ upload: true, label: "上传资料", prop: "upload", elparams: null }],
|
[{ upload: true, actionUrl: window.SITE_CONFIG['apiURL'] + '/pms/equipmentTypeFile', label: "上传资料", fileList:[], prop: "upload", elparams: null }],
|
||||||
],
|
],
|
||||||
operations: [
|
operations: [
|
||||||
{ name: "add", label: "保存", type: "primary", permission: "pms:equipmentType:save", showOnEdit: false },
|
{ name: "add", label: "保存", type: "primary", permission: "pms:equipmentType:save", showOnEdit: false },
|
||||||
|
@ -7,7 +7,7 @@ import initConfig from './config';
|
|||||||
import ListViewWithHead from '@/views/atomViews/ListViewWithHead.vue';
|
import ListViewWithHead from '@/views/atomViews/ListViewWithHead.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'ProductionLineView',
|
name: 'EquipmentTypeView',
|
||||||
components: { ListViewWithHead },
|
components: { ListViewWithHead },
|
||||||
provide() {
|
provide() {
|
||||||
return {
|
return {
|
||||||
|
Loading…
Reference in New Issue
Block a user