Commit 12b5f28f authored by tianhongyang's avatar tianhongyang

fix

parent 5738efe0
...@@ -99,3 +99,15 @@ export const updateCustomFormDataApi = (data) => request({ ...@@ -99,3 +99,15 @@ export const updateCustomFormDataApi = (data) => request({
method: "post", method: "post",
data data
}); });
/**
* oss文件上传地址
* @param {*} data
* @returns
*/
export const uploadFileToOssApi = (data) => request({
url: "/system/oss/upload",
method: "post",
data
});
<template>
<div class="dsk-photo-input-container">
<el-badge :value="0" class="item" type="primary">
<div class="dsk-photo-input-inner" @click.stop="uploadFile">
<i class="el-icon-plus"></i>
<span>上传图片</span>
</div>
</el-badge>
<el-upload :on-change="handleChange" action="#" :accept="allowTypes.join(',')" :auto-upload="false" :show-file-list="false" :limit="limit"
ref="elUploadDskUploadIns" class="el-upload-dsk-upload-ins"></el-upload>
</div>
</template>
<script>
import { uploadFileToOssApi } from "@/api/consultingOrgManagement";
export default {
name: "dskPhotoInput",
props: {
limit: {
type: [String, Number],
default: 1
}
},
data() {
return {
allowTypes: [".jpg", ".png", ".svg", ".gif", ".jpeg"],
comFileList: []
};
},
//可访问data属性
created() {
},
//计算集
computed: {
},
//方法集
methods: {
async handleChange(file, fileList) {
try {
/**
* @type {string}
*/
let fileName = file.name;
let fileType = "";
const index = fileName.lastIndexOf(".");
if (index) fileType = fileName.slice(index);
if (!this.allowTypes.includes(fileType.toLowerCase())) {
return this.$message.warning(`只支持上传${this.allowTypes.join(" , ")}类型图片`);
}
// 验证通过进行上传
const result = this.uploadHandle(file.raw, fileType);
} catch (error) {
}
},
uploadFile() {
this.$refs["elUploadDskUploadIns"].$el.querySelector(".el-upload__input").click();
},
async uploadHandle(file, fileType) {
try {
const formData = new FormData();
formData.append("file", file);
const result = await uploadFileToOssApi(formData);
if (result.code == 200 && result.data) {
this.comFileList.push({
url: result.data.url,
type: fileType,
fileName: ""
});
}
} catch (error) {
}
}
},
}
</script>
<style lang="scss" scoped>
.dsk-photo-input-container {
width: 100%;
height: 32px;
.dsk-photo-input-inner {
width: 106px;
height: 32px;
background: #ffffff;
border: 1px solid #dcdfe6;
display: flex;
align-items: center;
justify-content: center;
padding: 0px 16px;
box-sizing: border-box;
color: rgba(35, 35, 35, 0.8);
font-size: 14px;
font-weight: 400;
cursor: pointer;
&:hover {
color: #0081ff;
border-color: #0081ff;
}
}
::v-deep .el-upload-dsk-upload-ins {
width: 0px;
height: 0px;
opacity: 0;
position: relative;
z-index: -999;
}
}
</style>
...@@ -34,7 +34,6 @@ export const defaultComOptions = [ ...@@ -34,7 +34,6 @@ export const defaultComOptions = [
formAttribute: { formAttribute: {
// 验证规则 // 验证规则
rules: {}, rules: {},
designRules: {},
// 是否必填 // 是否必填
required: false, required: false,
// 字段名称 // 字段名称
...@@ -65,7 +64,6 @@ export const defaultComOptions = [ ...@@ -65,7 +64,6 @@ export const defaultComOptions = [
formAttribute: { formAttribute: {
// 验证规则 // 验证规则
rules: {}, rules: {},
designRules: {},
// 是否必填 // 是否必填
required: false, required: false,
// 字段名称 // 字段名称
...@@ -100,7 +98,6 @@ export const defaultComOptions = [ ...@@ -100,7 +98,6 @@ export const defaultComOptions = [
message: "请输入选项值", message: "请输入选项值",
trigger: ["change", "blur"] trigger: ["change", "blur"]
}, },
designRules: {},
// 是否必填 // 是否必填
required: false, required: false,
// 字段名称 // 字段名称
...@@ -134,7 +131,6 @@ export const defaultComOptions = [ ...@@ -134,7 +131,6 @@ export const defaultComOptions = [
formAttribute: { formAttribute: {
// 验证规则 // 验证规则
rules: {}, rules: {},
designRules: {},
// 是否必填 // 是否必填
required: false, required: false,
// 字段名称 // 字段名称
...@@ -187,16 +183,6 @@ export const defaultComOptions = [ ...@@ -187,16 +183,6 @@ export const defaultComOptions = [
return callback(); return callback();
} }
}, },
designRules: {
trigger: ["blur"],
validator: (rule, value, callback) => {
const phoneReg = /^1[3-9]\d{9}$/;
if (value && !phoneReg.test(value)) {
return callback(`请输入正确的联系电话`);
}
return callback();
}
},
// 是否必填 // 是否必填
required: false, required: false,
// 字段名称 // 字段名称
...@@ -229,23 +215,13 @@ export const defaultComOptions = [ ...@@ -229,23 +215,13 @@ export const defaultComOptions = [
rules: { rules: {
trigger: ["blur"], trigger: ["blur"],
validator: (rule, value, callback) => { validator: (rule, value, callback) => {
console.log("value", value); // console.log("value", value);
if (value && !validEmail(value)) { if (value && !validEmail(value)) {
return callback(new Error(`请输入正确的电子邮箱`)); return callback(new Error(`请输入正确的电子邮箱`));
} }
return callback(); return callback();
} }
}, },
designRules: {
trigger: ["blur"],
validator: (rule, value, callback) => {
console.log("value", value);
if (value && !validEmail(value)) {
return callback(`请输入正确的电子邮箱`);
}
return callback();
}
},
requiredRules: { requiredRules: {
trigger: ["blur"], trigger: ["blur"],
validator: (rule, value, callback) => { validator: (rule, value, callback) => {
......
...@@ -293,6 +293,7 @@ export default { ...@@ -293,6 +293,7 @@ export default {
} }
.el-form-item__content { .el-form-item__content {
line-height: 32px;
.el-input { .el-input {
.el-input__inner { .el-input__inner {
height: 32px; height: 32px;
...@@ -301,6 +302,10 @@ export default { ...@@ -301,6 +302,10 @@ export default {
color: #232323; color: #232323;
} }
} }
.el-input__suffix {
display: flex;
align-items: center;
}
} }
/* 下拉框样式重置 */ /* 下拉框样式重置 */
......
<template> <template>
<div class="subfield-item-container" :class="classCreate(comChildModuleInfo.comType)" :style="styles" @click="activeSubfieldItem"> <div class="subfield-item-container" :class="classCreate(comChildModuleInfo.comType)" :style="styles" @click="activeSubfieldItem">
<img src="@/assets/images/consultingAgencyManagement/customForm/icon_drag@2x.png" alt="" class="subfield-module-item-dragg-target-icon"> <img src="@/assets/images/consultingAgencyManagement/customForm/icon_drag@2x.png" alt="" class="subfield-module-item-dragg-target-icon">
<el-form-item class="subfield-module-form-item" :class="{'is-required': comChildModuleInfo.formAttribute.required}" <el-form-item class="subfield-module-form-item"
:class="{'is-required': comChildModuleInfo.formAttribute.required,'is-error' : comChildModuleInfo.formAttribute.isError}"
:label="comChildModuleInfo.formAttribute.label" :prop="propValue"> :label="comChildModuleInfo.formAttribute.label" :prop="propValue">
<!-- 单行文本类型 --> <!-- 单行文本类型 -->
<el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable <el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable
...@@ -27,7 +28,7 @@ ...@@ -27,7 +28,7 @@
<dsk-email-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" <dsk-email-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder"
:clearable="true" :disabled="isDisabled" v-if="comChildModuleInfo.comType == 'email'"></dsk-email-input> :clearable="true" :disabled="isDisabled" v-if="comChildModuleInfo.comType == 'email'"></dsk-email-input>
<!-- 图片类型 --> <!-- 图片类型 -->
<dsk-photo-input v-if="comChildModuleInfo.comType == 'photo'"></dsk-photo-input>
</el-form-item> </el-form-item>
<img src="@/assets/images/consultingAgencyManagement/customForm/icon_delete@2x.png" alt="" class="remove-subfield-item-icon" <img src="@/assets/images/consultingAgencyManagement/customForm/icon_delete@2x.png" alt="" class="remove-subfield-item-icon"
...@@ -38,10 +39,12 @@ ...@@ -38,10 +39,12 @@
import { cloneDeep } from "lodash-es"; import { cloneDeep } from "lodash-es";
import Schema from "async-validator"; import Schema from "async-validator";
import DskEmailInput from "@/components/DskEmailInput"; import DskEmailInput from "@/components/DskEmailInput";
import DskPhotoInput from "@/components/DskPhotoInput";
export default { export default {
name: "subfieldItem", name: "subfieldItem",
components: { components: {
DskEmailInput DskEmailInput,
DskPhotoInput
}, },
props: { props: {
childModuleInfo: Object, childModuleInfo: Object,
...@@ -128,13 +131,14 @@ export default { ...@@ -128,13 +131,14 @@ export default {
try { try {
const { formAttribute, componentAttribute } = item; const { formAttribute, componentAttribute } = item;
const validator = new Schema({ const validator = new Schema({
value: formAttribute.designRules value: formAttribute.rules
}); });
console.log(validator);
const flag = await validator.validate({ value: componentAttribute.value }, { first: true }); const flag = await validator.validate({ value: componentAttribute.value }, { first: true });
console.log(flag); if (flag) {
this.$set(this.comChildModuleInfo.formAttribute, "isError", false);
}
} catch (error) { } catch (error) {
console.log(error); this.$set(this.comChildModuleInfo.formAttribute, "isError", true);
} }
}, },
// 根据命中的id 来添加发布订阅 // 根据命中的id 来添加发布订阅
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment