You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
7179 lines
233 KiB
7179 lines
233 KiB
<!--
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-06-13 08:43:17
|
|
@ 备注: 表单控件（app）专用
|
|
-->
|
|
<script lang="ts" setup>
|
|
import { reactive, computed, toRefs, ref, watch, inject } from "vue";
|
|
import { getRequest } from "@/api/DesignForm";
|
|
import { useDesignFormStore } from "@/store/DesignForm/designForm";
|
|
import validate from "./validate";
|
|
import validateText from "./validateText";
|
|
import validateInt from "./validateInt";
|
|
import { ValidateTextTypes } from "@/components/DesignForm/validateText";
|
|
import { ElMessage } from "element-plus";
|
|
import { formatNumber } from "@/api/DesignForm/utils";
|
|
import { getOrgTreeList } from "@/api/hr/org/index";
|
|
import { orgInfo } from "@/api/hr/org/type";
|
|
|
|
|
|
import {
|
|
PublicAtrr,
|
|
formStruct,
|
|
CarsuselConfig,
|
|
VideoMsg,
|
|
optionsInfo,
|
|
} from "@/api/DesignForm/types";
|
|
|
|
import {
|
|
getAiagentList
|
|
} from "@/api/doc/space";
|
|
|
|
import {
|
|
chineseToPinyin,
|
|
customerFormGroupList,
|
|
gainDataStorceAllField,
|
|
} from "@/api/DesignForm/requestapi";
|
|
import request from "@/utils/request";
|
|
|
|
//数学计算公式编辑器
|
|
import MathFormula from "@/components/DesignForm/math/mathFormula.vue";
|
|
|
|
import { uploadUrl } from "@/api/DesignForm";
|
|
import { UploadFilled } from "@element-plus/icons-vue";
|
|
import { UploadFile, UploadFiles } from "element-plus/es/components/upload/src/upload";
|
|
import type Node from "element-plus/es/components/tree/src/model/node";
|
|
//样式布局
|
|
import LayoutPage from "@/components/DesignForm/layoutPage/index.vue";
|
|
|
|
import { Plus } from "@element-plus/icons-vue";
|
|
|
|
import Draggable from "vuedraggable-es";
|
|
import { dataBaseStruct } from "@/api/date/type";
|
|
|
|
import { analysisFromUnit } from "@/api/DesignForm/filterUnit";
|
|
|
|
const props = withDefaults(
|
|
//接收父级参数
|
|
defineProps<{
|
|
formData: any;
|
|
formList: any;
|
|
formConfig: any;
|
|
formOtherData: any;
|
|
customerformid: number | string;
|
|
formInfo: any;
|
|
isEdit: boolean;
|
|
formField: any[];
|
|
sunFormField: any[];
|
|
state: formStruct;
|
|
}>(),
|
|
{
|
|
formConfig: () => {
|
|
return {};
|
|
},
|
|
isEdit: () => {
|
|
return false;
|
|
},
|
|
formField: () => {
|
|
return [];
|
|
},
|
|
sunFormField: () => {
|
|
return [];
|
|
},
|
|
formOtherData: () => {
|
|
// 其他不需要保存在formData里的数据
|
|
return {};
|
|
},
|
|
}
|
|
);
|
|
const mathBoxShow = ref(false);
|
|
//注册自定义事件
|
|
const emits = defineEmits<{
|
|
(e: "openDialog", data: any): void;
|
|
(e: "update:formOtherData", data: any): void;
|
|
(e: "videoMsgChange", data: VideoMsg): void;
|
|
(e: "formNameChange", data: any): void;
|
|
//(e: 'update:formData', data: any): void
|
|
//(e: 'update:formConfig', data: any): void
|
|
}>();
|
|
const { formConfig, formData } = toRefs(props);
|
|
const store = useDesignFormStore() as any;
|
|
const controlData = computed(() => {
|
|
// console.log("注册自定义事件----------------->",props.formInfo)
|
|
// console.log("注册自定义事件--------1--------->", store.controlAttr);
|
|
// console.log("注册自定义事件---------3-------->", controlData.value.customRules);
|
|
return store.controlAttr;
|
|
});
|
|
//获取组件样式Demo
|
|
const controlDataStyls = computed(() => {
|
|
return store.controlAttr.styles;
|
|
});
|
|
|
|
const openDataSourceBox = ref(false);
|
|
|
|
const dataSourceOption = ref([]);
|
|
const designType = inject("formDesignType");
|
|
const state = reactive({
|
|
dataSourceList: [],
|
|
customRulesList: [
|
|
...validate,
|
|
{
|
|
type: "rules",
|
|
label: "自定义正则",
|
|
},
|
|
{
|
|
type: "methods",
|
|
label: "自定义方法",
|
|
},
|
|
], // 自定义校验规则
|
|
isSearch: designType === "search",
|
|
tooltip: {
|
|
css: "当前表单应用页的样式，类似于.vue文件中的style scoped中的样式",
|
|
dict:
|
|
'数据字典，用于匹配多选组、下拉选择等，提供动态获取Options接口字典数据，一般不设置，从接口dict获取。json格式："sex":{"0":"男","1":"女"}',
|
|
rules:
|
|
"可参考UI组件表单校验，<a href='https://element-plus.gitee.io/zh-CN/component/form.html#%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C' target='_blank' style='color:red'>详情点击</a>",
|
|
props: "可添加当前组件所有prop属性及事件方法",
|
|
},
|
|
tabsName: "second",
|
|
numberRulesList: [
|
|
{
|
|
type: "time",
|
|
label: "时间",
|
|
msg: "请选择时间格式",
|
|
},
|
|
{
|
|
type: "text",
|
|
label: "自定义字符",
|
|
msg: "请输入自定义字符",
|
|
},
|
|
{
|
|
type: "serialnumber",
|
|
label: "流水序号",
|
|
msg: "流水号起始值",
|
|
},
|
|
{
|
|
type: "randomnumber",
|
|
label: "随机数",
|
|
msg: "请输入随机数位数",
|
|
},
|
|
],
|
|
});
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-08-14 08:41:02
|
|
@ 功能: 必填
|
|
*/
|
|
const ValidateText = reactive<ValidateTextTypes>({
|
|
type: "required",
|
|
label: "必填",
|
|
regExp: /^\s*$/,
|
|
message: "必填项",
|
|
checkbox: false,
|
|
});
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-08-14 08:41:02
|
|
@ 功能: 单选校验
|
|
*/
|
|
const radioVerify = reactive<ValidateTextTypes>({});
|
|
|
|
const textUinrVerfy = reactive([...validateText]);
|
|
const numberUinrVerfy = reactive([...validateInt]);
|
|
|
|
const formAttr = computed(() => {
|
|
const isSearch = state.isSearch;
|
|
return [
|
|
{
|
|
label: "数据源",
|
|
placeholder: "请选择引用的数据源",
|
|
value: 1,
|
|
key: "dataSourceSetup",
|
|
type: "dataSourceSetup",
|
|
hide: isSearch,
|
|
options: [
|
|
{
|
|
label: "无",
|
|
value: "no",
|
|
},
|
|
{
|
|
label: "引用数据源",
|
|
value: "yes",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
label: "表单名称",
|
|
placeholder: "用于保存的表单名称",
|
|
value: formData.value.formName,
|
|
key: "formName",
|
|
hide: isSearch,
|
|
disabled: false,
|
|
},
|
|
{
|
|
label: "数据源",
|
|
placeholder: "请选择数据源",
|
|
value: formatNumber(props.formOtherData.source),
|
|
type: "select",
|
|
options: dataSourceOption.value,
|
|
key: "source",
|
|
hide: isSearch || !dataSourceOption.value?.length,
|
|
clearable: true,
|
|
},
|
|
{
|
|
label: "表单标识",
|
|
value: formData.value.name,
|
|
placeholder: "表单唯一标识，可为空",
|
|
key: "name",
|
|
hide: isSearch,
|
|
disabled: false,
|
|
},
|
|
// {
|
|
// label: '表单标签宽度',
|
|
// value: formData.value.labelWidth,
|
|
// placeholder: '表单label宽，如180px',
|
|
// key: 'labelWidth'
|
|
// },
|
|
// {
|
|
// label: '表单样式名称',
|
|
// value: formData.value.class,
|
|
// placeholder: '额外添加的表单class类名',
|
|
// key: 'class',
|
|
// type: 'select',
|
|
// options: [
|
|
// { label: '无样式', value: '',name:'',id:'' },
|
|
// { label: '每行两列', value: 'form-row-2',name:'',id:'' },
|
|
// { label: '每行三列', value: 'form-row-3',name:'',id:'' },
|
|
// { label: '每行四列', value: 'form-row-4',name:'',id:'' }
|
|
// ],
|
|
// hide: isSearch,
|
|
// clearable: true
|
|
// },
|
|
// {
|
|
// label: '字段名后添加冒号',
|
|
// value: formData.value.showColon,
|
|
// key: 'showColon',
|
|
// type: 'switch'
|
|
// },
|
|
// {
|
|
// label: '组件尺寸',
|
|
// value: formData.value.size,
|
|
// type: 'select',
|
|
// key: 'size',
|
|
// options: [
|
|
// { label: 'large', value: 'large',name:'',id:'' },
|
|
// { label: 'default', value: 'default',name:'',id:'' },
|
|
// { label: 'small', value: 'small',name:'',id:'' }
|
|
// ]
|
|
// }
|
|
/*{
|
|
label: '筛选条件展开/收起',
|
|
value: formConfig.value.expand,
|
|
type: 'switch',
|
|
path: 'config',
|
|
key: 'expand',
|
|
hide: !isSearch
|
|
}*/
|
|
];
|
|
});
|
|
const attrList = computed(() => {
|
|
// console.log("controlData.value-1-->",controlData.value)
|
|
if (Object.keys(controlData.value).length) {
|
|
const {
|
|
control = {},
|
|
type,
|
|
name,
|
|
config = {},
|
|
item = {},
|
|
attr = {},
|
|
selectvalue = "default",
|
|
mathFormula = {},
|
|
unitName,
|
|
}: {
|
|
control: any;
|
|
type: any;
|
|
name: any;
|
|
item: any;
|
|
attr: any;
|
|
config: any;
|
|
selectvalue: any;
|
|
mathFormula: any;
|
|
unitName: any;
|
|
} = controlData.value;
|
|
// console.log("controlData.value--->",controlData.value)
|
|
// console.log("controlData.value-1-->",unitName)
|
|
let columnIndex = false; // 是否显示序号列
|
|
if (type === "table") {
|
|
// 表格时处理
|
|
const list = controlData.value && controlData.value.list;
|
|
if (list && list.length > 0) {
|
|
columnIndex = list[0].type === "index";
|
|
}
|
|
}
|
|
//判断校验规则
|
|
// console.log("判断校验规则--->", item);
|
|
if (typeof controlData.value.customRules == "object") {
|
|
if (Array.isArray(controlData.value.customRules)) {
|
|
let otherPick: any[] = [];
|
|
controlData.value.customRules.forEach((item: any) => {
|
|
// console.log("判断校验规则-1-->", item);
|
|
if (item.type == ValidateText.type) {
|
|
ValidateText.checkbox = true;
|
|
} else {
|
|
otherPick.push(item);
|
|
}
|
|
});
|
|
if (otherPick.length > 0) {
|
|
otherPick.forEach((item: any) => {
|
|
radioVerify.type = item.type;
|
|
radioVerify.label = item.label;
|
|
radioVerify.regExp = item.regExp;
|
|
radioVerify.message = item.message;
|
|
radioVerify.checkbox = true;
|
|
});
|
|
}
|
|
}
|
|
} else {
|
|
ValidateText.checkbox = false;
|
|
radioVerify.type = "";
|
|
}
|
|
// console.log("判断校验规则-1-->", item);
|
|
const temp = reactive<PublicAtrr[]>([
|
|
{
|
|
label: "标签名称",
|
|
value: item.label,
|
|
path: "item.label",
|
|
vHide: [
|
|
"grid",
|
|
"tabs",
|
|
"title",
|
|
"gridChild",
|
|
"div",
|
|
"inputSlot",
|
|
"flex",
|
|
"button",
|
|
"txt",
|
|
],
|
|
eventName: "labelNameVal",
|
|
},
|
|
{
|
|
label: "标题",
|
|
value: control.modelValue,
|
|
path: "control.modelValue",
|
|
vShow: ["title"],
|
|
},
|
|
{
|
|
label: "组件类型",
|
|
value: unitName,
|
|
placeholder: "组件类型",
|
|
path: "unitName",
|
|
},
|
|
// {
|
|
// label: '自定义Class',
|
|
// value: config.className,
|
|
// placeholder: '样式类名',
|
|
// path: 'config.className'
|
|
// },
|
|
{
|
|
label: "字段标识",
|
|
value: name,
|
|
type: Object.keys(state.dataSourceList).length > 0 ? "selectDataSoure" : "text",
|
|
placeholder: "字段唯一标识，对应数据库",
|
|
dict: state.dataSourceList,
|
|
path: "name",
|
|
vHide: [
|
|
"grid",
|
|
"tabs",
|
|
"card",
|
|
"title",
|
|
"gridChild",
|
|
"tableColumn",
|
|
"divider",
|
|
"txt",
|
|
"div",
|
|
"button",
|
|
],
|
|
eventName: "filedNameKey",
|
|
},
|
|
{
|
|
label: "占位内容",
|
|
value: control.placeholder,
|
|
placeholder: "placeholder",
|
|
path: "control.placeholder",
|
|
vShow: [
|
|
"password",
|
|
"input",
|
|
"textarea",
|
|
"select",
|
|
"date",
|
|
"number",
|
|
"datePicker",
|
|
"tinymce",
|
|
"timePicker",
|
|
"treeSelect",
|
|
"digitpage",
|
|
],
|
|
},
|
|
{
|
|
label: "帮助信息",
|
|
value: config.help,
|
|
path: "config.help",
|
|
vHide: [
|
|
"table",
|
|
"grid",
|
|
"tabs",
|
|
"gridChild",
|
|
"divider",
|
|
"div",
|
|
"inputSlot",
|
|
"flex",
|
|
"button",
|
|
"txt",
|
|
],
|
|
},
|
|
{
|
|
label: "按钮类型",
|
|
value: control.type,
|
|
path: "control.type",
|
|
type: "select",
|
|
dict: {
|
|
primary: "primary",
|
|
success: "success",
|
|
info: "info",
|
|
warning: "warning",
|
|
danger: "danger",
|
|
},
|
|
vShow: ["button"],
|
|
clearable: true,
|
|
},
|
|
{
|
|
label: "按钮名称",
|
|
value: control.label,
|
|
path: "control.label",
|
|
vShow: ["button"],
|
|
},
|
|
{
|
|
label: "按钮事件",
|
|
value: control.key,
|
|
path: "control.key",
|
|
type: "select",
|
|
dict: {
|
|
submit: "提交表单",
|
|
reset: "重置表单",
|
|
cancel: "取消返回",
|
|
none: "无动作(自定义)",
|
|
},
|
|
vShow: ["button"],
|
|
},
|
|
{
|
|
label: "对齐方式",
|
|
value: config.textAlign,
|
|
path: "config.textAlign",
|
|
type: "select",
|
|
dict: {
|
|
left: "left",
|
|
right: "right",
|
|
center: "center",
|
|
},
|
|
vShow: ["button", "div"],
|
|
},
|
|
|
|
{
|
|
label: "隐藏标签",
|
|
value: item.showLabel,
|
|
path: "item.showLabel",
|
|
type: "switch",
|
|
vHide: [
|
|
"table",
|
|
"grid",
|
|
"tabs",
|
|
"title",
|
|
"gridChild",
|
|
"divider",
|
|
"card",
|
|
"div",
|
|
"inputSlot",
|
|
"flex",
|
|
"button",
|
|
"txt",
|
|
],
|
|
},
|
|
|
|
|
|
/*{
|
|
label: '行类样式',
|
|
value: config.inline,
|
|
type: 'switch',
|
|
path: 'config.inline',
|
|
vShow: ['div']
|
|
},*/
|
|
{
|
|
label: "文本值",
|
|
value: control.modelValue,
|
|
placeholder: "支持html",
|
|
path: "control.modelValue",
|
|
vShow: ["txt"],
|
|
inputStyle: "textarea",
|
|
},
|
|
{
|
|
label: "设为密码",
|
|
value: type,
|
|
type: "select",
|
|
dict: { input: "文本", password: "密码" },
|
|
path: "type",
|
|
vShow: ["input", "password"],
|
|
vIf: state.isSearch, // 搜索模式下隐藏 为true
|
|
},
|
|
{
|
|
label: "文本域高度",
|
|
value: control.rows,
|
|
placeholder: "输入框行数",
|
|
path: "control.rows",
|
|
vShow: ["textarea"],
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "前缀",
|
|
value: config.prepend,
|
|
placeholder: "文本前缀",
|
|
path: "config.prepend",
|
|
vShow: ["input", "password"],
|
|
},
|
|
{
|
|
label: "后缀",
|
|
value: config.append,
|
|
placeholder: "文本后缀",
|
|
path: "config.append",
|
|
vShow: ["input", "password", "digitpage"],
|
|
},
|
|
|
|
// {
|
|
// label: '状态打开时的值',
|
|
// value: control.activeValue,
|
|
// placeholder: '状态打开时的值',
|
|
// path: 'control.activeValue',
|
|
// vShow: ['switch'],
|
|
// isNum: true
|
|
// },
|
|
// {
|
|
// label: '状态关闭时的值',
|
|
// value: control.inactiveValue,
|
|
// placeholder: '状态关闭时的值',
|
|
// path: 'control.inactiveValue',
|
|
// vShow: ['switch'],
|
|
// isNum: true
|
|
// },
|
|
// {
|
|
// label: '转换格式化值',
|
|
// value: config.transform,
|
|
// path: 'config.transform',
|
|
// type: 'switch',
|
|
// vShow: [
|
|
// 'checkbox',
|
|
// 'select',
|
|
// 'switch',
|
|
// 'cascader',
|
|
// 'slider',
|
|
// 'table',
|
|
// 'flex',
|
|
// 'treeSelect'
|
|
// ]
|
|
// },
|
|
{
|
|
label: "增加按钮文案",
|
|
value: config.addBtnText,
|
|
path: "config.addBtnText",
|
|
type: "text",
|
|
vShow: ["flex", "table"],
|
|
},
|
|
{
|
|
label: "删除按钮文案",
|
|
value: config.delBtnText,
|
|
path: "config.delBtnText",
|
|
type: "text",
|
|
vShow: ["flex", "table"],
|
|
},
|
|
{
|
|
label: "是否多选",
|
|
value: control.multiple,
|
|
path: "control.multiple",
|
|
type: "switch",
|
|
vShow: ["select", "treeSelect"],
|
|
eventName: "selectMultiple",
|
|
},
|
|
{
|
|
label: "可清空",
|
|
value: control.clearable,
|
|
path: "control.clearable",
|
|
type: "switch",
|
|
vShow: ["select"],
|
|
},
|
|
// {
|
|
// label: '是否禁用',
|
|
// value: control.disabled,
|
|
// path: 'control.disabled',
|
|
// type: 'switch',
|
|
// vShow: [
|
|
// 'input',
|
|
// 'password',
|
|
// 'textarea',
|
|
// 'radio',
|
|
// 'checkbox',
|
|
// 'select',
|
|
// 'date',
|
|
// 'switch',
|
|
// 'number',
|
|
// 'cascader',
|
|
// 'upload',
|
|
// 'rate',
|
|
// 'tinymce',
|
|
// 'treeSelect'
|
|
// ],
|
|
// vIf: state.isSearch
|
|
// },
|
|
// {
|
|
// label: '是否禁用编辑',
|
|
// value: config.editDisabled,
|
|
// path: 'config.editDisabled',
|
|
// type: 'switch',
|
|
// vShow: [
|
|
// 'input',
|
|
// 'password',
|
|
// 'textarea',
|
|
// 'radio',
|
|
// 'checkbox',
|
|
// 'select',
|
|
// 'date',
|
|
// 'switch',
|
|
// 'number',
|
|
// 'cascader',
|
|
// 'upload',
|
|
// 'treeSelect',
|
|
// 'table',
|
|
// 'flex'
|
|
// ],
|
|
// vIf: state.isSearch
|
|
// },
|
|
// {
|
|
// label: '添加页隐藏',
|
|
// value: config.disabledAdd,
|
|
// path: 'config.disabledAdd',
|
|
// type: 'switch',
|
|
// vIf: state.isSearch,
|
|
// vHide: ['inputSlot']
|
|
// },
|
|
// {
|
|
// label: '编辑页隐藏',
|
|
// value: config.disabledEdit,
|
|
// path: 'config.disabledEdit',
|
|
// type: 'switch',
|
|
// vIf: state.isSearch,
|
|
// vHide: ['inputSlot']
|
|
// },
|
|
// {
|
|
// label: '详情页隐藏',
|
|
// value: config.disabledDetail,
|
|
// path: 'config.disabledDetail',
|
|
// type: 'switch',
|
|
// vIf: state.isSearch,
|
|
// vHide: ['inputSlot']
|
|
// },
|
|
{
|
|
label: "设为Input输入框的前/后缀",
|
|
value: type === "inputSlot",
|
|
path: "",
|
|
type: "switch",
|
|
vShow: ["select", "inputSlot"],
|
|
eventName: "setInputSlot",
|
|
},
|
|
|
|
|
|
{
|
|
label: "序号列",
|
|
value: columnIndex,
|
|
type: "switch",
|
|
vShow: ["table"],
|
|
eventName: "tableColumn1",
|
|
},
|
|
/*{
|
|
label: '操作列',
|
|
value: columnOperate,
|
|
type: 'switch',
|
|
vShow: ['table'],
|
|
eventName: 'tableColumn2'
|
|
},*/
|
|
{
|
|
label: "组件名",
|
|
value: config.componentName,
|
|
placeholder: "全局注册的组件名称",
|
|
path: "config.componentName",
|
|
vShow: ["component"],
|
|
},
|
|
{
|
|
label: "关联表单",
|
|
value: config.associatedForms,
|
|
path: "config.associatedForms",
|
|
type: "associatedForms_form",
|
|
vIf: state.isSearch,
|
|
vShow: ["associatedForms"],
|
|
},
|
|
{
|
|
label: "移动端扫描输入",
|
|
value: config.scanInput,
|
|
path: "config.scanInput",
|
|
type: "input",
|
|
vIf: state.isSearch,
|
|
vShow: ["input"],
|
|
},
|
|
{
|
|
label: "隐藏条件",
|
|
value: config.associatedForms,
|
|
path: "config.associatedForms",
|
|
type: "associatedForms_hide",
|
|
vIf: state.isSearch,
|
|
vShow: ["associatedForms"],
|
|
},
|
|
{
|
|
label: "数据范围",
|
|
value: config.associatedForms,
|
|
path: "config.associatedForms",
|
|
type: "associatedForms_dataRange",
|
|
vIf: state.isSearch,
|
|
vShow: ["associatedForms"],
|
|
},
|
|
{
|
|
label: "数据填充规则",
|
|
value: config.associatedForms,
|
|
path: "config.associatedForms",
|
|
type: "associatedForms_FillRoles",
|
|
vIf: state.isSearch,
|
|
vShow: ["associatedForms"],
|
|
},
|
|
{
|
|
label: "轮播图设置",
|
|
value: config.carousel,
|
|
path: "config.carousel",
|
|
type: "carousel",
|
|
vIf: state.isSearch,
|
|
vShow: ["lowcodeCarsusel"],
|
|
},
|
|
|
|
{
|
|
label: "穿梭框名",
|
|
value: config.transfer,
|
|
path: "config.transfer",
|
|
type: "transfer_name",
|
|
vIf: state.isSearch,
|
|
vShow: ["lowcodeTransfer"],
|
|
},
|
|
{
|
|
label: "选项数据源",
|
|
value: config.transfer,
|
|
path: "config.transfer",
|
|
type: "transfer_options_datasource",
|
|
vIf: state.isSearch,
|
|
vShow: ["lowcodeTransfer"],
|
|
},
|
|
{
|
|
label: "上传视频",
|
|
value: config.uploadvideo,
|
|
path: "config.uploadvideo",
|
|
type: "uploadvideo_url",
|
|
vIf: state.isSearch,
|
|
vShow: ["videoUpAndPlay"],
|
|
},
|
|
{
|
|
label: "默认图片",
|
|
value: config.lowcodeImage,
|
|
path: "config.lowcodeImage",
|
|
type: "lowcodeImage_url",
|
|
vIf: state.isSearch,
|
|
vShow: ["lowcodeImage"],
|
|
},
|
|
{
|
|
label: "必须现场拍照",
|
|
value: config.lowcodeImage,
|
|
path: "config.lowcodeImage",
|
|
type: "lowcodeImage_currentShot",
|
|
vIf: state.isSearch,
|
|
vShow: ["lowcodeImage"],
|
|
},
|
|
{
|
|
label: "详情页展示全部选项",
|
|
value: config.checkbox,
|
|
path: "config.checkbox",
|
|
type: "checkbox_showAll",
|
|
vIf: state.isSearch,
|
|
vShow: ["checkbox"],
|
|
},
|
|
{
|
|
label: "数据范围",
|
|
value: config.orgCentent,
|
|
path: "config.orgCentent",
|
|
type: "orgCentent_range",
|
|
vIf: state.isSearch,
|
|
vShow: ["orgCentent"],
|
|
},
|
|
{
|
|
label: "是否多选",
|
|
value: config.orgCentent,
|
|
path: "config.orgCentent",
|
|
type: "orgCentent_Multiple",
|
|
vIf: state.isSearch,
|
|
vShow: ["orgCentent"],
|
|
},
|
|
{
|
|
label: "默认一行",
|
|
value: config.table,
|
|
path: "config.table",
|
|
type: "table_defaultOne",
|
|
vIf: state.isSearch,
|
|
vShow: ["table"],
|
|
},
|
|
{
|
|
label: "数据范围",
|
|
value: config.expandUser,
|
|
path: "config.expand-user",
|
|
type: "expand-user",
|
|
vIf: state.isSearch,
|
|
vShow: ["expand-user"],
|
|
},
|
|
/* {
|
|
label: "表单栅格",
|
|
value: config.span,
|
|
placeholder: "表单区域栅格宽，0为自动宽",
|
|
path: "config.span",
|
|
vHide: ["gridChild"],
|
|
isNum: true,
|
|
}, */
|
|
{
|
|
label: "表单栅格",
|
|
value: config.span,
|
|
path: "config.span",
|
|
type: "span",
|
|
vHide: ["gridChild"],
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "占据的列数span",
|
|
value: attr.span,
|
|
type: "attrSpan",
|
|
path: "attr.span",
|
|
vShow: ["gridChild"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "左侧的间隔格数offset",
|
|
value: attr.offset,
|
|
type: "attrOffset",
|
|
path: "attr.offset",
|
|
vShow: ["gridChild"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "向右移动格数push",
|
|
value: attr.push,
|
|
type: "attrPush",
|
|
path: "attr.push",
|
|
vShow: ["gridChild"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "向左移动格数pull",
|
|
value: attr.pull,
|
|
type: "attrPull",
|
|
path: "attr.pull",
|
|
vShow: ["gridChild"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
/* {
|
|
label: "添加时间水印",
|
|
value: config.lowcodeImage,
|
|
path: "config.lowcodeImage",
|
|
type: "lowcodeImage_watermark",
|
|
vIf: state.isSearch,
|
|
vShow: ["lowcodeImage"],
|
|
}, */
|
|
{
|
|
label: "显示级别",
|
|
value: config.organization,
|
|
path: "config.organization",
|
|
type: "organization_location_level",
|
|
vIf: state.isSearch,
|
|
vShow: ["organization"],
|
|
},
|
|
/*{
|
|
label: '尺寸',
|
|
value: config.lowcodeImage,
|
|
path: 'config.lowcodeImage',
|
|
type: 'lowcodeImage_showMode',
|
|
vIf: state.isSearch,
|
|
vShow: ['lowcodeImage']
|
|
},
|
|
{
|
|
label: '契合度',
|
|
value: config.lowcodeImage,
|
|
path: 'config.lowcodeImage',
|
|
type: 'lowcodeImage_fit',
|
|
vIf: state.isSearch,
|
|
vShow: ['lowcodeImage']
|
|
},
|
|
{
|
|
label: '圆角',
|
|
value: config.lowcodeImage,
|
|
path: 'config.lowcodeImage',
|
|
type: 'lowcodeImage_radius',
|
|
vIf: state.isSearch,
|
|
vShow: ['lowcodeImage']
|
|
},
|
|
{
|
|
label: '边框和阴影',
|
|
value: config.lowcodeImage,
|
|
path: 'config.lowcodeImage',
|
|
type: 'lowcodeImage_boderAndShadow',
|
|
vIf: state.isSearch,
|
|
vShow: ['lowcodeImage']
|
|
},
|
|
{
|
|
label: '图片链接',
|
|
value: config.lowcodeImage,
|
|
path: 'config.lowcodeImage',
|
|
type: 'lowcodeImage_link',
|
|
vIf: state.isSearch,
|
|
vShow: ['lowcodeImage']
|
|
},
|
|
{
|
|
label: '浮动',
|
|
value: config.lowcodeImage,
|
|
path: 'config.lowcodeImage',
|
|
type: 'lowcodeImage_float',
|
|
vIf: state.isSearch,
|
|
vShow: ['lowcodeImage']
|
|
}, */
|
|
// {
|
|
// label: '内外四边距',
|
|
// value: config.lowcodeImage,
|
|
// path: 'config.lowcodeImage',
|
|
// type: 'lowcodeImage_marginAndPadding',
|
|
// vIf: state.isSearch,
|
|
// vShow: ['lowcodeImage']
|
|
// },
|
|
/* {
|
|
label: '上传视频封面',
|
|
value: config.uploadvideo,
|
|
path: 'config.uploadvideo',
|
|
type: 'uploadvideo_poster',
|
|
vIf: state.isSearch,
|
|
vShow: ['videoUpAndPlay']
|
|
}, */
|
|
{
|
|
label: "视频宽度(像素)",
|
|
value: config.uploadvideo,
|
|
path: "config.uploadvideo",
|
|
type: "uploadvideo_width",
|
|
vIf: state.isSearch,
|
|
vShow: ["videoUpAndPlay"],
|
|
},
|
|
{
|
|
label: "视频高度(像素)",
|
|
value: config.uploadvideo,
|
|
path: "config.uploadvideo",
|
|
type: "uploadvideo_height",
|
|
vIf: state.isSearch,
|
|
vShow: ["videoUpAndPlay"],
|
|
},
|
|
{
|
|
label: "视频自动播放",
|
|
value: config.uploadvideo,
|
|
path: "config.uploadvideo",
|
|
type: "uploadvideo_autoPlay",
|
|
vIf: state.isSearch,
|
|
vShow: ["videoUpAndPlay"],
|
|
},
|
|
{
|
|
label: "视频循环播放",
|
|
value: config.uploadvideo,
|
|
path: "config.uploadvideo",
|
|
type: "uploadvideo_loopPlay",
|
|
vIf: state.isSearch,
|
|
vShow: ["videoUpAndPlay"],
|
|
},
|
|
{
|
|
label: "上传地址",
|
|
value: control.action,
|
|
placeholder: "图片/文件上传地址,可不填有默认值",
|
|
path: "control.action",
|
|
vShow: ["upload"],
|
|
},
|
|
{
|
|
label: "文件字段名",
|
|
value: control.name,
|
|
placeholder: "上传的文件字段名,默认file",
|
|
path: "control.name",
|
|
vShow: ["upload"],
|
|
},
|
|
{
|
|
label: "提示文字",
|
|
value: config.tip,
|
|
placeholder: "提示说明文字",
|
|
path: "config.tip",
|
|
vShow: ["upload"],
|
|
},
|
|
{
|
|
label: "按钮文本",
|
|
value: config.btnText,
|
|
placeholder: "上传按钮文本",
|
|
path: "config.btnText",
|
|
vShow: ["upload"],
|
|
},
|
|
{
|
|
label: "分割线方向",
|
|
type: "select",
|
|
dict: { horizontal: "horizontal", vertical: "vertical" },
|
|
placeholder: "分割线方向，默认horizontal",
|
|
value: control.direction,
|
|
path: "control.direction",
|
|
vShow: ["divider"],
|
|
},
|
|
{
|
|
label: "分隔符样式",
|
|
placeholder: "分隔符样式，默认solid",
|
|
value: control.borderStyle,
|
|
path: "control.borderStyle",
|
|
vShow: ["divider"],
|
|
},
|
|
{
|
|
label: "文字方位",
|
|
type: "select",
|
|
dict: { left: "left", right: "right", center: "center" },
|
|
value: control.contentPosition,
|
|
path: "control.contentPosition",
|
|
vShow: ["divider"],
|
|
},
|
|
{
|
|
label: "最小值",
|
|
value: control.min,
|
|
path: "control.min",
|
|
vShow: ["slider"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "最大值",
|
|
value: control.max,
|
|
path: "control.max",
|
|
vShow: ["rate", "slider"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "步长",
|
|
value: control.step,
|
|
path: "control.step",
|
|
vShow: ["slider"],
|
|
eventName: "formatNumber",
|
|
isNum: true,
|
|
},
|
|
{
|
|
label: "显示类型",
|
|
value: control.type,
|
|
path: "control.type",
|
|
vShow: ["datePicker"],
|
|
type: "select",
|
|
placeholder: "显示类型",
|
|
dict: {
|
|
year: "年",
|
|
month: "月",
|
|
date: "日期",
|
|
datetime: "日期+时间",
|
|
week: "周",
|
|
datetimerange: "开始日期时间至结束日期时间",
|
|
daterange: "开始日期至结束日期",
|
|
monthrange: "开始月至结束月",
|
|
},
|
|
},
|
|
{
|
|
label: "时间格式",
|
|
value: control.format,
|
|
path: "control.format",
|
|
vShow: ["datePicker", "timePicker"],
|
|
placeholder: "显示在输入框中的格式",
|
|
},
|
|
{
|
|
label: "color-format",
|
|
value: control.colorFormat,
|
|
path: "control.colorFormat",
|
|
type: "select",
|
|
placeholder: "写入 v-model 的颜色的格式",
|
|
dict: { hsl: "hsl", hsv: "hsv", hex: "hex", rgb: "rgb" },
|
|
vShow: ["colorPicker"],
|
|
},
|
|
{
|
|
label: "文本高度",
|
|
value: control.height,
|
|
path: "control.height",
|
|
placeholder: "文本高度(预览查看效果)",
|
|
vShow: ["tinymce"],
|
|
},
|
|
{
|
|
label: "文本宽度",
|
|
value: control.width,
|
|
path: "control.width",
|
|
placeholder: "文本宽度(预览查看效果)",
|
|
vShow: ["tinymce"],
|
|
},
|
|
{
|
|
label: "图片上传地址",
|
|
value: control.imgUrl,
|
|
path: "control.imgUrl",
|
|
placeholder: "图片上传地址",
|
|
vShow: ["tinymce"],
|
|
},
|
|
{
|
|
label: "附件上传地址",
|
|
value: control.blobUrl,
|
|
path: "control.blobUrl",
|
|
placeholder: "附件上传地址",
|
|
vShow: ["tinymce"],
|
|
},
|
|
{
|
|
label: "显示模式",
|
|
value: config.style,
|
|
path: "config.style",
|
|
placeholder: "显示风格(预览查看效果)",
|
|
type: "select",
|
|
dict: { default: "default", simple: "simple" },
|
|
vShow: ["tinymce"],
|
|
},
|
|
{
|
|
label: "默认值",
|
|
value: control.mathsValue,
|
|
selectvalue: selectvalue,
|
|
path: "control.mathsValue",
|
|
placeholder: "显示风格(预览查看效果)",
|
|
type: "digitpage",
|
|
dict: { default: "自定义", simple: "编辑公式" },
|
|
vShow: ["digitpage"],
|
|
control: control,
|
|
},
|
|
]);
|
|
// 过滤显示对应的值
|
|
return temp.filter((item: any) => {
|
|
// console.log("过滤显示对应的值--->",item)
|
|
// console.log("过滤显示对应的值-1-->",type)
|
|
let hasFilter = true;
|
|
if (item.vShow) {
|
|
hasFilter = item.vShow.includes(type);
|
|
}
|
|
if (item.vHide) {
|
|
hasFilter = !item.vHide.includes(type);
|
|
}
|
|
if (item.vIf) {
|
|
// 不显示vif＝true的
|
|
hasFilter = false;
|
|
}
|
|
return hasFilter;
|
|
});
|
|
} else {
|
|
return [];
|
|
}
|
|
});
|
|
|
|
watch(
|
|
() => store.activeKey,
|
|
(val: string) => {
|
|
if (val) {
|
|
// 有值时自动跳到第一项
|
|
state.tabsName = "first";
|
|
cssIsShouw(attrList);
|
|
}
|
|
}
|
|
);
|
|
|
|
const fileSignAry = reactive<any>([]);
|
|
const controlChange = (obj: any, val: any) => {
|
|
// console.log("字段编辑--1--》", obj);
|
|
// console.log("字段编辑--2--》", obj.eventName);
|
|
// console.log("字段编辑--3--》", val);
|
|
// console.log("字段编辑--4--》", controlData.value);
|
|
// console.log("字段编辑--5--》", obj.path);
|
|
// console.log("字段编辑--6--》", props.formField);
|
|
// console.log("字段编辑--7--》", controlData.value.name);
|
|
// console.log("字段编辑--8--》", props.sunFormField);
|
|
|
|
// console.log(
|
|
// "字段编辑--9--》",
|
|
// Array.isArray(props.sunFormField) &&
|
|
// !props.sunFormField.includes(controlData.value.name)
|
|
// );
|
|
// select多选属性，
|
|
switch (obj.eventName) {
|
|
case "selectMultiple":
|
|
if (val) {
|
|
// 多选，将值改为数组
|
|
controlData.value.control.modelValue = [];
|
|
controlData.value.control.glxxsz = [];
|
|
} else {
|
|
// 单选
|
|
controlData.value.control.modelValue = "";
|
|
for (var i = 0; i < controlData.value.options.length; i++) {
|
|
if (controlData.value.control.glxxsz[i] === undefined) {
|
|
//新增了某个option
|
|
controlData.value.control.glxxsz.push({
|
|
conditionField: controlData.value.name,
|
|
optionLabel: controlData.value.options[i].label,
|
|
optionValue: controlData.value.options[i].value,
|
|
tableIndex: i,
|
|
id: uuidv4().replaceAll("-", "").toString(),
|
|
});
|
|
} else {
|
|
//修改了某个option
|
|
controlData.value.control.glxxsz[i].optionLabel =
|
|
controlData.value.options[i].label;
|
|
controlData.value.control.glxxsz[i].optionValue =
|
|
controlData.value.options[i].value;
|
|
}
|
|
}
|
|
}
|
|
break;
|
|
case "tableColumn1":
|
|
tableColumnAdd(val);
|
|
break;
|
|
case "formatNumber":
|
|
val = parseInt(val); // 将值转数值
|
|
break;
|
|
case "filedNameKey":
|
|
// 选择字段标识时，同时修改显示标题
|
|
// 根据value找key
|
|
if (obj.type === "select") {
|
|
state.dataSourceList.forEach((item: any) => {
|
|
if (item.name === val) {
|
|
if (controlData.value.item) {
|
|
controlData.value.item.label = item.label;
|
|
}
|
|
controlData.value.name = item.label;
|
|
}
|
|
});
|
|
}
|
|
break;
|
|
case "setInputSlot":
|
|
if (val) {
|
|
// 将类型改为inputSlot
|
|
controlData.value.type = "inputSlot";
|
|
ElMessage.success(
|
|
`请在对应的Input输入框属性前后缀设置key:${controlData.value.name}`
|
|
);
|
|
} else {
|
|
controlData.value.type = "select";
|
|
}
|
|
// 这里会报错Cannot set properties of null (setting 'checked')
|
|
// 因value:type===inputSlot，这里使用了v-model，影响不大暂不处理
|
|
break;
|
|
case "labelNameVal":
|
|
if (val != "") {
|
|
let ary = ["founder", "founderTime", "editTime", "owner", "deptOrg"];
|
|
if (!ary.includes(controlData.value.type)) {
|
|
if (
|
|
Array.isArray(props.formField) &&
|
|
!props.formField.includes(controlData.value.name)
|
|
) {
|
|
if (
|
|
Array.isArray(props.sunFormField) &&
|
|
!props.sunFormField.includes(controlData.value.name)
|
|
) {
|
|
chineseToPinyin({
|
|
title: val,
|
|
types: 8,
|
|
connector: "",
|
|
formJson: JSON.stringify(props.formInfo),
|
|
}).then((data: any) => {
|
|
if (data.code == 0) {
|
|
if (data.data != "") {
|
|
if (!fileSignAry.includes(data.data)) {
|
|
if (controlData.value.type == "table") {
|
|
controlData.value.name = "table_" + data.data;
|
|
} else {
|
|
controlData.value.name = data.data;
|
|
}
|
|
|
|
fileSignAry.push(data.data);
|
|
} else {
|
|
let isEnd = true;
|
|
do {
|
|
let titleVal = data.data + Rand(10000000, 99999999);
|
|
if (!fileSignAry.includes(titleVal)) {
|
|
// controlData.value.name = titleVal;
|
|
if (controlData.value.type == "table") {
|
|
controlData.value.name = "table_" + titleVal;
|
|
} else {
|
|
controlData.value.name = titleVal;
|
|
}
|
|
|
|
fileSignAry.push(titleVal);
|
|
isEnd = false;
|
|
}
|
|
} while (isEnd);
|
|
}
|
|
} else {
|
|
if (!fileSignAry.includes(val)) {
|
|
if (controlData.value.type == "table") {
|
|
controlData.value.name = "table_" + val;
|
|
} else {
|
|
controlData.value.name = val;
|
|
}
|
|
// controlData.value.name = val;
|
|
fileSignAry.push(val);
|
|
} else {
|
|
let titleVal = val + Rand(10000000, 99999999);
|
|
if (!fileSignAry.includes(titleVal)) {
|
|
// controlData.value.name = titleVal;
|
|
if (controlData.value.type == "table") {
|
|
controlData.value.name = "table_" + titleVal;
|
|
} else {
|
|
controlData.value.name = titleVal;
|
|
}
|
|
fileSignAry.push(titleVal);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
// chineseToPinyin({title:val,types:8,connector:"",formJson:JSON.stringify(props.formInfo)})
|
|
// .then((data:any)=>{
|
|
// if(data.code == 0){
|
|
// if(data.data != ""){
|
|
// if(!fileSignAry.includes(data.data)){
|
|
// controlData.value.name = data.data
|
|
// fileSignAry.push(data.data)
|
|
// }else{
|
|
// let isEnd = true;
|
|
// do{
|
|
// let titleVal = data.data + Rand(10000000,99999999)
|
|
// if(!fileSignAry.includes(titleVal)){
|
|
// controlData.value.name = titleVal;
|
|
// fileSignAry.push(titleVal);
|
|
// isEnd=false;
|
|
// }
|
|
// }while(isEnd);
|
|
// }
|
|
// }else{
|
|
// if(!fileSignAry.includes(val)){
|
|
// controlData.value.name = val
|
|
// fileSignAry.push(val)
|
|
// }else{
|
|
// let titleVal = val + Rand(10000000,99999999)
|
|
// if(!fileSignAry.includes(titleVal)){
|
|
// controlData.value.name = titleVal;
|
|
// fileSignAry.push(titleVal);
|
|
// }
|
|
// }
|
|
|
|
// }
|
|
|
|
// }
|
|
// })
|
|
}
|
|
|
|
// console.log("字段编辑--fileSignAry--》",fileSignAry)
|
|
break;
|
|
}
|
|
if (obj.path) {
|
|
const newVal = obj.isNum ? formatNumber(val) : val; // 类型为数字时转整数
|
|
obj.path && getPropByPath(controlData.value, obj.path, newVal);
|
|
}
|
|
};
|
|
//liwenxuan 关联选项设置 修复bug:当字段标识改变时，关联选项设置的字段标识未同步更改 start
|
|
//关联选项设置会在标签名称改变时清空
|
|
function formNameChange() {
|
|
emits("formNameChange", 1);
|
|
}
|
|
//liwenxuan 关联选项设置 修复bug:当字段标识改变时，关联选项设置的字段标识未同步更改 end
|
|
|
|
/**
|
|
* 获取非负整数随机数
|
|
* @param Min 最小整数
|
|
* @param Max 最大整数
|
|
* @returns 随机数
|
|
*/
|
|
const Rand = (Min: number, Max: number) => {
|
|
switch (Min) {
|
|
case 0:
|
|
return Math.round(Math.random() * Max);
|
|
case 1:
|
|
return Math.ceil(Math.random() * Max);
|
|
default:
|
|
return Math.round(Math.random() * (Max - Min) + Min);
|
|
}
|
|
};
|
|
// 修改指定路径下的值
|
|
const getPropByPath = (obj: any, path: string, val: any) => {
|
|
let tempObj = obj;
|
|
const keyArr = path.split(".");
|
|
//liwenxuan 关联选项设置会在标签名称改变时清空 start 250410
|
|
if (keyArr && keyArr[0] && keyArr[0] == "name") {
|
|
if (
|
|
tempObj.type == "select" ||
|
|
tempObj.type == "radio" ||
|
|
tempObj.type == "checkbox" ||
|
|
tempObj.type == "switch"
|
|
) {
|
|
formNameChange();
|
|
}
|
|
}
|
|
// liwenxuan 关联选项设置会在标签名称改变时清空 end 250410
|
|
// console.log("修改指定路径下的值", keyArr, tempObj);
|
|
let i = 0;
|
|
for (i; i < keyArr.length - 1; i++) {
|
|
const key = keyArr[i];
|
|
if (key in tempObj) {
|
|
tempObj = tempObj[key];
|
|
} else {
|
|
throw new Error(`${key} is undefined`);
|
|
// break
|
|
}
|
|
}
|
|
const key = keyArr[i];
|
|
const value = tempObj[keyArr[i]];
|
|
// 检查最后一级是否存在
|
|
/*if (!(key in tempObj)) {
|
|
throw new Error(`${key} is undefined`)
|
|
}*/
|
|
if (val !== undefined) {
|
|
tempObj[key] = val;
|
|
}
|
|
return {
|
|
obj: tempObj,
|
|
key: key,
|
|
value: value,
|
|
};
|
|
};
|
|
// 属性设置相关结束
|
|
|
|
//关联表单数据填充时无法获取当前表单新增且保存的字段，只有关闭重启后方能获取----bug修改
|
|
//穿梭框编辑固定选项时，修改的节点无法立即预览到，需保存后退出重进才能预览到修改后的----bug修改
|
|
|
|
const showAssociatedFormsFillRole = ref(true);
|
|
|
|
const saveRefreshFormControlAttr = () => {
|
|
getAssociatedFormsCurrentFieldTree1();
|
|
showAssociatedFormsFillRole.value = false;
|
|
// 等待一个短时间的延迟，确保组件卸载完成
|
|
setTimeout(() => {
|
|
showAssociatedFormsFillRole.value = true;
|
|
}, 200);
|
|
};
|
|
|
|
// 多选固定选项删除
|
|
const delSelectOption = (index: number, type?: string) => {
|
|
//liwenxuan 20240508 checkbox 删除选项时提醒 start
|
|
let delflag = true;
|
|
let breakFlag = 0;
|
|
if (
|
|
(controlData.value.type === "checkbox" ||
|
|
controlData.value.type === "radio" ||
|
|
controlData.value.type === "select") &&
|
|
controlData.value.config.optionsType == 0
|
|
) {
|
|
//多选删除时,当前index并不是索引而是value,需找出选择的多选框实际的索引作为index liwenxuan 多选选择框选项拖动功能 20240815 start
|
|
for (let i = 0; i < controlData.value.options.length; i++) {
|
|
if (controlData.value.options[i].value == index) {
|
|
index = i;
|
|
break;
|
|
}
|
|
}
|
|
//多选删除时,当前index并不是索引而是value,需找出选择的多选框实际的索引作为index liwenxuan 多选选择框选项拖动功能 20240815 end
|
|
if (controlData.value.type === "checkbox") {
|
|
for (var i = 0; i < controlData.value.control.glxxszForCheckBox.length; i++) {
|
|
if (breakFlag > 0) {
|
|
break;
|
|
}
|
|
for (
|
|
var j = 0;
|
|
j < controlData.value.control.glxxszForCheckBox[i].selectedOptions.length;
|
|
j++
|
|
) {
|
|
if (
|
|
controlData.value.control.glxxszForCheckBox[i].selectedOptions[j] ===
|
|
controlData.value.options[index].value
|
|
) {
|
|
let del = confirm(
|
|
"您本次删除的选项已在关联选项设置中有所配置，相关关联选项设置将被删除，是否确定删除？"
|
|
);
|
|
if (del == true) {
|
|
breakFlag++;
|
|
break;
|
|
} else {
|
|
delflag = false;
|
|
breakFlag++;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
if (delflag === true) {
|
|
//删除相关关联选项设置
|
|
if (controlData.value.type === "checkbox") {
|
|
const todelArr: any = [];
|
|
for (var i = 0; i < controlData.value.control.glxxszForCheckBox.length; i++) {
|
|
for (
|
|
var j = 0;
|
|
j < controlData.value.control.glxxszForCheckBox[i].selectedOptions.length;
|
|
j++
|
|
) {
|
|
if (
|
|
controlData.value.control.glxxszForCheckBox[i].selectedOptions[j] ===
|
|
controlData.value.options[index].value
|
|
) {
|
|
todelArr.push(controlData.value.control.glxxszForCheckBox[i].id);
|
|
}
|
|
}
|
|
}
|
|
for (var i = 0; i < todelArr.length; i++) {
|
|
controlData.value.control.glxxszForCheckBox = controlData.value.control.glxxszForCheckBox.filter(
|
|
(item: { id: any }) => item.id != todelArr[i]
|
|
);
|
|
}
|
|
}
|
|
//liwenxuan 20240508 checkbox 删除选项时提醒 end
|
|
if (type === "tabs") {
|
|
controlData.value.columns.splice(index, 1);
|
|
} else {
|
|
controlData.value.options.splice(index, 1);
|
|
}
|
|
}
|
|
};
|
|
// 多选固定选项增加
|
|
const addSelectOption = (type: any) => {
|
|
// console.log("多选固定选项增加", controlData.value.type);
|
|
if (controlData.value.type === "cascader") {
|
|
// 级联时打开弹窗口
|
|
openAttrDialog("cascader", "级联选择器");
|
|
} else if (controlData.value.type === "treeSelect") {
|
|
openAttrDialog("treeSelect", "编辑组件下拉选项数据");
|
|
} else {
|
|
if (type === "tabs") {
|
|
controlData.value.columns.push({
|
|
label: "标签名称",
|
|
list: [],
|
|
});
|
|
} else {
|
|
let maxVal = 1;
|
|
|
|
// console.log("多选固定选项增加-------1---->", maxVal, controlData.value.options);
|
|
|
|
if (controlData.value.options && controlData.value.options.length > 0) {
|
|
let optMax = 1;
|
|
controlData.value.options.forEach((item: any) => {
|
|
if (item.value * 1 >= optMax) {
|
|
optMax = item.value;
|
|
}
|
|
});
|
|
|
|
// console.log("多选固定选项增加-------4---->", maxVal, optMax);
|
|
|
|
if (maxVal < optMax) {
|
|
maxVal = optMax * 1 + 1;
|
|
} else {
|
|
maxVal = maxVal * 1 + 1;
|
|
}
|
|
|
|
// let isTrue = true;
|
|
// controlData.value.options.forEach((item: any) => {
|
|
// console.log("多选固定选项增加-------4---->", maxVal, item.value);
|
|
// if (item.value == maxVal) {
|
|
// maxVal = item.value;
|
|
// isTrue = false;
|
|
// }
|
|
// });
|
|
|
|
// if (isTrue) {
|
|
// maxVal = maxVal * 1 + 1;
|
|
// }
|
|
}
|
|
// console.log(
|
|
// "多选固定选项增加-------3---->",
|
|
// maxVal,
|
|
// controlData.value.options.length
|
|
// );
|
|
controlData.value.options.push({
|
|
label: "",
|
|
value: maxVal.toString(),
|
|
});
|
|
}
|
|
}
|
|
};
|
|
// 更多属性弹窗
|
|
const openAttrDialog = (type?: string, tooltip?: string) => {
|
|
let editData = controlData.value.control;
|
|
if (controlData.value.type === "button") {
|
|
// 按钮组件编辑属性
|
|
editData = controlData.value.config;
|
|
type = "button";
|
|
}
|
|
console.log("更多属性弹窗", controlData.value);
|
|
switch (type) {
|
|
case "treeSelect":
|
|
// console.log("更多属性弹窗", controlData.value.control.data);
|
|
editData = controlData.value.control.data;
|
|
|
|
break;
|
|
case "cascader":
|
|
// console.log("更多属性级联", controlData.value.options);
|
|
editData = controlData.value.options;
|
|
break;
|
|
case "optionsParams": // 选项请求附加参数
|
|
editData = controlData.value.config.beforeRequest;
|
|
// params.codeType = 'json'
|
|
break;
|
|
case "optionsResult":
|
|
editData = controlData.value.config.afterResponse;
|
|
break;
|
|
}
|
|
const emitsParams = {
|
|
content: editData,
|
|
title: tooltip,
|
|
type: type,
|
|
direction: "ltr",
|
|
callback: (result: any) => {
|
|
switch (type) {
|
|
case "treeSelect":
|
|
// console.log("更多属性弹窗会写数据：", result);
|
|
controlData.value.control.data = result;
|
|
// console.log(
|
|
// "更多属性弹窗会写数据-----1------>：",
|
|
// controlData.value.control.data
|
|
// );
|
|
break;
|
|
case "cascader":
|
|
controlData.value.options = result;
|
|
break;
|
|
case "optionsParams":
|
|
controlData.value.config.beforeRequest = result;
|
|
break;
|
|
case "optionsResult":
|
|
controlData.value.config.afterResponse = result;
|
|
break;
|
|
case "button":
|
|
controlData.value.config = result;
|
|
break;
|
|
default:
|
|
controlData.value.control = {};
|
|
Object.assign(controlData.value.control, result);
|
|
}
|
|
},
|
|
};
|
|
emits("openDialog", emitsParams);
|
|
};
|
|
// 必填校验
|
|
const requiredChange = (val: any) => {
|
|
if (!controlData.value.item?.rules) {
|
|
controlData.value.item.rules = [];
|
|
}
|
|
if (val) {
|
|
controlData.value.item.rules.push({
|
|
required: true,
|
|
message: "必填项",
|
|
trigger: "change",
|
|
});
|
|
} else {
|
|
controlData.value.item.rules.splice(0, 1);
|
|
}
|
|
};
|
|
// 添加校验规则
|
|
const addRules = (tooltip: string) => {
|
|
if (!controlData.value.item?.rules) {
|
|
controlData.value.item.rules = [];
|
|
}
|
|
const params = {
|
|
content: controlData.value.item?.rules,
|
|
title: tooltip,
|
|
direction: "ltr",
|
|
callback: (result: any) => {
|
|
Object.assign(controlData.value.item.rules, result);
|
|
},
|
|
};
|
|
emits("openDialog", params);
|
|
};
|
|
// 根据不同类型判断是否显示当前属性
|
|
const showHide = (type: string[], show?: boolean) => {
|
|
// show=true 条件成立显示，false符合条件隐藏
|
|
if ((type && type.length === 0) || Object.keys(controlData.value).length === 0) {
|
|
return false;
|
|
}
|
|
const index = type.indexOf(controlData.value.type);
|
|
return show ? index !== -1 : index === -1;
|
|
};
|
|
// 子表时添加序号和操作列
|
|
const tableColumnAdd = (val: string) => {
|
|
const item = {
|
|
name: "index",
|
|
type: "index",
|
|
item: {
|
|
label: "序号",
|
|
},
|
|
control: {},
|
|
config: {},
|
|
};
|
|
if (val) {
|
|
controlData.value.list.unshift(item);
|
|
} else {
|
|
controlData.value.list.splice(0, 1);
|
|
}
|
|
};
|
|
// 校验规则必填勾选设置，存在校验规则时勾选
|
|
const checkboxRequired = computed(() => {
|
|
const val = controlData.value && controlData.value.item?.rules;
|
|
// console.log("校验规则必填勾选设置",val && val.length > 0)
|
|
if (val && val.length > 0) {
|
|
return true;
|
|
} else {
|
|
return false;
|
|
}
|
|
// return val && val.length > 0
|
|
});
|
|
// 快速添加一条校验规则
|
|
const addRulesFast = () => {
|
|
if (!controlData.value.customRules) {
|
|
controlData.value.customRules = [];
|
|
}
|
|
controlData.value.customRules.push({
|
|
type: "required",
|
|
message: "必填项",
|
|
trigger: "blur",
|
|
});
|
|
};
|
|
// 删除一条校验规则
|
|
const delAddRules = (index: number) => {
|
|
controlData.value.customRules && controlData.value.customRules.splice(index, 1);
|
|
};
|
|
|
|
//添加一条编码规则
|
|
const addNumRules = () => {
|
|
if (!controlData.value.config.customRules) {
|
|
controlData.value.config.customRules = [];
|
|
}
|
|
controlData.value.config.customRules.push({
|
|
type: "time",
|
|
rule: "YYYYMMDD",
|
|
});
|
|
};
|
|
//删除一条编码规则
|
|
const delNumRules = (index: number) => {
|
|
controlData.value.config.customRules &&
|
|
controlData.value.config.customRules.splice(index, 1);
|
|
};
|
|
|
|
// 编辑表单样式
|
|
const editFormStyle = (tooltip: string) => {
|
|
emits("openDialog", {
|
|
codeType: "css",
|
|
direction: "ltr",
|
|
type: "css",
|
|
title: tooltip,
|
|
});
|
|
};
|
|
const editFormDict = (tooltip: string) => {
|
|
emits("openDialog", {
|
|
type: "dict",
|
|
direction: "ltr",
|
|
codeType: "json",
|
|
title: tooltip,
|
|
});
|
|
};
|
|
// 根据选定数据源获取表单字段
|
|
const getFormFieldBySource = (id?: string) => {
|
|
if (state.isSearch) {
|
|
// 搜索设计这里不需要数据源
|
|
return;
|
|
}
|
|
const source = id;
|
|
if (source) {
|
|
getRequest("sourceById", { id: source })
|
|
.then((res) => {
|
|
// console.log(res)
|
|
const tableData = res.data.result?.tableData;
|
|
if (tableData && tableData.length) {
|
|
state.dataSourceList = tableData.filter((item: any) => item.enterable);
|
|
}
|
|
})
|
|
.catch((res) => {
|
|
// console.log(res)
|
|
});
|
|
}
|
|
};
|
|
const getDataSource = () => {
|
|
// 获取数据源，表单设计才加载，搜索设置不需要
|
|
if (!state.isSearch) {
|
|
// getRequest('sourceList').then((res: any) => {
|
|
// dataSourceOption.value = res.data.list
|
|
// //dataSourceOption.value.unshift({ name: '无', id: '' })
|
|
// })
|
|
}
|
|
};
|
|
// 表单属性修改
|
|
const formAttrChange = (obj: any, val?: any) => {
|
|
// console.log("表单属性修改--->",obj,val,{ [obj.key]: obj.value })
|
|
if (obj.key === "source") {
|
|
getFormFieldBySource(obj.value); // 改变了数据源了，重新请求数据
|
|
// 清空设计区已选择的组件，再一次选择时字段标识才会变
|
|
store.setActiveKey("");
|
|
store.setControlAttr({});
|
|
}
|
|
if (["formName", "source"].includes(obj.key)) {
|
|
emits(
|
|
"update:formOtherData",
|
|
Object.assign(props.formOtherData, { [obj.key]: obj.value })
|
|
);
|
|
formData.value[obj.key] = obj.value;
|
|
return;
|
|
}
|
|
if (obj.path === "config") {
|
|
formConfig.value[obj.key] = obj.value || val;
|
|
} else {
|
|
formData.value[obj.key] = obj.value;
|
|
}
|
|
};
|
|
// 返回选项配置提示
|
|
const getOptionPlaceholder = (type: number) => {
|
|
switch (type) {
|
|
case 1:
|
|
return "数据源接口URL,可带参数";
|
|
case 2:
|
|
return "字典key，默认为字段标识";
|
|
}
|
|
return "";
|
|
};
|
|
// 快速添加校验规则改变时，填写默认的校验提示信息
|
|
const rulesSelectChange = (item: any, val: string) => {
|
|
const filter = validate.filter((item) => item.type === val);
|
|
if (filter && filter.length) {
|
|
item.message = filter[0].message;
|
|
}
|
|
};
|
|
const rulesSelectNumChange = (item: any, val: string) => {
|
|
// console.log("快速添加校验规则改变时",item,val)
|
|
const filter = state.numberRulesList.filter((item) => item.type === val);
|
|
if (filter && filter.length) {
|
|
item.message = filter[0].msg;
|
|
if (val == "time") {
|
|
item.rule = "YYYYMMDD";
|
|
} else {
|
|
item.rule = "";
|
|
}
|
|
}
|
|
};
|
|
// options动态选项数据源请求时
|
|
const optionsEvent = (type: string, tooltip?: string) => {
|
|
openAttrDialog(type, tooltip);
|
|
};
|
|
const eventClick = (type: string, tooltip?: string) => {
|
|
emits("openDialog", { type: type, title: tooltip, direction: "ltr" });
|
|
};
|
|
getDataSource();
|
|
defineExpose({ getFormFieldBySource, saveRefreshFormControlAttr });
|
|
|
|
//判断输入框是否可写
|
|
const isNotWrite = (val: any) => {
|
|
// console.log("判断输入框是否可写--->",val,props.customerformid)
|
|
if (val.disabled) {
|
|
return true;
|
|
} else {
|
|
if (val.key === "name" && props.customerformid != "") {
|
|
return true;
|
|
}
|
|
}
|
|
return false;
|
|
};
|
|
const isNotWriteWord = (val: any) => {
|
|
// console.log("isNotWriteWord---->", val);
|
|
// console.log("isNotWriteWord--formField-->", props.formField);
|
|
if (
|
|
val.eventName === "filedNameKey" &&
|
|
props.customerformid != "" &&
|
|
props.formField &&
|
|
Array.isArray(props.formField) &&
|
|
props.formField.includes(val.value)
|
|
) {
|
|
if (
|
|
props.sunFormField &&
|
|
Array.isArray(props.sunFormField) &&
|
|
props.sunFormField.includes(val.value)
|
|
) {
|
|
return true;
|
|
} else {
|
|
return false;
|
|
}
|
|
}
|
|
return false;
|
|
};
|
|
const unitInfo = ref<any>();
|
|
const formListmap = ref<any>();
|
|
const subUnit = ref<any>();
|
|
//默认值处理
|
|
const digitPageSub = (val: any, envt: any) => {
|
|
// console.log("默认值处理--->", val, envt, props.formData);
|
|
|
|
// console.log("默认值处理-1-->",props.formList)
|
|
// console.log("默认值处理-2-->",props.formConfig)
|
|
// console.log("默认值处理--3->",props.formOtherData)
|
|
// console.log("默认值处理--4->",props.customerformid)
|
|
// console.log("默认值处理--5->",controlData.value)
|
|
// console.log("默认值处理-6-->",val)
|
|
// console.log("默认值处理-7-->",mathBoxShow)
|
|
// console.log("默认值处理-8-->",attrList.value)
|
|
subUnit.value = val;
|
|
controlData.value.selectvalue = envt;
|
|
formListmap.value = props.formList;
|
|
if (envt == "simple") {
|
|
unitInfo.value = attrList.value;
|
|
mathBoxShow.value = true;
|
|
val.control.modelValue = "";
|
|
} else {
|
|
unitInfo.value = "";
|
|
mathBoxShow.value = false;
|
|
}
|
|
};
|
|
const openMathDialog = (val: any) => {
|
|
subUnit.value = val;
|
|
formListmap.value = props.formList;
|
|
unitInfo.value = attrList.value;
|
|
mathBoxShow.value = true;
|
|
};
|
|
//返回值处理
|
|
const updataDigit = (key: string, val: any) => {
|
|
// console.log("默认值处理-1-->",props.formList)
|
|
// console.log("默认值处理-2-->",props.formConfig)
|
|
// console.log("默认值处理--3->",props.formOtherData)
|
|
// console.log("默认值处理--4->",val)
|
|
formConfig.value[key] = {
|
|
mathsFormula: val.mathsFormula,
|
|
takingMethod: val.takingMethod,
|
|
digit: val.digit,
|
|
};
|
|
// console.log("返回值处理--->",formConfig.value)
|
|
attrList.value.forEach((item: any) => {
|
|
// console.log("返回值处理--1->",item)
|
|
if (item.type == "digitpage") {
|
|
item.control.mathFormula = {
|
|
formulaHtml: val.formulaHtml,
|
|
mathsString: val.mathsString,
|
|
mathsFormula: val.mathsFormula,
|
|
takingMethod: val.takingMethod,
|
|
digit: val.digit,
|
|
};
|
|
}
|
|
});
|
|
// console.log("默认值处理-5-->",props.formConfig)
|
|
};
|
|
|
|
//liwenxuan 20240108 vidioupload start
|
|
import { genFileId } from "element-plus";
|
|
import type { UploadInstance, UploadProps, UploadRawFile } from "element-plus";
|
|
|
|
//更改已上传的视频:el-upload中设置 limit 和 on-exceed 可以在选中时自动替换上一个文件。
|
|
const upload = ref<UploadInstance>();
|
|
|
|
const handleExceed: UploadProps["onExceed"] = (files) => {
|
|
upload.value!.clearFiles();
|
|
const file = files[0] as UploadRawFile;
|
|
file.uid = genFileId();
|
|
upload.value!.handleStart(file);
|
|
};
|
|
//每个视频上传控件对应一个videoMsg[videoIndex]
|
|
const videoIndex = ref(0);
|
|
|
|
//上传成功钩子
|
|
function videoUploadOk(response: any, uploadFile: UploadFile, uploadFiles: UploadFiles) {
|
|
const { control = {} }: { control: any } = controlData.value;
|
|
control.videoMsg[videoIndex.value].url = response.data.url;
|
|
control.videoMsg[videoIndex.value].videoReady = true;
|
|
control.videoMsg[videoIndex.value].CreatedAt = response.data.CreatedAt;
|
|
control.videoMsg[videoIndex.value].UpdatedAt = response.data.UpdatedAt;
|
|
control.videoMsg[videoIndex.value].fileSize = response.data.fileSize;
|
|
control.videoMsg[videoIndex.value].id = response.data.id;
|
|
control.videoMsg[videoIndex.value].key = response.data.key;
|
|
control.videoMsg[videoIndex.value].name = response.data.name;
|
|
control.videoMsg[videoIndex.value].physicspath = response.data.physicspath;
|
|
control.videoMsg[videoIndex.value].size = response.data.size;
|
|
control.videoMsg[videoIndex.value].tag = response.data.tag;
|
|
control.videoMsg[videoIndex.value].type = response.data.type;
|
|
}
|
|
|
|
//删除钩子 禁止删除
|
|
function beforeRemove() {
|
|
return false;
|
|
}
|
|
|
|
//上传失败钩子
|
|
function videoUploadErr(error: Error, uploadFile: UploadFile, uploadFiles: UploadFiles) {
|
|
alert("上传失败,请重试");
|
|
// console.log("上传失败"+error);
|
|
}
|
|
|
|
//liwenxuan 20240108 vidioupload end
|
|
|
|
//liwenxuan 20240111 carousel start
|
|
|
|
import { Delete } from "@element-plus/icons-vue";
|
|
import errimg from "@/assets/404_images/untilUploadImg.png";
|
|
import { v4 as uuidv4 } from "uuid";
|
|
|
|
//轮播图设置弹窗显示控制
|
|
const dialogTableVisible = ref(false);
|
|
//穿梭框设置弹窗显示控制
|
|
const transferDialogTableVisible = ref(false);
|
|
|
|
//图片展示显示控制
|
|
const showImagePreview = ref(false);
|
|
|
|
const currentAsfChangeCount = ref(0);
|
|
|
|
//最近点击的上传按钮对应的imgId
|
|
let currentUploadImgid = "";
|
|
|
|
//刚拖拽视频组件时,初始化imgid监听designForm.activeKey,变化时,如果controlData.value.type=='lowcodeCarsusel',就遍历轮播图数组把imgid=''的都生成uuid
|
|
watch(
|
|
() => store.activeKey,
|
|
(newVal) => {
|
|
//啊啊啊啊
|
|
if (controlData.value.type === "lowcodeCarsusel") {
|
|
const carsuselConfigData: CarsuselConfig[] =
|
|
controlData.value.control.carsuselConfigArr;
|
|
carsuselConfigData.forEach((element) => {
|
|
// console.log(element)
|
|
if (element.imgId == "") {
|
|
// console.log("初始化imgid")
|
|
let onlyNumber = uuidv4().replaceAll("-", "").toString(); //获取唯一编码
|
|
element.imgId = onlyNumber;
|
|
}
|
|
});
|
|
} else if (controlData.value.type === "associatedForms") {
|
|
currentAsfChangeCount.value = 0;
|
|
//alert(1)
|
|
/* if(controlData.value.item.label){
|
|
|
|
}else{
|
|
controlData.value.item.label = "关联表单"
|
|
}
|
|
controlData.value.item.showLabel = true */
|
|
//console.log(controlData.value.control.fillRoles.master)
|
|
if (
|
|
controlData.value.control.fillRoles &&
|
|
controlData.value.control.fillRoles.master.length == 0
|
|
) {
|
|
controlData.value.control.fillRoles.master = [
|
|
{
|
|
leftValue: "",
|
|
rightValue: "",
|
|
id: "",
|
|
},
|
|
];
|
|
}
|
|
if (
|
|
controlData.value.control.fillRoles &&
|
|
controlData.value.control.fillRoles.child.length == 0
|
|
) {
|
|
controlData.value.control.fillRoles.child = [
|
|
{
|
|
id: "",
|
|
asfChildTableKey: "",
|
|
filterCondition: {
|
|
conditionHtml: "",
|
|
conditionHtmlCopy: "",
|
|
gongShi: {
|
|
formulaHtml: "",
|
|
mathsFormula: "",
|
|
mathsString: "",
|
|
},
|
|
},
|
|
childRoles: [],
|
|
},
|
|
];
|
|
}
|
|
controlData.value.control.fillRoles.master[0].id = uuidv4()
|
|
.replaceAll("-", "")
|
|
.toString();
|
|
controlData.value.control.fillRoles.child[0].id = uuidv4()
|
|
.replaceAll("-", "")
|
|
.toString();
|
|
}else if(controlData.value.type === "orgCentent"){
|
|
haveOrgTreeInfo()
|
|
}else if(controlData.value.type === "expand-user"){
|
|
|
|
}
|
|
//实现关联表单设置可选字段中没有当前字段效果 start
|
|
// console.log(controlData.value.name)
|
|
resDataForGlxxszExceptself1 = JSON.parse(JSON.stringify(resDataForGlxxszExceptself));
|
|
// console.log(resDataForGlxxszExceptself1)
|
|
|
|
for (let i = 0; i < resDataForGlxxszExceptself1.length; i++) {
|
|
let strArr: [string] = resDataForGlxxszExceptself1[i].id.split(":");
|
|
// console.log(strArr)
|
|
let str = strArr[strArr.length - 1];
|
|
/* console.log(str)
|
|
console.log(newVal) */
|
|
if (str == newVal) {
|
|
resDataForGlxxszExceptself1.splice(i, 1); // 将使后面的元素依次前移，数组长度减1
|
|
i--; // 如果不减，将漏掉一个元素
|
|
}
|
|
}
|
|
console.log(resDataForGlxxszExceptself1);
|
|
if (
|
|
getAssociatedFormsCurrentFieldTreeData &&
|
|
getAssociatedFormsCurrentFieldTreeData.treeAttrs &&
|
|
getAssociatedFormsCurrentFieldTreeData.treeAttrs != undefined
|
|
) {
|
|
associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value = [
|
|
{
|
|
id: "rootid_" + getAssociatedFormsCurrentFieldTreeData.label,
|
|
//label: '当前表单',
|
|
label: "当前表单-" + getAssociatedFormsCurrentFieldTreeData.treeAttrs.show,
|
|
children: resDataForGlxxszExceptself1,
|
|
treeAttrs: getAssociatedFormsCurrentFieldTreeData.treeAttrs, //
|
|
},
|
|
];
|
|
}
|
|
|
|
//associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value.children = [...resDataForGlxxszExceptself1]
|
|
//实现关联表单设置可选字段中没有当前字段效果 end
|
|
}
|
|
);
|
|
|
|
|
|
const orgTreeProps = {
|
|
children: "child",
|
|
label: "name",
|
|
}; //行政组织树对照值
|
|
|
|
|
|
const orgCententRange = ref<orgInfo[]>();
|
|
function haveOrgTreeInfo() {
|
|
//orgTreeLoading.value = true;
|
|
getOrgTreeList({ orgid: 309 })
|
|
.then(({ data }) => {
|
|
// console.log("行政组织树对照值", data);
|
|
|
|
|
|
|
|
orgCententRange.value = data;
|
|
|
|
console.log(orgCententRange.value)
|
|
})
|
|
.finally(() => {
|
|
//orgTreeLoading.value = false;
|
|
});
|
|
}
|
|
|
|
|
|
|
|
//轮播图图片上传成功钩子
|
|
function carouselImgUploadSuccess(
|
|
response: any,
|
|
uploadFile: UploadFile,
|
|
uploadFiles: UploadFiles
|
|
) {
|
|
const carsuselConfigData: CarsuselConfig[] =
|
|
controlData.value.control.carsuselConfigArr;
|
|
carsuselConfigData.forEach((element) => {
|
|
if (element.imgId == currentUploadImgid) {
|
|
element.imgUrl = response.data.url;
|
|
element.uploadFlag = true;
|
|
}
|
|
});
|
|
}
|
|
|
|
//轮播图所有已上传的图片的url,点击略缩图展示大图用
|
|
const carouselImgUrlList = computed(() => {
|
|
const list: string[] = [];
|
|
const carsuselConfigData: CarsuselConfig[] =
|
|
store.controlAttr.control.carsuselConfigArr;
|
|
carsuselConfigData.forEach((element) => {
|
|
if (element.uploadFlag === true) {
|
|
list.push(element.imgUrl);
|
|
}
|
|
});
|
|
return list;
|
|
});
|
|
|
|
//轮播图设置table
|
|
function createRow(clickedRow: any) {
|
|
const newRow: CarsuselConfig = {
|
|
uploadFlag: false,
|
|
imgId: "",
|
|
imgSort: 1,
|
|
imgUrl: "",
|
|
link: "",
|
|
};
|
|
let onlyNumber = uuidv4().replaceAll("-", "").toString(); //获取唯一编码
|
|
newRow.imgId = onlyNumber;
|
|
const nextSort: number = clickedRow.sort + 1;
|
|
newRow.imgSort = nextSort;
|
|
controlData.value.control.carsuselConfigArr.push(newRow);
|
|
}
|
|
|
|
function deleteRow(clickedRow: any) {
|
|
//alert('删除一行')
|
|
const carsuselConfigData: CarsuselConfig[] =
|
|
controlData.value.control.carsuselConfigArr;
|
|
for (var i = 0; i < carsuselConfigData.length; i++) {
|
|
if (carsuselConfigData[i].imgId === clickedRow.imgId) {
|
|
carsuselConfigData.splice(i, 1);
|
|
i--; // 如果不减，将漏掉一个元素
|
|
}
|
|
}
|
|
}
|
|
|
|
//关闭大图展示
|
|
const closePreview = () => {
|
|
showImagePreview.value = false;
|
|
};
|
|
|
|
//开启大图展示
|
|
const handlePreview = (index: number, row: any) => {
|
|
showImagePreview.value = true;
|
|
};
|
|
|
|
const changeCurrentUploadImgid = (clickedRow: any) => {
|
|
currentUploadImgid = clickedRow.imgId;
|
|
};
|
|
const showModeSelectOptions = [
|
|
{
|
|
value: "自定义像素值",
|
|
label: "自定义像素值",
|
|
},
|
|
{
|
|
value: "自定义占父容器比例",
|
|
label: "自定义占父容器比例",
|
|
},
|
|
];
|
|
|
|
const floatSelectOptions = [
|
|
{
|
|
value: "left",
|
|
label: "左",
|
|
},
|
|
{
|
|
value: "right",
|
|
label: "右",
|
|
},
|
|
];
|
|
|
|
const dataSource = ref<Tree[]>([]);
|
|
interface Tree {
|
|
id?: string;
|
|
label: string;
|
|
disabled?: boolean;
|
|
children?: Tree[];
|
|
parentId?: string;
|
|
[key: string]: any;
|
|
}
|
|
|
|
const addRootNode = () => {
|
|
let onlyNumber = uuidv4().replaceAll("-", "").toString();
|
|
controlData.value.control.fixedOptions.push({
|
|
id: onlyNumber,
|
|
label: "新根节点",
|
|
disabled: false,
|
|
children: [],
|
|
});
|
|
};
|
|
|
|
const append = (data: Tree) => {
|
|
let onlyNumber = uuidv4().replaceAll("-", "").toString();
|
|
const newChild = { id: onlyNumber, label: "新节点", disabled: false, children: [] };
|
|
if (!data.children) {
|
|
data.children = [];
|
|
}
|
|
data.children.push(newChild);
|
|
dataSource.value = [...dataSource.value];
|
|
};
|
|
|
|
const remove = (node: Node, data: Tree) => {
|
|
let really = confirm("确认删除吗?\n将删除本节点与本节点的所有子孙节点!");
|
|
if (really) {
|
|
const parent = node.parent;
|
|
const children: Tree[] = parent.data.children || parent.data;
|
|
const index = children.findIndex((d) => d.id === data.id);
|
|
children.splice(index, 1);
|
|
dataSource.value = [...dataSource.value];
|
|
}
|
|
};
|
|
|
|
const changeLabel = (node: Node, data: Tree) => {
|
|
let favDrink = prompt("请输入:");
|
|
if (favDrink != null && favDrink.length > 0) {
|
|
const parent = node.parent;
|
|
const children: Tree[] = parent.data.children || parent.data;
|
|
const index = children.findIndex((d) => d.id === data.id);
|
|
children[index].label = favDrink;
|
|
dataSource.value = [...dataSource.value];
|
|
}
|
|
};
|
|
|
|
const setNodeEnable = (node: Node, data: Tree) => {
|
|
const parent = node.parent;
|
|
const children: Tree[] = parent.data.children || parent.data;
|
|
const index = children.findIndex((d) => d.id === data.id);
|
|
children[index].disabled = !children[index].disabled;
|
|
dataSource.value = [...dataSource.value];
|
|
};
|
|
function delDefaultImg(){
|
|
const element = controlData.value.control;
|
|
element.imgUrl = "";
|
|
element.uploadFlag = false;
|
|
element.useDefaultImg = false;
|
|
}
|
|
//图片上传成功钩子
|
|
function lowcodeImageUploadSuccess(
|
|
response: any,
|
|
uploadFile: UploadFile,
|
|
uploadFiles: UploadFiles
|
|
) {
|
|
const element = controlData.value.control;
|
|
element.imgUrl = response.data.url;
|
|
element.uploadFlag = true;
|
|
element.useDefaultImg = true;
|
|
element.onSiteShot = '';
|
|
element.watermark = '';
|
|
}
|
|
|
|
//
|
|
const transferDataSourceOptions = [
|
|
{
|
|
value: "数据源",
|
|
label: "数据源",
|
|
},
|
|
{
|
|
value: "固定选项",
|
|
label: "固定选项",
|
|
},
|
|
];
|
|
|
|
const locationLevelOptions = [
|
|
{
|
|
value: "省级",
|
|
label: "省级",
|
|
},
|
|
{
|
|
value: "市级",
|
|
label: "市级",
|
|
},
|
|
{
|
|
value: "区县级",
|
|
label: "区县级",
|
|
},
|
|
{
|
|
value: "详细地址",
|
|
label: "详细地址",
|
|
},
|
|
]
|
|
|
|
//const radio = ref(controlData.value.control.fit)
|
|
|
|
//liwenxuan20240313 lowcodeImage end
|
|
//liwenxuan20250103 qrCode start
|
|
let qrCodeImgInside = "";
|
|
const qrCodeInsideDialogFlag = ref(false);
|
|
function showQrCodeOutside() {
|
|
alert("暂不支持外部填单");
|
|
}
|
|
function showQrCodeInside() {
|
|
//查看二维码展示弹窗图片,图片带有分组,app,表单名称,和二维码图片
|
|
//在此获取必要的参数并请求后台,获取二维码图片,当图片返回成功时,显示弹窗
|
|
//必要的参数为cfid
|
|
getQrCodeImgInside().then(({ data }) => {
|
|
qrCodeImgInside = data;
|
|
if (qrCodeInsideDialogFlag.value == false) {
|
|
//console.log(qrCodeImgInside)
|
|
qrCodeInsideDialogFlag.value = true;
|
|
}
|
|
});
|
|
}
|
|
function getQrCodeImgInside() {
|
|
return request({
|
|
url: "/javasys/lowCode/QrCode/getQrCodeImgInside",
|
|
method: "post",
|
|
data: {
|
|
cfid: props.customerformid,
|
|
},
|
|
});
|
|
}
|
|
/* const qrCodeOutPrintConfigFlag = ref(false)
|
|
function showQrCodeOutPrintConfig(){
|
|
qrCodeOutPrintConfigFlag.value = true
|
|
} */
|
|
function handleMaxSelect() {
|
|
//console.log(formData.value.qrCodeShowFields.length)
|
|
if (formData.value.qrCodeShowFields.length > 5) {
|
|
alert("最多可选择5个字段");
|
|
}
|
|
while (formData.value.qrCodeShowFields.length > 5) {
|
|
//
|
|
formData.value.qrCodeShowFields.pop();
|
|
}
|
|
}
|
|
//liwenxuan20250103 qrCode end
|
|
//liwenxuan20240403 associatedForms start
|
|
import AssociatedFormsTinyace from "@/widget/associatedforms/associatedFormsTinyace.vue";
|
|
import AssociatedFormsTinyaceRange from "@/widget/associatedforms/associatedFormsTinyaceRange.vue";
|
|
import AssociatedFormsFillRole from "@/widget/associatedforms/associatedFormsFillRole.vue";
|
|
import AssociatedFormsChildFillRole from "@/widget/associatedforms/associatedFormsChildFillRole.vue";
|
|
import TransferSelectUserRange from "@/widget/lowcodetransfer/lowcodeTransfer1.vue";
|
|
|
|
const transferSelectUserRangeData = ref({"type":"lowcodeTransfer","unitName":"请选择","iconFont":"fa-arrows-h","control":{"modelValue":[],"fixedOptions":[{"id":"thefirstrootnode","label":"根节点1","unitName":"","disabled":false,"children":[]},{"id":"thesecondrootnode","label":"根节点2","unitName":"","disabled":false,"children":[]}]},"config":{"transferName":"请选择","transferDataSource":"数据源","apiUrl":"/javasys/lowCode/transfer/getOrgAndManTree","method":"post"},"name":"lowcodeTransfer1758525493710","item":{"label":"穿梭框"},"styles":{"divStyle":{"divbox":"all","transparency":100},"labelStyle":{"divbox":"all","transparency":100},"inputStyle":{"transparency":100}}})
|
|
|
|
|
|
const treeDefaultProps = {
|
|
//
|
|
children: "children",
|
|
label: "label",
|
|
};
|
|
//拿到子组件AssociatedFormsTinyace的实例
|
|
const aft = ref();
|
|
const aftRange = ref();
|
|
|
|
function getAssociatedFormsCurrentFieldTree() {
|
|
return request({
|
|
url: "/javasys/lowCode/AssociatedForms/getFieldTree",
|
|
method: "post",
|
|
data: {
|
|
//cfid:'13'
|
|
cfid: props.customerformid,
|
|
},
|
|
});
|
|
}
|
|
|
|
function getAssociatedFormsOrgAndManTree() {
|
|
return request({
|
|
url: "/javasys/lowCode/transfer/getOrgAndManTree",
|
|
method: "post",
|
|
});
|
|
}
|
|
|
|
function getCustomerFormList() {
|
|
return request({
|
|
url: "/javasys/lowCode/AssociatedForms/getCustomerFormList",
|
|
method: "post",
|
|
});
|
|
}
|
|
function getAssociatedFormsRoleTree() {
|
|
return request({
|
|
url: "/javasys/lowCode/AssociatedForms/getRoleList",
|
|
method: "post",
|
|
});
|
|
}
|
|
|
|
function getAsfasfFieldTree() {
|
|
return request({
|
|
url: "/javasys/lowCode/AssociatedForms/getFieldTree",
|
|
method: "post",
|
|
data: {
|
|
//cfid:'13'
|
|
cfid: controlData.value.control.formid,
|
|
},
|
|
});
|
|
}
|
|
|
|
function getAsfasfFieldTreeOptionsValue3() {
|
|
return request({
|
|
url: "/javasys/lowCode/AssociatedForms/getFieldTree",
|
|
method: "post",
|
|
data: {
|
|
//cfid:'13'
|
|
cfid: controlData.value.control.optionsValue3Formid,
|
|
},
|
|
});
|
|
}
|
|
|
|
//
|
|
const asfasfFieldTree = ref<Tree[]>();
|
|
|
|
const asfasfMasterFieldTree = ref<Tree[]>();
|
|
|
|
const asfasfChildTableList = ref<Tree[]>();
|
|
|
|
const asfasfChildTableFields = ref<Tree[]>();
|
|
|
|
const asfasfFieldTreeOptionsValue3 = ref<Tree[]>();
|
|
|
|
let currentChildTableCount = 0;
|
|
|
|
function removeFirstNumElements(arr: string | any[], num: number) {
|
|
if (arr.length < num) {
|
|
return [];
|
|
}
|
|
return arr.slice(num);
|
|
}
|
|
|
|
function formidChanged() {
|
|
//需设置关联关联表单的表单
|
|
controlData.value.control.glbbddbd = formData.value.name;
|
|
if (controlData.value.control.formid === "") {
|
|
} else {
|
|
getAsfasfFieldTree().then(({ data }) => {
|
|
if (data.id === "cfid为空") {
|
|
//alert("cfid为空")
|
|
} else {
|
|
let resData = ref(data.children);
|
|
let dataExceptChild = JSON.parse(JSON.stringify(data.children));
|
|
let dataOnlyChild = JSON.parse(JSON.stringify(data.children));
|
|
let dataOnlyChild1 = JSON.parse(JSON.stringify(data.children));
|
|
dataExceptChild = dataExceptChild.filter(
|
|
(obj: { type: string }) => obj.type !== "table"
|
|
);
|
|
//console.log(dataExceptChild)
|
|
//dataExceptChild = removeFirstNumElements(dataExceptChild, 8);
|
|
|
|
dataExceptChild.splice(0, 2);
|
|
|
|
dataExceptChild.splice(2, 4);
|
|
|
|
dataOnlyChild = dataOnlyChild.filter(
|
|
(obj: { type: string }) => obj.type == "table"
|
|
);
|
|
dataOnlyChild1 = dataOnlyChild1.filter(
|
|
(obj: { type: string }) => obj.type == "table"
|
|
);
|
|
//console.log(dataOnlyChild1)
|
|
dataOnlyChild1.forEach((element: any) => {
|
|
element.children = removeFirstNumElements(element.children, 6);
|
|
});
|
|
/* console.log(dataOnlyChild1)
|
|
console.log(dataOnlyChild) */
|
|
for (let m = 0; m < dataOnlyChild.length; m++) {
|
|
dataOnlyChild[m].children = [];
|
|
}
|
|
let resDataExceptChild = ref(dataExceptChild);
|
|
let resDataOnlyChild = ref(dataOnlyChild);
|
|
let resDataOnlyChild1 = ref(dataOnlyChild1);
|
|
//console.log(resDataOnlyChild1.value)
|
|
//console.log(resDataOnlyChild.value)
|
|
let childTableCount = 0;
|
|
for (let n = 0; n < resDataOnlyChild.value.length; n++) {
|
|
//console.log(resDataOnlyChild.value[n])
|
|
resDataOnlyChild.value[n].disabled = false;
|
|
childTableCount++;
|
|
}
|
|
//console.log(childTableCount)
|
|
currentChildTableCount = childTableCount;
|
|
asfasfFieldTree.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resData.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
asfasfMasterFieldTree.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resDataExceptChild.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
asfasfChildTableList.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resDataOnlyChild.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
asfasfChildTableFields.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resDataOnlyChild1.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
}
|
|
controlData.value.control.asfasfLabel = data.label;
|
|
});
|
|
}
|
|
}
|
|
|
|
function formidChangedOptionsValue3() {
|
|
if (controlData.value.control.optionsValue3Formid === "") {
|
|
} else {
|
|
getAsfasfFieldTreeOptionsValue3().then(({ data }) => {
|
|
if (data.id === "cfid为空") {
|
|
//alert("cfid为空")
|
|
} else {
|
|
if (data.treeAttrs.onlyToShowTableId == "") {
|
|
//当前选中的是主表
|
|
let resData = ref(data.children);
|
|
//let rootid_ = data.value.label
|
|
asfasfFieldTreeOptionsValue3.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resData.value],
|
|
treeAttrs: data.treeAttrs,
|
|
},
|
|
];
|
|
} else {
|
|
//当前选中的是子表
|
|
let resData = ref(data.children);
|
|
resData.value = resData.value.filter(
|
|
(item: { children: null }) => item.children != null
|
|
);
|
|
let arr = JSON.parse(JSON.stringify(resData.value));
|
|
arr = arr.filter(
|
|
(item: { label: any }) => item.label == data.treeAttrs.onlyToShowTableId
|
|
);
|
|
|
|
arr = arr[0].children;
|
|
// console.log(arr)
|
|
asfasfFieldTreeOptionsValue3.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...arr],
|
|
treeAttrs: data.treeAttrs,
|
|
},
|
|
];
|
|
}
|
|
let optionsValue3Formid = controlData.value.control.optionsValue3Formid;
|
|
let str_optionsValue3Formid = optionsValue3Formid.split(":")[0];
|
|
let optionsValue3Field = controlData.value.control.optionsValue3Field;
|
|
let str_optionsValue3Field = optionsValue3Field.split(":")[1];
|
|
//alert(str_optionsValue3Field)
|
|
if (typeof str_optionsValue3Field != "undefined") {
|
|
if (str_optionsValue3Formid != str_optionsValue3Field) {
|
|
controlData.value.control.optionsValue3Field = "";
|
|
} else {
|
|
if (optionsValue3Formid.includes(":zibiaoid-")) {
|
|
let zibiaoid = optionsValue3Formid.split(":zibiaoid-")[1];
|
|
if (!optionsValue3Field.includes(zibiaoid)) {
|
|
controlData.value.control.optionsValue3Field = "";
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
let currentFormChildTableFieldsForFillRole = ref<Tree[]>();
|
|
let associatedFormsCurrentFormFieldTree = ref<Tree[]>();
|
|
let associatedFormsCurrentFormFieldTree1 = ref<Tree[]>();
|
|
let associatedFormsCurrentFormFieldTreeNoTable = ref<Tree[]>();
|
|
let associatedFormsCurrentFormFieldTreeNoTable1 = ref<[]>();
|
|
let associatedFormsCurrentFormFieldTreeForGlxxsz = ref<Tree[]>();
|
|
let associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf = ref<Tree[]>();
|
|
let resDataForGlxxszExceptself: any[] = [];
|
|
let resDataForGlxxszExceptself1: any[] = [];
|
|
let getAssociatedFormsCurrentFieldTreeData: any;
|
|
getAssociatedFormsCurrentFieldTree1();
|
|
function getAssociatedFormsCurrentFieldTree1() {
|
|
getAssociatedFormsCurrentFieldTree().then(({ data }) => {
|
|
// console.log(data)
|
|
getAssociatedFormsCurrentFieldTreeData = JSON.parse(JSON.stringify(data));
|
|
// console.log(getAssociatedFormsCurrentFieldTreeData)
|
|
if (data.id === "cfid为空" || data.id === "masterTable为null") {
|
|
//alert("cfid为空")
|
|
} else {
|
|
let resData = ref(data.children);
|
|
let resDataExceptSystemFields = JSON.parse(JSON.stringify(data.children));
|
|
let currentFormChildTableFields = JSON.parse(JSON.stringify(data.children));
|
|
let resDataNoTable = JSON.parse(JSON.stringify(data.children));
|
|
let resDataNoTableNoAsf = JSON.parse(JSON.stringify(data.children));
|
|
resDataExceptSystemFields = removeFirstNumElements(resDataExceptSystemFields, 8);
|
|
resDataExceptSystemFields.forEach((element: any) => {
|
|
if (element.type == "table") {
|
|
//console.log(element)
|
|
element.children = removeFirstNumElements(element.children, 6);
|
|
}
|
|
});
|
|
//在此组装当前表单子表字段数据
|
|
currentFormChildTableFields = currentFormChildTableFields.filter(
|
|
(item: { type: string }) => item.type == "table"
|
|
);
|
|
currentFormChildTableFields.forEach((element: any) => {
|
|
element.children = removeFirstNumElements(element.children, 6);
|
|
});
|
|
|
|
associatedFormsCurrentFormFieldTree.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "当前表单-" + data.treeAttrs.show,
|
|
children: [...resData.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
associatedFormsCurrentFormFieldTree1.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "当前表单-" + data.treeAttrs.show,
|
|
children: [...resDataExceptSystemFields],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
currentFormChildTableFieldsForFillRole.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "当前表单-" + data.treeAttrs.show,
|
|
children: [...currentFormChildTableFields],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
|
|
//liwenxuan 关联选项设置对子表不生效的bug修复 start 250409
|
|
let resDataHasTableButNoTableChild = JSON.parse(JSON.stringify(data.children));
|
|
resDataHasTableButNoTableChild.splice(0, 2);
|
|
resDataHasTableButNoTableChild.splice(2, 4);
|
|
resDataHasTableButNoTableChild.forEach((element: any) => {
|
|
if (element.type && element.type == "table") {
|
|
element.children = [];
|
|
element.disabled = false;
|
|
}
|
|
let currentIdArr = element.id.split(":");
|
|
//console.log(currentIdArr)
|
|
let currentId = currentIdArr[currentIdArr.length - 1];
|
|
//console.log(currentId)
|
|
|
|
if (currentId == controlData.value.name) {
|
|
/* alert(currentId)
|
|
console.log(currentId) */
|
|
element.disabled = true;
|
|
}
|
|
});
|
|
|
|
//liwenxuan 关联选项设置对子表不生效的bug修复 end 250409
|
|
|
|
resDataNoTable = resDataNoTable.filter(
|
|
(item: { type: string | null }) => item.type != "table"
|
|
);
|
|
resDataNoTableNoAsf = resDataNoTable.filter(
|
|
(item: { type: string | null }) =>
|
|
item.type != "associatedForms" &&
|
|
item.type != "table" &&
|
|
item.type != "checkbox"
|
|
);
|
|
|
|
associatedFormsCurrentFormFieldTreeNoTable.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "当前表单-" + data.treeAttrs.show,
|
|
children: [...resDataNoTableNoAsf],
|
|
treeAttrs: data.treeAttrs,
|
|
},
|
|
];
|
|
//console.log(resDataNoTable)
|
|
associatedFormsCurrentFormFieldTreeNoTable1.value = [...resDataNoTable];
|
|
//liwenxuan 关联选项设置无法识别创建人,创建时间控件bug修复 start 250409
|
|
/* let r1 = JSON.parse(JSON.stringify(data.children));
|
|
|
|
r1.splice(0,2);
|
|
r1.splice(2,4); */
|
|
//let resDataForGlxxsz = ref(data.children.slice(8));
|
|
let resDataForGlxxsz = ref(resDataHasTableButNoTableChild);
|
|
//liwenxuan 关联选项设置无法识别创建人,创建时间控件bug修复 end 250409
|
|
resDataForGlxxszExceptself = JSON.parse(JSON.stringify(resDataForGlxxsz.value));
|
|
|
|
associatedFormsCurrentFormFieldTreeForGlxxsz.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
//label: '当前表单',
|
|
label: "当前表单-" + data.treeAttrs.show,
|
|
children: [...resDataForGlxxsz.value],
|
|
treeAttrs: data.treeAttrs,
|
|
},
|
|
];
|
|
associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
//label: '当前表单',
|
|
label: "当前表单-" + data.treeAttrs.show,
|
|
children: [...resDataForGlxxsz.value],
|
|
treeAttrs: data.treeAttrs, //getAssociatedFormsCurrentFieldTreeData
|
|
},
|
|
];
|
|
}
|
|
});
|
|
}
|
|
function removeTreeNode(tree: any, targetId: any) {
|
|
// 深拷贝原始树结构避免污染原数据
|
|
const clonedTree = JSON.parse(JSON.stringify(tree));
|
|
|
|
// 递归处理节点
|
|
function processNode(node: { id: any; children: any[]; }) {
|
|
// 命中目标节点时返回null进行过滤
|
|
if (node.id === targetId) return null;
|
|
|
|
// 递归处理子节点并过滤空值
|
|
if (node.children?.length) {
|
|
node.children = node.children.map((child: any) => processNode(child)).filter(Boolean);
|
|
}
|
|
|
|
return node;
|
|
}
|
|
|
|
// 处理单根或多根树结构
|
|
const result = Array.isArray(clonedTree)
|
|
? clonedTree.map((node) => processNode(node)).filter(Boolean)
|
|
: processNode(clonedTree);
|
|
|
|
return result || null;
|
|
}
|
|
|
|
const customerFormTree = ref<Tree[]>();
|
|
getCustomerFormList().then(({ data }) => {
|
|
/* console.log(data.children)
|
|
console.log(props.customerformid) */
|
|
let datachildrenWithoutSelf = removeTreeNode(data.children, props.customerformid);
|
|
let resData = ref(datachildrenWithoutSelf);
|
|
customerFormTree.value = [
|
|
{
|
|
id: data.id,
|
|
//value: data.value,
|
|
//label: data.label,
|
|
label: "请选择表单",
|
|
children: [...resData.value],
|
|
},
|
|
];
|
|
});
|
|
|
|
const orgAndManTree = ref<Tree[]>();
|
|
getAssociatedFormsOrgAndManTree().then(({ data }) => {
|
|
let resData = ref(data.children);
|
|
orgAndManTree.value = [
|
|
{
|
|
id: data.id,
|
|
//label: data.label,
|
|
label: "组织机构",
|
|
children: [...resData.value],
|
|
},
|
|
];
|
|
});
|
|
|
|
const roleTree = ref<Tree[]>();
|
|
getAssociatedFormsRoleTree().then(({ data }) => {
|
|
let resData = ref(data.children);
|
|
// console.log("roleTree=============="+resData.value);
|
|
roleTree.value = [
|
|
{
|
|
id: data.id,
|
|
//label: data.label,
|
|
label: "角色",
|
|
children: [...resData.value],
|
|
},
|
|
];
|
|
});
|
|
// field
|
|
const fieldTreeSearchFlag = ref(false);
|
|
|
|
function handleFieldTreeExpand() {
|
|
fieldTreeSearchFlag.value = true;
|
|
}
|
|
|
|
function handleFieldTreeCollapse() {
|
|
fieldTreeSearchFlag.value = false;
|
|
}
|
|
|
|
function handleFieldTreeContextmenu(
|
|
MouseEvent: any,
|
|
object: any,
|
|
Node: any,
|
|
element: any
|
|
) {
|
|
aft.value.addIcon_field(object);
|
|
}
|
|
function handleFieldTreeContextmenuRange(
|
|
MouseEvent: any,
|
|
object: any,
|
|
Node: any,
|
|
element: any
|
|
) {
|
|
aftRange.value.addIcon_field(object);
|
|
}
|
|
|
|
//org
|
|
const orgTreeSearchFlag = ref(false);
|
|
|
|
function handleOrgTreeExpand() {
|
|
orgTreeSearchFlag.value = true;
|
|
}
|
|
|
|
function handleOrgTreeCollapse() {
|
|
orgTreeSearchFlag.value = false;
|
|
}
|
|
|
|
function handleOrgTreeContextmenu(MouseEvent: any, object: any, Node: any, element: any) {
|
|
aft.value.addIcon_org(object);
|
|
}
|
|
function handleOrgTreeContextmenuRange(
|
|
MouseEvent: any,
|
|
object: any,
|
|
Node: any,
|
|
element: any
|
|
) {
|
|
aftRange.value.addIcon_org(object);
|
|
}
|
|
//role
|
|
const roleTreeSearchFlag = ref(false);
|
|
|
|
function handleRoleTreeExpand() {
|
|
roleTreeSearchFlag.value = true;
|
|
}
|
|
|
|
function handleRoleTreeCollapse() {
|
|
roleTreeSearchFlag.value = false;
|
|
}
|
|
|
|
function handleRoleTreeContextmenu(
|
|
MouseEvent: any,
|
|
object: any,
|
|
Node: any,
|
|
element: any
|
|
) {
|
|
aft.value.addIcon(object);
|
|
}
|
|
function handleRoleTreeContextmenuRange(
|
|
MouseEvent: any,
|
|
object: any,
|
|
Node: any,
|
|
element: any
|
|
) {
|
|
aftRange.value.addIcon(object);
|
|
}
|
|
|
|
import { ElTree } from "element-plus";
|
|
import { forEach } from "jszip";
|
|
import { getInstanceByDom } from "echarts";
|
|
|
|
const fieldTreeFilterText = ref("");
|
|
const orgTreeFilterText = ref("");
|
|
const roleTreeFilterText = ref("");
|
|
const fieldTreeRef = ref<InstanceType<typeof ElTree>>();
|
|
const orgTreeRef = ref<InstanceType<typeof ElTree>>();
|
|
const roleTreeRef = ref<InstanceType<typeof ElTree>>();
|
|
watch(fieldTreeFilterText, (val) => {
|
|
fieldTreeRef.value!.filter(val);
|
|
});
|
|
watch(orgTreeFilterText, (val) => {
|
|
orgTreeRef.value!.filter(val);
|
|
});
|
|
watch(roleTreeFilterText, (val) => {
|
|
roleTreeRef.value!.filter(val);
|
|
});
|
|
|
|
const filterNode = (value: string, associatedFormsCurrentFormFieldTree: Tree) => {
|
|
if (!value) return true;
|
|
return associatedFormsCurrentFormFieldTree.label.includes(value);
|
|
};
|
|
|
|
//关联表单隐藏条件弹窗flag
|
|
const associatedFormsHideDialogFlag = ref(false);
|
|
|
|
const associatedFormsDataRangeDialogFlag = ref(false);
|
|
|
|
//点击开启隐藏设置
|
|
function associatedFormsHideDialoghandle() {
|
|
associatedFormsHideDialogFlag.value = true;
|
|
controlData.value.control.hideConditionHtmlCopy =
|
|
controlData.value.control.hideConditionHtml;
|
|
nextTick(() => {
|
|
aft.value.focusEditor
|
|
});
|
|
}
|
|
|
|
function associatedFormsDataRangeDialoghandle() {
|
|
getAsfasfFieldTree().then(({ data }) => {
|
|
if (data.id === "cfid为空") {
|
|
//alert("cfid为空")
|
|
} else {
|
|
let resData = ref(data.children);
|
|
let dataExceptChild = JSON.parse(JSON.stringify(data.children));
|
|
let dataOnlyChild = JSON.parse(JSON.stringify(data.children));
|
|
let dataOnlyChild1 = JSON.parse(JSON.stringify(data.children));
|
|
dataExceptChild = dataExceptChild.filter(
|
|
(obj: { type: string }) => obj.type !== "table"
|
|
);
|
|
//console.log(dataExceptChild)
|
|
dataExceptChild = removeFirstNumElements(dataExceptChild, 8);
|
|
dataOnlyChild = dataOnlyChild.filter(
|
|
(obj: { type: string }) => obj.type == "table"
|
|
);
|
|
dataOnlyChild1 = dataOnlyChild1.filter(
|
|
(obj: { type: string }) => obj.type == "table"
|
|
);
|
|
//console.log(dataOnlyChild1)
|
|
dataOnlyChild1.forEach((element: any) => {
|
|
element.children = removeFirstNumElements(element.children, 6);
|
|
});
|
|
/* console.log(dataOnlyChild1)
|
|
console.log(dataOnlyChild) */
|
|
for (let m = 0; m < dataOnlyChild.length; m++) {
|
|
dataOnlyChild[m].children = [];
|
|
}
|
|
let resDataExceptChild = ref(dataExceptChild);
|
|
let resDataOnlyChild = ref(dataOnlyChild);
|
|
let resDataOnlyChild1 = ref(dataOnlyChild1);
|
|
//console.log(resDataOnlyChild1.value)
|
|
//console.log(asfasfChildTableList.value)
|
|
//console.log(resDataOnlyChild.value)
|
|
let childTableCount = 0;
|
|
for (let n = 0; n < resDataOnlyChild.value.length; n++) {
|
|
//console.log(resDataOnlyChild.value[n])
|
|
resDataOnlyChild.value[n].disabled = false;
|
|
childTableCount = n;
|
|
}
|
|
//console.log(childTableCount)
|
|
currentChildTableCount = childTableCount;
|
|
asfasfFieldTree.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resData.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
asfasfMasterFieldTree.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resDataExceptChild.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
asfasfChildTableList.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resDataOnlyChild.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
asfasfChildTableFields.value = [
|
|
{
|
|
id: "rootid_" + data.label,
|
|
label: "关联的表单-" + data.label,
|
|
children: [...resDataOnlyChild1.value],
|
|
treeAttrs: data.treeAttrs,
|
|
disabled: true,
|
|
},
|
|
];
|
|
}
|
|
});
|
|
|
|
associatedFormsDataRangeDialogFlag.value = true;
|
|
controlData.value.control.dataRangeConditionHtmlCopy =
|
|
controlData.value.control.dataRangeConditionHtml;
|
|
|
|
nextTick(() => {
|
|
aftRange.value.focusEditor();
|
|
});
|
|
}
|
|
|
|
//自定义事件同步父子组件的text
|
|
function aftTextChanged(str: string) {
|
|
controlData.value.control.hideConditionHtml = str;
|
|
}
|
|
|
|
function aftGongshiChanged(gongshi: any) {
|
|
controlData.value.control.hideGongShi.formulaHtml = gongshi.formulaHtml;
|
|
controlData.value.control.hideGongShi.mathsFormula = gongshi.mathsFormula;
|
|
controlData.value.control.hideGongShi.mathsString = gongshi.mathsString;
|
|
}
|
|
|
|
function aftTextChangedRange(str: string) {
|
|
controlData.value.control.dataRangeConditionHtml = str;
|
|
}
|
|
function aftGongshiChangedRange(gongshi: any) {
|
|
controlData.value.control.dataRangeGongShi.formulaHtml = gongshi.formulaHtml;
|
|
controlData.value.control.dataRangeGongShi.mathsFormula = gongshi.mathsFormula;
|
|
controlData.value.control.dataRangeGongShi.mathsString = gongshi.mathsString;
|
|
}
|
|
//asf隐藏条件取消编辑
|
|
function asfhTextCancel() {
|
|
determine.value = false;
|
|
associatedFormsHideDialogFlag.value = false;
|
|
controlData.value.control.hideConditionHtml =
|
|
controlData.value.control.hideConditionHtmlCopy;
|
|
//父组件取消将copy同步至子组件
|
|
aft.value.handelCancel(controlData.value.control.hideConditionHtmlCopy);
|
|
}
|
|
|
|
function asfhTextCancelRange() {
|
|
determineRange.value = false;
|
|
associatedFormsDataRangeDialogFlag.value = false;
|
|
controlData.value.control.dataRangeConditionHtml =
|
|
controlData.value.control.dataRangeConditionHtmlCopy;
|
|
//父组件取消将copy同步至子组件
|
|
aftRange.value.handelCancel(controlData.value.control.dataRangeConditionHtmlCopy);
|
|
}
|
|
|
|
//上次点击了确定为true
|
|
let determine = ref(true);
|
|
let determineRange = ref(true);
|
|
//监听associatedFormsHideDialogFlag true 重新init tinymce
|
|
watch(associatedFormsHideDialogFlag, (val) => {
|
|
if (val === true && determine.value === false) {
|
|
setTimeout(() => {
|
|
//alert(1)
|
|
aft.value.tinymceReInit();
|
|
}, 200);
|
|
}
|
|
});
|
|
|
|
watch(associatedFormsDataRangeDialogFlag, (val) => {
|
|
if (val === true && determineRange.value === false) {
|
|
setTimeout(() => {
|
|
//alert(2)
|
|
aftRange.value.tinymceReInit();
|
|
}, 200);
|
|
}
|
|
});
|
|
//关联表单数据填充规则根据已选择子表的数目和id将已选择的子表置为不可选择
|
|
function selectedOrDelChildRole() {
|
|
//console.log(asfasfChildTableList.value)
|
|
//console.log(controlData.value.control?.fillRoles?.child)
|
|
let selectedArr: any[] = [];
|
|
controlData.value.control?.fillRoles?.child.forEach(function (item: any) {
|
|
if (item.asfChildTableKey != "") {
|
|
selectedArr.push(item);
|
|
}
|
|
});
|
|
//console.log(selectedArr)
|
|
if (asfasfChildTableList.value) {
|
|
asfasfChildTableList.value[0].children?.forEach(function (item: any) {
|
|
item.disabled = false;
|
|
});
|
|
}
|
|
if (asfasfChildTableList.value) {
|
|
asfasfChildTableList.value[0].children?.forEach(function (item: any) {
|
|
selectedArr.forEach(function (i: any) {
|
|
if (i.asfChildTableKey == item.id) {
|
|
item.disabled = true;
|
|
}
|
|
});
|
|
});
|
|
}
|
|
}
|
|
//将已被选择的要填充的关联其他表单的表单的子表字段设为不可选择
|
|
function childRoleRightChanged() {
|
|
let selectedArr: any[] = [];
|
|
let otherMasterSelectedArr: any[] = [];
|
|
let otherChildSelectedArr: any[] = [];
|
|
asfsExpectCurrent.forEach(function (item: any) {
|
|
let master = item.control.fillRoles.master;
|
|
let child = item.control.fillRoles.child;
|
|
/* console.log(master)
|
|
console.log(child) */
|
|
master.forEach(function (item: any) {
|
|
if (item.rightValue != "") {
|
|
otherMasterSelectedArr.push(item);
|
|
}
|
|
});
|
|
child.forEach(function (item: any) {
|
|
item.childRoles.forEach((element: any) => {
|
|
if (element.rightValue != "") {
|
|
otherChildSelectedArr.push(element);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
let masterSelectedArr: any[] = [];
|
|
controlData.value.control?.fillRoles?.master.forEach(function (item: any) {
|
|
if (item.rightValue != "") {
|
|
masterSelectedArr.push(item);
|
|
}
|
|
});
|
|
let childSelectedArr: any[] = [];
|
|
controlData.value.control?.fillRoles?.child.forEach(function (item: any) {
|
|
item.childRoles.forEach((element: any) => {
|
|
if (element.rightValue != "") {
|
|
childSelectedArr.push(element);
|
|
}
|
|
});
|
|
});
|
|
|
|
/* 1.得到当前子表填充规则块在所有子表填充规则块数组中的index
|
|
2.得到所有index在当前子表填充规则块之前的子表填充规则块
|
|
3.得到2中所有right,凡是出现过的子表,就把这些子表的所有选项全部置为不可选 */
|
|
//console.log(asfs)
|
|
|
|
selectedArr.push(...otherMasterSelectedArr);
|
|
selectedArr.push(...otherChildSelectedArr);
|
|
selectedArr.push(...masterSelectedArr);
|
|
selectedArr.push(...childSelectedArr);
|
|
//主表控制 start
|
|
if (associatedFormsCurrentFormFieldTree1.value) {
|
|
associatedFormsCurrentFormFieldTree1.value[0].children?.forEach(function (item: any) {
|
|
if (item.type == "table") {
|
|
item.children.forEach((element: any) => {
|
|
element.disabled = false;
|
|
});
|
|
} else {
|
|
item.disabled = false;
|
|
}
|
|
});
|
|
}
|
|
if (associatedFormsCurrentFormFieldTree1.value) {
|
|
associatedFormsCurrentFormFieldTree1.value[0].children?.forEach(function (item: any) {
|
|
if (item.type == "table") {
|
|
item.children.forEach((element: any) => {
|
|
selectedArr.forEach((j: any) => {
|
|
if (j.rightValue == element.id) {
|
|
element.disabled = true;
|
|
}
|
|
});
|
|
});
|
|
} else {
|
|
selectedArr.forEach((element: any) => {
|
|
if (element.rightValue == item.id) {
|
|
item.disabled = true;
|
|
}
|
|
});
|
|
}
|
|
});
|
|
}
|
|
//主表控制 end
|
|
|
|
//子表控制start
|
|
if (currentFormChildTableFieldsForFillRole.value) {
|
|
currentFormChildTableFieldsForFillRole.value[0]?.children?.forEach((element: any) => {
|
|
element.children.forEach((item: any) => {
|
|
selectedArr.forEach((j: any) => {
|
|
item.disabled = false;
|
|
});
|
|
});
|
|
});
|
|
}
|
|
if (currentFormChildTableFieldsForFillRole.value) {
|
|
currentFormChildTableFieldsForFillRole.value[0]?.children?.forEach((element: any) => {
|
|
element.children.forEach((item: any) => {
|
|
selectedArr.forEach((j: any) => {
|
|
if (j.rightValue == item.id) {
|
|
item.disabled = true;
|
|
}
|
|
});
|
|
});
|
|
});
|
|
}
|
|
//子表控制end
|
|
}
|
|
|
|
//确定回调
|
|
function handleDetermine() {
|
|
associatedFormsHideDialogFlag.value = false;
|
|
determine.value = true;
|
|
controlData.value.control.hideConditionHtmlCopy =
|
|
controlData.value.control.hideConditionHtml;
|
|
}
|
|
function handleDetermineRange() {
|
|
associatedFormsDataRangeDialogFlag.value = false;
|
|
determineRange.value = true;
|
|
controlData.value.control.dataRangeConditionHtmlCopy =
|
|
controlData.value.control.dataRangeConditionHtml;
|
|
}
|
|
//数据填充规则
|
|
|
|
const associatedFormsFillRolesDialogFlag = ref(false);
|
|
//数据填充规则设置按钮
|
|
function associatedFormsDataFillRolesDialoghandle() {
|
|
if (controlData.value.control.formid === "") {
|
|
alert("请先选择要关联的表单");
|
|
} else {
|
|
associatedFormsFillRolesDialogFlag.value = true;
|
|
}
|
|
}
|
|
|
|
function asfhTextCancelFillRoles() {
|
|
associatedFormsFillRolesDialogFlag.value = false;
|
|
}
|
|
//数据填充规则确定按钮
|
|
function handleDetermineFillRoles() {
|
|
associatedFormsFillRolesDialogFlag.value = false;
|
|
}
|
|
|
|
watch(
|
|
() => store.activeKey,
|
|
() => {
|
|
// console.log("activeKey",store.activeKey);
|
|
if (controlData.value.type === "associatedForms") {
|
|
setTimeout(() => {
|
|
formidChanged();
|
|
}, 800);
|
|
/* aft.value.tinymceReInit()
|
|
aftRange.value.tinymceReInit() */
|
|
} else if (
|
|
controlData.value.type === "radio" ||
|
|
controlData.value.type === "select" ||
|
|
controlData.value.type === "checkbox"
|
|
) {
|
|
setTimeout(() => {
|
|
formidChangedOptionsValue3();
|
|
}, 800);
|
|
}
|
|
}
|
|
);
|
|
|
|
function addFillRole() {
|
|
let onlyNumber = uuidv4().replaceAll("-", "").toString(); //获取唯一编码
|
|
controlData.value.control.fillRoles.master.push({
|
|
leftValue: "",
|
|
rightValue: "",
|
|
id: onlyNumber,
|
|
});
|
|
}
|
|
|
|
function addChildFillRole() {
|
|
//子表填充规则要受到子表数量的限制
|
|
//currentChildTableCount
|
|
//controlData.value.control.fillRoles.child.length
|
|
selectedOrDelChildRole();
|
|
childRoleRightChanged();
|
|
if (controlData.value.control.fillRoles.child.length < currentChildTableCount) {
|
|
let onlyNumber = uuidv4().replaceAll("-", "").toString(); //获取唯一编码
|
|
let onlyNumber1 = uuidv4().replaceAll("-", "").toString(); //获取唯一编码
|
|
controlData.value.control.fillRoles.child.push({
|
|
id: onlyNumber,
|
|
asfChildTableKey: "",
|
|
filterCondition: {
|
|
conditionHtml: "",
|
|
conditionHtmlCopy: "",
|
|
gongShi: {
|
|
formulaHtml: "",
|
|
mathsFormula: "",
|
|
mathsString: "",
|
|
},
|
|
},
|
|
childRoles: [
|
|
{
|
|
leftValue: "",
|
|
rightValue: "",
|
|
id: onlyNumber1,
|
|
},
|
|
],
|
|
});
|
|
} else {
|
|
alert(
|
|
"当前关联表单共 " +
|
|
controlData.value.control.fillRoles.child.length +
|
|
" 张子表,不可再添加"
|
|
);
|
|
}
|
|
}
|
|
|
|
function delRole(id: String) {
|
|
const delRoleData: any = controlData.value.control.fillRoles.master;
|
|
for (var i = 0; i < delRoleData.length; i++) {
|
|
if (delRoleData[i].id === id) {
|
|
delRoleData.splice(i, 1);
|
|
i--; // 如果不减，将漏掉一个元素
|
|
}
|
|
}
|
|
}
|
|
|
|
function delChildRole(id: String) {
|
|
const delRoleData: any = controlData.value.control.fillRoles.child;
|
|
for (var i = 0; i < delRoleData.length; i++) {
|
|
if (delRoleData[i].id === id) {
|
|
delRoleData.splice(i, 1);
|
|
i--; // 如果不减，将漏掉一个元素
|
|
}
|
|
}
|
|
selectedOrDelChildRole();
|
|
childRoleRightChanged();
|
|
}
|
|
const associatedFormsChooseDialogFlag = ref(false);
|
|
function chooseAssociatedForm() {
|
|
associatedFormsChooseDialogFlag.value = true;
|
|
}
|
|
function handleDetermineAssociatedFormsChooseDialog() {
|
|
associatedFormsChooseDialogFlag.value = false;
|
|
}
|
|
|
|
//liwenxuan20240403 associatedForms end
|
|
|
|
//liwenxuan20240426 单选多选下拉 关联选项设置 start
|
|
|
|
const glxxszDialogFlag = ref(false);
|
|
const glxxszDialogFlagCheckBox = ref(false);
|
|
const glxxszDialogFlagSwitch = ref(false);
|
|
function handelGlxxszDialogSwitch() {
|
|
if (
|
|
controlData.value.control.activeValue == undefined ||
|
|
controlData.value.control.inactiveValue == undefined
|
|
) {
|
|
alert("请先设置开关状态打开/关闭时的值");
|
|
} else {
|
|
glxxszDialogFlagSwitch.value = true;
|
|
}
|
|
}
|
|
function handelGlxxszDialog() {
|
|
if (controlData.value.options.length === 0) {
|
|
alert("无可配置选项，请先添加。");
|
|
} else {
|
|
glxxszDialogFlag.value = true;
|
|
}
|
|
}
|
|
|
|
function handelGlxxszDialogCheckbox() {
|
|
glxxszDialogFlagCheckBox.value = true;
|
|
}
|
|
|
|
function handleDetermineGlxxszDialog() {
|
|
glxxszDialogFlag.value = false;
|
|
}
|
|
function handleDetermineGlxxszDialogSwitch() {
|
|
glxxszDialogFlagSwitch.value = false;
|
|
}
|
|
function handleDetermineGlxxszDialogCheckBox() {
|
|
glxxszDialogFlagCheckBox.value = false;
|
|
}
|
|
//同步开关的设置值和开关关联选项设置的值
|
|
watch(
|
|
() => controlData.value.control,
|
|
(newVal) => {
|
|
// console.log("同步开关的设置值和开关关联选项设置的值",typeof(newVal))
|
|
if (typeof newVal != "undefined") {
|
|
if (typeof newVal.glxxszSwitch != "undefined") {
|
|
if (typeof controlData.value.control.activeValue != "undefined") {
|
|
controlData.value.control.glxxszSwitch[0].openValue =
|
|
controlData.value.control.activeValue;
|
|
controlData.value.control.glxxszSwitch[0].conditionField =
|
|
controlData.value.name;
|
|
}
|
|
if (typeof controlData.value.control.inactiveValue != "undefined") {
|
|
controlData.value.control.glxxszSwitch[1].offValue =
|
|
controlData.value.control.inactiveValue;
|
|
controlData.value.control.glxxszSwitch[1].conditionField =
|
|
controlData.value.name;
|
|
}
|
|
}
|
|
}
|
|
// console.log("同步开关的设置值和开关关联选项设置的值",controlData.value.control)
|
|
},
|
|
{ deep: true }
|
|
);
|
|
|
|
//radio,select添加选项时同步配置选项
|
|
watch(
|
|
() => controlData.value.options,
|
|
(changedOptions: any) => {
|
|
// console.log("radio,select添加选项时同步配置选项",changedOptions)
|
|
// console.log("radio,select添加选项时同步配置选项------>",controlData.value)
|
|
if (
|
|
controlData.value.type === "radio" ||
|
|
(controlData.value.type === "select" && !controlData.value.multiple)
|
|
) {
|
|
if (controlData.value.config.optionsType == 0) {
|
|
if (changedOptions.length === 0) {
|
|
//删没了option
|
|
controlData.value.control.glxxsz = [];
|
|
} else {
|
|
if (changedOptions.length < controlData.value.control.glxxsz.length) {
|
|
//删除了某个option
|
|
controlData.value.control.glxxsz = controlData.value.control.glxxsz.filter(
|
|
(item: { optionValue: any }) =>
|
|
changedOptions.find(
|
|
(bItem: { value: any }) => item.optionValue == bItem.value
|
|
)
|
|
);
|
|
} else {
|
|
// console.log(changedOptions);
|
|
// console.log(controlData.value.control.glxxsz);
|
|
for (var i = 0; i < changedOptions.length; i++) {
|
|
if (controlData.value.control.glxxsz[i] === undefined) {
|
|
//新增了某个option
|
|
controlData.value.control.glxxsz.push({
|
|
conditionField: controlData.value.name,
|
|
optionLabel: changedOptions[i].label,
|
|
optionValue: changedOptions[i].value,
|
|
tableIndex: i,
|
|
id: uuidv4().replaceAll("-", "").toString(),
|
|
});
|
|
} else {
|
|
//修改了某个option
|
|
controlData.value.control.glxxsz[i].optionLabel = changedOptions[i].label;
|
|
controlData.value.control.glxxsz[i].optionValue = changedOptions[i].value;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} else if (controlData.value.type === "checkbox") {
|
|
}
|
|
},
|
|
{ deep: true }
|
|
);
|
|
|
|
function createRowForGlxxsz() {
|
|
if (controlData.value.config.optionsType == 0) {
|
|
controlData.value.control.glxxszForCheckBox.push({
|
|
conditionField: controlData.value.name,
|
|
selectedOptions: [],
|
|
showFields: [],
|
|
id: uuidv4().replaceAll("-", "").toString(),
|
|
});
|
|
}
|
|
}
|
|
function createRowForGlxxsz1() {
|
|
if (controlData.value.config.optionsType == 0) {
|
|
controlData.value.control.glxxsz.push({
|
|
conditionField: controlData.value.name,
|
|
selectedOptions: [],
|
|
showFields: [],
|
|
id: uuidv4().replaceAll("-", "").toString(),
|
|
});
|
|
}
|
|
}
|
|
|
|
function deleteRowForGlxxsz(row: { id: any }) {
|
|
if (controlData.value.config.optionsType == 0) {
|
|
controlData.value.control.glxxszForCheckBox = controlData.value.control.glxxszForCheckBox.filter(
|
|
(item: { id: any }) => item.id != row.id
|
|
);
|
|
}
|
|
}
|
|
|
|
function deleteRowForGlxxsz1(row: { id: any }) {
|
|
if (controlData.value.config.optionsType == 0) {
|
|
controlData.value.control.glxxsz = controlData.value.control.glxxsz.filter(
|
|
(item: { id: any }) => item.id != row.id
|
|
);
|
|
}
|
|
}
|
|
/* */
|
|
|
|
const optionsValue3SettingDialogOpenFlag = ref(false);
|
|
function optionsValue3Setting() {
|
|
optionsValue3SettingDialogOpenFlag.value = true;
|
|
}
|
|
function handleDetermineoptionsValue3() {
|
|
optionsValue3SettingDialogOpenFlag.value = false;
|
|
}
|
|
|
|
//liwenxuan20240426 单选多选下拉 关联选项设置 end
|
|
|
|
function optionsTypeChanged() {
|
|
controlData.value.config.optionsFun = "";
|
|
controlData.value.options = [];
|
|
}
|
|
|
|
const optionsCss = [
|
|
{ label: "无样式", value: "" },
|
|
{ label: "每行两列", value: "form-row-2" },
|
|
{ label: "每行三列", value: "form-row-3" },
|
|
{ label: "每行四列", value: "form-row-4" },
|
|
];
|
|
const layouytStyle = reactive<any>(controlData.value.styles);
|
|
watch(
|
|
() => layouytStyle,
|
|
(val: any) => {
|
|
// console.log("监听样式处理",val)
|
|
controlData.value.styles = val;
|
|
// Object.assign(store.controlAttr.styles.divStyle, val)
|
|
},
|
|
{
|
|
deep: true,
|
|
}
|
|
);
|
|
const setStylefield = ref<string>("divStyle");
|
|
//liwenxuan 20240111 carousel end
|
|
const activeFormName = ref("0");
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-03-01 08:16:45
|
|
@ 功能: 判断是否是组件
|
|
*/
|
|
const cssIsShouw = (val: any) => {
|
|
if (val.length && val.length > 0) {
|
|
return true;
|
|
}
|
|
return false;
|
|
};
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-03-18 11:42:52
|
|
@ 功能: 上传图标相关
|
|
*/
|
|
const imgUploadApiUrl = import.meta.env.VITE_APP_BASE_API + "/api/upordown"; //上传地址
|
|
const handleAvatarSuccess: UploadProps["onSuccess"] = (response, uploadFile) => {
|
|
// imageUrl.value = URL.createObjectURL(uploadFile.raw!)
|
|
formConfig.value.imageUrl = response.data.url;
|
|
};
|
|
|
|
const beforeAvatarUpload: UploadProps["beforeUpload"] = (rawFile) => {
|
|
// console.log("beforeAvatarUpload",rawFile.type)
|
|
if (
|
|
rawFile.type !== "image/jpeg" &&
|
|
rawFile.type !== "image/jpg" &&
|
|
rawFile.type !== "image/png" &&
|
|
rawFile.type !== "image/gif" &&
|
|
rawFile.type !== "image/icon"
|
|
) {
|
|
ElMessage.error("请上传以下格式的图片(jpg、jpeg、png、gif、icon)!" + rawFile.type);
|
|
return false;
|
|
} else if (rawFile.size / 1024 / 1024 > 2) {
|
|
ElMessage.error("图片大小不要大于 2MB!");
|
|
return false;
|
|
}
|
|
return true;
|
|
};
|
|
|
|
const page = ref<number>(1);
|
|
const pageSize = ref<number>(200000);
|
|
const loadingmore = ref(false);
|
|
const loadingnomore = ref(false);
|
|
const formGroup = ref<any[]>([]);
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-03-19 08:38:27
|
|
@ 功能: 获取表单分组
|
|
*/
|
|
const gainFormGroupList = () => {
|
|
loadingmore.value = true;
|
|
let sendInfo = {
|
|
page: page.value,
|
|
pagesize: pageSize.value,
|
|
state: 1,
|
|
};
|
|
customerFormGroupList(sendInfo)
|
|
.then((data) => {
|
|
// console.log("获取表单分组",data)
|
|
formGroup.value = data.data;
|
|
})
|
|
.finally(() => {
|
|
loadingmore.value = false;
|
|
|
|
// console.log("组件加载完毕--------1----------->", formData.value);
|
|
// console.log("组件加载完毕--------2----------->", props.formList);
|
|
// console.log("组件加载完毕--------3----------->", state.dataSourceList);
|
|
if (formData.value.dataSource == "yes" && state.dataSourceList.length < 1) {
|
|
// console.log("组件加载完毕--------4----------->", state.dataSourceList);
|
|
tableFileList();
|
|
}
|
|
});
|
|
};
|
|
|
|
//by han2015
|
|
const gainAiagentList=()=>{
|
|
getAiagentList().then(resp=>{
|
|
aiAgentList.value=resp.data
|
|
})
|
|
};
|
|
|
|
//liwenxuan 2025 移动端单选扫描输入功能 start
|
|
const scanTypes = [
|
|
{
|
|
value: "QrCode",
|
|
label: "二维码",
|
|
},
|
|
{
|
|
value: "OCR",
|
|
label: "光学字符识别",
|
|
},
|
|
];
|
|
//liwenxuan 2025 移动端单选扫描输入功能 end
|
|
|
|
let asfs: any[] = [];
|
|
let asfsExpectCurrent: any[] = [];
|
|
const unitFormList = ref<optionsInfo[]>([]);
|
|
|
|
watch(
|
|
() => props.formList,
|
|
(dataList: any) => {
|
|
//console.log(dataList)
|
|
unitFormList.value = analysisFromUnit(props.state);
|
|
if (
|
|
dataList &&
|
|
Array.isArray(dataList) &&
|
|
dataList.length > 0 &&
|
|
controlData.value.type == "associatedForms" &&
|
|
currentAsfChangeCount.value == 0
|
|
) {
|
|
//console.log(1)
|
|
asfsExpectCurrent = [];
|
|
asfs = [];
|
|
currentAsfChangeCount.value = 1;
|
|
for (let i = 0; i < dataList.length; i++) {
|
|
if (dataList[i].type == "associatedForms") {
|
|
asfs.push(dataList[i]);
|
|
} else if (
|
|
dataList[i].type == "card" ||
|
|
dataList[i].type == "flex" ||
|
|
dataList[i].type == "div" ||
|
|
dataList[i].type == "table"
|
|
) {
|
|
dataList[i].list.forEach((element: any) => {
|
|
if (element.type == "associatedForms") {
|
|
asfs.push(element);
|
|
}
|
|
});
|
|
} else if (dataList[i].type == "grid") {
|
|
let columns = JSON.parse(JSON.stringify(dataList[i].columns));
|
|
//console.log(columns)
|
|
if (columns.length > 0) {
|
|
for (let z = 0; z < columns.length; z++) {
|
|
for (let x = 0; x < columns[z].list.length; x++) {
|
|
let a = JSON.parse(JSON.stringify(columns[z].list[x]));
|
|
//console.log(a)
|
|
if (a.type == "associatedForms") {
|
|
asfs.push(a);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} else if (dataList[i].type == "tabs") {
|
|
//tabs标签页有可能再嵌套一层flex或者table
|
|
let columns = JSON.parse(JSON.stringify(dataList[i].columns));
|
|
if (columns.length > 0) {
|
|
for (let z = 0; z < columns.length; z++) {
|
|
for (let x = 0; x < columns[z].list.length; x++) {
|
|
let a = JSON.parse(JSON.stringify(columns[z].list[x]));
|
|
//console.log(a)
|
|
if (a.type == "associatedForms") {
|
|
asfs.push(a);
|
|
} else if (a.type == "flex" || a.type == "table") {
|
|
if (a.list.length > 0) {
|
|
for (let m = 0; m < a.list.length; m++) {
|
|
let q = JSON.parse(JSON.stringify(a.list[m]));
|
|
//console.log(q)
|
|
if (q.type == "associatedForms") {
|
|
asfs.push(q);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
if (asfs.length > 0) {
|
|
asfsExpectCurrent = asfs.filter((item: any) => {
|
|
return item.name != controlData.value.name;
|
|
});
|
|
/* if(asfsExpectCurrent.length>0){
|
|
console.log(asfsExpectCurrent)
|
|
} */
|
|
}
|
|
}
|
|
},
|
|
{
|
|
deep: true,
|
|
}
|
|
);
|
|
|
|
onMounted(() => {
|
|
gainFormGroupList();
|
|
analysisFromUnit(props.state);
|
|
gainAiagentList()
|
|
});
|
|
|
|
watch(
|
|
() => state.tabsName,
|
|
(val: string) => {
|
|
// console.log("监听字段切换", val);
|
|
if (val == "first") {
|
|
if (formData.value.dataSource == "yes" && state.dataSourceList.length < 1) {
|
|
// console.log("组件加载完毕--------4----------->", formData.value);
|
|
tableFileList();
|
|
}
|
|
}
|
|
},
|
|
{
|
|
deep: true,
|
|
}
|
|
);
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2025-01-03 14:57:18
|
|
@ 功能: 获取有源数据库表单
|
|
*/
|
|
const tableFileList = () => {
|
|
let sendData = {
|
|
id: formData.value.dataSourceConfig.id,
|
|
sqlType: formData.value.dataSourceConfig.dsn.sqlType,
|
|
name: formData.value.dataSourceConfig.dsn.dataBaseName,
|
|
tableName: formData.value.dataSourceConfig.tableKey,
|
|
host: formData.value.dataSourceConfig.dsn.ip,
|
|
prot: formData.value.dataSourceConfig.dsn.port,
|
|
user: formData.value.dataSourceConfig.dsn.userName,
|
|
pwd: formData.value.dataSourceConfig.dsn.password,
|
|
};
|
|
gainDataStorceAllField(sendData)
|
|
.then((data) => {
|
|
console.log("获取有源数据库表单", data);
|
|
// formGroup.value = data.data;
|
|
state.dataSourceList = data.data;
|
|
})
|
|
.finally(() => {});
|
|
};
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-03-19 09:17:51
|
|
@ 功能: 控制下拉列表触底加载
|
|
*/
|
|
const handleVisibleChange = (visible: any) => {
|
|
if (visible) {
|
|
// 如果下拉框显示
|
|
let selectDropdown: any = document.querySelector(".el-select-dropdown__wrap");
|
|
// 监听下拉框滚动事件
|
|
selectDropdown.addEventListener("scroll", loadNextPage);
|
|
} else {
|
|
// 如果下拉框隐藏
|
|
let selectDropdown: any = document.querySelector(".el-select-dropdown__wrap");
|
|
// 移除下拉框滚动事件监听
|
|
selectDropdown.removeEventListener("scroll", loadNextPage);
|
|
}
|
|
};
|
|
const loadNextPage = () => {
|
|
let selectDropdown: any = document.querySelector(".el-select-dropdown__wrap");
|
|
// 判断下拉框是否触底
|
|
if (
|
|
selectDropdown.scrollTop + selectDropdown.clientHeight >=
|
|
selectDropdown.scrollHeight - 2
|
|
) {
|
|
loadingnomore.value = false;
|
|
loadingmore.value = true;
|
|
if (selectoptions.value.length <= 20) {
|
|
setTimeout(() => {
|
|
selectoptions.value.push({
|
|
label: String(selectoptions.value.length),
|
|
value: String(selectoptions.value.length),
|
|
});
|
|
loadingmore.value = false;
|
|
}, 2000);
|
|
} else {
|
|
loadingmore.value = false;
|
|
selectDropdown.removeEventListener("scroll", loadNextPage);
|
|
loadingnomore.value = true;
|
|
}
|
|
} else {
|
|
loadingnomore.value = true;
|
|
}
|
|
};
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-06-22 13:57:55
|
|
@ 功能: 判断该输入框是否不可编辑
|
|
*/
|
|
const disabledIstrue = (val: string) => {
|
|
let ary = ["creater", "creater_time", "edit_time", "owner", "org"];
|
|
if (ary.includes(val)) {
|
|
return true;
|
|
} else {
|
|
return false;
|
|
}
|
|
};
|
|
|
|
// watch(()=>controlData.value.customRules,(val:any) => {
|
|
// // console.log("啊啊啊啊啊",val,typeof(val));
|
|
// if(typeof(val)=="object"){
|
|
// if(Array.isArray(val)){
|
|
// val.forEach((item:any)=>{
|
|
|
|
// })
|
|
// }
|
|
// }
|
|
// },{
|
|
// deep: true
|
|
// })
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-08-14 13:16:26
|
|
@ 功能: 必填文本框改变
|
|
*/
|
|
const requiredText = (val: any) => {
|
|
if (typeof controlData.value.customRules == "object") {
|
|
if (Array.isArray(controlData.value.customRules)) {
|
|
controlData.value.customRules.forEach((item: any) => {
|
|
if (item.type == ValidateText.type) {
|
|
item.message = val;
|
|
}
|
|
});
|
|
}
|
|
}
|
|
// console.log("判断校验规则-1-->", controlData.value.customRules);
|
|
};
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-08-14 14:35:07
|
|
@ 功能: 校验文本框改变
|
|
*/
|
|
const requiredTextRadio = (val: any) => {
|
|
// console.log("校验文本框改变-->", val);
|
|
if (val.type == radioVerify.type) {
|
|
if (typeof controlData.value.customRules == "object") {
|
|
if (Array.isArray(controlData.value.customRules)) {
|
|
controlData.value.customRules.forEach((item: any) => {
|
|
if (item.type == radioVerify.type) {
|
|
item.message = val.message;
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-08-14 13:21:43
|
|
@ 功能: 是否选中必填
|
|
*/
|
|
const requiredChangeSet = (val: boolean) => {
|
|
if (!controlData.value?.customRules) {
|
|
controlData.value.customRules = [];
|
|
}
|
|
if (val) {
|
|
if (
|
|
Array.isArray(controlData.value.customRules) &&
|
|
controlData.value.customRules.length > 0
|
|
) {
|
|
let isNewWrite = true;
|
|
controlData.value.customRules.forEach((item: any) => {
|
|
if (item.type == ValidateText.type) {
|
|
isNewWrite = false;
|
|
}
|
|
});
|
|
if (isNewWrite) {
|
|
controlData.value.customRules.push({
|
|
type: ValidateText.type,
|
|
message: ValidateText.message,
|
|
trigger: "blur",
|
|
});
|
|
}
|
|
} else {
|
|
controlData.value.customRules.push({
|
|
type: ValidateText.type,
|
|
message: ValidateText.message,
|
|
trigger: "blur",
|
|
});
|
|
}
|
|
} else {
|
|
if (
|
|
Array.isArray(controlData.value.customRules) &&
|
|
controlData.value.customRules.length > 0
|
|
) {
|
|
controlData.value.customRules.forEach((item: any, index: number) => {
|
|
if (item.type == ValidateText.type) {
|
|
controlData.value.customRules.splice(index, 1);
|
|
}
|
|
});
|
|
}
|
|
// controlData.value.item.rules.splice(0, 1)
|
|
}
|
|
// console.log("判断校验规则-222-->",controlData.value.customRules)
|
|
};
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-08-14 14:14:42
|
|
@ 功能: 单选改变事件
|
|
*/
|
|
const radioChangeSet = (val: any) => {
|
|
// console.log("单选改变事件-222-->", val);
|
|
let pickRadio = {};
|
|
let isTrue = true;
|
|
textUinrVerfy.forEach((item: any) => {
|
|
if (item.type == val) {
|
|
pickRadio = item;
|
|
isTrue = false;
|
|
}
|
|
});
|
|
if (isTrue) {
|
|
numberUinrVerfy.forEach((item: any) => {
|
|
if (item.type == val) {
|
|
pickRadio = item;
|
|
isTrue = false;
|
|
}
|
|
});
|
|
}
|
|
// console.log("单选改变事件-3333-->",pickRadio)
|
|
if (!controlData.value?.customRules) {
|
|
controlData.value.customRules = [];
|
|
}
|
|
if (
|
|
Array.isArray(controlData.value.customRules) &&
|
|
controlData.value.customRules.length > 0
|
|
) {
|
|
let isNewWrite = true;
|
|
controlData.value.customRules.forEach((item: any, index: number) => {
|
|
if (item.type == ValidateText.type) {
|
|
isNewWrite = false;
|
|
} else {
|
|
controlData.value.customRules.splice(index, 1);
|
|
}
|
|
});
|
|
controlData.value.customRules.push({
|
|
type: pickRadio.type,
|
|
message: pickRadio.message,
|
|
trigger: "blur",
|
|
});
|
|
} else {
|
|
controlData.value.customRules.push({
|
|
type: pickRadio.type,
|
|
message: pickRadio.message,
|
|
trigger: "blur",
|
|
});
|
|
}
|
|
};
|
|
|
|
watch(
|
|
() => formData.value.dataSource,
|
|
(val: string) => {
|
|
if (val == "yes") {
|
|
formAttr.value.forEach((item) => {
|
|
console.log(item.label, "====", "item.", item.type);
|
|
if (!item.hide) {
|
|
if (!item.type) {
|
|
// console.log(item.label, "item.", item.type);
|
|
item.disabled = true;
|
|
}
|
|
}
|
|
// if (item.key == "formName" || item.key == "name") {
|
|
// item.disabled = true;
|
|
// }
|
|
});
|
|
} else {
|
|
// console.log("formData.value---------------", formData.value);
|
|
if (formData.value.dataSourceConfi) {
|
|
formData.value.dataSourceConfig.id = "";
|
|
formData.value.dataSourceConfig.dataBaseName = "";
|
|
formData.value.dataSourceConfig.tableName = "";
|
|
formData.value.dataSourceConfig.tableKey = "";
|
|
formData.value.dataSourceConfig.dsn = {
|
|
dataBaseName: "",
|
|
ip: "",
|
|
port: 0,
|
|
userName: "",
|
|
password: "",
|
|
};
|
|
}
|
|
|
|
formAttr.value.forEach((item) => {
|
|
// console.log(item.label, "item.", item.type);
|
|
if (!item.hide) {
|
|
if (!item.type) {
|
|
// console.log(item.label, "item.", item.type);
|
|
item.disabled = false;
|
|
}
|
|
}
|
|
// if (item.key == "formName" || item.key == "name") {
|
|
// item.disabled = false;
|
|
// }
|
|
});
|
|
}
|
|
},
|
|
{
|
|
deep: true,
|
|
}
|
|
);
|
|
|
|
//选择用户数据范围 start
|
|
const tabsRef = ref(null);
|
|
const userRangeDialogFlag = ref(false)
|
|
function handleUserRangeDialogFlag(){
|
|
userRangeDialogFlag.value = true
|
|
if(controlData.value.control.queryBy=='role'){
|
|
queryAllRole()
|
|
}
|
|
}
|
|
|
|
function checkedIdListChangedIndex(val:any){
|
|
//console.log(val)
|
|
controlData.value.control.orgRange = val
|
|
}
|
|
|
|
let componentKey = 0
|
|
|
|
function reRenderComponent() {
|
|
componentKey++;
|
|
}
|
|
|
|
function handleExpandTabChange(){
|
|
if(controlData.value.control.queryBy=='role'){
|
|
queryAllRole()
|
|
}
|
|
}
|
|
|
|
|
|
function getAllRole() {
|
|
return request({
|
|
url: "/javasys/lowCode/manCont/getAllRole",
|
|
method: "get",
|
|
});
|
|
}
|
|
const tabsData = ref([])
|
|
function queryAllRole(){
|
|
getAllRole().then(({ data }) => {
|
|
//console.log(data)
|
|
tabsData.value = data
|
|
|
|
|
|
}).finally(()=>{
|
|
//activeName.value = tabsData.value[2]?.name
|
|
setTimeout(()=>{
|
|
activeTab.value = tabsData.value[0]?.id
|
|
//alert(tabsData.value[0]?.id)
|
|
//activeName.value = tabsData.value[0]?.id
|
|
handleLeftTabChange(activeTab.value)
|
|
},100)
|
|
|
|
})
|
|
|
|
}
|
|
const expandPageNum = ref(1)
|
|
const expandPageSize = ref(10)
|
|
function getPersonByRoleId(id:string){
|
|
return request({
|
|
url: "/javasys/lowCode/manCont/getPersonByRoleId",
|
|
method: "post",
|
|
data: {
|
|
id: id,
|
|
pageNum: expandPageNum.value,
|
|
pageSize: expandPageSize.value+"",
|
|
number:expandQueryParamNumber.value,
|
|
name:expandQueryParamName.value
|
|
},
|
|
});
|
|
}
|
|
//const activeName = ref('1')
|
|
const total = ref(10)
|
|
const activeTab = ref('')
|
|
const expandTableData = ref()
|
|
|
|
function handleLeftTabChange(tab: any){
|
|
getPersonByRoleId(tab).then(({ data }) => {
|
|
//console.log(data)
|
|
expandTableData.value = data.list
|
|
total.value = data.total
|
|
//activeName.value = tab
|
|
|
|
});
|
|
}
|
|
import type { TableInstance } from 'element-plus'
|
|
const multipleTableRef = ref<TableInstance>()
|
|
|
|
const multipleSelection = ref<User[]>([])
|
|
|
|
interface User {
|
|
id: number
|
|
name: string
|
|
number: string
|
|
key: string
|
|
|
|
}
|
|
|
|
const handleSelectionChange = (val: User[]) => {
|
|
|
|
multipleSelection.value = val
|
|
|
|
}
|
|
/* controlData.value.control.roleRange = computed(()=>{
|
|
let arr: any[] = []
|
|
checkDataList.value.forEach(element => {
|
|
let str = element.key+""
|
|
arr.push(str)
|
|
});
|
|
|
|
|
|
return arr
|
|
}) */
|
|
|
|
function gotoRight(){
|
|
// 遍历multipleSelection中的每个用户
|
|
multipleSelection.value.forEach(user => {
|
|
// 检查checkDataList中是否已存在具有相同key的用户
|
|
const exists = controlData.value.control.roleCheckDataList.some((item: { key: string; }) => item.key === user.key);
|
|
|
|
// 如果不存在，则添加到checkDataList中
|
|
if (!exists) {
|
|
controlData.value.control.roleCheckDataList.push(user);
|
|
}
|
|
});
|
|
|
|
let arr: any[] = []
|
|
controlData.value.control.roleCheckDataList.forEach((element: { key: string; }) => {
|
|
let str = element.key+""
|
|
arr.push(str)
|
|
});
|
|
//console.log(arr)
|
|
controlData.value.control.roleRange = arr
|
|
}
|
|
|
|
function handleCurrentChange(){
|
|
//alert(expandPageNum.value)
|
|
handleLeftTabChange(activeTab.value)
|
|
}
|
|
const expandQueryParam = ref('')
|
|
|
|
function isAllDigits(str:any) {
|
|
// 首先检查输入是否为字符串类型
|
|
if (typeof str !== 'string') {
|
|
return false;
|
|
}
|
|
|
|
// 检查字符串是否为空
|
|
if (str.length === 0) {
|
|
return false;
|
|
}
|
|
|
|
// 使用正则表达式检查是否全为数字
|
|
// ^ 表示字符串开始，$ 表示字符串结束
|
|
// \d+ 表示一个或多个数字
|
|
const regex = /^\d+$/;
|
|
return regex.test(str);
|
|
}
|
|
const expandQueryParamNumber = ref('')
|
|
const expandQueryParamName = ref('')
|
|
function searchClick(){
|
|
expandQueryParamNumber.value = ''
|
|
expandQueryParamName.value = ''
|
|
if(isAllDigits(expandQueryParam.value)){
|
|
expandQueryParamNumber.value = expandQueryParam.value
|
|
}else{
|
|
expandQueryParamName.value = expandQueryParam.value
|
|
}
|
|
handleLeftTabChange(activeTab.value)
|
|
|
|
}
|
|
|
|
function resetClick(){
|
|
expandQueryParamNumber.value = ''
|
|
expandQueryParamName.value = ''
|
|
expandQueryParam.value = ''
|
|
handleLeftTabChange(activeTab.value)
|
|
}
|
|
|
|
|
|
function delRowClick(param: any){
|
|
let key = param.key
|
|
// console.log(key)
|
|
controlData.value.control.roleCheckDataList = controlData.value.control.roleCheckDataList.filter((item: { key: any; }) => item.key !== key);
|
|
let arr: any[] = []
|
|
controlData.value.control.roleCheckDataList.forEach((element: { key: string; }) => {
|
|
let str = element.key+""
|
|
arr.push(str)
|
|
});
|
|
//console.log(arr)
|
|
controlData.value.control.roleRange = arr
|
|
}
|
|
|
|
|
|
function delAllClick(){
|
|
controlData.value.control.roleCheckDataList = []
|
|
controlData.value.control.roleRange = []
|
|
}
|
|
|
|
|
|
function handleSizeChange(){
|
|
handleLeftTabChange(activeTab.value)
|
|
}
|
|
|
|
//选择用户数据范围 end
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-12-23 10:39:48
|
|
@ 功能: 打开数据源设定
|
|
*/
|
|
const openSetDataSource = () => {
|
|
openDataSourceBox.value = true;
|
|
};
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-12-23 16:36:16
|
|
@ 功能: 关闭数据源
|
|
*/
|
|
const closeDataSource = () => {
|
|
openDataSourceBox.value = false;
|
|
};
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2024-12-26 16:26:06
|
|
@ 功能: 设定关联数据
|
|
*/
|
|
// const dataList = ref<dataBaseStruct[]>([]);
|
|
const updataBase = (val: any) => {
|
|
// console.log("设定关联数据", val);
|
|
formData.value.dataSourceConfig.id = val.id;
|
|
formData.value.dataSourceConfig.dataBaseName = val.dataBaseName;
|
|
formData.value.dataSourceConfig.tableName = val.tableName;
|
|
formData.value.dataSourceConfig.tableKey = val.tableKey;
|
|
formData.value.dataSourceConfig.dsn = val.dsn;
|
|
// dataList.value = val.fields;
|
|
state.dataSourceList = val.fields;
|
|
|
|
formData.value.name = val.tableKey;
|
|
formData.value.formName = val.tableName;
|
|
|
|
// formAttr.value.forEach((item) => {
|
|
// if (item.key == "formName" || item.key == "name") {
|
|
// item.disabled = true;
|
|
// }
|
|
// });
|
|
|
|
// console.log("设定关联数据------1-------》", state.dataSourceList);
|
|
// console.log("设定关联数据------2-------》", val.fields);
|
|
// console.log("设定关联数据------3-------》", state.dataSourceList);
|
|
};
|
|
//添加条件
|
|
const addPickTracn = () => {
|
|
if (props.formInfo.aiConfig) {
|
|
props.formInfo.aiConfig.push({
|
|
title: [],
|
|
trigger: 1,
|
|
openShowType: 1,
|
|
});
|
|
} else {
|
|
props.formInfo.aiConfig = [
|
|
{
|
|
title: [],
|
|
trigger: 1,
|
|
openShowType: 1,
|
|
},
|
|
];
|
|
}
|
|
};
|
|
|
|
function delList(dex:number){
|
|
if(props.formInfo.aiConfig){
|
|
props.formInfo.aiConfig.splice(dex,1)
|
|
}
|
|
}
|
|
|
|
/**
|
|
@ 作者: 秦东
|
|
@ 时间: 2025-04-10 08:12:21
|
|
@ 功能: 知识库
|
|
*/
|
|
const aiAgentList = ref([
|
|
// {
|
|
// label: "法律法规",
|
|
// value: 1,
|
|
// },
|
|
// {
|
|
// label: "安全环保",
|
|
// value: 2,
|
|
// },
|
|
// {
|
|
// label: "员工守则",
|
|
// value: 3,
|
|
// },
|
|
]);
|
|
|
|
|
|
const formatTooltip = (val: number) => {
|
|
//console.log("zhidhfasidhais----->",val)
|
|
/* const result = ((val / 24) * 100).toFixed(2);
|
|
return `${result}%`; */
|
|
return val+"/24"
|
|
}
|
|
</script>
|
|
<template>
|
|
<DataSourcePage
|
|
v-model:isShow="openDataSourceBox"
|
|
@closeDataSource="closeDataSource"
|
|
@updataBase="updataBase"
|
|
/>
|
|
|
|
<div class="sidebar-tools">
|
|
<el-tabs v-model="state.tabsName">
|
|
<el-tab-pane label="字段配置" name="first">
|
|
<el-form size="small" class="form">
|
|
<!-- <div class=""><h3>通用属性</h3></div> -->
|
|
<el-divider content-position="left">通用属性</el-divider>
|
|
|
|
<template v-for="(item, index) in attrList" :key="index">
|
|
<!-- <template v-if="item.label == '添加时间水印'">
|
|
|
|
<el-form-item :label="item.label" v-if="controlData.control.onSiteShot=='1'" class="form_cont">
|
|
<el-radio-group v-model="controlData.control.watermark">
|
|
<el-radio value="1">是</el-radio>
|
|
<el-radio value="">否</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</template> -->
|
|
<template v-if="item.label == '必须现场拍照'">
|
|
|
|
<el-form-item :label="item.label" v-if="controlData.control.useDefaultImg==false" class="form_cont">
|
|
<el-radio-group v-model="controlData.control.onSiteShot">
|
|
<el-radio value="1">是</el-radio>
|
|
<el-radio value="">否</el-radio>
|
|
</el-radio-group>
|
|
<div v-if="controlData.control.onSiteShot=='1'" style="width: 100%;border: 0px solid black; margin-top: 10px">
|
|
<div style="position: relative; left: -84px">
|
|
添加时间水印
|
|
|
|
<el-radio-group v-model="controlData.control.watermark" style="position: relative; left: 8px">
|
|
<el-radio value="1">是</el-radio>
|
|
<el-radio value="">否</el-radio>
|
|
</el-radio-group>
|
|
</div>
|
|
|
|
</div>
|
|
</el-form-item>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
<el-form-item v-else :label="item.label" class="form_cont">
|
|
<el-select
|
|
v-if="item.type === 'select'"
|
|
:placeholder="item.placeholder"
|
|
v-model="item.value"
|
|
:filterable="item.path === 'name'"
|
|
:allow-create="item.path === 'name'"
|
|
:clearable="item.clearable"
|
|
@change="controlChange(item, $event)"
|
|
>
|
|
<el-option
|
|
v-for="(opt, key) in item.dict"
|
|
:key="key"
|
|
:value="item.path === 'name' ? opt.name : key"
|
|
:label="item.path === 'name' ? `${opt.label}(${opt.name})` : opt"
|
|
/>
|
|
</el-select>
|
|
|
|
<el-select
|
|
v-if="item.type === 'selectDataSoure'"
|
|
:placeholder="item.placeholder"
|
|
v-model="item.value"
|
|
:filterable="item.path === 'name'"
|
|
:allow-create="item.path === 'name'"
|
|
:clearable="item.clearable"
|
|
@change="controlChange(item, $event)"
|
|
>
|
|
<el-option
|
|
v-for="(opt, key) in item.dict"
|
|
:key="key"
|
|
:value="item.path === 'name' ? opt.fieldes : key"
|
|
:label="item.path === 'name' ? `${opt.comment}(${opt.fieldes})` : opt"
|
|
/>
|
|
</el-select>
|
|
|
|
<el-switch
|
|
v-else-if="item.type === 'switch'"
|
|
v-model="item.value"
|
|
@change="controlChange(item, $event)"
|
|
/>
|
|
|
|
<template v-else-if="item.type === 'digitpage'">
|
|
<el-row>
|
|
<el-col :span="12">
|
|
<el-select
|
|
v-model="item.selectvalue"
|
|
:placeholder="item.placeholder"
|
|
:filterable="item.path === 'name'"
|
|
:allow-create="item.path === 'name'"
|
|
:clearable="item.clearable"
|
|
@change="digitPageSub(item, $event)"
|
|
>
|
|
<el-option
|
|
v-for="(opt, key) in item.dict"
|
|
:key="key"
|
|
:value="item.path === 'name' ? opt.name : key"
|
|
:label="item.path === 'name' ? `${opt.label}(${opt.name})` : opt"
|
|
/>
|
|
</el-select>
|
|
</el-col>
|
|
<el-col :span="12">
|
|
<el-input-number
|
|
v-if="item.selectvalue == 'default'"
|
|
v-model="item.control.modelValue"
|
|
class="mx-4"
|
|
/>
|
|
</el-col>
|
|
</el-row>
|
|
<div
|
|
v-if="item.selectvalue == 'simple'"
|
|
style="width: 100%; cursor: pointer; margin-top: 10px"
|
|
@click="openMathDialog(item)"
|
|
v-html="item.control.mathFormula.formulaHtml"
|
|
></div>
|
|
<MathFormula
|
|
v-model:show="mathBoxShow"
|
|
:sub-unit="subUnit"
|
|
:unit-info="attrList"
|
|
:form-listmap="formListmap"
|
|
@updata-digit="updataDigit"
|
|
/>
|
|
</template>
|
|
|
|
<el-row v-else-if="item.type === 'uploadvideo_url'">
|
|
<!-- {{ controlData.control }} -->
|
|
<el-upload
|
|
:action="uploadUrl"
|
|
:before-remove="beforeRemove"
|
|
:on-success="videoUploadOk"
|
|
:show-file-list="true"
|
|
:on-error="videoUploadErr"
|
|
:limit="1"
|
|
:on-exceed="handleExceed"
|
|
accept=".mp4,.MOV,.WMV,.FLV,.AVI,.AVCHD,.WebM,.MKV,.rmvb"
|
|
>
|
|
<el-button
|
|
v-if="!controlData.control.videoMsg[videoIndex].videoReady"
|
|
type="primary"
|
|
>点此上传</el-button
|
|
>
|
|
<el-button
|
|
v-if="controlData.control.videoMsg[videoIndex].videoReady"
|
|
type="primary"
|
|
>已上传,点击修改</el-button
|
|
>
|
|
</el-upload>
|
|
<!-- <el-button v-if="controlData.control.videoMsg[videoIndex].videoReady" type="primary">已上传,点击修改</el-button>
|
|
v-if="!controlData.control.videoMsg[videoIndex].videoReady"-->
|
|
</el-row>
|
|
<!-- <el-row v-else-if="item.type === 'uploadvideo_poster'">
|
|
<el-upload
|
|
v-if="controlData.control.videoMsg[videoIndex].videoReady&&controlData.control.videoMsg[videoIndex].poster===''"
|
|
:action="uploadUrl" :before-remove="beforeRemove"
|
|
:on-success="videoUploadOk" :show-file-list="true"
|
|
:on-error="videoUploadErr"
|
|
|
|
accept=".mp4,.MOV,.WMV,.FLV,.AVI,.AVCHD,.WebM,.MKV,.rmvb">
|
|
|
|
<el-tooltip
|
|
class="box-item"
|
|
content="不上传则视频封面默认为视频第一帧"
|
|
placement="top-end"
|
|
>
|
|
<el-button type="primary">点此上传</el-button>
|
|
</el-tooltip>
|
|
</el-upload>
|
|
<el-button v-if="!controlData.control[videoIndex].videoReady" type="warning">请先上传视频</el-button>
|
|
<el-button v-if="controlData.control.videoMsg[videoIndex].videoReady&&controlData.control.videoMsg[videoIndex].poster!=''" type="primary">已上传,点击修改</el-button>
|
|
</el-row> -->
|
|
<el-row v-else-if="item.type === 'uploadvideo_autoPlay'">
|
|
<el-switch
|
|
v-model="controlData.control.videoMsg[videoIndex].videoAutoPlay"
|
|
/>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'uploadvideo_loopPlay'">
|
|
<el-switch v-model="controlData.control.videoMsg[videoIndex].loop" />
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'uploadvideo_width'">
|
|
<el-input-number
|
|
v-model="controlData.control.videoMsg[videoIndex].videoWidth"
|
|
:step="50"
|
|
:max="4096"
|
|
/>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'uploadvideo_height'">
|
|
<el-input-number
|
|
v-model="controlData.control.videoMsg[videoIndex].videoHeight"
|
|
:step="50"
|
|
:max="2160"
|
|
/>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'organization_location_level'">
|
|
<el-select v-model="controlData.control.locationLevel" placeholder="请选择地址精确到" style="width: 200px">
|
|
<el-option
|
|
v-for="i in locationLevelOptions"
|
|
:key="i.value"
|
|
:label="i.label"
|
|
:value="i.value"
|
|
/>
|
|
</el-select>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'carousel'">
|
|
<el-button
|
|
type="primary"
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="dialogTableVisible = true"
|
|
>轮播图设置</el-button
|
|
>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'transfer_name'">
|
|
<el-input
|
|
v-model="controlData.config.transferName"
|
|
placeholder="请输入穿梭框名"
|
|
style="width: 221px"
|
|
/>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'transfer_options_datasource'">
|
|
<!-- <span style="display:inline-block;width:78px">选项数据源</span> -->
|
|
<el-select
|
|
v-model="controlData.config.transferDataSource"
|
|
placeholder="选项数据源"
|
|
style="width: 150px; height: 20px"
|
|
>
|
|
<el-option
|
|
v-for="dataSourceOption1 in transferDataSourceOptions"
|
|
:key="dataSourceOption1.value"
|
|
:label="dataSourceOption1.label"
|
|
:value="dataSourceOption1.value"
|
|
/>
|
|
</el-select>
|
|
<div
|
|
v-if="controlData.config.transferDataSource === '固定选项'"
|
|
style="
|
|
width: auto;
|
|
margin-top: 33px;
|
|
margin-left: -220px;
|
|
padding-bottom: 6px;
|
|
"
|
|
>
|
|
<el-button
|
|
type="primary"
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="transferDialogTableVisible = true"
|
|
>编辑固定选项</el-button
|
|
>
|
|
</div>
|
|
<div
|
|
v-if="controlData.config.transferDataSource === '数据源'"
|
|
style="width: auto; margin-top: 20px"
|
|
>
|
|
<!-- <span style="display:inline-block;width:50px;margin-bottom: 25px;">接口url</span> -->
|
|
<el-input
|
|
v-model="controlData.config.apiUrl"
|
|
style="width: 278px; margin-left: -68px; margin-top: -5px"
|
|
placeholder="数据源接口url"
|
|
>
|
|
<template #prepend>
|
|
<el-select v-model="controlData.config.method" style="width: 100px">
|
|
<el-option label="get" value="get" />
|
|
<el-option label="post" value="post" />
|
|
</el-select>
|
|
</template>
|
|
</el-input>
|
|
</div>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'lowcodeImage_url'"><!-- -->
|
|
<el-button v-if="controlData.control.uploadFlag" type="danger" style="margin-right: 8px;" @click="delDefaultImg"
|
|
>删除默认图片</el-button
|
|
>
|
|
<el-upload
|
|
:action="uploadUrl"
|
|
:before-remove="beforeRemove"
|
|
:on-success="lowcodeImageUploadSuccess"
|
|
:on-error="videoUploadErr"
|
|
:limit="1"
|
|
accept=".jpg,.jpeg,.png,.tif,.tga,.bmp,.dds,.svg,.eps,.pdf,.hdr,.raw,.exr,.psd,.afphoto,.afdesign"
|
|
:show-file-list = "false"
|
|
>
|
|
<el-button v-if="!controlData.control.uploadFlag" type="primary"
|
|
>上传默认图片</el-button
|
|
>
|
|
<el-button v-if="controlData.control.uploadFlag" type="primary"
|
|
>更改默认图片</el-button
|
|
>
|
|
|
|
</el-upload>
|
|
<div v-if="controlData.control.uploadFlag">
|
|
<div style="position: relative; left: -60px;top:8px">
|
|
默认图片可更改
|
|
|
|
<el-radio-group v-model="controlData.control.defaultAllowsChange" style="position: relative; left: 8px">
|
|
<el-radio value="">是</el-radio>
|
|
<el-radio value="0">否</el-radio>
|
|
</el-radio-group>
|
|
</div>
|
|
</div>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'lowcodeImage_currentShot'">
|
|
<el-radio-group v-model="controlData.control.onSiteShot">
|
|
<el-radio value="1">是</el-radio>
|
|
<el-radio value="">否</el-radio>
|
|
</el-radio-group>
|
|
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'checkbox_showAll'">
|
|
<el-radio-group v-model="controlData.control.showAll">
|
|
<el-radio value="1">是</el-radio>
|
|
<el-radio value="">否</el-radio>
|
|
</el-radio-group>
|
|
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'orgCentent_range'">
|
|
<!-- {{ controlData.control.range }} -->
|
|
<el-tree-select
|
|
v-model="controlData.control.range"
|
|
node-key="id"
|
|
:props="orgTreeProps"
|
|
:data="orgCententRange"
|
|
:render-after-expand="false"
|
|
show-checkbox
|
|
multiple
|
|
style="width: 200px"
|
|
collapse-tags
|
|
collapse-tags-tooltip
|
|
:max-collapse-tags="2"
|
|
/>
|
|
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'orgCentent_Multiple'">
|
|
|
|
<el-radio-group v-model="controlData.control.multiple">
|
|
<el-radio value="1">是</el-radio>
|
|
<el-radio value="">否</el-radio>
|
|
</el-radio-group>
|
|
|
|
</el-row><!-- -->
|
|
|
|
<el-row v-else-if="item.type === 'table_defaultOne'">
|
|
|
|
<el-radio-group v-model="controlData.control.defaultOne">
|
|
<el-radio value="">是</el-radio>
|
|
<el-radio value="2">否</el-radio>
|
|
</el-radio-group>
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row v-else-if="item.type === 'expand-user'">
|
|
<el-button @click="handleUserRangeDialogFlag">可选用户设置</el-button>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'span'" >
|
|
<div style="width:190px;margin-left: 10px;">
|
|
<el-slider v-model="controlData.config.span" :format-tooltip="formatTooltip" :max="24" />
|
|
</div>
|
|
</el-row>
|
|
<!--
|
|
attrSpan
|
|
attrOffset
|
|
attrPush
|
|
attrPull
|
|
-->
|
|
<el-row v-else-if="item.type === 'attrSpan'" >
|
|
<div style="width:150px;margin-left: 10px;">
|
|
<el-slider v-model="controlData.attr.span" :format-tooltip="formatTooltip" :max="24" />
|
|
</div>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'attrOffset'" >
|
|
<div style="width:131px">
|
|
<!-- <el-slider v-model="controlData.attr.offset" :format-tooltip="formatTooltip" :max="24" /> -->
|
|
<el-input-number v-model="controlData.attr.offset" :min="0" :max="23" />
|
|
</div>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'attrPush'" >
|
|
<div style="width:131px">
|
|
<!-- <el-slider v-model="controlData.attr.offset" :format-tooltip="formatTooltip" :max="24" /> -->
|
|
<el-input-number v-model="controlData.attr.push" :min="0" :max="23" />
|
|
</div>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'attrPull'" >
|
|
<div style="width:131px">
|
|
<!-- <el-slider v-model="controlData.attr.offset" :format-tooltip="formatTooltip" :max="24" /> -->
|
|
<el-input-number v-model="controlData.attr.pull" :min="0" :max="23" />
|
|
</div>
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<!-- <el-row v-else-if="item.type === 'lowcodeImage_radius'">
|
|
<el-switch v-model="controlData.control.radius" style="margin-right: 15px;"/>
|
|
<el-popover
|
|
placement="top-start"
|
|
:width="200"
|
|
trigger="hover"
|
|
content="数值越大圆角程度越高"
|
|
>
|
|
<template #reference>
|
|
<el-input-number v-if="controlData.control.radius" v-model="controlData.control.radiusNum" :step="1"/>
|
|
</template>
|
|
</el-popover>
|
|
</el-row> -->
|
|
<!-- <el-row v-else-if="item.type === 'lowcodeImage_url'">
|
|
<el-upload
|
|
:action="uploadUrl" :before-remove="beforeRemove"
|
|
:on-success="lowcodeImageUploadSuccess"
|
|
:on-error="videoUploadErr"
|
|
:limit="1"
|
|
accept=".jpg,.jpeg,.png,.tif,.tga,.bmp,.dds,.svg,.eps,.pdf,.hdr,.raw,.exr,.psd,.afphoto,.afdesign">
|
|
<el-button v-if="!controlData.control.uploadFlag" type="primary">点此上传</el-button>
|
|
<el-button v-if="controlData.control.uploadFlag" type="primary">已上传,点击修改</el-button>
|
|
</el-upload>
|
|
</el-row> -->
|
|
<!-- <el-row v-else-if="item.type === 'lowcodeImage_showMode'">
|
|
<el-select
|
|
v-model="controlData.control.showMode"
|
|
placeholder="选项数据源"
|
|
style="width: 150px; height:20px">
|
|
<el-option
|
|
v-for="showModeSelected in showModeSelectOptions"
|
|
:key="showModeSelected.value"
|
|
:label="showModeSelected.label"
|
|
:value="showModeSelected.value"
|
|
/>
|
|
|
|
</el-select>
|
|
<div v-if="controlData.control.showMode==='自定义像素值'" style="width: auto;margin-top:33px;margin-left:-187px;padding-bottom: 6px;">
|
|
<span style="margin-right: 10px;">宽度(像素) </span><el-input-number v-model="controlData.control.pxWidth" style="margin-bottom: 10px;" /><br/>
|
|
<span style="margin-right: 10px;">高度(像素) </span><el-input-number v-model="controlData.control.pxHeight" />
|
|
</div>
|
|
<div v-if="controlData.control.showMode==='自定义占父容器比例'" style="width: auto;margin-top:33px;margin-left:-187px;padding-bottom: 6px;">
|
|
<span style="margin-right: 10px;">百分比宽 </span><el-input-number v-model="controlData.control.widthPercent" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;">百分比高 </span><el-input-number v-model="controlData.control.heightPercent" />
|
|
</div>
|
|
</el-row> -->
|
|
<!-- <el-row v-else-if="item.type === 'lowcodeImage_fit'">
|
|
<el-radio-group v-model="controlData.control.fit">
|
|
<el-popover
|
|
placement="top-start"
|
|
title="填充"
|
|
:width="200"
|
|
trigger="hover"
|
|
content="默认值。调整替换后的内容大小，以填充元素的内容框。如有必要，将拉伸或挤压物体以适应该对象。"
|
|
>
|
|
<template #reference>
|
|
<el-radio :label="1" :value="1">填充</el-radio>
|
|
</template>
|
|
</el-popover>
|
|
|
|
<el-popover
|
|
placement="top-start"
|
|
title="适应"
|
|
:width="200"
|
|
trigger="hover"
|
|
content="缩放替换后的内容以保持其纵横比，同时将其放入元素的内容框。"
|
|
>
|
|
<template #reference>
|
|
<el-radio :label="2" :value="2">适应</el-radio>
|
|
</template>
|
|
</el-popover>
|
|
|
|
<el-popover
|
|
placement="top-start"
|
|
title="裁切"
|
|
:width="200"
|
|
trigger="hover"
|
|
content="调整替换内容的大小，以在填充元素的整个内容框时保持其长宽比。该对象将被裁剪以适应。"
|
|
>
|
|
<template #reference>
|
|
<el-radio :label="3" :value="3">裁切</el-radio>
|
|
</template>
|
|
</el-popover>
|
|
|
|
<el-popover
|
|
placement="top-start"
|
|
title="无"
|
|
:width="200"
|
|
trigger="hover"
|
|
content="不对替换的内容调整大小。"
|
|
>
|
|
<template #reference>
|
|
<el-radio :label="4" :value="4">无</el-radio>
|
|
</template>
|
|
</el-popover>
|
|
|
|
|
|
<el-popover
|
|
placement="top-start"
|
|
title="缩减"
|
|
:width="200"
|
|
trigger="hover"
|
|
content="调整内容大小就像没有指定内容或包含内容一样（将导致较小的具体对象尺寸）"
|
|
>
|
|
<template #reference>
|
|
<el-radio :label="5" :value="5">缩减</el-radio>
|
|
</template>
|
|
</el-popover>
|
|
|
|
</el-radio-group>
|
|
</el-row> -->
|
|
<!-- <el-row v-else-if="item.type === 'lowcodeImage_boderAndShadow'">
|
|
<el-switch v-model="controlData.control.boderAndShadow" style="margin-right: 15px;"/>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'lowcodeImage_link'">
|
|
<el-input
|
|
v-model="controlData.control.link"
|
|
placeholder="请录入图片链接地址"
|
|
style="width:221px"
|
|
/>
|
|
</el-row>
|
|
<el-row v-else-if="item.type === 'lowcodeImage_marginAndPadding'">
|
|
<div style="width: auto;margin-top:33px;margin-left:-47px;padding-bottom: 6px;">
|
|
<span style="margin-right: 10px;"> 外边距(上)</span><el-input-number v-model="controlData.control.mt" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 外边距(下)</span><el-input-number v-model="controlData.control.mb" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 外边距(左)</span><el-input-number v-model="controlData.control.ml" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 外边距(右)</span><el-input-number v-model="controlData.control.mr" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 内边距(上)</span><el-input-number v-model="controlData.control.pt" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 内边距(下)</span><el-input-number v-model="controlData.control.pb" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 内边距(左)</span><el-input-number v-model="controlData.control.pl" style="margin-bottom: 10px;"/><br/>
|
|
<span style="margin-right: 10px;"> 内边距(右)</span><el-input-number v-model="controlData.control.pr" style="margin-bottom: 10px;"/><br/>
|
|
</div>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'lowcodeImage_float'">
|
|
<el-switch v-model="controlData.control.floatFlag" style="margin-right: 15px;"/>
|
|
|
|
<el-select
|
|
v-if="controlData.control.floatFlag"
|
|
v-model="controlData.control.floatValue"
|
|
|
|
style="width: 150px; height:20px">
|
|
<el-option
|
|
v-for="showModeSelected1 in floatSelectOptions"
|
|
:key="showModeSelected1.value"
|
|
:label="showModeSelected1.label"
|
|
:value="showModeSelected1.value"
|
|
/>
|
|
|
|
</el-select>
|
|
|
|
</el-row> -->
|
|
|
|
<el-row v-else-if="item.type === 'associatedForms_hide'">
|
|
<el-button
|
|
v-if="controlData.control.hideConditionHtml === ''"
|
|
style="padding-top: 5px"
|
|
type="primary"
|
|
link
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="associatedFormsHideDialoghandle"
|
|
>设置隐藏条件</el-button
|
|
>
|
|
<div
|
|
style="width: 100%; cursor: pointer"
|
|
@click="associatedFormsHideDialoghandle"
|
|
v-html="controlData.control.hideConditionHtml"
|
|
></div>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'associatedForms_form'">
|
|
<el-button
|
|
type="primary"
|
|
link
|
|
style="display: block; cursor: pointer"
|
|
@click="chooseAssociatedForm"
|
|
>{{
|
|
controlData.control.asfasfLabel == ""
|
|
? "选择关联表单"
|
|
: controlData.control.asfasfLabel
|
|
}}</el-button
|
|
>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'input'"
|
|
><!-- 移动端扫描输入 -->
|
|
<el-switch v-model="controlData.control.scanInputFlag" />
|
|
<div
|
|
v-if="controlData.control.scanInputFlag"
|
|
style="
|
|
display: flex;
|
|
width: auto;
|
|
margin-top: 33px;
|
|
margin-left: -125px;
|
|
padding-bottom: 6px;
|
|
"
|
|
>
|
|
<div style="margin-right: 12px">扫描方式</div>
|
|
<el-select
|
|
v-model="controlData.control.scanType"
|
|
style="width: 150px; height: 20px"
|
|
>
|
|
<el-option
|
|
v-for="scanType in scanTypes"
|
|
:key="scanType.value"
|
|
:label="scanType.label"
|
|
:value="scanType.value"
|
|
/>
|
|
</el-select>
|
|
</div>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'associatedForms_dataRange'">
|
|
<el-button
|
|
v-if="controlData.control.dataRangeConditionHtml === ''"
|
|
style="padding-top: 5px"
|
|
type="primary"
|
|
link
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="associatedFormsDataRangeDialoghandle"
|
|
>设置数据范围</el-button
|
|
>
|
|
<div
|
|
style="width: 100%; cursor: pointer"
|
|
@click="associatedFormsDataRangeDialoghandle"
|
|
v-html="controlData.control.dataRangeConditionHtml"
|
|
></div>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.type === 'associatedForms_FillRoles'">
|
|
<el-button
|
|
style="padding-top: 5px"
|
|
type="primary"
|
|
link
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="associatedFormsDataFillRolesDialoghandle"
|
|
>设置数据填充规则</el-button
|
|
>
|
|
</el-row>
|
|
|
|
<el-row v-else-if="item.path === 'unitName'">
|
|
<el-input
|
|
:type="item.inputStyle"
|
|
v-model="item.value"
|
|
:placeholder="item.placeholder"
|
|
disabled
|
|
/>
|
|
</el-row>
|
|
|
|
<el-input
|
|
v-else
|
|
:type="item.inputStyle"
|
|
v-model="item.value"
|
|
:placeholder="item.placeholder"
|
|
:disabled="isNotWriteWord(item)"
|
|
@input="controlChange(item, $event)"
|
|
/>
|
|
</el-form-item>
|
|
</template>
|
|
|
|
<template v-if="controlData.config">
|
|
<!-- <el-form-item label="联动条件" class="form_cont">
|
|
<el-switch v-model="controlData.config.linkKey" />
|
|
</el-form-item> -->
|
|
<template v-if="controlData.config.linkKey">
|
|
<el-form-item class="form_cont">
|
|
<el-input
|
|
v-model="controlData.config.linkValue"
|
|
type="textarea"
|
|
placeholder="表达式如: $.input>1 $表示为当前表单数据，input为字段标识"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item
|
|
class="form_cont"
|
|
v-if="
|
|
showHide(
|
|
[
|
|
'input',
|
|
'textarea',
|
|
'radio',
|
|
'checkbox',
|
|
'select',
|
|
'date',
|
|
'switch',
|
|
'number',
|
|
'cascader',
|
|
'slider',
|
|
'datePicker',
|
|
'timePicker',
|
|
'colorPicker',
|
|
'inputNumber',
|
|
'rate',
|
|
'treeSelect',
|
|
],
|
|
true
|
|
)
|
|
"
|
|
label="联动结果"
|
|
>
|
|
<el-radio-group
|
|
v-model="controlData.config.linkResult"
|
|
class="option-radio"
|
|
>
|
|
<el-radio label="hidden">隐藏(默认)</el-radio>
|
|
<el-radio label="disabled">禁用</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</template>
|
|
</template>
|
|
<template v-if="showHide(['tabs'], true)">
|
|
<!-- <div class="h3"><h3>标签配置项</h3></div> -->
|
|
<el-divider content-position="left">标签配置项</el-divider>
|
|
<el-form-item
|
|
class="form_cont"
|
|
v-for="(item, index) in controlData.columns"
|
|
:key="index"
|
|
>
|
|
<el-col :span="12">
|
|
<el-input v-model="item.label" placeholder="标签配置项" />
|
|
</el-col>
|
|
<el-col :span="2" :offset="1">
|
|
<i class="icon-del" @click="delSelectOption(index as number, 'tabs')"></i>
|
|
</el-col>
|
|
</el-form-item>
|
|
<el-form-item class="form_cont">
|
|
<el-button @click="addSelectOption('tabs')">增加标签</el-button>
|
|
</el-form-item>
|
|
</template>
|
|
<!--编号规则设置--->
|
|
<div v-if="showHide(['serialNumber'], true)">
|
|
<!-- <div class="h3"><h3>编码规则配置</h3></div> -->
|
|
<el-divider content-position="left">编码规则配置</el-divider>
|
|
<el-form-item label="编码方式" class="form_cont">
|
|
<el-switch
|
|
v-model="controlData.config.automatic"
|
|
inline-prompt
|
|
active-text="自动编码"
|
|
inactive-text="手动编码"
|
|
style="--el-switch-on-color: #13ce66; --el-switch-off-color: #e6a23c"
|
|
/>
|
|
</el-form-item>
|
|
<div v-if="controlData.config.automatic">
|
|
<el-form-item
|
|
v-for="(item, index) in controlData.config.customRules"
|
|
:key="index"
|
|
class="form_cont"
|
|
>
|
|
<el-input
|
|
v-model="item.rule"
|
|
:placeholder="item.message ? item.message : '请输入自定义字符'"
|
|
>
|
|
<template #prepend>
|
|
<el-select
|
|
v-model="item.type"
|
|
style="width: 100px"
|
|
@change="rulesSelectNumChange(item, $event)"
|
|
>
|
|
<el-option
|
|
v-for="list in state.numberRulesList"
|
|
:key="list.type"
|
|
:label="list.label"
|
|
:value="list.type"
|
|
/>
|
|
</el-select>
|
|
</template>
|
|
<template #append>
|
|
<i class="icon-del" @click="delNumRules(index as number)"></i>
|
|
</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item class="form_cont">
|
|
<el-button @click="addNumRules">添加规则</el-button>
|
|
</el-form-item>
|
|
</div>
|
|
</div>
|
|
<!-- {{controlData.config.optionsType}} -->
|
|
<div v-if="showHide(['switch'], true)">
|
|
<el-button @click="handelGlxxszDialogSwitch">关联选项设置</el-button>
|
|
</div>
|
|
<div
|
|
v-if="
|
|
showHide(['radio', 'select'], true) && controlData.config.optionsType == 0
|
|
"
|
|
>
|
|
<el-button @click="handelGlxxszDialog">关联选项设置</el-button>
|
|
</div>
|
|
<div v-if="showHide(['checkbox'], true) && controlData.config.optionsType == 0">
|
|
<el-button @click="handelGlxxszDialogCheckbox">关联选项设置</el-button>
|
|
</div>
|
|
<div
|
|
v-if="
|
|
showHide(
|
|
['radio', 'select', 'checkbox', 'cascader', 'inputSlot', 'treeSelect'],
|
|
true
|
|
)
|
|
"
|
|
>
|
|
<!-- <div class="h3"><h3>选项配置</h3></div> -->
|
|
<el-divider content-position="left">选项配置</el-divider>
|
|
<el-form-item
|
|
v-if="showHide(['select'], true)"
|
|
label="添加全部项"
|
|
class="form_cont"
|
|
>
|
|
<el-input
|
|
v-model="controlData.config.addAll"
|
|
placeholder="请输入全部项文案"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="选项数据源" class="form_cont">
|
|
<el-select
|
|
v-model="controlData.config.optionsType"
|
|
@change="optionsTypeChanged"
|
|
>
|
|
<el-option :value="0" label="固定选项" />
|
|
<el-option :value="3" label="系统表单字段" />
|
|
<el-option :value="1" label="数据源" />
|
|
<el-option :value="2" label="接口字典" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<template v-if="controlData.config.optionsType === 0">
|
|
<div
|
|
v-if="
|
|
controlData.type !== 'cascader' &&
|
|
controlData.type !== 'checkbox' &&
|
|
controlData.type !== 'radio' &&
|
|
controlData.type !== 'select'
|
|
"
|
|
>
|
|
<el-form-item
|
|
v-for="(item, index) in controlData.options"
|
|
:key="index"
|
|
class="form_cont"
|
|
label="选项标签"
|
|
>
|
|
<el-col :span="10">
|
|
<el-input v-model="item.label" placeholder="选项标签" />
|
|
</el-col>
|
|
<!-- <el-col :span="10" :offset="1">
|
|
<el-input v-model="item.value" placeholder="选项值" />
|
|
</el-col> -->
|
|
<el-col :span="2" :offset="1">
|
|
<i class="icon-del" @click="delSelectOption(index as number)"></i>
|
|
</el-col>
|
|
</el-form-item>
|
|
</div>
|
|
<!-- 多选选择框选项拖动功能 liwenxuan 20240815 start -->
|
|
<div
|
|
v-if="
|
|
controlData.type !== 'cascader' &&
|
|
(controlData.type == 'checkbox' ||
|
|
controlData.type == 'radio' ||
|
|
controlData.type == 'select')
|
|
"
|
|
>
|
|
<draggable
|
|
:list="controlData.options"
|
|
:force-fallback="true"
|
|
chosen-class="chosenClass"
|
|
animation="300"
|
|
>
|
|
<template #item="{ element }">
|
|
<div class="item form_cont">
|
|
<el-form-item>
|
|
<el-col
|
|
:span="2"
|
|
style="padding-top: 4px; cursor: move; color: #66b1ff"
|
|
>
|
|
<i class="icon-move"></i>
|
|
</el-col>
|
|
<el-col :span="6" style="cursor: move"> 选项标签 </el-col>
|
|
<el-col :span="10">
|
|
<el-input v-model="element.label" placeholder="选项标签" />
|
|
</el-col>
|
|
<el-col :span="2" :offset="1">
|
|
<i
|
|
class="icon-del"
|
|
@click="delSelectOption(element.value as number)"
|
|
></i>
|
|
</el-col>
|
|
</el-form-item>
|
|
</div>
|
|
</template>
|
|
</draggable>
|
|
</div>
|
|
<!-- 多选选择框选项拖动功能 liwenxuan 20240815 end -->
|
|
<el-form-item class="form_cont">
|
|
<el-button @click="addSelectOption">{{
|
|
controlData.type === "cascader" ? "编辑" : "新增"
|
|
}}</el-button>
|
|
</el-form-item>
|
|
</template>
|
|
<template v-else-if="controlData.config.optionsType === 3">
|
|
<el-button
|
|
type="primary"
|
|
style="margin-bottom: 10px; margin-left: 80px"
|
|
plain
|
|
@click="optionsValue3Setting"
|
|
>选择系统表单字段</el-button
|
|
>
|
|
<!-- <el-button style="padding-top: 5px;" type="primary" link append-to-body="true" modal="true" @click="optionsValue3Setting" >选择系统表单字段</el-button> -->
|
|
</template>
|
|
<template v-else>
|
|
<el-form-item class="form_cont">
|
|
<el-input
|
|
v-model="controlData.config.optionsFun"
|
|
:placeholder="getOptionPlaceholder(controlData.config.optionsType)"
|
|
>
|
|
<template v-if="controlData.config.optionsType === 1" #prepend>
|
|
<el-select v-model="controlData.config.method" style="width: 80px">
|
|
<el-option label="get" value="get" />
|
|
<el-option label="post" value="post" />
|
|
</el-select>
|
|
</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
<template v-if="controlData.config.optionsType === 1">
|
|
<el-form-item label="指定label属性值" class="form_cont">
|
|
<el-input
|
|
v-model="controlData.config.label"
|
|
placeholder="返回数据中没有label时可设置"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="指定value属性值" class="form_cont">
|
|
<el-input
|
|
v-model="controlData.config.value"
|
|
placeholder="返回数据中没有value时可设置"
|
|
/>
|
|
</el-form-item>
|
|
</template>
|
|
<el-form-item v-if="controlData.config.optionsType === 1" class="form_cont">
|
|
<el-button
|
|
@click="
|
|
optionsEvent(
|
|
'optionsParams',
|
|
'请求前处理事件，参数(data,route,form) data请求参数,route页面路由,form表单值'
|
|
)
|
|
"
|
|
>beforeRequest</el-button
|
|
>
|
|
<el-button
|
|
@click="
|
|
optionsEvent(
|
|
'optionsResult',
|
|
'请求返回结束处理；，也可为字符串，如opt=formatTest'
|
|
)
|
|
"
|
|
>afterResponse</el-button
|
|
>
|
|
</el-form-item>
|
|
</template>
|
|
<el-form-item label="尝试转换value值为" class="form_cont">
|
|
<el-select
|
|
v-model="controlData.config.transformData"
|
|
placeholder="默认为number"
|
|
>
|
|
<el-option value="none">不转换</el-option>
|
|
<el-option value="number">number</el-option>
|
|
<el-option value="string">string</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</div>
|
|
<template
|
|
v-if="
|
|
!state.isSearch &&
|
|
showHide([
|
|
'txt',
|
|
'title',
|
|
'table',
|
|
'grid',
|
|
'tabs',
|
|
'card',
|
|
'switch',
|
|
'gridChild',
|
|
'tableColumn',
|
|
'divider',
|
|
'div',
|
|
'button',
|
|
])
|
|
"
|
|
>
|
|
<!-- <div class="h3"><h3>校验设置</h3></div> -->
|
|
<el-divider content-position="left">校验设置</el-divider>
|
|
<div
|
|
v-if="showHide(['input', 'password', 'component', 'digitpage'], true)"
|
|
class="jiaoYan"
|
|
>
|
|
<el-form-item class="form_cont">
|
|
<el-input
|
|
v-model="ValidateText.message"
|
|
@input="requiredText"
|
|
:placeholder="ValidateText.message"
|
|
>
|
|
<template #prepend> 必填 </template>
|
|
<template #append>
|
|
<el-checkbox
|
|
v-model="ValidateText.checkbox"
|
|
@change="requiredChangeSet"
|
|
/>
|
|
</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
v-if="showHide(['input', 'password', 'component'], true)"
|
|
class="form_cont"
|
|
>
|
|
<el-radio-group v-model="radioVerify.type" @change="radioChangeSet">
|
|
<el-input
|
|
v-for="item in textUinrVerfy"
|
|
v-model="item.message"
|
|
@input="requiredTextRadio(item)"
|
|
:placeholder="item.message"
|
|
class="radioInput"
|
|
>
|
|
<template #prepend>
|
|
{{ item.label }}
|
|
</template>
|
|
<template #append>
|
|
<el-radio :value="item.type" />
|
|
</template>
|
|
</el-input>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item v-else class="form_cont">
|
|
<el-radio-group v-model="radioVerify.type" @change="radioChangeSet">
|
|
<el-input
|
|
v-for="item in numberUinrVerfy"
|
|
v-model="item.message"
|
|
@input="requiredTextRadio(item)"
|
|
:placeholder="item.message"
|
|
class="radioInput"
|
|
>
|
|
<template #prepend>
|
|
{{ item.label }}
|
|
</template>
|
|
<template #append>
|
|
<el-radio :value="item.type" />
|
|
</template>
|
|
</el-input>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<!-- <el-form-item
|
|
v-for="(item, index) in controlData.customRules"
|
|
:key="item.type"
|
|
class="form_cont"
|
|
>
|
|
|
|
<el-input v-model="item.message" placeholder="校验提示信息">
|
|
<template #prepend>
|
|
<el-select
|
|
v-model="item.type"
|
|
style="width: 80px"
|
|
@change="rulesSelectChange(item, $event)"
|
|
>
|
|
<el-option
|
|
v-for="list in state.customRulesList"
|
|
:key="list.type"
|
|
:label="list.label"
|
|
:value="list.type"
|
|
/>
|
|
</el-select>
|
|
</template>
|
|
<template #append>
|
|
<i
|
|
class="icon-del"
|
|
@click="delAddRules(index as number)"
|
|
></i>
|
|
</template>
|
|
</el-input>
|
|
<el-input
|
|
v-if="item.type === 'rules'"
|
|
v-model="item.rules"
|
|
placeholder="正则表达式"
|
|
/>
|
|
<el-input
|
|
v-if="item.type === 'methods'"
|
|
v-model="item.methods"
|
|
placeholder="方法名称，此方法仅适用于导出vue文件"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item class="form_cont">
|
|
<el-button @click="addRulesFast">快速添加</el-button>
|
|
<el-button @click="addRules(state.tooltip.rules)"
|
|
>编写校验规则
|
|
<el-tooltip
|
|
:content="state.tooltip.rules"
|
|
placement="top"
|
|
raw-content
|
|
>
|
|
<el-icon>
|
|
<QuestionFilled />
|
|
</el-icon>
|
|
</el-tooltip>
|
|
</el-button>
|
|
</el-form-item> -->
|
|
</div>
|
|
<el-form-item class="form_cont" v-else>
|
|
<el-checkbox :model-value="checkboxRequired" @change="requiredChange"
|
|
>必填
|
|
</el-checkbox>
|
|
<el-input
|
|
v-if="controlData.item?.rules && controlData.item?.rules[0]"
|
|
v-model="controlData.item.rules[0].message"
|
|
placeholder="自定义必填错误提示"
|
|
/>
|
|
</el-form-item>
|
|
</template>
|
|
<!-- <div class="h3"><h3>其他属性</h3></div> -->
|
|
<!-- <el-divider content-position="left">其他属性</el-divider>
|
|
<div v-if="showHide(['grid', 'card', 'gridChild', 'divider', 'div'])" class="form_cont">
|
|
|
|
|
|
<el-button
|
|
size="small"
|
|
@click="openAttrDialog('', state.tooltip.props)"
|
|
>编辑属性
|
|
<el-tooltip :content="state.tooltip.props" placement="top">
|
|
<el-icon>
|
|
<QuestionFilled />
|
|
</el-icon>
|
|
</el-tooltip>
|
|
</el-button>
|
|
</div> -->
|
|
<el-divider content-position="left">高级属性</el-divider>
|
|
|
|
<LayoutPage
|
|
v-if="cssIsShouw(attrList)"
|
|
v-model:styles-val="controlDataStyls"
|
|
:place="controlData.type"
|
|
/>
|
|
</el-form>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="表单配置" name="second">
|
|
<el-form size="small" class="form">
|
|
<el-divider content-position="left">基础配置</el-divider>
|
|
<el-form-item v-if="formConfig.classify != 4" class="form_cont">
|
|
<template #label> 归属分组 </template>
|
|
|
|
<el-select
|
|
id="groupForm"
|
|
v-model="formConfig.groupKey"
|
|
placeholder="Select"
|
|
ref="groupForm"
|
|
>
|
|
<el-option
|
|
v-for="item in formGroup.list"
|
|
:key="item.idStr"
|
|
:label="item.title"
|
|
:value="item.idStr"
|
|
/>
|
|
<p v-if="loadingmore">加载中</p>
|
|
<p v-if="loadingnomore">无数据</p>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item
|
|
v-for="(item, index) in formAttr.filter((item) => !item.hide)"
|
|
:label="item.label"
|
|
:key="index"
|
|
class="form_cont"
|
|
>
|
|
<el-select
|
|
v-if="item.type === 'select'"
|
|
v-model="item.value"
|
|
:filterable="item.key === 'class'"
|
|
:allow-create="item.key === 'class'"
|
|
:placeholder="item.placeholder"
|
|
:clearable="item.clearable"
|
|
@change="formAttrChange(item)"
|
|
>
|
|
<el-option
|
|
v-for="opt in item.options"
|
|
:key="opt.label || opt.name"
|
|
:label="opt.label || opt.name"
|
|
:value="formatNumber(opt.value ?? opt.id)"
|
|
/>
|
|
</el-select>
|
|
|
|
<div v-else-if="item.type === 'dataSourceSetup'">
|
|
<el-radio-group v-model="formData.dataSource" size="small">
|
|
<el-radio-button
|
|
v-for="optVal in item.options"
|
|
:label="optVal.label"
|
|
:value="optVal.value"
|
|
/>
|
|
<!-- <el-radio-button label="Washington" value="Washington" />
|
|
<el-radio-button label="Los Angeles" value="Los Angeles" />
|
|
<el-radio-button label="Chicago" value="Chicago" /> -->
|
|
</el-radio-group>
|
|
<div v-if="formData.dataSource == 'yes'" @click="openSetDataSource">
|
|
<el-text v-if="formData.dataSourceConfig.tableName != ''">
|
|
{{ formData.dataSourceConfig.dataBaseName }} /
|
|
{{ formData.dataSourceConfig.tableName }}
|
|
</el-text>
|
|
<el-text v-else>请选择数据源</el-text>
|
|
</div>
|
|
</div>
|
|
<el-switch
|
|
v-else-if="item.type === 'switch'"
|
|
v-model="item.value"
|
|
@input="formAttrChange(item)"
|
|
/>
|
|
<el-input
|
|
v-else
|
|
v-model="item.value"
|
|
:placeholder="item.placeholder"
|
|
:disabled="isNotWrite(item)"
|
|
@input="formAttrChange(item)"
|
|
/>
|
|
</el-form-item>
|
|
|
|
<el-form-item class="form_cont">
|
|
<template #label> 表单图标 </template>
|
|
<el-upload
|
|
class="avatar-uploader"
|
|
:action="imgUploadApiUrl"
|
|
:show-file-list="false"
|
|
:on-success="handleAvatarSuccess"
|
|
:before-upload="beforeAvatarUpload"
|
|
>
|
|
<img v-if="formConfig.imageUrl" :src="formConfig.imageUrl" class="avatar" />
|
|
<el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
|
|
</el-upload>
|
|
</el-form-item>
|
|
<el-form-item class="form_cont" label="数据标题">
|
|
<el-tree-select
|
|
v-model="formData.dataTitle"
|
|
multiple
|
|
clearable
|
|
collapse-tags
|
|
:data="associatedFormsCurrentFormFieldTreeNoTable"
|
|
:render-after-expand="false"
|
|
style="width: 240px"
|
|
/>
|
|
</el-form-item>
|
|
|
|
<el-form-item class="form_cont" label="二维码">
|
|
<el-switch v-model="formData.qrCodeFlag" />
|
|
</el-form-item>
|
|
<el-form-item v-if="formData.qrCodeFlag" class="form_cont" label="内部二维码">
|
|
<el-switch v-model="formData.qrCodeInside" />
|
|
<el-button
|
|
v-if="formData.qrCodeInside"
|
|
type="primary"
|
|
text
|
|
@click="showQrCodeInside"
|
|
>
|
|
查看内部二维码图片
|
|
</el-button>
|
|
</el-form-item>
|
|
<el-form-item v-if="formData.qrCodeFlag" class="form_cont" label="外部二维码">
|
|
<el-switch v-model="formData.qrCodeOutside" />
|
|
<el-button
|
|
v-if="formData.qrCodeOutside"
|
|
type="primary"
|
|
text
|
|
@click="showQrCodeOutside"
|
|
>
|
|
查看外部二维码图片
|
|
</el-button>
|
|
</el-form-item>
|
|
<el-form-item
|
|
v-if="formData.qrCodeFlag"
|
|
class="form_cont"
|
|
label="二维码打印样式"
|
|
>
|
|
<!-- <el-button
|
|
type="primary"
|
|
text
|
|
@click="showQrCodeOutPrintConfig"
|
|
>
|
|
样式设置
|
|
</el-button> -->
|
|
|
|
<el-radio-group v-model="formData.qrCodePrintStyle">
|
|
<el-radio value="1">图片</el-radio>
|
|
<el-radio value="2">表格卡片</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
|
|
<el-form-item
|
|
v-if="formData.qrCodeFlag && formData.qrCodePrintStyle == 2"
|
|
class="form_cont"
|
|
label="表格卡片显示字段"
|
|
>
|
|
<el-select
|
|
v-model="formData.qrCodeShowFields"
|
|
multiple
|
|
placeholder="请选择"
|
|
style="width: 240px"
|
|
@change="handleMaxSelect"
|
|
>
|
|
<el-option
|
|
v-for="item in associatedFormsCurrentFormFieldTreeNoTable1"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
|
|
<el-divider content-position="left">表单整体布局</el-divider>
|
|
<el-form-item label="组件尺寸" class="form_cont">
|
|
<el-radio-group v-model="formData.size">
|
|
<el-radio-button label="large">大</el-radio-button>
|
|
<el-radio-button label="default">适中</el-radio-button>
|
|
<el-radio-button label="small">小</el-radio-button>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="表单样式名称" class="form_cont">
|
|
<el-select
|
|
v-model="formData.class"
|
|
class="m-2"
|
|
placeholder="额外添加的表单class类名"
|
|
>
|
|
<el-option
|
|
v-for="item in optionsCss"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="行内表单模式" class="form_cont">
|
|
<el-switch
|
|
v-model="formData.inline"
|
|
active-text="开启"
|
|
inactive-text="关闭"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="标签宽度" class="form_cont">
|
|
<el-input v-model="formData.labelWidth" clearable placeholder="表单标签宽度">
|
|
<template #append>PX</template>
|
|
</el-input>
|
|
</el-form-item>
|
|
<el-form-item label="标签后缀" class="form_cont">
|
|
<el-input v-model="formData.labelSuffix" placeholder="表单标签后缀" />
|
|
</el-form-item>
|
|
<el-form-item label="表单标签对齐方式" class="form_cont">
|
|
<el-radio-group v-model="formData.labelPosition">
|
|
<el-radio-button label="left">左</el-radio-button>
|
|
<el-radio-button label="right">右</el-radio-button>
|
|
<el-radio-button label="top">上</el-radio-button>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="必填项星号位置" class="form_cont">
|
|
<el-radio-group v-model="formData.requireAsteriskPosition">
|
|
<el-radio-button label="left">左</el-radio-button>
|
|
<el-radio-button label="right">右</el-radio-button>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="是否隐藏星号" class="form_cont">
|
|
<el-switch
|
|
v-model="formData.hideRequiredAsterisk"
|
|
active-text="隐藏"
|
|
inactive-text="显示"
|
|
style="--el-switch-on-color: #ff4949; --el-switch-off-color: #13ce66"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="校验错误信息" class="form_cont">
|
|
<el-switch
|
|
v-model="formData.showMessage"
|
|
active-text="显示"
|
|
inactive-text="隐藏"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="行内展示校验信息" class="form_cont">
|
|
<el-switch
|
|
v-model="formData.inlineMessage"
|
|
active-text="显示"
|
|
inactive-text="隐藏"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="校验结果反馈图标" class="form_cont">
|
|
<el-switch
|
|
v-model="formData.statusIcon"
|
|
active-text="显示"
|
|
inactive-text="隐藏"
|
|
/>
|
|
</el-form-item>
|
|
<el-divider content-position="left">表单功能补充</el-divider>
|
|
<el-form-item class="form_cont">
|
|
<el-button @click="editFormStyle(state.tooltip.css)">
|
|
编辑表单样式
|
|
<el-tooltip :content="state.tooltip.css" placement="top">
|
|
<el-icon>
|
|
<QuestionFilled />
|
|
</el-icon>
|
|
</el-tooltip>
|
|
</el-button>
|
|
<el-button @click="editFormDict(state.tooltip.dict)">
|
|
设置数据字典
|
|
<el-tooltip :content="state.tooltip.dict" placement="top">
|
|
<el-icon>
|
|
<QuestionFilled />
|
|
</el-icon>
|
|
</el-tooltip>
|
|
</el-button>
|
|
</el-form-item>
|
|
<template v-if="!state.isSearch">
|
|
<el-divider content-position="left">接口数据事件</el-divider>
|
|
|
|
<el-form-item v-if="!state.isSearch" class="form_cont">
|
|
<template #label>
|
|
添加时获取请求
|
|
<el-tooltip
|
|
content="新增表单数据时，从接口获取新增初始数据"
|
|
placement="top"
|
|
>
|
|
<el-icon>
|
|
<QuestionFilled />
|
|
</el-icon>
|
|
</el-tooltip>
|
|
</template>
|
|
<el-switch
|
|
v-model="formConfig.addLoad"
|
|
@change="formAttrChange({ key: 'addLoad', path: 'config' }, $event)"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="新增数据保存url" class="form_cont">
|
|
<el-input
|
|
v-model="formConfig.addUrl"
|
|
placeholder="表单提交的url，非特殊不需要设置"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="修改数据保存url" class="form_cont">
|
|
<el-input
|
|
v-model="formConfig.editUrl"
|
|
placeholder="修改提交的url，非特殊不需要设置"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="获取表单数据url" class="form_cont">
|
|
<el-input
|
|
v-model="formConfig.requestUrl"
|
|
placeholder="获取表单数据url，非特殊不需要设置"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item class="event-btn form_cont">
|
|
<el-button
|
|
@click="
|
|
eventClick('beforeRequest', '获取表单初始数据前事件，可修改请求参数')
|
|
"
|
|
>beforeRequest
|
|
</el-button>
|
|
<el-button
|
|
@click="
|
|
eventClick(
|
|
'afterResponse',
|
|
'获取表单初始数据后事件，可对请求返回数据进行处理；也可为字符串，如opt=formatTest'
|
|
)
|
|
"
|
|
>afterResponse
|
|
</el-button>
|
|
<el-button
|
|
@click="
|
|
eventClick(
|
|
'beforeSubmit',
|
|
'表单数据提交前事件，可对提交数据进行处理；也可为字符串，如opt=formatTest'
|
|
)
|
|
"
|
|
>beforeSubmit
|
|
</el-button>
|
|
<el-button @click="eventClick('afterSubmit', '表单数据提交成功事件')"
|
|
>afterSubmit
|
|
</el-button>
|
|
<el-button
|
|
@click="
|
|
eventClick(
|
|
'change',
|
|
'表单组件值改变事件。当表单某值改变时，可修改其他组件的值；也可为字符串，如opt=formChange,字符串即为/utils/formChangeValue(name,model,key)中的key值'
|
|
)
|
|
"
|
|
>表单组件改变事件change
|
|
</el-button>
|
|
</el-form-item>
|
|
</template>
|
|
</el-form>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="AI配置" name="aiConfig">
|
|
<el-divider content-position="left">AI触发条件设置</el-divider>
|
|
<div class="common-layout">
|
|
<el-scrollbar class="aiBox">
|
|
<el-card v-for="(item, index) in props.formInfo.aiConfig" class="aiCardBox">
|
|
<template #header>
|
|
<div class="card-header">
|
|
<i class="fa fa-close" @click="delList(index)"></i>
|
|
</div>
|
|
</template>
|
|
<el-form :model="item" label-width="auto">
|
|
<el-form-item label="触发字段">
|
|
<el-select
|
|
v-model="item.title"
|
|
multiple
|
|
collapse-tags
|
|
placeholder="请选择触发字段"
|
|
>
|
|
<el-option
|
|
v-for="oItem in unitFormList"
|
|
:key="oItem.value"
|
|
:label="oItem.label"
|
|
:value="oItem.value"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="触发方式">
|
|
<el-radio-group v-model="item.trigger">
|
|
<el-radio :value="1">任一有值</el-radio>
|
|
<el-radio :value="2">半数以上有值</el-radio>
|
|
<el-radio :value="3">全部有值</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
<el-form-item label="采用的知识库">
|
|
<el-select
|
|
v-model="item.library"
|
|
multiple
|
|
collapse-tags
|
|
placeholder="请选择采用的知识库"
|
|
>
|
|
<el-option
|
|
v-for="lItem in aiAgentList"
|
|
:key="lItem.uuid"
|
|
:label="lItem.name"
|
|
:value="lItem.uuid"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<!-- <el-form-item label="结果呈现方式">
|
|
<el-radio-group v-model="item.openShowType">
|
|
<el-radio :value="1">底部展示</el-radio>
|
|
<el-radio :value="2">消息弹出框</el-radio>
|
|
<el-radio :value="3">抽屉</el-radio>
|
|
<el-radio :value="4">消息提示</el-radio>
|
|
<el-radio :value="5">通知框</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item> -->
|
|
</el-form>
|
|
</el-card>
|
|
|
|
<el-button type="primary" class="aiBut" @click="addPickTracn"
|
|
>添加条件</el-button
|
|
>
|
|
</el-scrollbar>
|
|
</div>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</div>
|
|
|
|
<el-dialog
|
|
v-model="userRangeDialogFlag"
|
|
title="可选用户设置"
|
|
width="840"
|
|
|
|
|
|
>
|
|
|
|
<el-tabs v-if="controlData.type === 'expand-user'" v-model="controlData.control.queryBy" style="width:100%;" @tab-change="handleExpandTabChange" >
|
|
<el-tab-pane label="根据角色筛选" name="role">
|
|
|
|
<div >
|
|
|
|
<el-row>
|
|
<el-col :span="16" style="padding: 0;border-right: 0px solid black;">
|
|
<el-tabs ref="tabsRef" v-model="activeTab" style="height:483px;" tab-position="left" @tab-change="handleLeftTabChange" >
|
|
<el-tab-pane
|
|
v-for="tab in tabsData"
|
|
:key="tab.id"
|
|
:label="tab.name"
|
|
:name="tab.id"
|
|
>
|
|
<div>
|
|
<el-input placeholder="请输入用户名" v-model="expandQueryParam" clearable style="width: 50%; margin-bottom: 10px;margin-left: 3px;"/>
|
|
<el-button type="primary" @click="searchClick" style="margin-left: 10px; margin-bottom: 10px;">查询</el-button>
|
|
<el-button @click="resetClick" style="margin-bottom: 10px;">重置</el-button>
|
|
</div>
|
|
<div class="expandTable">
|
|
<el-table ref="multipleTableRef" :data="expandTableData" style="width: 100%; height: 440px" :row-style="{ height: '39.8px' }" :cell-style="{ padding: '1.5px 0' }" @selection-change="handleSelectionChange">
|
|
<!-- <el-table-column prop="userName" label="照片" width="70px" align="center">
|
|
<template #default="scope">
|
|
<el-avatar
|
|
v-if="scope.row.icon != ''"
|
|
shape="square"
|
|
:size="30"
|
|
:src="scope.row.icon"
|
|
/>
|
|
<el-avatar v-else shape="square" :size="30" :src="UserRole" />
|
|
</template>
|
|
</el-table-column> -->
|
|
<el-table-column prop="name" label="姓名" width="160px" align="left">
|
|
<template #default="scope">
|
|
{{ scope.row.name }}({{ scope.row.number }})
|
|
</template>
|
|
</el-table-column>
|
|
<!-- <el-table-column prop="tel" label="联系方式" width="120px" align="left" /> -->
|
|
<el-table-column prop="nickName" label="部门" width="140px" align="left">
|
|
<template #default="{ row }">
|
|
{{row.deparment}}
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column type="selection" width="45" />
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
</div>
|
|
<div class="expandPage">
|
|
|
|
</div>
|
|
|
|
</el-tab-pane>
|
|
|
|
</el-tabs>
|
|
</el-col>
|
|
<el-col :span="1" style="display: flex; align-items: center;justify-content: center;" >
|
|
<el-icon style="font-size: large;cursor: pointer;" @click="gotoRight"><ArrowRightBold /></el-icon>
|
|
</el-col>
|
|
<el-col :span="6" style="padding: 0">
|
|
<div >
|
|
<div style="display: flex; align-items: center; padding-bottom: 18px;">
|
|
<div>已选择：{{ controlData.control.roleCheckDataList.length }}</div>
|
|
<el-button type="danger" @click="delAllClick" size="small" style="margin-left: auto"
|
|
>全部移除</el-button
|
|
>
|
|
</div>
|
|
<el-table :data="controlData.control.roleCheckDataList" style="height: 440px;padding-top: 2px;" :row-style="{ height: '39.8px' }" :cell-style="{ padding: '1.5px 0' }">
|
|
<!-- <el-table-column prop="userName" label="照片" width="60px" align="center">
|
|
<template #default="scope">
|
|
<el-avatar
|
|
v-if="scope.row.icon != ''"
|
|
shape="square"
|
|
:size="30"
|
|
:src="scope.row.icon"
|
|
/>
|
|
<el-avatar v-else shape="square" :size="30" :src="UserRole" />
|
|
</template>
|
|
</el-table-column> -->
|
|
<el-table-column prop="name" label="姓名" align="left">
|
|
<template #default="scope">
|
|
{{ scope.row.name }}({{ scope.row.number }})
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="" width="60px" >
|
|
<template #default="{ row }">
|
|
<el-button size="small" type="danger" @click="delRowClick(row)"
|
|
>移除</el-button
|
|
>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
|
|
|
|
</el-col>
|
|
|
|
<div style="width:100%;display: flex;margin-top: 18px;justify-content: center;">
|
|
<el-pagination v-model:current-page="expandPageNum" v-model:page-size="expandPageSize" background layout="prev, pager, next, jumper,sizes" :pager-count="3" :page-sizes="[10, 20, 100, 500, 1000]" :total = "total" @current-change="handleCurrentChange" @size-change="handleSizeChange"/>
|
|
</div>
|
|
</el-row>
|
|
|
|
|
|
|
|
</div>
|
|
</el-tab-pane>
|
|
<el-tab-pane label="根据组织筛选" name="org">
|
|
<div style="width:100%;display: flex;margin-top: 1px;justify-content: center;">
|
|
<TransferSelectUserRange v-if="userRangeDialogFlag" :key="componentKey" :data="transferSelectUserRangeData" :selected-value="controlData.control.orgRange" @checked-id-list-changed="checkedIdListChangedIndex" @re-render-component="reRenderComponent" />
|
|
</div>
|
|
|
|
</el-tab-pane>
|
|
|
|
|
|
</el-tabs>
|
|
|
|
|
|
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="userRangeDialogFlag = false">
|
|
确定
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
|
|
</el-dialog>
|
|
|
|
|
|
<!-- 轮播图设置弹窗 20240122 start -->
|
|
|
|
<el-dialog
|
|
v-model="dialogTableVisible"
|
|
title="轮播图设置"
|
|
top="20px"
|
|
style="margin-top:70px,margin-left:270px"
|
|
>
|
|
<div v-if="controlData.type == 'lowcodeCarsusel'" style="margin-bottom: 30px">
|
|
<span style="margin-right: 10px">轮播图宽度(像素):</span
|
|
><el-input-number
|
|
v-model="controlData.control.config.carsuselWidth"
|
|
:step="64"
|
|
:max="4096"
|
|
:min="178"
|
|
/>
|
|
<span style="margin-left: 15px; margin-right: 10px">轮播图高度(像素):</span
|
|
><el-input-number
|
|
v-model="controlData.control.config.carsuselHeight"
|
|
:step="36"
|
|
:max="4096"
|
|
:min="100"
|
|
/>
|
|
<span style="margin-left: 15px; margin-right: 10px">切图间隔(毫秒):</span
|
|
><el-input-number v-model="controlData.control.config.interval" :step="200" />
|
|
</div>
|
|
<el-table
|
|
v-if="controlData.type == 'lowcodeCarsusel'"
|
|
:data="controlData.control.carsuselConfigArr"
|
|
border
|
|
style="width: 100%"
|
|
row-key="imgId"
|
|
>
|
|
<el-table-column label="设置图片" width="180">
|
|
<template #default="propFlag">
|
|
<el-upload
|
|
:action="uploadUrl"
|
|
:before-remove="beforeRemove"
|
|
:on-success="carouselImgUploadSuccess"
|
|
:on-error="videoUploadErr"
|
|
:limit="1"
|
|
accept=".jpg,.jpeg,.png,.tif,.tga,.bmp,.dds,.svg,.eps,.pdf,.hdr,.raw,.exr,.psd,.afphoto,.afdesign"
|
|
>
|
|
<el-button
|
|
v-if="!propFlag.row.uploadFlag"
|
|
type="primary"
|
|
@click="changeCurrentUploadImgid(propFlag.row)"
|
|
>点此上传</el-button
|
|
>
|
|
<el-button
|
|
v-if="propFlag.row.uploadFlag"
|
|
type="primary"
|
|
@click="changeCurrentUploadImgid(propFlag.row)"
|
|
>已上传,点击修改</el-button
|
|
>
|
|
</el-upload>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="imgUrl" label="查看图片" width="180">
|
|
<template #default="imgScope">
|
|
<!-- {{ imgScope.row.imgUrl }} -->
|
|
|
|
<el-image
|
|
style="width: 100px; height: 100px; cursor: pointer"
|
|
:src="imgScope.row.imgUrl"
|
|
fit="contain"
|
|
alt="暂未上传"
|
|
@click="handlePreview(imgScope.$index, imgScope.row)"
|
|
>
|
|
<template #error>
|
|
<div class="image-slot">
|
|
<el-image
|
|
style="width: 100px; height: 100px"
|
|
:src="errimg"
|
|
fit="contain"
|
|
></el-image>
|
|
</div>
|
|
</template>
|
|
</el-image>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="link" label="链接地址">
|
|
<template #default="linkScope">
|
|
<el-input v-model="linkScope.row.link" placeholder="输入图片的链接地址" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column fixed="right" label="操作（增/删）" width="120">
|
|
<template #default="scope">
|
|
<el-button
|
|
v-if="controlData.control.carsuselConfigArr.length > 1"
|
|
type="danger"
|
|
:icon="Delete"
|
|
circle
|
|
@click="deleteRow(scope.row)"
|
|
/>
|
|
|
|
<el-button
|
|
v-if="
|
|
controlData.control.carsuselConfigArr[
|
|
controlData.control.carsuselConfigArr.length - 1
|
|
].imgId == scope.row.imgId
|
|
"
|
|
type="success"
|
|
:icon="Plus"
|
|
circle
|
|
@click="createRow(scope.row)"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-dialog>
|
|
<!-- 图片预览 -->
|
|
<el-image-viewer
|
|
v-if="showImagePreview"
|
|
:zoom-rate="1.2"
|
|
:url-list="carouselImgUrlList"
|
|
@close="closePreview"
|
|
/>
|
|
|
|
<el-dialog
|
|
v-model="transferDialogTableVisible"
|
|
title="创建穿梭框选项树"
|
|
top="150px"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<div v-if="controlData.type == 'lowcodeTransfer'">
|
|
<el-button
|
|
type="success"
|
|
plain
|
|
style="margin-top: 5px; margin-bottom: 5px"
|
|
@click="addRootNode()"
|
|
>新增根节点</el-button
|
|
>
|
|
|
|
<!-- 建立树 -->
|
|
<div class="custom-tree-container">
|
|
<el-tree
|
|
:data="controlData.control.fixedOptions"
|
|
show-checkbox
|
|
node-key="id"
|
|
:default-expand-all="false"
|
|
:expand-on-click-node="true"
|
|
>
|
|
<template #default="{ node, data }">
|
|
<span class="custom-tree-node">
|
|
<span>{{ node.label }}</span>
|
|
<span style="float: right">
|
|
<a style="color: green" @click="append(data)"> 新增子节点 </a>
|
|
<a style="margin-left: 8px" @click="changeLabel(node, data)">
|
|
编辑节点名
|
|
</a>
|
|
<a
|
|
style="margin-left: 8px; color: orange"
|
|
@click="setNodeEnable(node, data)"
|
|
>
|
|
设为可选/不可选
|
|
</a>
|
|
<a style="margin-left: 8px; color: red" @click="remove(node, data)">
|
|
删除本节点
|
|
</a>
|
|
</span>
|
|
</span>
|
|
</template>
|
|
</el-tree>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
<!-- 穿梭框设置弹窗 liwenxuan 20240217 end -->
|
|
|
|
<!-- 二维码展示弹窗 liwenxuan 20250103 start -->
|
|
|
|
<el-dialog
|
|
v-model="qrCodeInsideDialogFlag"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
title="内部二维码"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<img :src="qrCodeImgInside" style="width: 50%; height: 50%" />
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="qrCodeInsideDialogFlag = false">
|
|
确定
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<!-- <el-dialog
|
|
v-model="qrCodeOutPrintConfigFlag"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
title="详情二维码样式设置"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<el-radio-group v-model="formData.qrCodePrintStyle">
|
|
<el-radio value="1" size="large">图片</el-radio>
|
|
<el-radio value="2" size="large">表格卡片</el-radio>
|
|
</el-radio-group>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="qrCodeOutPrintConfigFlag = false">
|
|
确定
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog> -->
|
|
|
|
<!-- 二维码展示弹窗 liwenxuan 20250103 end -->
|
|
<!-- 关联表单设置弹窗 liwenxuan 20240402 start -->
|
|
<!-- -->
|
|
<el-dialog
|
|
v-model="associatedFormsChooseDialogFlag"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
title="选择关联表单"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<template v-if="controlData.type == 'associatedForms'">
|
|
<div style="display: flex; margin-bottom: 2px; margin-top: 28px">
|
|
<span style="font-size: larger; margin-left: 35px; margin-right: 15px"
|
|
>请选择表单</span
|
|
>
|
|
<el-tree-select
|
|
v-model="controlData.control.formid"
|
|
style="width: 390px"
|
|
:data="customerFormTree[0].children"
|
|
check-strictly
|
|
:render-after-expand="false"
|
|
|
|
node-key="id"
|
|
@change="formidChanged"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="handleDetermineAssociatedFormsChooseDialog">
|
|
确定
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<el-dialog
|
|
v-model="associatedFormsHideDialogFlag"
|
|
title="隐藏条件"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
:show-close="false"
|
|
style="margin-top: 70px; min-height: 500px"
|
|
width="50%"
|
|
>
|
|
<template v-if="controlData.type == 'associatedForms'">
|
|
<div class="common-layout">
|
|
<el-container>
|
|
<el-aside
|
|
width="300px"
|
|
style="height: 420px; border: 1px solid gainsboro; margin-right: 5px"
|
|
>
|
|
<!-- <el-input
|
|
v-show="fieldTreeSearchFlag"
|
|
v-model="fieldTreeFilterText"
|
|
style="width:98%;margin: 3px;"
|
|
placeholder="搜索字段"
|
|
class="filter-tree"
|
|
/> -->
|
|
<el-tree
|
|
ref="fieldTreeRef"
|
|
node-key="id"
|
|
empty-text="请先保存当前表单"
|
|
:data="associatedFormsCurrentFormFieldTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
@node-expand="handleFieldTreeExpand"
|
|
@node-collapse="handleFieldTreeCollapse"
|
|
@node-contextmenu="handleFieldTreeContextmenu"
|
|
/>
|
|
<!-- <el-input
|
|
v-show="orgTreeSearchFlag"
|
|
v-model="orgTreeFilterText"
|
|
style="width:98%;margin: 3px;"
|
|
placeholder="搜索字段"
|
|
class="filter-tree"
|
|
/> -->
|
|
<el-tree
|
|
ref="orgTreeRef"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
:data="orgAndManTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
@node-expand="handleOrgTreeExpand"
|
|
@node-collapse="handleOrgTreeCollapse"
|
|
@node-contextmenu="handleOrgTreeContextmenu"
|
|
/>
|
|
<!-- <el-input
|
|
v-show="roleTreeSearchFlag"
|
|
v-model="roleTreeFilterText"
|
|
style="width:98%;margin: 3px;"
|
|
placeholder="搜索字段"
|
|
class="filter-tree"
|
|
/> -->
|
|
<el-tree
|
|
ref="roleTreeRef"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
:data="roleTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
@node-expand="handleRoleTreeExpand"
|
|
@node-collapse="handleRoleTreeCollapse"
|
|
@node-contextmenu="handleRoleTreeContextmenu"
|
|
/>
|
|
</el-aside>
|
|
<el-main
|
|
style="border: 1px solid gainsboro; padding: 3px"
|
|
class="associatedFormsHideDialogMain"
|
|
>
|
|
<div
|
|
style="
|
|
border: 1px solid gainsboro;
|
|
height: 7%;
|
|
border-bottom: 0px;
|
|
padding-top: 3px;
|
|
padding-left: 5px;
|
|
background-color: #e6f3fe;
|
|
"
|
|
>
|
|
当满足以下条件时此控件隐藏
|
|
</div>
|
|
<div
|
|
id="associatedFormsHideEditArea"
|
|
style="border: 1px solid gainsboro; height: 38%; border-bottom: 0px"
|
|
>
|
|
<AssociatedFormsTinyace
|
|
ref="aft"
|
|
:aft-text="controlData.control.hideConditionHtml"
|
|
:aft-text-copy="controlData.control.hideConditionHtmlCopy"
|
|
@text-change="aftTextChanged"
|
|
@gongshi-change="aftGongshiChanged"
|
|
></AssociatedFormsTinyace>
|
|
<!-- <div style="border: 1px solid #4189EF;width:90px;height:26px;border-radius: 3px;padding:2px;text-align: center;cursor:pointer;float: right;margin-top: -32px;margin-right: 5px;z-index:99999999;position: relative;">
|
|
<span style="color: #4189EF;font:6px;margin-right: 5px;">fx</span>插入函数
|
|
</div> -->
|
|
</div>
|
|
<div style="border: 1px solid gainsboro; height: 55%; padding-top: 20px">
|
|
<ul>
|
|
<li>请从左侧面板<span style="color: red">右击</span>选择字段或选项</li>
|
|
<li>
|
|
支持的符号：<span style="color: red"
|
|
>'==', '>=', '>', '<=', '<', '!='</span
|
|
>
|
|
</li>
|
|
<li>
|
|
支持<span style="color: red">"包含,不包含,当前用户"</span
|
|
>关键字,用于组织机构条件和角色条件
|
|
</li>
|
|
<li>参考举例：</li>
|
|
<span style="margin-left: 14px">年龄>10</span
|
|
><br />
|
|
<span style="margin-left: 14px">企管部包含当前用户</span
|
|
><br />
|
|
<span style="margin-left: 14px">绩效考核执行人包含当前用户</span
|
|
><br />
|
|
<span style="margin-left: 14px">张三!=当前用户</span>
|
|
</ul>
|
|
</div>
|
|
</el-main>
|
|
</el-container>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button @click="asfhTextCancel">取消</el-button>
|
|
<el-button type="primary" @click="handleDetermine"> 确定 </el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<!-- 数据范围编辑弹窗 -->
|
|
|
|
<el-dialog
|
|
v-model="associatedFormsDataRangeDialogFlag"
|
|
title="数据范围"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
:show-close="false"
|
|
style="margin-top: 70px; min-height: 500px"
|
|
width="50%"
|
|
>
|
|
<template v-if="controlData.type == 'associatedForms'">
|
|
<div class="common-layout">
|
|
<el-container>
|
|
<el-aside
|
|
width="300px"
|
|
style="height: 420px; border: 1px solid gainsboro; margin-right: 5px"
|
|
>
|
|
<el-tree
|
|
ref="fieldTreeRef"
|
|
node-key="id"
|
|
empty-text="选择关联的表单后展示"
|
|
:data="asfasfFieldTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
@node-expand="handleFieldTreeExpand"
|
|
@node-collapse="handleFieldTreeCollapse"
|
|
@node-contextmenu="handleFieldTreeContextmenuRange"
|
|
/>
|
|
<!-- <el-input
|
|
v-show="fieldTreeSearchFlag"
|
|
v-model="fieldTreeFilterText"
|
|
style="width:98%;margin: 3px;"
|
|
placeholder="搜索字段"
|
|
class="filter-tree"
|
|
/> -->
|
|
<el-tree
|
|
ref="fieldTreeRef"
|
|
node-key="id"
|
|
empty-text="请先保存当前表单"
|
|
:data="associatedFormsCurrentFormFieldTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
@node-expand="handleFieldTreeExpand"
|
|
@node-collapse="handleFieldTreeCollapse"
|
|
@node-contextmenu="handleFieldTreeContextmenuRange"
|
|
/>
|
|
<!-- <el-input
|
|
v-show="orgTreeSearchFlag"
|
|
v-model="orgTreeFilterText"
|
|
style="width:98%;margin: 3px;"
|
|
placeholder="搜索字段"
|
|
class="filter-tree"
|
|
/> -->
|
|
<el-tree
|
|
ref="orgTreeRef"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
:data="orgAndManTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
@node-expand="handleOrgTreeExpand"
|
|
@node-collapse="handleOrgTreeCollapse"
|
|
@node-contextmenu="handleOrgTreeContextmenuRange"
|
|
/>
|
|
<!-- <el-input
|
|
v-show="roleTreeSearchFlag"
|
|
v-model="roleTreeFilterText"
|
|
style="width:98%;margin: 3px;"
|
|
placeholder="搜索字段"
|
|
class="filter-tree"
|
|
/> -->
|
|
<el-tree
|
|
ref="roleTreeRef"
|
|
style="max-width: 600px; border: 1px solid gainsboro; margin: 3px"
|
|
:data="roleTree"
|
|
:props="treeDefaultProps"
|
|
:filter-node-method="filterNode"
|
|
@node-expand="handleRoleTreeExpand"
|
|
@node-collapse="handleRoleTreeCollapse"
|
|
@node-contextmenu="handleRoleTreeContextmenuRange"
|
|
/>
|
|
</el-aside>
|
|
<el-main
|
|
style="border: 1px solid gainsboro; padding: 3px"
|
|
class="associatedFormsHideDialogMain"
|
|
>
|
|
<div
|
|
style="
|
|
border: 1px solid gainsboro;
|
|
height: 7%;
|
|
border-bottom: 0px;
|
|
padding-top: 3px;
|
|
padding-left: 5px;
|
|
background-color: #e6f3fe;
|
|
"
|
|
>
|
|
仅可选择符合以下条件的数据
|
|
</div>
|
|
<div
|
|
id="associatedFormsHideEditArea"
|
|
style="border: 1px solid gainsboro; height: 38%; border-bottom: 0px"
|
|
>
|
|
<AssociatedFormsTinyaceRange
|
|
ref="aftRange"
|
|
:aft-text="controlData.control.dataRangeConditionHtml"
|
|
:aft-text-copy="controlData.control.dataRangeConditionHtmlCopy"
|
|
:current-form="props.customerformid"
|
|
@text-change="aftTextChangedRange"
|
|
@gongshi-change="aftGongshiChangedRange"
|
|
></AssociatedFormsTinyaceRange>
|
|
<!-- <div style="border: 1px solid #4189EF;width:90px;height:26px;border-radius: 3px;padding:2px;text-align: center;cursor:pointer;float: right;margin-top: -32px;margin-right: 5px;z-index:99999999;position: relative;">
|
|
<span style="color: #4189EF;font:6px;margin-right: 5px;">fx</span>插入函数
|
|
</div> -->
|
|
</div>
|
|
<div style="border: 1px solid gainsboro; height: 55%; padding-top: 20px">
|
|
<ul>
|
|
<li>请从左侧面板<span style="color: red">右击</span>选择字段或选项</li>
|
|
<li>
|
|
支持的符号：<span style="color: red"
|
|
>'==', '>=', '>', '<=', '<', '!='</span
|
|
>
|
|
</li>
|
|
<li>
|
|
支持<span style="color: red">"包含,不包含,数据拥有者,数据所属部门"</span
|
|
>关键字,用于组织机构条件,角色条件,==运算符和!=运算符
|
|
</li>
|
|
<li>参考举例：</li>
|
|
<span style="margin-left: 14px">年龄>10</span
|
|
><br />
|
|
<span style="margin-left: 14px">企管部==数据所属部门</span
|
|
><br />
|
|
<span style="margin-left: 14px">绩效考核执行人包含数据拥有者</span
|
|
><br />
|
|
<span style="margin-left: 14px">生产部包含数据所属部门</span>
|
|
</ul>
|
|
</div>
|
|
</el-main>
|
|
</el-container>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button @click="asfhTextCancelRange">取消</el-button>
|
|
<el-button type="primary" @click="handleDetermineRange"> 确定 </el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<!-- 数据填充规则弹窗 -->
|
|
<el-dialog
|
|
v-model="associatedFormsFillRolesDialogFlag"
|
|
title="数据填充规则"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
:show-close="false"
|
|
style="margin-top: 70px; min-height: 300px; max-height: 900px"
|
|
width="60%"
|
|
>
|
|
<template v-if="controlData.type == 'associatedForms'">
|
|
<el-button
|
|
style="font-size: large; margin-top: 10px; margin-bottom: 15px"
|
|
type="primary"
|
|
link
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="addFillRole"
|
|
>十 主表填充规则</el-button
|
|
>
|
|
<div style="max-height: 230px; border: 1px solid white; overflow-y: auto">
|
|
<div
|
|
style="
|
|
background-color: #f0f0f0;
|
|
padding: 12px;
|
|
border-radius: 5px;
|
|
padding-left: 45px;
|
|
padding-bottom: 10px;
|
|
margin-right: 10px;
|
|
"
|
|
>
|
|
<!-- #F5F7FA #E6F3FE #F0F0F0 #F5F7FA-->
|
|
<template
|
|
v-for="(item, index) in controlData.control.fillRoles.master"
|
|
:key="controlData.control.fillRoles.master[index].id"
|
|
>
|
|
<AssociatedFormsFillRole
|
|
v-if="showAssociatedFormsFillRole"
|
|
v-model:left-value="controlData.control.fillRoles.master[index].leftValue"
|
|
v-model:right-value="controlData.control.fillRoles.master[index].rightValue"
|
|
:left-tree-source="asfasfMasterFieldTree"
|
|
:right-tree-source="associatedFormsCurrentFormFieldTree1"
|
|
:current-key="controlData.control.fillRoles.master[index].id"
|
|
@del-role="delRole"
|
|
@child-role-right-changed="childRoleRightChanged"
|
|
>
|
|
</AssociatedFormsFillRole
|
|
><!-- -->
|
|
</template>
|
|
</div>
|
|
</div>
|
|
<el-popover
|
|
v-if="currentChildTableCount > 0"
|
|
placement="right-start"
|
|
title=""
|
|
:width="200"
|
|
trigger="hover"
|
|
content="【关联表单子表字段】暂不支持填充至【当前表单主表字段】"
|
|
>
|
|
<template #reference>
|
|
<el-button
|
|
style="font-size: large; margin-top: 23px; margin-bottom: 15px"
|
|
type="primary"
|
|
link
|
|
append-to-body="true"
|
|
modal="true"
|
|
@click="addChildFillRole"
|
|
>十 子表填充规则</el-button
|
|
>
|
|
</template>
|
|
</el-popover>
|
|
<div
|
|
v-if="currentChildTableCount > 0"
|
|
style="max-height: 330px; overflow-y: auto; padding-top: 7px"
|
|
>
|
|
<template
|
|
v-for="(item, index) in controlData.control.fillRoles.child"
|
|
:key="controlData.control.fillRoles.child[index].id"
|
|
>
|
|
<AssociatedFormsChildFillRole
|
|
v-model:selected-child-table="
|
|
controlData.control.fillRoles.child[index].asfChildTableKey
|
|
"
|
|
v-model:filter-condition="
|
|
controlData.control.fillRoles.child[index].filterCondition
|
|
"
|
|
v-model:child-roles="controlData.control.fillRoles.child[index].childRoles"
|
|
:child-table-list="asfasfChildTableList"
|
|
:asfasf-field-tree="asfasfFieldTree"
|
|
:tree-default-props="treeDefaultProps"
|
|
:filter-node="filterNode"
|
|
:org-and-man-tree="orgAndManTree"
|
|
:handle-org-tree-contextmenu-range="handleOrgTreeContextmenuRange"
|
|
:role-tree="roleTree"
|
|
:handle-role-tree-contextmenu-range="handleRoleTreeContextmenuRange"
|
|
:associated-forms-current-form-field-tree="
|
|
associatedFormsCurrentFormFieldTree
|
|
"
|
|
:asfasf-child-table-fields="asfasfChildTableFields"
|
|
:current-key="controlData.control.fillRoles.child[index].id"
|
|
:current-form-child-table-fields-for-fill-role="
|
|
currentFormChildTableFieldsForFillRole
|
|
"
|
|
@selected-or-del-child-role="selectedOrDelChildRole"
|
|
@child-role-right-changed="childRoleRightChanged"
|
|
@del-role="delChildRole"
|
|
>
|
|
</AssociatedFormsChildFillRole>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<!-- <el-button @click="asfhTextCancelFillRoles">取消</el-button> -->
|
|
<el-button type="primary" @click="handleDetermineFillRoles"> 确定 </el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<!-- 关联表单设置弹窗 liwenxuan 20240402 end -->
|
|
|
|
<!-- 关联选项设置弹窗 liwenxuan 20240426 start -->
|
|
<!-- :title="`关联选项设置--`+controlData.item.label+`--`+controlData.name" -->
|
|
<el-dialog
|
|
v-model="glxxszDialogFlag"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
:title="`关联选项设置--` + controlData.name"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<template
|
|
v-if="
|
|
(controlData.type == 'radio' || controlData.type == 'select') &&
|
|
controlData.config.optionsType == 0 &&
|
|
!controlData.control.multiple
|
|
"
|
|
>
|
|
<el-table
|
|
:data="controlData.options"
|
|
stripe
|
|
border
|
|
style="width: 100%; min-height: 50px; max-height: 500px; overflow-y: auto"
|
|
:cell-style="{ height: '55px', paddingLeft: '15px' }"
|
|
:header-cell-style="{ background: '#F3F4F7', color: '#555' }"
|
|
>
|
|
<el-table-column prop="link" label="当选项为" width="220">
|
|
<template #default="optionScope">
|
|
<span
|
|
style="
|
|
background-color: #e8eaee;
|
|
border-radius: 8px;
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
padding-left: 15px;
|
|
padding-right: 15px;
|
|
"
|
|
>{{ optionScope.row.label }}</span
|
|
>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column fixed="right" label="显示以下组件">
|
|
<template #default="fieldScope">
|
|
<el-tree-select
|
|
v-model="controlData.control.glxxsz[fieldScope.$index].showFields"
|
|
style="width: 100%"
|
|
:data="associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf[0].children"
|
|
multiple
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</template>
|
|
|
|
<template
|
|
v-if="
|
|
controlData.type == 'select' &&
|
|
controlData.config.optionsType == 0 &&
|
|
controlData.control.multiple
|
|
"
|
|
>
|
|
<el-table
|
|
:data="controlData.control.glxxsz"
|
|
stripe
|
|
border
|
|
style="width: 100%; min-height: 50px; max-height: 500px; overflow-y: auto"
|
|
:cell-style="{ height: '55px', paddingLeft: '15px' }"
|
|
:header-cell-style="{ background: '#F3F4F7', color: '#555' }"
|
|
>
|
|
<el-table-column prop="link" label="当选项为" width="300">
|
|
<template #default="optionScope">
|
|
<el-tree-select
|
|
v-model="controlData.control.glxxsz[optionScope.$index].selectedOptions"
|
|
style="width: 100%"
|
|
:data="controlData.options"
|
|
multiple
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column fixed="right" label="显示以下组件">
|
|
<template #default="fieldScope">
|
|
<el-tree-select
|
|
v-model="controlData.control.glxxsz[fieldScope.$index].showFields"
|
|
style="width: 100%"
|
|
:data="associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf[0].children"
|
|
multiple
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column fixed="right" label="操作" width="130">
|
|
<template #default="operateScope">
|
|
<el-button
|
|
type="danger"
|
|
:icon="Delete"
|
|
circle
|
|
@click="deleteRowForGlxxsz1(operateScope.row)"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-button
|
|
plain
|
|
type="success"
|
|
style="margin-top: 10px"
|
|
@click="createRowForGlxxsz1"
|
|
>新增</el-button
|
|
>
|
|
</template>
|
|
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="handleDetermineGlxxszDialog"> 确定 </el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<el-dialog
|
|
v-model="glxxszDialogFlagCheckBox"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
:title="`关联选项设置--` + controlData.name"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<template v-if="controlData.type == 'checkbox'">
|
|
<el-table
|
|
:data="controlData.control.glxxszForCheckBox"
|
|
stripe
|
|
border
|
|
style="width: 100%; min-height: 50px; max-height: 500px; overflow-y: auto"
|
|
:cell-style="{ height: '55px', paddingLeft: '15px' }"
|
|
:header-cell-style="{ background: '#F3F4F7', color: '#555' }"
|
|
>
|
|
<el-table-column prop="link" label="当选项为" width="300">
|
|
<template #default="optionScope">
|
|
<el-tree-select
|
|
v-model="
|
|
controlData.control.glxxszForCheckBox[optionScope.$index].selectedOptions
|
|
"
|
|
style="width: 100%"
|
|
:data="controlData.options"
|
|
multiple
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column fixed="right" label="显示以下组件">
|
|
<template #default="fieldScope">
|
|
<el-tree-select
|
|
v-model="
|
|
controlData.control.glxxszForCheckBox[fieldScope.$index].showFields
|
|
"
|
|
style="width: 100%"
|
|
:data="associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf[0].children"
|
|
multiple
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column fixed="right" label="操作" width="130">
|
|
<template #default="operateScope">
|
|
<el-button
|
|
type="danger"
|
|
:icon="Delete"
|
|
circle
|
|
@click="deleteRowForGlxxsz(operateScope.row)"
|
|
/>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-button plain type="success" style="margin-top: 10px" @click="createRowForGlxxsz"
|
|
>新增</el-button
|
|
>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="handleDetermineGlxxszDialogCheckBox">
|
|
确定
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<el-dialog
|
|
v-model="glxxszDialogFlagSwitch"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
:title="`关联选项设置--` + controlData.name"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<template v-if="controlData.type == 'switch'">
|
|
<div style="display: flex; margin-bottom: 20px; margin-top: 20px;width: 100%;">
|
|
<span style="font-size: larger; margin-left: 35px; margin-right: 15px"
|
|
>当开关打开时显示</span
|
|
>
|
|
<el-tree-select
|
|
v-model="controlData.control.glxxszSwitch[0].showFields"
|
|
style="width: 60%"
|
|
:data="associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf[0].children"
|
|
multiple
|
|
/>
|
|
</div>
|
|
<div style="display: flex;width: 100%;">
|
|
<span style="font-size: larger; margin-left: 35px; margin-right: 15px"
|
|
>当开关关闭时显示</span
|
|
>
|
|
<el-tree-select
|
|
v-model="controlData.control.glxxszSwitch[1].showFields"
|
|
style="width: 60%"
|
|
:data="associatedFormsCurrentFormFieldTreeForGlxxszExceptSelf[0].children"
|
|
multiple
|
|
/>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="handleDetermineGlxxszDialogSwitch">
|
|
确定
|
|
</el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
|
|
<!-- 关联选项设置弹窗 liwenxuan 20240426 end -->
|
|
|
|
<!-- 单选下拉多选选项来源value3--系统表单字段 start-->
|
|
|
|
<el-dialog
|
|
v-model="optionsValue3SettingDialogOpenFlag"
|
|
class="glxxsztc"
|
|
top="150px"
|
|
:close-on-click-modal="false"
|
|
title="选择表单字段"
|
|
:show-close="false"
|
|
style="margin-top: 70px"
|
|
width="50%"
|
|
>
|
|
<template
|
|
v-if="
|
|
controlData.type == 'radio' ||
|
|
controlData.type == 'select' ||
|
|
controlData.type == 'checkbox'
|
|
"
|
|
>
|
|
<div style="display: flex; margin-bottom: 20px; margin-top: 20px">
|
|
<span style="font-size: larger; margin-left: 35px; margin-right: 15px"
|
|
>请选择表单</span
|
|
>
|
|
<el-tree-select
|
|
v-model="controlData.control.optionsValue3Formid"
|
|
style="width: 390px"
|
|
:data="customerFormTree[0].children"
|
|
check-strictly
|
|
:render-after-expand="false"
|
|
filterable
|
|
node-key="id"
|
|
@change="formidChangedOptionsValue3"
|
|
/>
|
|
</div>
|
|
<div
|
|
style="display: flex"
|
|
v-if="
|
|
typeof controlData.control.optionsValue3Formid != 'undefined' &&
|
|
typeof asfasfFieldTreeOptionsValue3 != 'undefined' &&
|
|
controlData.control.optionsValue3Formid != ''
|
|
"
|
|
>
|
|
<span style="font-size: larger; margin-left: 35px; margin-right: 15px"
|
|
>请选择字段</span
|
|
>
|
|
<!--
|
|
|
|
|
|
-->
|
|
<el-tree-select
|
|
v-model="controlData.control.optionsValue3Field"
|
|
style="width: 390px"
|
|
:data="asfasfFieldTreeOptionsValue3[0].children"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<template #footer>
|
|
<div class="dialog-footer">
|
|
<el-button type="primary" @click="handleDetermineoptionsValue3"> 确定 </el-button>
|
|
</div>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
<style lang="scss" scoped>
|
|
li::before {
|
|
content: "";
|
|
display: inline-block;
|
|
width: 4px;
|
|
height: 4px;
|
|
border-radius: 50%;
|
|
background-color: gray;
|
|
margin-right: 5px;
|
|
margin-left: 5px;
|
|
margin-bottom: 3.5px;
|
|
}
|
|
|
|
.sidebar-tools .el-tabs__content {
|
|
padding: 0;
|
|
}
|
|
.el-collapse-item__header {
|
|
padding-left: 10px;
|
|
background-color: rgb(229, 229, 229);
|
|
}
|
|
.el-collapse-item__header {
|
|
padding-left: 10px;
|
|
background-color: rgb(229, 229, 229);
|
|
}
|
|
|
|
.form_cont {
|
|
padding: 0 10px;
|
|
.radioInput {
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
.avatar-uploader {
|
|
width: 100px;
|
|
height: 100px;
|
|
.avatar {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
.avatar-uploader-icon {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
}
|
|
.custom-tree-node {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 14px;
|
|
padding-right: 8px;
|
|
}
|
|
.custom-tree-node:hover {
|
|
background-color: antiquewhite;
|
|
}
|
|
|
|
.associatedFormsHideDialogMain7 {
|
|
display: flex;
|
|
}
|
|
.el-main {
|
|
--el-main-padding: 5px;
|
|
}
|
|
.jiaoYan {
|
|
.el-input-group__append,
|
|
.el-input-group__prepend {
|
|
padding: 0 5px;
|
|
}
|
|
}
|
|
.contentBetween {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.common-layout {
|
|
width: 100%;
|
|
height: calc(100vh - 170px);
|
|
:deep .el-header {
|
|
padding: 0px;
|
|
}
|
|
:deep .el-main {
|
|
padding: 10px;
|
|
}
|
|
|
|
.asideBox {
|
|
height: calc(100vh - 170px);
|
|
}
|
|
.aiButs {
|
|
width: 94%;
|
|
margin-left: 3%;
|
|
}
|
|
.contBox {
|
|
border-right: 1px solid #ccc;
|
|
}
|
|
.titleBox {
|
|
width: 100%;
|
|
height: 40px;
|
|
border-bottom: 1px solid #ccc;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.rowBox {
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
}
|
|
.aiBox {
|
|
width: 100%;
|
|
|
|
height: calc(100vh - 170px);
|
|
.aiBut {
|
|
width: 94%;
|
|
margin-bottom: 15px;
|
|
margin-left: 3%;
|
|
}
|
|
:deep .el-card__header {
|
|
padding: 5px 10px;
|
|
border: 0;
|
|
i {
|
|
color: #ff0000;
|
|
}
|
|
}
|
|
:deep .el-card__body {
|
|
padding: 0px 10px 10px 10px;
|
|
}
|
|
}
|
|
.aiCardBox {
|
|
width: 94%;
|
|
margin-top: 15px;
|
|
margin-bottom: 15px;
|
|
margin-left: 3%;
|
|
}
|
|
.card-header {
|
|
text-align: right;
|
|
}
|
|
</style>
|
|
|