Commit 12b5f28f authored by tianhongyang's avatar tianhongyang

fix

parent 5738efe0
......@@ -99,3 +99,15 @@ export const updateCustomFormDataApi = (data) => request({
method: "post",
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 = [
formAttribute: {
// 验证规则
rules: {},
designRules: {},
// 是否必填
required: false,
// 字段名称
......@@ -65,7 +64,6 @@ export const defaultComOptions = [
formAttribute: {
// 验证规则
rules: {},
designRules: {},
// 是否必填
required: false,
// 字段名称
......@@ -100,7 +98,6 @@ export const defaultComOptions = [
message: "请输入选项值",
trigger: ["change", "blur"]
},
designRules: {},
// 是否必填
required: false,
// 字段名称
......@@ -134,7 +131,6 @@ export const defaultComOptions = [
formAttribute: {
// 验证规则
rules: {},
designRules: {},
// 是否必填
required: false,
// 字段名称
......@@ -187,16 +183,6 @@ export const defaultComOptions = [
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,
// 字段名称
......@@ -229,23 +215,13 @@ export const defaultComOptions = [
rules: {
trigger: ["blur"],
validator: (rule, value, callback) => {
console.log("value", value);
// console.log("value", value);
if (value && !validEmail(value)) {
return callback(new Error(`请输入正确的电子邮箱`));
}
return callback();
}
},
designRules: {
trigger: ["blur"],
validator: (rule, value, callback) => {
console.log("value", value);
if (value && !validEmail(value)) {
return callback(`请输入正确的电子邮箱`);
}
return callback();
}
},
requiredRules: {
trigger: ["blur"],
validator: (rule, value, callback) => {
......
......@@ -293,6 +293,7 @@ export default {
}
.el-form-item__content {
line-height: 32px;
.el-input {
.el-input__inner {
height: 32px;
......@@ -301,6 +302,10 @@ export default {
color: #232323;
}
}
.el-input__suffix {
display: flex;
align-items: center;
}
}
/* 下拉框样式重置 */
......
<template>
<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">
<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">
<!-- 单行文本类型 -->
<el-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder" clearable
......@@ -27,7 +28,7 @@
<dsk-email-input v-model="comChildModuleInfo.componentAttribute.value" :placeholder="comChildModuleInfo.componentAttribute.placeholder"
: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>
<img src="@/assets/images/consultingAgencyManagement/customForm/icon_delete@2x.png" alt="" class="remove-subfield-item-icon"
......@@ -38,10 +39,12 @@
import { cloneDeep } from "lodash-es";
import Schema from "async-validator";
import DskEmailInput from "@/components/DskEmailInput";
import DskPhotoInput from "@/components/DskPhotoInput";
export default {
name: "subfieldItem",
components: {
DskEmailInput
DskEmailInput,
DskPhotoInput
},
props: {
childModuleInfo: Object,
......@@ -128,13 +131,14 @@ export default {
try {
const { formAttribute, componentAttribute } = item;
const validator = new Schema({
value: formAttribute.designRules
value: formAttribute.rules
});
console.log(validator);
const flag = await validator.validate({ value: componentAttribute.value }, { first: true });
console.log(flag);
if (flag) {
this.$set(this.comChildModuleInfo.formAttribute, "isError", false);
}
} catch (error) {
console.log(error);
this.$set(this.comChildModuleInfo.formAttribute, "isError", true);
}
},
// 根据命中的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