Skip to content

E
enterprise-platform
Commit afaac2d9 authored by 姬鋆屾's avatar 姬鋆屾
Browse files
Options

pref:提交产品模块所修改内容，轮播图改为多图上传，富文本等修改

parent 790d23a8
Hide whitespace changes
Inline Side-by-side
Showing with 1332 additions and 836 deletions
enterprise-manager-ui/admin/.env.development 0 → 100644
View file @ afaac2d9
#开发环境
NODE_ENV = "development"
VUE_APP_API_BASE_URL= http://192.168.0.98:11086
enterprise-manager-ui/admin/src/assets/less/new.css
View file @ afaac2d9
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
height: 100% !important; height: 100% !important;
} }
.layout-menu-wrapper { .layout-menu-wrapper {
padding: 0 24px;
height: 64px !important; height: 64px !important;
line-height: 64px !important; line-height: 64px !important;
background: linear-gradient(90deg, #1845c6, #2999ff) !important; background: linear-gradient(90deg, #1845c6, #2999ff) !important;
...@@ -9,6 +10,13 @@ ...@@ -9,6 +10,13 @@
.layout-menu-wrapper .layout-logo { .layout-menu-wrapper .layout-logo {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
width: 200px;
}
.layout-menu-wrapper .menu-list {
margin-left: 50px;
}
.layout-menu-wrapper .menu-list li {
padding: 0 20px;
} }
.layout-menu-wrapper .menu-list li a { .layout-menu-wrapper .menu-list li a {
display: block; display: block;
......
enterprise-manager-ui/admin/src/assets/less/new.less
View file @ afaac2d9
#app { #app {
height: 100% !important; height: 100% !important;
} }
.layout-menu-wrapper { .layout-menu-wrapper {
height: 64px !important; padding: 0 24px;
line-height: 64px !important; height: 64px !important;
background: linear-gradient(90deg, #1845c6, #2999ff) !important; line-height: 64px !important;
background: linear-gradient(90deg, #1845c6, #2999ff) !important;
.layout-logo { .layout-logo {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
} width: 200px;
}
.menu-list {
li {
a {
display: block;
padding: 0 12px;
height: 100%;
font-size: 14px !important;
color: rgba(254, 254, 254, .65) !important;
text-align: center !important;
i {
font-size: 14px !important;
margin-right: 10px !important;
}
i:first-child { .menu-list {
margin-right: 0px !important; margin-left: 50px;
} li {
padding: 0 20px;
a {
display: block;
padding: 0 12px;
height: 100%;
font-size: 14px !important;
color: rgba(254, 254, 254, 0.65) !important;
text-align: center !important;
&:hover { i {
color: #fff !important; font-size: 14px !important;
margin-right: 10px !important;
}
} i:first-child {
margin-right: 0px !important;
}
&.router-link-active, &:hover {
&[active] { color: #fff !important;
//background: #1890ff;
color: #fff !important;
list-style-type: none;
border-bottom: none !important;
padding-bottom: 2px;
background-color: #1890ff !important;
}
}
} }
&.router-link-active,
&[active] {
//background: #1890ff;
color: #fff !important;
list-style-type: none;
border-bottom: none !important;
padding-bottom: 2px;
background-color: #1890ff !important;
}
}
} }
}
} }
.layout-header .layout-submenu-wrapper { .layout-header .layout-submenu-wrapper {
width: 95% !important; width: 95% !important;
margin: 0 auto !important; margin: 0 auto !important;
margin-top: 20px !important; margin-top: 20px !important;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
} }
.page.active { .page.active {
width: 95% !important; width: 95% !important;
margin: 0 auto !important; margin: 0 auto !important;
padding: 20px !important; padding: 20px !important;
padding-top: 0 !important; padding-top: 0 !important;
} }
.page { .page {
height: 82% !important; height: 82% !important;
min-height: 82% !important; min-height: 82% !important;
border-bottom-left-radius: 8px; border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px; border-bottom-right-radius: 8px;
} }
\ No newline at end of file
enterprise-manager-ui/admin/src/components/FormField.vue
View file @ afaac2d9
// 表单节点封装，支持 input textarea select radio checkbox 及slot方式 // 表单节点封装，支持 input textarea select radio checkbox 及slot方式
<template> <template>
<el-col :span='span'> <el-col :span="span">
<el-form-item :label="label" :prop="prop" class="my-form-field">
<el-form-item :label="label" :prop="prop" class='my-form-field'>
<slot> <slot>
<el-input :disabled='disabled' :placeholder='placeholder' v-model="field" @change="emit" @input="emit" v-if='type === "text"' :class="inputClass" :clearable='clearable'></el-input> <el-input
<el-input :disabled='disabled' :placeholder='placeholder' v-model="field" @change="emit" @input="emit" type='password' v-if='type === "password"'></el-input> :disabled="disabled"
:placeholder="placeholder"
<el-input-number :disabled='disabled' v-model="field" size="small" :placeholder='placeholder' @change="emit" @input="emit" v-if='type === "num"'></el-input-number> v-model="field"
@change="emit"
@input="emit"
v-if="type === 'text'"
:class="inputClass"
:clearable="clearable"
></el-input>
<el-input
:disabled="disabled"
:placeholder="placeholder"
v-model="field"
@change="emit"
@input="emit"
type="password"
v-if="type === 'password'"
></el-input>
<el-input-number
:disabled="disabled"
v-model="field"
size="small"
:placeholder="placeholder"
@change="emit"
@input="emit"
v-if="type === 'num'"
></el-input-number>
<el-input :disabled='disabled' :placeholder='placeholder' v-model="field" @change="emit" :rows='rows' @input="emit" v-if='type === "textarea"' type='textarea' :autosize="textareaSize" :class="inputClass"></el-input> <el-input
:disabled="disabled"
:placeholder="placeholder"
v-model="field"
@change="emit"
:rows="rows"
@input="emit"
v-if="type === 'textarea'"
type="textarea"
:autosize="textareaSize"
:class="inputClass"
></el-input>
<el-select :disabled='disabled' v-model="field" @change="emit" :multiple='multiple' :filterable='filterable' :clearable='clearable' v-if='type === "select"'> <el-select
:disabled="disabled"
v-model="field"
@change="emit"
:multiple="multiple"
:filterable="filterable"
:clearable="clearable"
v-if="type === 'select'"
>
<el-option <el-option
v-for="($label, $value) in enumData" v-for="($label, $value) in enumData"
:key="$value" :key="$value"
...@@ -21,25 +63,54 @@ ...@@ -21,25 +63,54 @@
></el-option> ></el-option>
</el-select> </el-select>
<el-radio-group :disabled='disabled' v-model="field" @change="emit" v-if='type === "radio"'> <el-radio-group
:disabled="disabled"
v-model="field"
@change="emit"
v-if="type === 'radio'"
>
<el-radio <el-radio
v-for='($label, $value) in enumData' v-for="($label, $value) in enumData"
:key='$value' :key="$value"
:label="$value" :label="$value"
>{{$label}}</el-radio> >{{ $label }}</el-radio
>
</el-radio-group> </el-radio-group>
<el-checkbox-group :disabled='disabled' v-model="field" @change="emit" v-if='type === "checkbox"'> <el-checkbox-group
:disabled="disabled"
v-model="field"
@change="emit"
v-if="type === 'checkbox'"
>
<el-checkbox <el-checkbox
v-for='($label, $value) in enumData' v-for="($label, $value) in enumData"
:key='$value' :key="$value"
:label="$value" :label="$value"
>{{$label}}</el-checkbox> >{{ $label }}</el-checkbox
>
</el-checkbox-group> </el-checkbox-group>
<el-date-picker :disabled='disabled' type="date" value-format="yyyy-MM-dd HH:mm:ss" v-model="field" @change="emit" @input="emit" placeholder="选择日期" v-if='type === "date"'></el-date-picker> <el-date-picker
<el-date-picker :disabled='disabled' type="datetime" value-format="yyyy-MM-dd HH:mm:ss" v-model="field" @change="emit" @input="emit" placeholder="选择日期" v-if='type === "datetime"'></el-date-picker> :disabled="disabled"
type="date"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="field"
@change="emit"
@input="emit"
placeholder="选择日期"
v-if="type === 'date'"
></el-date-picker>
<el-date-picker
:disabled="disabled"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="field"
@change="emit"
@input="emit"
placeholder="选择日期"
v-if="type === 'datetime'"
></el-date-picker>
</slot> </slot>
</el-form-item> </el-form-item>
</el-col> </el-col>
...@@ -48,29 +119,29 @@ ...@@ -48,29 +119,29 @@
<script> <script>
export default { export default {
props: { props: {
// 字段值 // 字段值
value: { value: {
type: [String, Number, Array], type: [String, Number, Array],
}, },
// 组件的el-col span宽度 1-24,默认12 // 组件的el-col span宽度 1-24,默认12
span: { span: {
type: Number, type: Number,
default: 12, default: 12,
}, },
// 字段类型: text,password,textarea,select,radio,checkbox,date,datetime // 字段类型: text,password,textarea,select,radio,checkbox,date,datetime
type: { type: {
type: String, type: String,
default: 'text', default: "text",
}, },
// 字段name // 字段name
prop: { prop: {
type: String, type: String,
default: '', default: "",
}, },
// 字段中文标题 // 字段中文标题
label: { label: {
type: String, type: String,
default: '', default: "",
}, },
// 是否禁用 // 是否禁用
disabled: { disabled: {
...@@ -80,18 +151,18 @@ export default { ...@@ -80,18 +151,18 @@ export default {
// 是否提示 // 是否提示
placeholder: { placeholder: {
type: String, type: String,
default: '', default: "",
}, },
// 字段所需的枚举类型 // 字段所需的枚举类型
enumData: { enumData: {
type: Object, type: Object,
default: ()=>{}, default: () => {},
}, },
// textarea专用-自适应内容高度 // textarea专用-自适应内容高度
textareaSize: { textareaSize: {
type: Object, type: Object,
default: ()=>{}, default: () => {},
}, },
// select专用-是否可搜索 // select专用-是否可搜索
filterable: { filterable: {
...@@ -111,38 +182,39 @@ export default { ...@@ -111,38 +182,39 @@ export default {
// 字段所需的枚举类型 // 字段所需的枚举类型
options: { options: {
type: Array, type: Array,
default: ()=>[], default: () => [],
}, },
children: { children: {
type: Array, type: Array,
default: ()=>[], default: () => [],
}, },
inputClass: { inputClass: {
type: String, type: String,
default: '', default: "",
} },
}, },
methods: { methods: {
emit() { emit() {
this.$emit('input', this.newVal) this.$emit("input", this.newVal);
this.$emit('change', this.newVal) this.$emit("change", this.newVal);
} console.log(this.newVal);
},
}, },
computed: { computed: {
field: { field: {
get() { get() {
return this.value return this.value;
}, },
set(val) { set(val) {
this.newVal = val; this.newVal = val;
} },
} },
}, },
data() { data() {
return { return {
newVal: this.value, newVal: this.value,
} };
} },
} };
</script> </script>
enterprise-manager-ui/admin/src/components/Header.vue
View file @ afaac2d9
...@@ -11,11 +11,11 @@ ...@@ -11,11 +11,11 @@
<router-link to="/"> <router-link to="/">
<img <img
:src="sysLogo ? sysLogo : require('../assets/images/logo.png')" :src="sysLogo ? sysLogo : require('../assets/images/logo.png')"
style="margin-bottom:5px" style="margin-bottom: 5px"
height="40" height="40"
alt="" alt=""
/> />
<b style="color:white;font-size:18px;" <b style="color: white; font-size: 18px"
>&nbsp;&nbsp;&nbsp; >&nbsp;&nbsp;&nbsp;
{{ sysName ? sysName : "企业服务平台" }} {{ sysName ? sysName : "企业服务平台" }}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</b &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</b
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
</span> --> </span> -->
<el-dropdown @command="handleCommand"> <el-dropdown @command="handleCommand">
<span class="el-dropdown-link" style="color:white"> <span class="el-dropdown-link" style="color: white">
{{ userData.currUserName }} {{ userData.currUserName }}
<i class="el-icon-arrow-down el-icon--right"></i> <i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
...@@ -249,9 +249,7 @@ export default { ...@@ -249,9 +249,7 @@ export default {
} }
} }
} }
.layout-profile {
padding-right: 30px;
}
} }
.layout-submenu-wrapper { .layout-submenu-wrapper {
......
enterprise-manager-ui/admin/src/components/ImageUpload.vue
View file @ afaac2d9
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<template> <template>
<div class="component-upload-image"> <div class="component-upload-image">
<el-upload <el-upload
:action="uploadImgUrl+'?prePath=' +prePath" :action="uploadImgUrl + '?prePath=' + prePath"
list-type="picture-card" list-type="picture-card"
:on-success="handleUploadSuccess" :on-success="handleUploadSuccess"
:before-upload="handleBeforeUpload" :before-upload="handleBeforeUpload"
...@@ -11,14 +11,22 @@ ...@@ -11,14 +11,22 @@
:show-file-list="false" :show-file-list="false"
:headers="headers" :headers="headers"
style="display: inline-block; vertical-align: top" style="display: inline-block; vertical-align: top"
v-if="!isList"
> >
<el-image v-if="!value" :src="value"> <el-image
v-if="!value"
:src="value.indexOf('http') == -1 ? baseUrl + value : value"
>
<div slot="error" class="image-slot"> <div slot="error" class="image-slot">
<i class="el-icon-plus" /> <i class="el-icon-plus" />
</div> </div>
</el-image> </el-image>
<div v-else class="image"> <div v-else class="image">
<el-image :src="value" :style="`width:150px;height:150px;`" fit="fill"/> <el-image
:src="value.indexOf('http') == -1 ? baseUrl + value : value"
:style="`width:150px;height:150px;`"
fit="fill"
/>
<div class="mask"> <div class="mask">
<div class="actions"> <div class="actions">
<span title="预览" @click.stop="dialogVisible = true"> <span title="预览" @click.stop="dialogVisible = true">
...@@ -31,8 +39,36 @@ ...@@ -31,8 +39,36 @@
</div> </div>
</div> </div>
</el-upload> </el-upload>
<el-dialog :visible.sync="dialogVisible" title="预览" width="800" append-to-body> <el-upload
<img :src="value" style="display: block; max-width: 100%; margin: 0 auto;"> :action="uploadImgUrl + '?prePath=' + prePath"
list-type="picture-card"
:on-remove="handleRemove"
:on-success="handleUploadSuccess"
:before-upload="handleBeforeUpload"
:on-preview="handlePictureCardPreview"
:file-list="imgList"
accept=".jpeg,.png,.jpg,.bmp,.gif"
:headers="headers"
v-else
>
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog
:visible.sync="dialogVisible"
title="预览"
width="800"
append-to-body
>
<img
:src="dialogImageUrl"
style="display: block; max-width: 100%; margin: 0 auto"
v-if="isList"
/>
<img
:src="value"
style="display: block; max-width: 100%; margin: 0 auto"
v-else
/>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
...@@ -41,8 +77,11 @@ ...@@ -41,8 +77,11 @@
export default { export default {
data() { data() {
return { return {
baseUrl: process.env.VUE_APP_API_BASE_URL + "/",
dialogVisible: false, dialogVisible: false,
uploadImgUrl: "/enterprise/file/commonupload", // 上传的图片服务器地址 uploadImgUrl: "/enterprise/file/commonupload", // 上传的图片服务器地址
imgList: [],
dialogImageUrl: "",
}; };
}, },
props: { props: {
...@@ -53,16 +92,52 @@ export default { ...@@ -53,16 +92,52 @@ export default {
//保存服务器路径前缀地址 //保存服务器路径前缀地址
prePath: { prePath: {
type: String, type: String,
default: '', default: "",
},
isList: {
type: Boolean,
default: false,
},
},
mounted() {
// 判断是否为多图上传
if (this.isList) {
if (this.value && this.value != "") {
this.imgList = [];
let arr = [];
arr = this.value?.split(",");
arr.forEach((v) => {
let obj = {};
obj.name = "轮播图";
obj.uid = parseInt(Math.random(0, 100));
v.indexOf("http") == -1
? (obj.url = this.baseUrl + v)
: (obj.url = v);
this.imgList.push(obj);
});
}
} }
}, },
methods: { methods: {
handleRemove(file, fileList) {
console.log(fileList);
this.imgList = fileList;
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
removeImage() { removeImage() {
this.$emit("input", ""); this.$emit("input", "");
}, },
handleUploadSuccess(res) { handleUploadSuccess(res, file, fileList) {
this.$emit("input", res.url); if (this.isList) {
this.loading.close(); this.loading.close();
this.imgList = fileList;
} else {
this.$emit("input", res.url);
this.loading.close();
}
}, },
handleBeforeUpload() { handleBeforeUpload() {
this.loading = this.$loading({ this.loading = this.$loading({
......
enterprise-manager-ui/admin/src/views/company/drawershow.vue
View file @ afaac2d9
...@@ -7,10 +7,26 @@ ...@@ -7,10 +7,26 @@
:destroy-on-close="true" :destroy-on-close="true"
size="80%" size="80%"
> >
<el-form ref="form" :model="form" :rules="rules" label-width="140px" style="padding:0 40px;"> <el-form
ref="form"
:model="form"
:rules="rules"
label-width="140px"
style="padding: 0 40px"
>
<el-row> <el-row>
<Field label="企业名称" prop="companyName" v-model="form.companyName" placeholder="请输入企业名称" /> <Field
<Field label="联系电话" prop="contactPhone" v-model="form.contactPhone" placeholder="请输入联系电话" /> label="企业名称"
prop="companyName"
v-model="form.companyName"
placeholder="请输入企业名称"
/>
<Field
label="联系电话"
prop="contactPhone"
v-model="form.contactPhone"
placeholder="请输入联系电话"
/>
<!-- <Field label="公司编码" prop="companyCode" v-model="form.companyCode" placeholder="请输入公司编码"/> <!-- <Field label="公司编码" prop="companyCode" v-model="form.companyCode" placeholder="请输入公司编码"/>
<Field label="注册号" prop="registrationNumber" v-model="form.registrationNumber" placeholder="请输入注册号"/> <Field label="注册号" prop="registrationNumber" v-model="form.registrationNumber" placeholder="请输入注册号"/>
<Field label="法定代表人" prop="legalRepresentative" v-model="form.legalRepresentative" placeholder="请输入法定代表人"/> <Field label="法定代表人" prop="legalRepresentative" v-model="form.legalRepresentative" placeholder="请输入法定代表人"/>
...@@ -28,11 +44,19 @@ ...@@ -28,11 +44,19 @@
prop="businessAdress" prop="businessAdress"
placeholder="请输入经营地址" placeholder="请输入经营地址"
> >
<area-select ref="areaselect" v-model="form.areaCode" @addressSelect="addressSelect"></area-select> <area-select
ref="areaselect"
v-model="form.areaCode"
@addressSelect="addressSelect"
></area-select>
</Field> </Field>
<!-- <Field label="所在地" prop="location" v-model="form.location" placeholder="请输入所在地"/> --> <!-- <Field label="所在地" prop="location" v-model="form.location" placeholder="请输入所在地"/> -->
<Field prop="location" v-model="form.location" placeholder="请输入详细地址" /> <Field
prop="location"
v-model="form.location"
placeholder="请输入详细地址"
/>
<!-- <Field label="电子邮件地址" prop="email" v-model="form.email" placeholder="请输入电子邮件地址"/> <!-- <Field label="电子邮件地址" prop="email" v-model="form.email" placeholder="请输入电子邮件地址"/>
<Field label="公司网站" prop="website" v-model="form.website" placeholder="请输入公司网站"/> <Field label="公司网站" prop="website" v-model="form.website" placeholder="请输入公司网站"/>
<Field label="税务登记号" prop="taxRegistrationNumber" v-model="form.taxRegistrationNumber" placeholder="请输入税务登记号"/> <Field label="税务登记号" prop="taxRegistrationNumber" v-model="form.taxRegistrationNumber" placeholder="请输入税务登记号"/>
...@@ -67,13 +91,16 @@ ...@@ -67,13 +91,16 @@
></el-option> ></el-option>
</el-select> </el-select>
</Field> </Field>
<Field <Field label="公司介绍">
<editor v-model="form.companyIntroduction" :min-height="150" />
</Field>
<!-- <Field
label="公司介绍" label="公司介绍"
prop="companyIntroduction" prop="companyIntroduction"
v-model="form.companyIntroduction" v-model="form.companyIntroduction"
type="textarea" type="textarea"
placeholder="请输入公司介绍" placeholder="请输入公司介绍"
/> /> -->
<!-- <Field :span="24" label="企业视频"><fileUpload v-model="form.companyVideoPath" :fileType="[ 'mp4', 'avi']" prePath="/file/fileupload"/></Field> <!-- <Field :span="24" label="企业视频"><fileUpload v-model="form.companyVideoPath" :fileType="[ 'mp4', 'avi']" prePath="/file/fileupload"/></Field>
<Field :span="24" label="企业宣传图片"><fileUpload v-model="form.companyPicPath" :fileType="['png', 'jpg', 'jpeg']" prePath="/file/preview"/></Field> <Field :span="24" label="企业宣传图片"><fileUpload v-model="form.companyPicPath" :fileType="['png', 'jpg', 'jpeg']" prePath="/file/preview"/></Field>
...@@ -88,10 +115,22 @@ ...@@ -88,10 +115,22 @@
ref="companyPatents" ref="companyPatents"
> >
<!-- <el-table-column type="selection" width="50" align="center" /> --> <!-- <el-table-column type="selection" width="50" align="center" /> -->
<el-table-column label="序号" align="center" prop="index" width="50" /> <el-table-column
<el-table-column label="知识产权类型" align="center" prop="intellectPropertyType"> label="序号"
align="center"
prop="index"
width="50"
/>
<el-table-column
label="知识产权类型"
align="center"
prop="intellectPropertyType"
>
<template slot-scope="scope"> <template slot-scope="scope">
<el-input v-model="scope.row.intellectPropertyType" placeholder="请输入知识产权类型" /> <el-input
v-model="scope.row.intellectPropertyType"
placeholder="请输入知识产权类型"
/>
</template> </template>
</el-table-column> </el-table-column>
...@@ -107,25 +146,40 @@ ...@@ -107,25 +146,40 @@
<el-table-column label="操作" width="240"> <el-table-column label="操作" width="240">
<template slot-scope="scope"> <template slot-scope="scope">
<Confirm @confirm="handleDeleteCompanyPatents(scope.row)" message="确定要删除该条知识产权吗？"> <Confirm
@confirm="handleDeleteCompanyPatents(scope.row)"
message="确定要删除该条知识产权吗？"
>
<div class="del">删除</div> <div class="del">删除</div>
</Confirm> </Confirm>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-row <el-row
style="margin:10px 0;display: flex;justify-content: center;" style="margin: 10px 0; display: flex; justify-content: center"
:gutter="10" :gutter="10"
class="mb8" class="mb8"
> >
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" icon="el-icon-plus" @click="handleAddCompanyPatents">新增知识产权</el-button> <el-button
type="primary"
icon="el-icon-plus"
@click="handleAddCompanyPatents"
>新增知识产权</el-button
>
</el-col> </el-col>
</el-row> </el-row>
<el-form-item v-if="pageInfo.type!='view'" class="formbtns"> <el-form-item v-if="pageInfo.type != 'view'" class="formbtns">
<el-button type="primary" @click="hanndleSubmit" icon="el-icon-circle-check-outline">保存</el-button> <el-button
<el-button @click="open=false" icon="el-icon-circle-close-outline">取消</el-button> type="primary"
@click="hanndleSubmit"
icon="el-icon-circle-check-outline"
>保存</el-button
>
<el-button @click="open = false" icon="el-icon-circle-close-outline"
>取消</el-button
>
</el-form-item> </el-form-item>
</Field> </Field>
</el-form> </el-form>
...@@ -139,25 +193,25 @@ export default { ...@@ -139,25 +193,25 @@ export default {
name: "CompanyDetail", name: "CompanyDetail",
mixins: [form], mixins: [form],
components: { components: {
Confirm Confirm,
}, },
created() { created() {
this.changePath("company"); this.changePath("company");
}, },
data() { data() {
let that = this; let that = this;
var checkPhone = (rule,value,callback) =>{ var checkPhone = (rule, value, callback) => {
let phoneReg = /^(((\d{3,4}-)?[0-9]{7,8})|(1(3|4|5|6|7|8|9)\d{9}))$/ let phoneReg = /^(((\d{3,4}-)?[0-9]{7,8})|(1(3|4|5|6|7|8|9)\d{9}))$/;
if(!value){ if (!value) {
callback() callback();
}else{ } else {
if(phoneReg.test(value)){ if (phoneReg.test(value)) {
callback() callback();
}else{ } else {
callback(new Error("请输入正确的联系电话")) callback(new Error("请输入正确的联系电话"));
} }
} }
} };
return { return {
regionCodeList: [], regionCodeList: [],
areaprops: { areaprops: {
...@@ -168,22 +222,22 @@ export default { ...@@ -168,22 +222,22 @@ export default {
lazyLoad(node, resolve) { lazyLoad(node, resolve) {
var param = { var param = {
pid: node.level === 0 ? 0 : node.data.id, pid: node.level === 0 ? 0 : node.data.id,
size: -1 size: -1,
}; };
that.$post("/base/area/list", param).then(res => { that.$post("/base/area/list", param).then((res) => {
console.log(res); console.log(res);
let nodes = res.data.data.map(item => { let nodes = res.data.data.map((item) => {
return { return {
value: item.areaCode, value: item.areaCode,
label: item.name, label: item.name,
id: item.iid, id: item.iid,
leaf: item.haveSonArea === "False" leaf: item.haveSonArea === "False",
}; };
}); });
resolve(nodes); resolve(nodes);
}); });
} },
}, },
// 子表选中数据 // 子表选中数据
checkedCompanyLabels: [], checkedCompanyLabels: [],
...@@ -206,61 +260,67 @@ export default { ...@@ -206,61 +260,67 @@ export default {
rules: { rules: {
companyName: [ companyName: [
{ required: true, message: "请输入公司名称", trigger: "blur" }, { required: true, message: "请输入公司名称", trigger: "blur" },
{ max: 128, message: "最多只能录入128个字符", trigger: "blur" } { max: 128, message: "最多只能录入128个字符", trigger: "blur" },
], ],
areaCode: [ areaCode: [
{ required: true, message: "请输入所属区域编码", trigger: "blur" }, { required: true, message: "请输入所属区域编码", trigger: "blur" },
{ max: 128, message: "最多只能录入128个字符", trigger: "blur" } { max: 128, message: "最多只能录入128个字符", trigger: "blur" },
], ],
areaName: [ areaName: [
{ required: true, message: "请输入所属区域名称", trigger: "blur" }, { required: true, message: "请输入所属区域名称", trigger: "blur" },
{ max: 128, message: "最多只能录入128个字符", trigger: "blur" } { max: 128, message: "最多只能录入128个字符", trigger: "blur" },
], ],
contactPhone: [ contactPhone: [
{ required: true, message: "请输入联系电话", trigger: "blur" }, { required: true, message: "请输入联系电话", trigger: "blur" },
{ validator: checkPhone,trigger: "blur" }, { validator: checkPhone, trigger: "blur" },
{ max: 32, message: "最多只能录入32个字符", trigger: "blur" } { max: 32, message: "最多只能录入32个字符", trigger: "blur" },
], ],
lon: [ lon: [
{ required: true, message: "请输入经度", trigger: "blur" }, { required: true, message: "请输入经度", trigger: "blur" },
{ max: 32, message: "最多只能录入32个字符", trigger: "blur" } { max: 32, message: "最多只能录入32个字符", trigger: "blur" },
], ],
lati: [ lati: [
{ required: true, message: "请输入纬度", trigger: "blur" }, { required: true, message: "请输入纬度", trigger: "blur" },
{ max: 32, message: "最多只能录入32个字符", trigger: "blur" } { max: 32, message: "最多只能录入32个字符", trigger: "blur" },
], ],
logoPath: [ logoPath: [
{ required: true, message: "请输入企业logo", trigger: "blur" }, { required: true, message: "请输入企业logo", trigger: "blur" },
{ max: 128, message: "最多只能录入128个字符", trigger: "blur" } { max: 128, message: "最多只能录入128个字符", trigger: "blur" },
], ],
establishDate: [{ required: true, message: "请选择成立日期" }], establishDate: [{ required: true, message: "请选择成立日期" }],
createTime: [{ required: true, message: "请选择创建时间" }] createTime: [{ required: true, message: "请选择创建时间" }],
} },
}; };
}, },
methods: { methods: {
hanndleSubmit(){ hanndleSubmit() {
this.form.businessAdress = this.$refs.areaselect.provinceName+this.$refs.areaselect.cityName+this.$refs.areaselect.areaName+this.$refs.areaselect.streetName+this.$refs.areaselect.communityName+this.form.location this.form.businessAdress =
this.$refs.areaselect.provinceName +
this.$refs.areaselect.cityName +
this.$refs.areaselect.areaName +
this.$refs.areaselect.streetName +
this.$refs.areaselect.communityName +
this.form.location;
// 检查知识产权list中类型不能为空 // 检查知识产权list中类型不能为空
if(this.companyPatentsList && this.companyPatentsList.length>0){ if (this.companyPatentsList && this.companyPatentsList.length > 0) {
let isNull = false let isNull = false;
this.companyPatentsList.forEach((item)=>{ this.companyPatentsList.forEach((item) => {
if (!item.intellectPropertyType) { if (!item.intellectPropertyType) {
isNull = true isNull = true;
} }
}) });
if(isNull){ if (isNull) {
this.$confirm('知识产权类型不能为空', '提示', { this.$confirm("知识产权类型不能为空", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
type: 'warning', type: "warning",
showCancelButton: false, //是否显示取消按钮 showCancelButton: false, //是否显示取消按钮
showClose: false, //是否显示关闭按钮 showClose: false, //是否显示关闭按钮
}) });
return; return;
} }
} }
this.submitForm() this.submitForm();
}, },
addressSelect(val) { addressSelect(val) {
console.log("addressSelect", val); console.log("addressSelect", val);
...@@ -293,7 +353,7 @@ export default { ...@@ -293,7 +353,7 @@ export default {
handleDeleteCompanyPatents(row) { handleDeleteCompanyPatents(row) {
// 由于有一些知识产权还没有id，所以这里删除选用的是字段中带的index // 由于有一些知识产权还没有id，所以这里删除选用的是字段中带的index
this.companyPatentsList = this.companyPatentsList.filter( this.companyPatentsList = this.companyPatentsList.filter(
item => item.index !== row.index (item) => item.index !== row.index
); );
this.form.companyPatentsList = this.companyPatentsList; this.form.companyPatentsList = this.companyPatentsList;
}, },
...@@ -311,7 +371,7 @@ export default { ...@@ -311,7 +371,7 @@ export default {
beforeRender(data) { beforeRender(data) {
if (data.entity.companyLabelsList) { if (data.entity.companyLabelsList) {
let arr = []; let arr = [];
data.entity.companyLabelsList.forEach(item => { data.entity.companyLabelsList.forEach((item) => {
//如果相等做操作 //如果相等做操作
item["labelId"] = item["labelId"] + ""; item["labelId"] = item["labelId"] + "";
arr.push(item.labelId); arr.push(item.labelId);
...@@ -400,7 +460,7 @@ export default { ...@@ -400,7 +460,7 @@ export default {
establishDate: null, establishDate: null,
remark: "", remark: "",
companyLabelsList: [], companyLabelsList: [],
companyPatentsList: [] companyPatentsList: [],
}; };
this.resetForm("form"); this.resetForm("form");
}, },
...@@ -408,19 +468,19 @@ export default { ...@@ -408,19 +468,19 @@ export default {
if (this.$refs[refName]) { if (this.$refs[refName]) {
this.$refs[refName].resetFields(); this.$refs[refName].resetFields();
} }
} },
}, },
watch: { watch: {
companyLabelsList(newval) { companyLabelsList(newval) {
let arr = []; let arr = [];
newval.forEach(item => { newval.forEach((item) => {
arr.push({ arr.push({
labelId: item labelId: item,
}); });
}); });
this.form.companyLabelsList = arr; this.form.companyLabelsList = arr;
} },
} },
}; };
</script> </script>
......
enterprise-manager-ui/admin/src/views/news/drawershow.vue
View file @ afaac2d9
<template> <template>
<!-- 弹出框表单 --> <!-- 弹出框表单 -->
<el-drawer <el-drawer
:title="title" :title="title"
:visible.sync="open" :visible.sync="open"
:direction="direction" :direction="direction"
:destroy-on-close="true" :destroy-on-close="true"
size="100%"> size="100%"
<el-form ref="form" :model="form" :rules="rules" label-width="120px"> >
<div class="form"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<div class="formleft"> <div class="form">
<Field label="标题" :span="24" prop="title" v-model="form.title" placeholder="请输入标题"/> <div class="formleft">
<Field :span="24" label="内容"><editor v-model="form.content" :min-height="256"/></Field> <Field
</div> label="标题"
<div class="formright"> :span="24"
<el-row> prop="title"
<Field label="类型" :span="20" prop="categoryId" v-model="form.categoryId" type="radio" :enum-data="dict.categoryId" placeholder="请输入分类id"/> v-model="form.title"
<Field :span="20" label="封面"><imageUpload v-model="form.titleLogoPath" prePath="/file/preview"/></Field> placeholder="请输入标题"
/>
<Field :span="24" label="内容"
><editor v-model="form.content" :min-height="256"
/></Field>
</div>
<div class="formright">
<el-row>
<Field
label="类型"
:span="20"
prop="categoryId"
v-model="form.categoryId"
type="radio"
:enum-data="dict.categoryId"
placeholder="请输入分类id"
/>
<Field :span="20" label="封面">
<imageUpload
v-model="form.titleLogoPath"
prePath="/file/preview"
:isList="true"
ref="imgList"
/>
</Field>
<Field :span="20" label="责任编辑" prop="editor" v-model="form.editor" placeholder="请输入责任编辑"/> <Field
:span="20"
label="责任编辑"
prop="editor"
v-model="form.editor"
placeholder="请输入责任编辑"
/>
<Field :span="20" label="发布部门" prop="deptId" v-model="form.deptId" type="select" :enum-data="dict.deptId" placeholder="请输入发布部门"/> <Field
:span="20"
label="发布部门"
prop="deptId"
v-model="form.deptId"
type="select"
:enum-data="dict.deptId"
placeholder="请输入发布部门"
/>
<Field :span="20" label="文章来源" prop="source" v-model="form.source" placeholder="请输入文章来源"/> <Field
:span="20"
label="文章来源"
prop="source"
v-model="form.source"
placeholder="请输入文章来源"
/>
<Field label="发布时间" prop="publishTime" v-model="form.publishTime" type="date" /> <Field
label="发布时间"
prop="publishTime"
v-model="form.publishTime"
type="date"
/>
<Field :span="20" label="声明" prop="statement" v-model="form.statement" type="textarea" placeholder="请输入声明"/> <Field
:span="20"
</el-row> label="声明"
</div> prop="statement"
</div> v-model="form.statement"
<el-form-item class="footerbtns"> type="textarea"
<el-button type="primary" @click='submitForm' icon='el-icon-circle-check-outline'>发布</el-button> placeholder="请输入声明"
<el-button @click='()=>{open = false}' icon='el-icon-circle-close-outline'>取消</el-button> />
</el-form-item> </el-row>
</el-form> </div>
</div>
</el-drawer> <el-form-item class="footerbtns">
<el-button
type="primary"
@click="submitForm"
icon="el-icon-circle-check-outline"
>发布</el-button
>
<el-button
@click="
() => {
open = false;
}
"
icon="el-icon-circle-close-outline"
>取消</el-button
>
</el-form-item>
</el-form>
</el-drawer>
</template> </template>
<script> <script>
import form from "@/assets/mixins/formdialog"; import form from "@/assets/mixins/formdialog";
export default { export default {
name: "NewsDetail", name: "NewsDetail",
mixins: [form], mixins: [form],
components: { components: {},
created() {
}, this.changePath("news");
created() { },
this.changePath("news") data() {
}, return {
data() { // 遮罩层
return { loading: true,
// 遮罩层 // 弹出层标题
loading: true, title: "新闻",
// 弹出层标题 // 是否显示弹出层
title: "新闻", open: false,
// 是否显示弹出层 direction: "rtl",
open: false, toString: ["top", "viewNums", "categoryId"],
direction:"rtl", toDate: ["publishTime"],
toString:[ // 表单校验
"top", rules: {
"viewNums", categoryId: [
"categoryId" { required: true, message: "请选择频道类型", trigger: "blur" },
], ],
toDate:[ title: [
"publishTime", { required: true, message: "请输入标题", trigger: "blur" },
], { max: 512, message: "最多只能录入512个字符", trigger: "blur" },
// 表单校验 ],
rules: { titleLogoPath: [
categoryId: [ { required: true, message: "请输入标题logo", trigger: "blur" },
{required: true,message: "请选择频道类型", trigger: "blur" }, ],
], publishTime: [{ required: true, message: "请选择发布时间" }],
title: [ },
{required: true,message: "请输入标题", trigger: "blur" }, };
{max: 512,message: "最多只能录入512个字符",trigger: "blur",}, },
],
titleLogoPath: [
{required: true,message: "请输入标题logo", trigger: "blur" },
],
publishTime: [
{required: true,message: "请选择发布时间" },
]
}
};
},
methods: {
/** 编辑 */
edit(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="news/edit";
this.getData();
this.pageInfo.type="edit"
this.title = "修改新闻";
},
/** 新增 */
add(row) {
this.reset()
this.urls.currUrl = "news/add";
this.getData();
this.pageInfo.type="add"
this.title = "新增新闻";
},
/** 查看*/
view(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="news/view";
this.getData();
this.pageInfo.type="view"
this.title = "新闻详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
afterSubmit(data) { methods: {
this.open = false; /** 编辑 */
this.$emit("ok"); edit(row) {
}, this.reset();
this.query = { id: row.id };
this.urls.currUrl = "news/edit";
this.getData();
this.pageInfo.type = "edit";
this.title = "修改新闻";
},
/** 新增 */
add(row) {
this.reset();
this.urls.currUrl = "news/add";
this.getData();
this.pageInfo.type = "add";
this.title = "新增新闻";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "news/view";
this.getData();
this.pageInfo.type = "view";
this.title = "新闻详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
// 提交前数据处理
beforeSubmit(data) {
console.log(data, "123");
let arr = [];
arr = this.$refs.imgList.imgList.map((v) => {
return v.response ? v.response.url : v.url.substr(v.url.indexOf("f"));
});
data.titleLogoPath = arr.join(",");
return data;
},
afterSubmit(data) {
this.open = false;
this.$emit("ok");
},
// 表单重置 // 表单重置
reset() { reset() {
this.form = { this.form = {
categoryId : null, categoryId: null,
categoryName : "", categoryName: "",
title : "", title: "",
titleLogoPath : "", titleLogoPath: "",
content : "", content: "",
top : 0, top: 0,
viewNums : 0, viewNums: 0,
publishTime : null, publishTime: null,
}; };
this.resetForm("form"); this.resetForm("form");
}, },
resetForm(refName) { resetForm(refName) {
if (this.$refs[refName]) { if (this.$refs[refName]) {
this.$refs[refName].resetFields(); this.$refs[refName].resetFields();
} }
}, },
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.footerbtns{ .footerbtns {
margin-top: 20px; margin-top: 20px;
padding-top: 20px; padding-top: 20px;
border-top: 1px solid gainsboro; border-top: 1px solid gainsboro;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-content: center; align-content: center;
} }
.form{ .form {
display: flex; display: flex;
width: 100%; width: 100%;
.formleft{ .formleft {
flex:1; flex: 1;
width: 60%; width: 60%;
height: calc(100vh - 200px); height: calc(100vh - 200px);
overflow: auto; overflow: auto;
} }
.formright{ .formright {
width: 40%; width: 40%;
flex-shrink: 0; flex-shrink: 0;
flex-grow: 0; flex-grow: 0;
} }
} }
</style> </style>
\ No newline at end of file
enterprise-manager-ui/admin/src/views/product/drawershow.vue
View file @ afaac2d9
<template> <template>
<!-- 弹出框表单 --> <!-- 弹出框表单 -->
<el-drawer <el-drawer
:title="title" :title="title"
:visible.sync="open" :visible.sync="open"
:direction="direction" :direction="direction"
:destroy-on-close="true" :destroy-on-close="true"
size="90%"> size="90%"
<el-form ref="form" :model="form" :rules="rules" label-width="120px" > >
<div class="form"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<div class="formleft"> <div class="form">
<el-row> <div class="formleft">
<Field label="产品名称" prop="productName" v-model="form.productName" placeholder="请输入产品名称，名称唯一"/> <el-row>
</el-row> <Field
<el-row> label="产品名称"
<Field label="产品slogan" prop="productSlogan" v-model="form.productSlogan" placeholder="请输入产品slogan"/> prop="productName"
</el-row> v-model="form.productName"
<el-row> placeholder="请输入产品名称，名称唯一"
<Field label="产品分类" prop="categoryId" v-model="form.categoryId" :multiple="true" type="select" :enumData="dict.categoryId" placeholder="请选择产品分类"/> />
<Field label="所属企业" prop="companyId" v-model="form.companyId" :multiple="true" type="select" :enumData="dict.companyId" placeholder="请选择所属企业"/> </el-row>
<el-row>
<Field label="产品slogan">
<el-tag
:key="tag"
v-for="tag in dynamicTags"
closable
:disable-transitions="false"
@close="handleClose(tag)"
>
{{ tag }}
</el-tag>
<el-input
class="input-new-tag"
v-if="inputVisible"
v-model="inputValue"
ref="saveTagInput"
size="small"
@keyup.enter.native="handleInputConfirm"
@blur="handleInputConfirm"
>
</el-input>
<el-button
v-else
class="button-new-tag"
size="small"
@click="showInput"
>+ 新增 slogan</el-button
>
</Field>
<!-- <Field
label="产品slogan"
prop="productSlogan"
v-model="form.productSlogan"
placeholder="请输入产品slogan"
/> -->
</el-row>
<el-row>
<Field
label="产品分类"
prop="categoryId"
v-model="form.categoryId"
:multiple="false"
type="select"
:enumData="dict.categoryId"
placeholder="请选择产品分类"
/>
<Field
label="所属企业"
prop="companyId"
v-model="form.companyId"
:multiple="true"
type="select"
:enumData="dict.companyId"
placeholder="请选择所属企业"
/>
<!-- <Field label="产品图标"><imageUpload v-model="form.productLogoPath" prePath="/file/preview"/></Field> -->
</el-row>
<el-row>
<Field label="产品封面图片" prop="productFacePath"
><imageUpload
v-model="form.productFacePath"
prePath="/file/preview"
/>
</Field>
</el-row>
<!-- <el-row>
<Field
label="宣传形式"
type="checkbox"
:enumData="dict.propagandaList"
v-model="form.nowPropaganda"
@change="changeNowprop"
></Field>
</el-row> -->
<el-row>
<Field label="轮播图">
<imageUpload
v-model="form.productPicPath"
prePath="/file/preview"
:isList="true"
ref="imgList"
/>
</Field>
</el-row>
<el-row>
<Field label="短视频"
><fileUpload
v-model="form.productVideoPath"
:fileType="['mp4', 'avi']"
prePath="/file/fileupload"
/></Field>
</el-row>
<el-row>
<Field
label="产品简介"
prop="productIntroduction"
v-model="form.productIntroduction"
type="textarea"
placeholder="请输入产品简介"
/>
<!-- <Field label="发布时间" prop="publishTime" v-model="form.publishTime" type="date" /> -->
</el-row>
<el-row>
<Field
label="是否热门"
prop="hot"
v-model="form.hot"
type="radio"
:enumData="dict.hot"
placeholder="请选择是否热门"
/>
<!-- <Field label="备注" prop="productRemark" v-model="form.productRemark" type="textarea" placeholder="请输入备注"/> -->
</el-row>
</div>
<!-- <Field label="产品图标"><imageUpload v-model="form.productLogoPath" prePath="/file/preview"/></Field> --> <div class="formright">
</el-row> <div class="tabs">
<el-row> <div
<Field label="产品封面图片" prop="productFacePath" ><imageUpload v-model="form.productFacePath" prePath="/file/preview"/> </Field> class="tab"
</el-row> :class="nowtab == 1 ? 'activetab' : ''"
<el-row> @click="changeTab(1)"
<Field label="宣传形式" type="radio" :enumData="propagandaList" v-model="nowPropaganda" :field="nowPropaganda" @emit="changeNowprop"></Field> >
</el-row> 产品详情
<el-row> </div>
<Field label="轮播图" v-if="nowPropaganda==0"><imageUpload v-model="form.productPicPath" prePath="/file/preview"/></Field> <div
</el-row> class="tab"
<el-row> :class="nowtab == 2 ? 'activetab' : ''"
<Field label="短视频" v-if="nowPropaganda==1"><fileUpload v-model="form.productVideoPath" :fileType="[ 'mp4', 'avi']" prePath="/file/fileupload"/></Field> @click="changeTab(2)"
</el-row> >
<el-row> 常见问题
<Field label="产品简介" prop="productIntroduction" v-model="form.productIntroduction" type="textarea" placeholder="请输入产品简介"/>
<!-- <Field label="发布时间" prop="publishTime" v-model="form.publishTime" type="date" /> -->
</el-row>
<el-row>
<Field label="是否热门" prop="hot" v-model="form.hot" type="radio" :enumData="dict.hot" placeholder="请选择是否热门"/>
<!-- <Field label="备注" prop="productRemark" v-model="form.productRemark" type="textarea" placeholder="请输入备注"/> -->
</el-row>
</div>
<div class="formright">
<div class="tabs">
<div class="tab" :class="nowtab==1?'activetab':''" @click="changeTab(1)">产品详情</div>
<div class="tab" :class="nowtab==2?'activetab':''" @click="changeTab(2)">常见问题</div>
</div>
<div class="content" v-show="nowtab==1">
<editor v-model="form.productDetail" :min-height="100"/>
</div>
<div class="content" v-show="nowtab==2">
<el-table :data="productQuestionList" :row-class-name="rowProductQuestionIndex" @selection-change="handleProductQuestionSelectionChange" ref="productQuestion">
<el-table-column label="序号" align="center" prop="index" width="50"/>
<el-table-column label="问题" prop="question">
<template slot-scope="scope">
<el-input v-model="scope.row.question" placeholder="请输入问题" />
</template>
</el-table-column>
<el-table-column label="常见问题回答" prop="answer">
<template slot-scope="scope">
<el-input v-model="scope.row.answer" placeholder="请输入常见问题回答" />
</template>
</el-table-column>
<el-table-column label="操作" width="240" align="center">
<template slot-scope="scope">
<Confirm @confirm="handleDeleteCompanyPatents(scope.row)" message="确定要删除该条知识产权吗？">
<div class="del">删除</div>
</Confirm>
</template>
</el-table-column>
</el-table>
<el-row style="margin:10px 0;display: flex;justify-content: center;" :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" icon="el-icon-plus" @click="handleAddProductQuestion">新增常见问题</el-button>
</el-col>
</el-row>
</div>
</div>
</div> </div>
</div>
<div class="content" v-show="nowtab == 1">
<!-- 保存按钮 --> <editor v-model="form.productDetail" :min-height="100" />
<form-buttons @submit='onSubmitForm' @cancel='cancelForm' v-if="pageInfo.type!='view'" class="formbtns" /> </div>
</el-form> <div class="content" v-show="nowtab == 2">
<el-table
:data="productQuestionList"
:row-class-name="rowProductQuestionIndex"
@selection-change="handleProductQuestionSelectionChange"
ref="productQuestion"
>
<el-table-column
label="序号"
align="center"
prop="index"
width="50"
/>
<el-table-column label="问题" prop="question">
<template slot-scope="scope">
<el-input
v-model="scope.row.question"
placeholder="请输入问题"
/>
</template>
</el-table-column>
<el-table-column label="常见问题回答" prop="answer">
<template slot-scope="scope">
<el-input
v-model="scope.row.answer"
placeholder="请输入常见问题回答"
/>
</template>
</el-table-column>
<el-table-column label="操作" width="240" align="center">
<template slot-scope="scope">
<Confirm
@confirm="handleDeleteCompanyPatents(scope.row)"
message="确定要删除该条知识产权吗？"
>
<div class="del">删除</div>
</Confirm>
</template>
</el-table-column>
</el-table>
<el-row
style="margin: 10px 0; display: flex; justify-content: center"
:gutter="10"
class="mb8"
>
<el-col :span="1.5">
<el-button
type="primary"
icon="el-icon-plus"
@click="handleAddProductQuestion"
>新增常见问题</el-button
>
</el-col>
</el-row>
</div>
</div>
</div>
</el-drawer> <!-- 保存按钮 -->
<form-buttons
@submit="onSubmitForm"
@cancel="cancelForm"
v-if="pageInfo.type != 'view'"
class="formbtns"
/>
</el-form>
</el-drawer>
</template> </template>
<script> <script>
import form from "@/assets/mixins/formdialog"; import form from "@/assets/mixins/formdialog";
export default { export default {
name: "ProductDetail", name: "ProductDetail",
mixins: [form], mixins: [form],
components: { components: {},
created() {
}, this.changePath("product");
created() { },
this.changePath("product") data() {
}, return {
data() { dynamicTags: [],
return { inputVisible: false,
propagandaList:['轮播图','短视频'], inputValue: "",
// 当前宣传形式 propagandaList: { 1: "轮播图", 2: "短视频" },
nowPropaganda:0, // 当前宣传形式
nowtab:1, nowPropaganda: [],
// 子表选中数据 nowtab: 1,
checkedProductQuestion: [], // 子表选中数据
// 产品常见问题表格数据 checkedProductQuestion: [],
productQuestionList: [], // 产品常见问题表格数据
// 遮罩层 productQuestionList: [],
loading: true, // 遮罩层
// 弹出层标题 loading: true,
title: "产品", // 弹出层标题
// 是否显示弹出层 title: "产品",
open: false, // 是否显示弹出层
direction:"rtl", open: false,
toString:[ direction: "rtl",
"hot", toString: ["hot"],
], toArrays: ["companyId"],
toArrays:[ toDate: ["publishTime"],
"companyId", // 表单校验
"categoryId" rules: {
], productName: [
toDate:[ {
"publishTime", required: true,
], message: "请输入产品名称，名称唯一",
// 表单校验 trigger: "blur",
rules: {
productName: [
{required: true,message: "请输入产品名称，名称唯一", trigger: "blur" },
{max: 20,message: "最多只能录入20个字符",trigger: "blur",},
],
productSlogan: [
{required: true,message: "请输入产品slogan", trigger: "blur" },
{max: 64,message: "最多只能录入64个字符",trigger: "blur",},
],
productLogoPath: [
{required: true,message: "请输入产品图标", trigger: "blur" },
{max: 64,message: "最多只能录入64个字符",trigger: "blur",},
],
productFacePath: [
{required: true,message: "请输入产品封面图片", trigger: "blur" },
{max: 64,message: "最多只能录入64个字符",trigger: "blur",},
],
publishTime: [
{required: true,message: "请选择发布时间" },
],
createTime: [
{required: true,message: "请选择创建时间" },
],
}
};
},
methods: {
// 重写提交表单
onSubmitForm(){
// 由于宣传形式修改，只能存在一种，所以当选中一种时另外一种清空
if(this.nowPropaganda===0){
// 选中轮播图
this.form.productVideoPath = ''
}else{
// 选中短视频
this.form.productPicPath = ''
}
// 检查常见问题list中问题不能为空
if(this.productQuestionList && this.productQuestionList.length>0){
let isNull = false
this.productQuestionList.forEach((item)=>{
if (!item.question) {
isNull = true
}
})
if(isNull){
this.$confirm('常见问题项的问题标题不能为空', '提示', {
confirmButtonText: '确定',
type: 'warning',
showCancelButton: false, //是否显示取消按钮
showClose: false, //是否显示关闭按钮
})
return;
}
}
this.submitForm()
},
// 修改宣传形式
changeNowprop(val){
this.nowPropaganda = val
},
// 问题删除
handleDeleteCompanyPatents(row) {
console.log(row);
// 由于有一些知识产权还没有id，所以这里删除选用的是字段中带的index
this.productQuestionList = this.productQuestionList.filter(
item => item.index !== row.index
);
this.form.productQuestionList = this.productQuestionList;
},
cancelForm(){
this.open = false
},
changeTab(nowtab){
this.nowtab = nowtab
this.$forceUpdate()
},
/** 产品常见问题序号 */
rowProductQuestionIndex({ row, rowIndex }) {
row.index = rowIndex + 1;
},
/** 产品常见问题添加按钮操作 */
handleAddProductQuestion() {
let obj = {};
obj.productName = "";
obj.question = "";
obj.answer = "";
obj.createTime = "";
obj.createUserId = "";
obj.updateTime = "";
this.productQuestionList.push(obj);
},
/** 产品常见问题删除按钮操作 */
handleDeleteProductQuestion() {
if (this.checkedProductQuestion.length == 0) {
this.$alert("请先选择要删除的产品常见问题数据", "提示", { confirmButtonText: "确定", });
} else {
this.productQuestionList.splice(this.checkedProductQuestion[0].index - 1, 1);
}
},
/** 单选框选中数据 */
handleProductQuestionSelectionChange(selection) {
if (selection.length > 1) {
this.$refs.productQuestion.clearSelection();
this.$refs.productQuestion.toggleRowSelection(selection.pop());
} else {
this.checkedProductQuestion = selection;
}
},
// 渲染前置处理
beforeRender(data) {
if(data.entity.productQuestionList) {
this.productQuestionList = data.entity.productQuestionList;
}
// 判断有无短视频，如果有短视频那么更改为短视频选项
if(data.entity.productVideoPath){
this.nowPropaganda = 1
}else{
this.nowPropaganda = 0
}
return data
},
/** 编辑 */
edit(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="product/edit";
this.getData();
this.pageInfo.type="edit"
this.title = "修改产品";
},
/** 新增 */
add(row) {
this.reset()
this.urls.currUrl = "product/add";
this.getData();
this.pageInfo.type="add"
this.title = "新增产品";
},
/** 查看*/
view(row) {
this.reset()
this.query = { id: row.id };
this.urls.currUrl ="product/view";
this.getData();
this.pageInfo.type="view"
this.title = "产品详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
},
beforeSubmit(data) {
data.categoryId=data.categoryId.join(",")
data.companyId=data.companyId.join(",")
return data
}, },
{ max: 20, message: "最多只能录入20个字符", trigger: "blur" },
],
productSlogan: [
{ required: true, message: "请输入产品slogan", trigger: "blur" },
{ max: 64, message: "最多只能录入64个字符", trigger: "blur" },
],
productLogoPath: [
{ required: true, message: "请输入产品图标", trigger: "blur" },
{ max: 64, message: "最多只能录入64个字符", trigger: "blur" },
],
productFacePath: [
{ required: true, message: "请输入产品封面图片", trigger: "blur" },
{ max: 64, message: "最多只能录入64个字符", trigger: "blur" },
],
publishTime: [{ required: true, message: "请选择发布时间" }],
createTime: [{ required: true, message: "请选择创建时间" }],
},
};
},
methods: {
// 删除slogan标签
handleClose(tag) {
this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
},
// 展示标签输入框
showInput() {
this.inputVisible = true;
this.$nextTick((_) => {
this.$refs.saveTagInput.$refs.input.focus();
});
},
// 确认标签输入框内容
handleInputConfirm() {
let inputValue = this.inputValue;
if (inputValue) {
this.dynamicTags.push(inputValue);
}
this.inputVisible = false;
this.inputValue = "";
},
// 重写提交表单
onSubmitForm() {
console.log(this.form);
console.log(this.$refs.imgList.imgList);
let arr = [];
arr = this.$refs.imgList.imgList.map((v) => {
return v.response ? v.response.url : v.url.substr(v.url.indexOf("f"));
});
this.form.productPicPath = arr.join(",");
// // 由于宣传形式修改，只能存在一种，所以当选中一种时另外一种清空
// if (this.nowPropaganda === 0) {
// // 选中轮播图
// this.form.productVideoPath = "";
// } else {
// // 选中短视频
// this.form.productPicPath = "";
// }
// 检查常见问题list中问题不能为空
if (this.productQuestionList && this.productQuestionList.length > 0) {
let isNull = false;
this.productQuestionList.forEach((item) => {
if (!item.question) {
isNull = true;
}
});
if (isNull) {
this.$confirm("常见问题项的问题标题不能为空", "提示", {
confirmButtonText: "确定",
type: "warning",
showCancelButton: false, //是否显示取消按钮
showClose: false, //是否显示关闭按钮
});
return;
}
}
this.submitForm();
},
// 修改宣传形式
changeNowprop(val) {
this.form.nowPropaganda = val;
this.$forceUpdate(this.form);
},
// 问题删除
handleDeleteCompanyPatents(row) {
console.log(row);
// 由于有一些知识产权还没有id，所以这里删除选用的是字段中带的index
this.productQuestionList = this.productQuestionList.filter(
(item) => item.index !== row.index
);
this.form.productQuestionList = this.productQuestionList;
},
cancelForm() {
this.open = false;
},
changeTab(nowtab) {
this.nowtab = nowtab;
this.$forceUpdate();
},
/** 产品常见问题序号 */
rowProductQuestionIndex({ row, rowIndex }) {
row.index = rowIndex + 1;
},
/** 产品常见问题添加按钮操作 */
handleAddProductQuestion() {
let obj = {};
obj.productName = "";
obj.question = "";
obj.answer = "";
obj.createTime = "";
obj.createUserId = "";
obj.updateTime = "";
this.productQuestionList.push(obj);
},
/** 产品常见问题删除按钮操作 */
handleDeleteProductQuestion() {
if (this.checkedProductQuestion.length == 0) {
this.$alert("请先选择要删除的产品常见问题数据", "提示", {
confirmButtonText: "确定",
});
} else {
this.productQuestionList.splice(
this.checkedProductQuestion[0].index - 1,
1
);
}
},
/** 单选框选中数据 */
handleProductQuestionSelectionChange(selection) {
if (selection.length > 1) {
this.$refs.productQuestion.clearSelection();
this.$refs.productQuestion.toggleRowSelection(selection.pop());
} else {
this.checkedProductQuestion = selection;
}
},
// 渲染前置处理
beforeRender(data) {
if (data.entity.productQuestionList) {
this.productQuestionList = data.entity.productQuestionList;
}
// 判断有无短视频，如果有短视频那么更改为短视频选项
// if (data.entity.productVideoPath) {
// this.nowPropaganda = 1;
// } else {
// this.nowPropaganda = 0;
// }
data.entity.categoryId
? (data.entity.categoryId = String(data.entity.categoryId))
: "";
data.entity.productSlogan && data.entity.productSlogan != ""
? (this.dynamicTags = data.entity.productSlogan.split(","))
: "";
return data;
},
/** 编辑 */
edit(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "product/edit";
this.getData();
this.pageInfo.type = "edit";
this.title = "修改产品";
},
/** 新增 */
add(row) {
this.reset();
this.urls.currUrl = "product/add";
this.getData();
this.pageInfo.type = "add";
this.title = "新增产品";
},
/** 查看*/
view(row) {
this.reset();
this.query = { id: row.id };
this.urls.currUrl = "product/view";
this.getData();
this.pageInfo.type = "view";
this.title = "产品详细";
},
/**取消按钮 */
cancel() {
this.open = false;
},
/**获取数据后弹框 */
afterRender(data) {
this.open = true;
this.dict.propagandaList = { 1: "轮播图", 2: "短视频" };
this.form.nowPropaganda = [];
this.$forceUpdate(this.dict);
this.$forceUpdate(this.form);
},
afterSubmit(data) { beforeSubmit(data) {
this.open = false; // data.categoryId = data.categoryId.join(",");
this.$emit("ok"); data.companyId = data.companyId.join(",");
}, this.dynamicTags && this.dynamicTags.length > 0
? (data.productSlogan = this.dynamicTags.join(","))
: (data.productSlogan = "");
return data;
},
// 表单重置 afterSubmit(data) {
reset() { this.open = false;
this.form = { this.$emit("ok");
productName : "", },
productCode : "",
productSlogan : "", // 表单重置
productLogoPath : "", reset() {
productFacePath : "", this.form = {
productVideoPath : "", productName: "",
productPicPath : "", productCode: "",
productIntroduction : "", productSlogan: "",
productDetail : "", productLogoPath: "",
publishTime : null, productFacePath: "",
hot : 0, productVideoPath: "",
productRemark : "", productPicPath: "",
}; productIntroduction: "",
this.resetForm("form"); productDetail: "",
}, publishTime: null,
resetForm(refName) { hot: 0,
if (this.$refs[refName]) { productRemark: "",
this.$refs[refName].resetFields(); };
} this.resetForm("form");
}, },
}, resetForm(refName) {
}; if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
},
},
};
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
/deep/.el-tag + .el-tag {
margin-left: 10px;
}
/deep/.button-new-tag {
margin-left: 10px;
height: 32px;
line-height: 30px;
padding-top: 0;
padding-bottom: 0;
}
.input-new-tag {
width: 90px;
margin-left: 10px;
vertical-align: bottom;
}
.del { .del {
color: red; color: red;
} }
...@@ -343,43 +526,43 @@ ...@@ -343,43 +526,43 @@
padding-right: 30px; padding-right: 30px;
border-top: 1px solid #dcdcdc; border-top: 1px solid #dcdcdc;
} }
.tabs{ .tabs {
background: #dcdcdc59; background: #dcdcdc59;
height: 50px; height: 50px;
display: flex; display: flex;
padding-left: 10px; padding-left: 10px;
.tab{ .tab {
height: 100%; height: 100%;
line-height: 50px; line-height: 50px;
padding: 0 20px; padding: 0 20px;
width: 120px; width: 120px;
align-items: center; align-items: center;
// display: flex; // display: flex;
// justify-content: center; // justify-content: center;
// align-content: center; // align-content: center;
} }
.activetab{ .activetab {
background: white; background: white;
} }
} }
.form{ .form {
display: flex; display: flex;
.formleft{ .formleft {
width: 600px; width: 600px;
border-right: 1px solid gainsboro; border-right: 1px solid gainsboro;
flex-shrink: 0; flex-shrink: 0;
flex-grow: 0; flex-grow: 0;
} }
.el-col-12{ .el-col-12 {
width: 96% !important; width: 96% !important;
} }
.formright{ .formright {
margin-left: 10px; margin-left: 10px;
width: 100%; width: 100%;
.content{ .content {
margin-top: 10px; margin-top: 10px;
width: 100%; width: 100%;
}
} }
}
} }
</style> </style>
\ No newline at end of file
enterprise-manager-ui/admin/src/views/product/list.vue
View file @ afaac2d9
<template> <template>
<div class="page"> <div class="page">
<LayoutTable ref="layouttable" :data="tableData" :config="tableConfig" notDel > <LayoutTable
<!-- 热门0为非热门1为热门 --> ref="layouttable"
<div slot="table-search-left" class="onlyhot"> :data="tableData"
<el-checkbox :config="tableConfig"
:key="0" notDel
v-model="ishot" >
:checked="ishot" <!-- 热门0为非热门1为热门 -->
@change="changeIshot" <div slot="table-search-left" class="onlyhot">
> <el-checkbox
:key="0"
</el-checkbox> v-model="ishot"
只看热门 :checked="ishot"
</div> @change="changeIshot"
>
</LayoutTable> </el-checkbox>
只看热门
</div>
</LayoutTable>
<drawer-show ref="drawerform" @ok="getData" />
<drawer-show ref="drawerform" @ok="getData" /> </div>
</div>
</template> </template>
<script> <script>
/** 表单弹出框模式需引入 */ /** 表单弹出框模式需引入 */
import drawerShow from "./drawershow"; import drawerShow from "./drawershow";
import table from "@/assets/mixins/table"; import table from "@/assets/mixins/table";
export default { export default {
name: "ProductList", name: "ProductList",
components: { components: {
drawerShow drawerShow,
}, },
mixins: [table], mixins: [table],
mounted() { mounted() {
// 重写查询 // 重写查询
this.$refs.layouttable.$refs.searchform.onSubmit = this.onSearch this.$refs.layouttable.$refs.searchform.onSubmit = this.onSearch;
// 重写搜索清除 // 重写搜索清除
this.$refs.layouttable.$refs.searchform.cleanForm = this.cleanForm this.$refs.layouttable.$refs.searchform.cleanForm = this.cleanForm;
}, },
methods: { methods: {
renderTable(tableData) { renderTable(tableData) {
return ( return (
<el-table stripe data={tableData} class="total-table"> <el-table stripe data={tableData} class="total-table">
{this.columnSet.map((item) => this.renderTableColumn(item))} {this.columnSet.map((item) => this.renderTableColumn(item))}
</el-table> </el-table>
); );
}, },
renderTableColumn(options) { renderTableColumn(options) {
return ( return (
<el-table-column <el-table-column
prop={options.prop} prop={options.prop}
label={options.label} label={options.label}
width={options.width} width={options.width}
formatter={options.formatter} formatter={options.formatter}
> ></el-table-column>
</el-table-column> );
); },
}, /** 重写新增方法 */
/** 重写新增方法 */ toAdd(row) {
toAdd(row) { this.$refs.drawerform.add(row);
this.$refs.drawerform.add(row); },
}, /** 重写编辑方法 */
/** 重写编辑方法 */ toEdit(row) {
toEdit(row) { this.$refs.drawerform.edit(row);
this.$refs.drawerform.edit(row); },
}, /** 重写查看方法 */
/** 重写查看方法 */ toView(row) {
toView(row) { this.$refs.drawerform.view(row);
this.$refs.drawerform.view(row); },
}, // 重写查询
// 重写查询 onSearch() {
onSearch(){ if (this.ishot) {
if(this.ishot){ this.$refs.layouttable.$refs.searchform.form = Object.assign(
this.$refs.layouttable.$refs.searchform.form = Object.assign({}, this.$refs.layouttable.$refs.searchform.form, {hot:1}) {},
} this.$refs.layouttable.$refs.searchform.form,
let { path, query } = this.$refs.layouttable.$refs.searchform.$route; { hot: 1 }
let data = this.$refs.layouttable.$refs.searchform.decode(this.$refs.layouttable.$refs.searchform.form); );
this.$refs.layouttable.$refs.searchform.$router.push({ }
path: path, let { path, query } = this.$refs.layouttable.$refs.searchform.$route;
query: Object.assign({}, query, data), let data = this.$refs.layouttable.$refs.searchform.decode(
}); this.$refs.layouttable.$refs.searchform.form
}, );
// 重写搜索清除 this.$refs.layouttable.$refs.searchform.$router.push({
cleanForm(){ path: path,
this.ishot = false query: Object.assign({}, query, data),
this.$refs.layouttable.$refs.searchform.form.hot = undefined });
this.$forceUpdate() },
this.$refs.layouttable.$refs.searchform.clean(); // 重写搜索清除
this.$refs.layouttable.$refs.searchform.onSubmit(); cleanForm() {
}, this.ishot = false;
changeIshot(val){ this.$refs.layouttable.$refs.searchform.form.hot = undefined;
this.ishot = val this.$forceUpdate();
} this.$refs.layouttable.$refs.searchform.clean();
this.$refs.layouttable.$refs.searchform.onSubmit();
}, },
data() { changeIshot(val) {
return { this.ishot = val;
ishot:false, },
config: { },
search: [ data() {
{ return {
name: "categoryId", ishot: false,
type: "select", config: {
placeholder:"请选择产品分类", search: [
label: "产品分类" {
}, name: "categoryId",
{ type: "select",
name: "companyId", placeholder: "请选择产品分类",
type: "select", label: "产品分类",
placeholder:"请选择所属企业", },
label: "所属企业" {
}, name: "companyId",
{ type: "select",
name: "productName", placeholder: "请选择所属企业",
type: "text", label: "所属企业",
label: "产品名称", },
fuzzy: true, {
}, name: "productName",
], type: "text",
columns: [ label: "产品名称",
{type: "index",label: "序号",width: 50}, fuzzy: true,
},
],
columns: [
{ type: "index", label: "序号", width: 50 },
{label: "产品名称", prop: "productName"}, { label: "产品名称", prop: "productName" },
{label: "产品分类", prop: "categoryId",formatter: this.formatters}, { label: "产品分类", prop: "categoryId", formatter: this.formatters },
{label: "所属企业", prop: "companyId",formatter: this.formatters}, { label: "所属企业", prop: "companyId", formatter: this.formatters },
{label: "产品介绍", prop: "productIntroduction" , width: 500,formatter: this.formatters}, {
label: "产品介绍",
prop: "productIntroduction",
width: 500,
formatter: this.formatters,
},
{label: "发布时间", prop: "publishTime", formatter: this.formatterDate}, {
label: "发布时间",
prop: "publishTime",
formatter: this.formatterDate,
},
{label: "热门", prop: "hot",formatter: this.formatterYES, width: 50}, {
label: "热门",
prop: "hot",
formatter: this.formatterYES,
width: 50,
},
{label: "最近更新时间", prop: "updateTime", formatter: this.formatterDate}, {
label: "最近更新时间",
prop: "updateTime",
formatter: this.formatterDate,
},
{ {
label: "操作", label: "操作",
width: 240, width: 240,
formatter: row => { formatter: (row) => {
return ( return (
<table-buttons noAdd noView row={row} onEdit={this.toEdit} onView={this.toView} onDel={this.toDel} /> <table-buttons
); noAdd
} noView
} row={row}
] onEdit={this.toEdit}
} onView={this.toView}
}; onDel={this.toDel}
} />
);
},
},
],
},
}; };
},
};
</script> </script>
<style lang="less" > <style lang="less" >
.table-form{ .table-form {
display: flex ; display: flex;
} }
.onlyhot{ .onlyhot {
margin-right: 20px; margin-right: 20px;
line-height: 30px; line-height: 30px;
font-size: 14px; font-size: 14px;
color: #333333; color: #333333;
} }
</style> </style>
\ No newline at end of file
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