diff --git a/package.json b/package.json
index 60c12d0..962d2e2 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
"dependencies": {
"@smallwei/avue": "^2.9.15",
"@tinymce/tinymce-vue": "^3.2.8",
+ "af-table-column": "^1.0.3",
"avue-plugin-map": "^1.0.1",
"axios": "0.18.1",
"core-js": "3.6.5",
diff --git a/src/api/system/customForm.js b/src/api/system/customForm.js
index 63a7b24..ba03a48 100644
--- a/src/api/system/customForm.js
+++ b/src/api/system/customForm.js
@@ -42,3 +42,10 @@ export function update(params) {
isLoading:false
})
}
+
+export function realTableIndex() {
+ return request({
+ method: "get",
+ url: '/api/admin/custom-form/real-table-index'
+ })
+}
diff --git a/src/components/XyTable/index.vue b/src/components/XyTable/index.vue
index aa0ecac..7525b4c 100644
--- a/src/components/XyTable/index.vue
+++ b/src/components/XyTable/index.vue
@@ -196,6 +196,13 @@ export default {
},
methods: {
//方法
+ calculateTextWidth(text) {
+ const canvas = document.createElement('canvas');
+ const context = canvas.getContext('2d');
+ context.font = '14px Arial'; // Set the font size and family to match the table cell's font
+ const metrics = context.measureText(text);
+ return metrics.width;
+ },
initLoad() {
let clientHeight = document.documentElement.clientHeight;
let lxheader = document
@@ -237,6 +244,7 @@ export default {
this.totalData = res.data.total;
setTimeout(() => {
this.loading = false;
+
}, 300);
})
.catch((err) => {
@@ -255,6 +263,7 @@ export default {
this.totalData = res.total;
setTimeout(() => {
this.loading = false;
+
}, 300);
})
.catch((err) => {
@@ -785,7 +794,7 @@ export default {
return $scopedSlots[item.prop](item, index);
}
return (
- {
return (
-
+ >
);
})
: ""}
-
+
);
})}
{$scopedSlots.btns ? $scopedSlots.btns() : this.isCreateAuthBtns()}
diff --git a/src/const/addProps.js b/src/const/addProps.js
index 03cb3d1..edd8a70 100644
--- a/src/const/addProps.js
+++ b/src/const/addProps.js
@@ -6,10 +6,12 @@ export const addPropsMap = new Map([
}],
["richtext",{}],
['radio',{
-
+ clearable: true
}],
["checkbox", {
-
+ collapseTags: true,
+ multiple: true,
+ clearable: true
}],
["date", {
clearable: true,
diff --git a/src/const/inputType.js b/src/const/inputType.js
index 032629c..91d8ebc 100644
--- a/src/const/inputType.js
+++ b/src/const/inputType.js
@@ -1,8 +1,8 @@
export const domMap = new Map([
["text", "el-input"],
["richtext",'my-tinymce'],
- ['radio','el-radio-group'],
- ["checkbox", "el-checkbox-group"],
+ ['radio','el-select'],
+ ["checkbox", "el-select"],
["date", "el-date-picker"],
["datetime", "el-date-picker"],
["file","el-upload"],
diff --git a/src/const/templateProps.js b/src/const/templateProps.js
index 6576107..8b931f1 100644
--- a/src/const/templateProps.js
+++ b/src/const/templateProps.js
@@ -5,10 +5,17 @@ export const templatePropsMap = new Map([
clearable: true
}],
["richtext",'my-tinymce'],
+ ['select', {
+ value: '选项1',
+ readonly: true
+ }],
['radio',{
- value: '选项1'
+ value: '选项1',
+ readonly: true
}],
["checkbox", {
+ multiple: true,
+ readonly: true,
value: ['选项1']
}],
["date", {
diff --git a/src/main.js b/src/main.js
index 4c756ca..ab218e5 100644
--- a/src/main.js
+++ b/src/main.js
@@ -79,6 +79,8 @@ import tinymce from '@/components/XyTinymce'
Vue.component('my-tinymce',tinymce)
import myMap from "@/components/XyMap"
Vue.component('my-map',myMap)
+import afTableColumn from 'af-table-column'
+Vue.component('af-table-column',afTableColumn)
Vue.prototype.$integrateData = (target,value) => {
for(let i in target){
diff --git a/src/views/component/dialog.vue b/src/views/component/dialog.vue
index 31563f1..3de0beb 100644
--- a/src/views/component/dialog.vue
+++ b/src/views/component/dialog.vue
@@ -54,6 +54,10 @@ export default {
props: {
label: i.name,
prop: i.field,
+ required:
+ i.validation instanceof Array
+ ? !!i.validation.find((i) => i === "required")
+ : false,
},
},
[
@@ -61,6 +65,9 @@ export default {
domMap.get(i.edit_input),
{
ref: `elEdit_${i.field}`,
+ style: {
+ width: "100%",
+ },
props: {
...addPropsMap.get(i.edit_input),
...this.extraProps(i),
@@ -79,6 +86,55 @@ export default {
}
},
},
+ scopedSlots:
+ i.edit_input === "file" || i.edit_input === "files"
+ ? {
+ file: (scope) => {
+ let { file } = scope;
+
+ console.log(111, file);
+ return [
+ h("div", {}, [
+ h("i", {
+ class: {
+ "el-icon-circle-check":
+ file.status === "success",
+ "el-icon-loading":
+ file.status === "uploading",
+ },
+ style: {
+ "color": file.status === "success" ? "green" : ""
+ }
+ }),
+ h(
+ "a",
+ {
+ attrs: {
+ href: file.url,
+ download: file.name,
+ },
+ class: {
+ "uploaded-a":
+ file.status === "success",
+ }
+ },
+ file.name
+ )
+ ]),
+ h("i", {
+ class: "el-icon-close",
+ on: {
+ ["click"]: () =>
+ this.fileRemoveHandler(
+ file,
+ i.field
+ ),
+ },
+ }),
+ ];
+ },
+ }
+ : "",
},
this.optionsRender(h, i)
),
@@ -136,12 +192,14 @@ export default {
dialogVisible: false,
form: {},
rules: {},
- file: {
-
- }
+ file: {},
};
},
methods: {
+ fileRemoveHandler(file, field) {
+ this.file[field] = this.file[field].filter((item) => item !== file);
+ this.file = Object.assign({}, this.file);
+ },
//on事件类别获取
getEventType(info) {
if (info.type === "checkbox") {
@@ -152,25 +210,15 @@ export default {
//渲染一些组件内部需要选项等
optionsRender(h, info) {
- if (info.edit_input === "radio") {
+ if (info.edit_input === "checkbox" || info.edit_input === "radio") {
return info._paramters && info._paramters instanceof Array
? info._paramters.map((i) =>
- h(
- "el-radio",
- { props: { label: i.id } },
- i.name || i.no || i.value || i.id
- )
- )
- : [];
- }
- if (info.edit_input === "checkbox") {
- return info._paramters && info._paramters instanceof Array
- ? info._paramters.map((i) =>
- h(
- "el-checkbox",
- { props: { label: i.id } },
- i.name || i.no || i.value || i.id
- )
+ h("el-option", {
+ props: {
+ label: i.name || i.no || i.value || i.id,
+ value: i.id,
+ },
+ })
)
: [];
}
@@ -238,6 +286,14 @@ export default {
props.onRemove = (file, fileList) => {
this.file[info.field] = fileList;
};
+
+ props.onError = (err,file,fileList) => {
+ this.file[info.field] = fileList;
+ this.$message({
+ type: "warning",
+ message: err
+ })
+ }
}
return props;
},
@@ -278,6 +334,18 @@ export default {
const res = await show({ id: this.id, table_name: this.tableName });
this.$integrateData(this.form, res);
this.form = Object.assign({}, this.form);
+
+ this.formInfo.forEach((i) => {
+ if (i && i.edit_input === "file") {
+ this.file[i.field] = [
+ {
+ name: res[i.link_with_name]?.original_name,
+ url: res[i.link_with_name]?.url,
+ response: res[i.link_with_name],
+ },
+ ];
+ }
+ });
},
submit() {
@@ -302,8 +370,8 @@ export default {
(i) => i?.response?.id
);
}
- if(info.edit_input === "file") {
- this.form[info.field] = this.file[info.field][0]?.response?.id
+ if (info.edit_input === "file") {
+ this.form[info.field] = this.file[info.field][0]?.response?.id;
}
});
console.log(this.form);
@@ -330,7 +398,11 @@ export default {
newVal.forEach((i) => {
if (i.field) {
this.form[i.field] = "";
- if (i.validation instanceof Array && i.validation.length > 0) {
+ if (
+ i.validation instanceof Array &&
+ i.validation.length > 0 &&
+ !!i.validation.find((i) => i === "required")
+ ) {
this.rules[i.field] = [
{ required: true, message: `请填写${i.name}` },
];
@@ -338,7 +410,7 @@ export default {
if (i.edit_input === "files") {
this.form[i.field] = [];
}
- if(i.edit_input === "files" || i.edit_input === "file") {
+ if (i.edit_input === "files" || i.edit_input === "file") {
this.file[i.field] = [];
}
if (i.edit_input === "checkbox") {
@@ -355,6 +427,7 @@ export default {
this.$nextTick(() => this.getDetail());
}
} else {
+ this.file = {};
this.id = "";
this.type = "";
this.init();
@@ -366,4 +439,15 @@ export default {
};
-
+
diff --git a/src/views/component/imports.vue b/src/views/component/imports.vue
index ea46280..00cca11 100644
--- a/src/views/component/imports.vue
+++ b/src/views/component/imports.vue
@@ -43,7 +43,7 @@
import * as XLSX from "xlsx";
import { saveAs } from "file-saver";
import { getToken } from "@/utils/auth";
-import { imports } from "@/api/system/baseForm"
+import { imports } from "@/api/system/baseForm";
export default {
props: {
formInfo: {
diff --git a/src/views/component/table.vue b/src/views/component/table.vue
index 0113ce5..da64d49 100644
--- a/src/views/component/table.vue
+++ b/src/views/component/table.vue
@@ -141,7 +141,7 @@
-
+
diff --git a/src/views/system/components/formEditor.vue b/src/views/system/components/formEditor.vue
index 4d580cb..b56794a 100644
--- a/src/views/system/components/formEditor.vue
+++ b/src/views/system/components/formEditor.vue
@@ -63,6 +63,7 @@
>