Skip to content

P
pica.cloud.web-admin-discuss
提交 ec205d47 编写于 作者: qingzhong.ren@picahealth.com's avatar qingzhong.ren@picahealth.com
浏览文件
操作

静态部分

上级 61a868a9
隐藏空白字符变更
内嵌 并排
正在显示 包含 838 行增加 和 545 行删除
src/views/question-naire/question-list.vue
浏览文件 @ ec205d47
<template> <template>
<div class="question-wrap"> <div class="question-wrap">
<bread-crumb <bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond">
:curmbFirst="curmbFirst" </bread-crumb>
:curmbSecond="curmbSecond"> <div class="question-content screenSet" id="screenSet">
</bread-crumb> <el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<div class="question-content screenSet" id="screenSet"> <el-form
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;"> ref="serchForm"
<el-form ref="serchForm" :model="searchParam" label-width="75px" label-suffix=":" style="width:100%;"> :model="searchParam"
<el-col :span="6"> label-width="75px"
<el-form-item label="问卷名称"> label-suffix=":"
<el-input v-model="searchParam.name" size="mini" placeholder="请输入问卷名称"></el-input> style="width:100%;"
</el-form-item> >
</el-col> <el-col :span="6">
<el-col :span="6"> <el-form-item label="问卷名称">
<el-form-item label="状态"> <el-input
<el-select clearable v-model="searchParam.status" size="mini" placeholder="请选择问卷状态"> v-model="searchParam.name"
<el-option size="mini"
v-for="(item,index) in statuSelect" placeholder="请输入问卷名称"
:key="index" ></el-input>
:label="item.label" </el-form-item>
:value="item.value"> </el-col>
</el-option> <el-col :span="6">
</el-select> <el-form-item label="状态">
</el-form-item> <el-select
</el-col> clearable
<el-col :span="12" style="text-align:right;padding:0 30px 15px 0;"> v-model="searchParam.status"
<el-button type="primary" size="small" @click="search(1)">查询</el-button> size="mini"
<el-button type="default" size="small" @click="reseat">重置</el-button> placeholder="请选择问卷状态"
</el-col> >
</el-form> <el-option
</el-row> v-for="(item, index) in statuSelect"
<el-button class="add-question" type="primary" size="small" @click="addQuestion">新增问卷</el-button> :key="index"
<el-table :label="item.label"
:data="tableData" :value="item.value"
style="width: 100%" v-loading="loading"> >
<el-table-column prop="id" label="问卷编号" min-width="50" align="center"></el-table-column> </el-option>
<el-table-column prop="name" label="问卷名称" min-width="100" align="center"></el-table-column> </el-select>
<el-table-column label="最后修改人" min-width="50" align="center"> </el-form-item>
<template slot-scope="scope"> </el-col>
<span>{{ scope.row.modifiedId | modifyType(modifyArray) }}</span> <el-col :span="12" style="text-align:right;padding:0 30px 15px 0;">
</template> <el-button type="primary" size="small" @click="search(1)"
</el-table-column> >查询</el-button
<el-table-column label="最后修改时间" min-width="100" align="center"> >
<template slot-scope="scope"> <el-button type="default" size="small" @click="reseat"
<span>{{ scope.row.modifiedTime | liveDateFilter }}</span> >重置</el-button
</template> >
</el-table-column> </el-col>
<el-table-column label="问卷状态" min-width="80" align="center"> </el-form>
<template slot-scope="scope"> </el-row>
<span>{{ scope.row.status | questionStatus }}</span> <el-button
</template> class="add-question"
</el-table-column> type="primary"
<el-table-column label="操作" fixed="right" align="center" min-width="200"> size="small"
<template slot-scope="scope"> @click="addQuestion"
<el-button type="primary" size="small" @click="editQuestion(scope.row)">编辑</el-button> >新增问卷</el-button
<el-button type="primary" v-if="scope.row.status == 1" size="small" @click="onAndDownLine(scope.row)">上线</el-button> >
<el-button type="primary" v-if="scope.row.status == 2" size="small" @click="onAndDownLine(scope.row)">下线</el-button> <el-table :data="tableData" style="width: 100%" v-loading="loading">
<!-- <el-button type="primary" size="small" @click="reviewQuestion(scope.row)">查看题库</el-button> --> <el-table-column
</template> prop="id"
</el-table-column> label="问卷编号"
<div slot="empty"> min-width="50"
<div class="table-empty"> align="center"
<img src="../../assets/image/no-content1.png" /> ></el-table-column>
<p>没有查询到相关结果</p> <el-table-column
</div> prop="name"
</div> label="问卷名称"
</el-table> min-width="100"
<!-- 分页 --> align="center"
<div class="pagination"> ></el-table-column>
<el-pagination <el-table-column label="最后修改人" min-width="50" align="center">
background <template slot-scope="scope">
@size-change="handleSizeChange" <span>{{ scope.row.modifiedId | modifyType(modifyArray) }}</span>
@current-change="handleCurrentChange" </template>
:current-page="searchParam.pageNo" </el-table-column>
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]" <el-table-column label="最后修改时间" min-width="100" align="center">
:page-size="searchParam.pageSize" <template slot-scope="scope">
layout="total, sizes, prev, pager, next, jumper" <span>{{ scope.row.modifiedTime | liveDateFilter }}</span>
:total="totalRows"> </template>
</el-pagination> </el-table-column>
</div> <el-table-column label="问卷状态" min-width="80" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status | questionStatus }}</span>
</template>
</el-table-column>
<el-table-column
label="操作"
fixed="right"
align="center"
min-width="200"
>
<template slot-scope="scope">
<el-button
type="primary"
size="small"
@click="editQuestion(scope.row)"
>编辑</el-button
>
<el-button
type="primary"
v-if="scope.row.status == 1"
size="small"
@click="onAndDownLine(scope.row)"
>上线</el-button
>
<el-button
type="primary"
v-if="scope.row.status == 2"
size="small"
@click="onAndDownLine(scope.row)"
>下线</el-button
>
<!-- <el-button type="primary" size="small" @click="reviewQuestion(scope.row)">查看题库</el-button> -->
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有查询到相关结果</p>
</div>
</div> </div>
<!-- 问卷新增(编辑) --> </el-table>
<el-dialog <!-- 分页 -->
class="img-edit" <div class="pagination">
:title="questionTitle" <el-pagination
:visible.sync="discussEditVisible" background
:close-on-click-modal="false" @size-change="handleSizeChange"
:close-on-press-escape="false"> @current-change="handleCurrentChange"
<el-form ref="questionForm" :rules="rules" :model="questionEditList" label-width="220px" label-suffix=":" size="mini"> :current-page="searchParam.pageNo"
<el-form-item> :page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
<el-radio-group v-model="questionEditList.showType" style="margin-left: -65px;"> :page-size="searchParam.pageSize"
<el-radio :label="1">单题显示</el-radio> layout="total, sizes, prev, pager, next, jumper"
<el-radio :label="2">平铺显示</el-radio> :total="totalRows"
</el-radio-group> >
</el-form-item> </el-pagination>
<el-form-item label="问卷标题" prop="name"> </div>
<el-input v-model="questionEditList.name" maxlength="10" placeholder="标题最多10字符" style="width: 300px;"></el-input>
</el-form-item>
<el-form-item label="题库导入" prop="fileName">
<el-col :span="12">
<el-input class="form-input" :placeholder="excelFileName" v-model="fileName" disabled style="width: 99%;"/>
</el-col>
<el-col :span="10">
<el-upload
class="upload-demo"
style="display: inline-block;width: 80px;"
action="#"
accept=".xlsx"
:before-upload="beforeImport"
:limit="1">
<el-button type="primary" size="mini">导入题库</el-button>
</el-upload>
<el-button type="default" size="mini" @click="uploadTemplate">模板下载</el-button>
</el-col>
</el-form-item>
<el-form-item label="下一题按钮" v-if="questionEditList.showType == 1">
<div class="submit-btn" style="margin-right:20px;">
<p>置灰不可点</p>
<el-upload
v-model="questionEditList.nextDisableClickUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_1">
<el-button size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img v-if="questionEditList.nextDisableClickUrl" :src="questionEditList.nextDisableClickUrl" class="bg-img">
<img v-if="!questionEditList.nextDisableClickUrl" class="bg-img" src="https://files.yunqueyi.com/image/png/common/20190408164003674.png">
</div>
</div>
<div class="submit-btn">
<p>点亮可点</p>
<el-upload
v-model="questionEditList.nextClickUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_2">
<el-button size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img v-if="questionEditList.nextClickUrl" :src="questionEditList.nextClickUrl" class="bg-img">
<img v-if="!questionEditList.nextClickUrl" class="bg-img" src="https://files.yunqueyi.com/image/png/common/20190408164015812.png">
</div>
</div>
</el-form-item>
<el-form-item label="头部样式" v-if="questionEditList.showType == 2">
<el-radio-group v-model="questionEditList.headStyle">
<el-radio :label="1">文字</el-radio>
<el-radio :label="2">图片</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="副标题" v-if="questionEditList.showType == 2 && questionEditList.headStyle == 1">
<el-input v-model="questionEditList.subheading" maxlength="20" placeholder="副标题最多20字符" style="width: 300px;"></el-input>
</el-form-item>
<el-form-item label="问卷导言" v-if="questionEditList.showType == 2">
<el-input v-model="questionEditList.questionIntro" maxlength="210" placeholder="最多210字符" style="width: 300px;"></el-input>
</el-form-item>
<el-form-item label="问卷起始时间" v-if="questionEditList.showType == 2 && questionEditList.headStyle == 1">
<el-date-picker
type="datetime"
placeholder="开始时间"
v-model="questionEditList.startDate"
style="width: 181px;"
:picker-options="endDateOpt"
>
</el-date-picker>
<span>-</span>
<el-date-picker
type="datetime"
placeholder="结束时间"
v-model="questionEditList.endDate"
style="width: 181px;"
:picker-options="endDateOpt1"
default-time="23:59:59"
>
</el-date-picker>
</el-form-item>
<div v-if="questionEditList.showType == 2 && questionEditList.headStyle == 2">
<el-form-item class="submit-btn" label="头图">
<el-upload
v-model="questionEditList.headDiagramUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_4">
<el-button class="head-btn" size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img v-if="questionEditList.headDiagramUrl" :src="questionEditList.headDiagramUrl" class="head-bg-img">
<img v-if="!questionEditList.headDiagramUrl" class="head-bg-img" src="../../assets/image/default.png">
</div>
</el-form-item>
</div>
<el-form-item class="submit-btn" label="提交按钮">
<el-upload
v-model="questionEditList.submitButtomUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_3">
<el-button size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img v-if="questionEditList.submitButtomUrl" :src="questionEditList.submitButtomUrl" class="bg-img">
<img v-if="!questionEditList.submitButtomUrl" class="bg-img" src="https://files.yunqueyi.com/image/png/common/20190408164026451.png">
</div>
</el-form-item>
<el-form-item label="问卷填写完毕提示文案" prop="promptCopy">
<el-input v-model="questionEditList.promptCopy" maxlength="40" style="width: 300px;"></el-input>
<span style="font-size:12px;">标题最多40字符</span>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align:center;">
<el-button type="primary" size="small" @click="submitQuestion" style="width:120px;">提交</el-button>
</div>
</el-dialog>
</div> </div>
<!-- 问卷新增(编辑) -->
<el-dialog
class="img-edit"
:title="questionTitle"
:visible.sync="discussEditVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
>
<el-form
ref="questionForm"
:rules="rules"
:model="questionEditList"
label-width="220px"
label-suffix=":"
size="mini"
>
<el-form-item>
<el-radio-group
v-model="questionEditList.showType"
style="margin-left: -65px;"
>
<el-radio :label="1">单题显示</el-radio>
<el-radio :label="2">平铺显示</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="问卷标题" prop="name">
<el-input
v-model="questionEditList.name"
maxlength="30"
placeholder="标题最多30字符"
style="width: 300px;"
></el-input>
</el-form-item>
<el-form-item label="题库导入" prop="fileName">
<el-col :span="12">
<el-input
class="form-input"
:placeholder="excelFileName"
v-model="fileName"
disabled
style="width: 99%;"
/>
</el-col>
<el-col :span="10">
<el-upload
class="upload-demo"
style="display: inline-block;width: 80px;"
action="#"
accept=".xlsx"
:before-upload="beforeImport"
:limit="1"
>
<el-button type="primary" size="mini">导入题库</el-button>
</el-upload>
<el-button type="default" size="mini" @click="uploadTemplate"
>模板下载</el-button
>
</el-col>
</el-form-item>
<el-form-item label="下一题按钮" v-if="questionEditList.showType == 1">
<div class="submit-btn" style="margin-right:20px;">
<p>置灰不可点</p>
<el-upload
v-model="questionEditList.nextDisableClickUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_1"
>
<el-button size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img
v-if="questionEditList.nextDisableClickUrl"
:src="questionEditList.nextDisableClickUrl"
class="bg-img"
/>
<img
v-if="!questionEditList.nextDisableClickUrl"
class="bg-img"
src="https://files.yunqueyi.com/image/png/common/20190408164003674.png"
/>
</div>
</div>
<div class="submit-btn">
<p>点亮可点</p>
<el-upload
v-model="questionEditList.nextClickUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_2"
>
<el-button size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img
v-if="questionEditList.nextClickUrl"
:src="questionEditList.nextClickUrl"
class="bg-img"
/>
<img
v-if="!questionEditList.nextClickUrl"
class="bg-img"
src="https://files.yunqueyi.com/image/png/common/20190408164015812.png"
/>
</div>
</div>
</el-form-item>
<el-form-item label="头部样式" v-if="questionEditList.showType == 2">
<el-radio-group v-model="questionEditList.headStyle">
<el-radio :label="1">文字</el-radio>
<el-radio :label="2">图片</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item
label="副标题"
v-if="
questionEditList.showType == 2 && questionEditList.headStyle == 1
"
>
<el-input
v-model="questionEditList.subheading"
maxlength="20"
placeholder="副标题最多20字符"
style="width: 300px;"
></el-input>
</el-form-item>
<el-form-item label="问卷导言" v-if="questionEditList.showType == 2">
<el-input
v-model="questionEditList.questionIntro"
maxlength="210"
placeholder="最多210字符"
style="width: 300px;"
></el-input>
</el-form-item>
<el-form-item label="基本信息" v-if="questionEditList.showType == 2">
<el-checkbox
v-for="(item, index) in questionEditList.baseInfoList"
:label="item.typeValue"
:key="index"
v-model="item.checked"
>{{ item.typeName }}</el-checkbox
>
</el-form-item>
<el-form-item
label="问卷起始时间"
v-if="
questionEditList.showType == 2 && questionEditList.headStyle == 1
"
>
<el-date-picker
type="datetime"
placeholder="开始时间"
v-model="questionEditList.startDate"
style="width: 181px;"
:picker-options="endDateOpt"
>
</el-date-picker>
<span>-</span>
<el-date-picker
type="datetime"
placeholder="结束时间"
v-model="questionEditList.endDate"
style="width: 181px;"
:picker-options="endDateOpt1"
default-time="23:59:59"
>
</el-date-picker>
</el-form-item>
<div
v-if="
questionEditList.showType == 2 && questionEditList.headStyle == 2
"
>
<el-form-item class="submit-btn" label="头图">
<el-upload
v-model="questionEditList.headDiagramUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_4"
>
<el-button class="head-btn" size="mini" type="primary"
>上传</el-button
>
</el-upload>
<div class="uploat-content">
<img
v-if="questionEditList.headDiagramUrl"
:src="questionEditList.headDiagramUrl"
class="head-bg-img"
/>
<img
v-if="!questionEditList.headDiagramUrl"
class="head-bg-img"
src="../../assets/image/default.png"
/>
</div>
</el-form-item>
</div>
<el-form-item class="submit-btn" label="提交按钮">
<el-upload
v-model="questionEditList.submitButtomUrl"
class="avatar-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeAvatarUpload_3"
>
<el-button size="mini" type="primary">上传</el-button>
</el-upload>
<div class="uploat-content">
<img
v-if="questionEditList.submitButtomUrl"
:src="questionEditList.submitButtomUrl"
class="bg-img"
/>
<img
v-if="!questionEditList.submitButtomUrl"
class="bg-img"
src="https://files.yunqueyi.com/image/png/common/20190408164026451.png"
/>
</div>
</el-form-item>
<el-form-item label="问卷填写完毕提示文案" prop="promptCopy">
<el-input
v-model="questionEditList.promptCopy"
maxlength="40"
style="width: 300px;"
></el-input>
<span style="font-size:12px;">限40字符</span>
</el-form-item>
<el-form-item
label="登录权限控制"
v-if="questionEditList.showType == 2"
>
<div class="login-auth">
<el-checkbox
v-for="(item, index) in questionEditList.loginAuthList"
:label="item.typeValue"
:key="index"
v-model="item.checked"
>{{ item.typeName }}</el-checkbox
>
</div>
</el-form-item>
<el-form-item
label="问卷填写次数"
v-if="questionEditList.showType == 2"
>
<el-radio v-model="questionEditList.limitNumFlag" label="0">
<el-input
v-model="questionEditList.limitNum"
controls-position="right"
:min="1"
style="width: 100px;"
@blur="checkLimitNum"
@focus="questionEditList.limitNumFlag = '0'"
></el-input>
</el-radio>
<el-radio v-model="questionEditList.limitNumFlag" label="1"
>不限制填写次数</el-radio
>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align:center;">
<el-button
type="primary"
size="small"
@click="submitQuestion"
style="width:120px;"
>提交</el-button
>
</div>
</el-dialog>
</div>
</template> </template>
<script> <script>
import BreadCrumb from '../../components/breadcrumb.vue' import BreadCrumb from "../../components/breadcrumb.vue";
import * as commonUtil from '../../utils/utils' import * as commonUtil from "../../utils/utils";
import { getFilePath, doUpload } from '../../utils/qiniu-util' import { getFilePath, doUpload } from "../../utils/qiniu-util";
import { QUESTION_UPLOAD_TEMPLATE } from '../../utils/constants' import { QUESTION_UPLOAD_TEMPLATE } from "../../utils/constants";
let vm = null let vm = null;
export default { export default {
components: { components: {
BreadCrumb BreadCrumb
},
data() {
return {
curmbFirst: "组件",
curmbSecond: "问卷管理",
questionTitle: "问卷新增/编辑",
discussEditVisible: false,
excelFileName: "",
fileName: "",
fileArray: [],
tableData: [],
totalRows: 0,
loading: false,
searchParam: {
name: "",
status: "",
pageSize: 15,
pageNo: 1
},
modifyArray: [],
questionEditList: {
id: "",
showType: 1,
name: "",
nextDisableClickUrl: "",
nextClickUrl: "",
submitButtomUrl: "",
promptCopy: "",
headDiagramUrl: "",
headStyle: 1,
subheading: "",
baseInfoList: [], //基本信息
questionIntro: "",
startDate: "",
endDate: "",
loginAuthList: [], //登录权限控制
limitNumFlag: "0", //填写次数flag
limitNum: 1 //填写次数
},
endDateOpt: {
disabledData: time => {
if (
this.questionEditList.endDate != "" &&
this.questionEditList.endDate != null
) {
return (
time.getTime() >
new Date(this.questionEditList.startDate).getTime()
);
}
}
},
endDateOpt1: {
disabledDate: time => {
return (
time.getTime() < new Date(this.questionEditList.startDate).getTime()
);
}
},
rules: {
name: [{ required: true, message: "请输入问卷标题", trigger: "blur" }],
promptCopy: [
{
required: true,
message: "请输入问卷填写完毕提示文案",
trigger: "blur"
}
]
},
statuSelect: [
{
label: "下线",
value: 1
},
{
label: "上线",
value: 2
}
]
};
},
created() {
vm = this;
vm.search();
vm.getAllModify();
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
// 查询
search(flag) {
if (flag) vm.searchParam.pageNo = 1;
vm.GET("/campaign/adminQuestionnaire/queryList", vm.searchParam).then(
res => {
if (res.code == "000000") {
vm.tableData = res.data.questionnaireList;
vm.totalRows = res.data.total;
}
}
);
}, },
data() { handleSizeChange(value) {
return { vm.searchParam.pageSize = value;
curmbFirst: '组件', vm.search();
curmbSecond: '问卷管理', },
questionTitle: '问卷新增/编辑', handleCurrentChange(value) {
discussEditVisible: false, vm.searchParam.pageNo = value;
excelFileName: '', vm.search();
fileName: '', },
fileArray: [], reseat() {
tableData: [], vm.searchParam.name = "";
totalRows: 0, vm.searchParam.status = "";
loading:false, vm.search();
searchParam: { },
name: '', // 获取所有修改人
status: '', getAllModify() {
pageSize: 15, vm.GET("/campaign/adminQuestionnaire/getAllUser").then(res => {
pageNo: 1 if (res.code == "000000") {
}, vm.modifyArray = res.data;
modifyArray: [], }
questionEditList: { });
id: '', },
showType: 1, // 新增问卷
name: '', addQuestion() {
nextDisableClickUrl: '', vm.discussEditVisible = true;
nextClickUrl: '', if (vm.$refs.questionForm !== undefined) {
submitButtomUrl: '', vm.$refs.questionForm.resetFields();
promptCopy: '', }
headDiagramUrl: '', vm.questionEditList = Object.assign(
headStyle: 1, {},
subheading: '', {
questionIntro: '', id: "",
startDate: '', showType: 1,
endDate: '' name: "",
}, nextDisableClickUrl: "",
endDateOpt: { nextClickUrl: "",
disabledData: (time) => { submitButtomUrl: "",
if ( this.questionEditList.endDate != "" && this.questionEditList.endDate != null) { promptCopy: "您已成功提交问卷，感谢您的参与！",
return time.getTime() > new Date(this.questionEditList.startDate).getTime(); headDiagramUrl: "",
} headStyle: 1,
} subheading: "",
baseInfoList: [
{
typeName: "姓名",
typeValue: "name",
checked: true
}, },
endDateOpt1: { {
disabledDate: time => { typeName: "手机号",
return ( typeValue: "mobile",
time.getTime() < new Date(this.questionEditList.startDate).getTime() checked: false
);
}
}, },
rules: { {
name: [ typeName: "地址",
{ required: true, message: '请输入问卷标题', trigger: 'blur' } typeValue: "address",
], checked: false
promptCopy: [ }
{ required: true, message: '请输入问卷填写完毕提示文案', trigger: 'blur' } ],
] questionIntro: "",
startDate: "",
endDate: "",
loginAuthList: [
{
typeName: "云鹊医app",
typeValue: "1",
checked: true
}, },
statuSelect: [ {
{ typeName: "云鹊医h5",
label: '下线', typeValue: "2",
value: 1 checked: false
},{ }
label: '上线', ],
value: 2 limitNumFlag: "0",
} limitNum: 1
]
} }
);
vm.fileName = "";
vm.fileArray = [];
vm.excelFileName = "";
}, },
created() { // 编辑
vm = this editQuestion(row) {
vm.search() if (vm.$refs.questionForm !== undefined) {
vm.getAllModify() vm.$refs.questionForm.resetFields();
}
vm.discussEditVisible = true;
vm.excelFileName = "";
vm.fileName = "";
vm.fileArray = [];
vm.GET("/campaign/adminQuestionnaire/getQuestionnaireById", {
id: row.id
}).then(res => {
if (res.code == "000000") {
console.log(res.data);
vm.questionEditList = Object.assign({}, res.data);
vm.questionEditList.limitNumFlag = res.data.limitNum < 1 ? "0" : "1";
}
});
}, },
// 挂载到Dom完成时 // 上线/下线
mounted: function() { onAndDownLine(row) {
commonUtil.resizeHeight() let req = null;
if (row.status == 1) {
req = {
id: row.id,
status: 2
};
} else {
req = {
id: row.id,
status: 1
};
}
vm.GET("/campaign/adminQuestionnaire/upperOrLowerShip", req).then(res => {
if (res.code == "000000") {
vm.search();
}
});
}, },
methods: { // 导入题库
// 查询 beforeImport(file) {
search(flag) { if (commonUtil.isEmptyUtils(file)) return;
if(flag) vm.searchParam.pageNo = 1 let arr = file.type.split("/");
vm.GET('/campaign/adminQuestionnaire/queryList',vm.searchParam).then((res) => { let ext = "." + arr[1];
if(res.code == '000000') { let reader = new FileReader();
vm.tableData = res.data.questionnaireList reader.onload = function(e) {
vm.totalRows = res.data.total let fileJson = {
} fileName: file.name,
}) file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
}, ext: ext
handleSizeChange(value) { };
vm.searchParam.pageSize = value vm.fileArray = [
vm.search() {
}, base64: fileJson
handleCurrentChange(value) { }
vm.searchParam.pageNo = value ];
vm.search() vm.fileName = file.name;
}, vm.excelFileName = file.name;
reseat() { vm.$message.info("读取完毕");
vm.searchParam.name = '' };
vm.searchParam.status = '' reader.readAsDataURL(file);
vm.search() },
}, // 模板下载
// 获取所有修改人 uploadTemplate() {
getAllModify() { window.location.href = QUESTION_UPLOAD_TEMPLATE;
vm.GET('/campaign/adminQuestionnaire/getAllUser').then((res) => { },
if(res.code == '000000') { // 置灰不可点图片上传
vm.modifyArray = res.data beforeAvatarUpload_1(file) {
} if (commonUtil.isEmptyUtils(file)) return;
}) vm.imgDoUpload(file, 1, 50, 750, 100);
}, },
// 新增问卷 // 点亮图片上传
addQuestion() { beforeAvatarUpload_2(file) {
vm.discussEditVisible = true if (commonUtil.isEmptyUtils(file)) return;
if (vm.$refs.questionForm !== undefined) { vm.imgDoUpload(file, 2, 50, 750, 100);
vm.$refs.questionForm.resetFields(); },
} // 提交图片上传
vm.questionEditList = Object.assign({},{ beforeAvatarUpload_3(file) {
id: '', if (commonUtil.isEmptyUtils(file)) return;
showType: 1, vm.imgDoUpload(file, 3, 50, 750, 100);
name: '', },
nextDisableClickUrl: '', // 头图图片上传
nextClickUrl: '', beforeAvatarUpload_4(file) {
submitButtomUrl: '', if (commonUtil.isEmptyUtils(file)) return;
promptCopy: '', vm.imgDoUpload(file, 4, 1024, 750, -1);
headDiagramUrl: '', },
headStyle: 1, imgDoUpload(file, urlType, size, w, h) {
subheading: '', const isSize = file.size / 1024 < size;
questionIntro: '', if (!isSize) {
startDate: '', if (size / 1024) {
endDate: '' vm.$message.info("上传图片要小于" + size / 1024 + "M");
}); } else {
vm.fileName = '' vm.$message.info("上传图片要小于" + size + "k");
vm.fileArray = [] }
vm.excelFileName = '' return;
}, }
// 编辑 var _img = new FileReader();
editQuestion(row) { _img.readAsDataURL(file);
if (vm.$refs.questionForm !== undefined) { _img.onload = function(theFile) {
vm.$refs.questionForm.resetFields(); let image = new Image();
} image.src = theFile.target.result;
vm.discussEditVisible = true image.onload = function() {
vm.excelFileName = '' let _this = this;
vm.fileName = '' let uploadFlag = false;
vm.fileArray = [] if (h == -1) {
vm.GET('/campaign/adminQuestionnaire/getQuestionnaireById',{id:row.id}).then((res) => { if (_this.width != w) {
if(res.code == '000000') { vm.$message.info("上传图片宽度应为" + w + "，请重新上传");
vm.questionEditList = Object.assign({},res.data)
}
})
},
// 上线/下线
onAndDownLine(row) {
let req = null
if(row.status == 1) {
req = {
id: row.id,
status: 2
}
} else { } else {
req = { uploadFlag = true;
id: row.id,
status: 1
}
}
vm.GET('/campaign/adminQuestionnaire/upperOrLowerShip',req).then((res) => {
if(res.code == '000000') {
vm.search()
}
})
},
// 导入题库
beforeImport(file) {
if (commonUtil.isEmptyUtils(file)) return;
let arr = file.type.split('/');
let ext = "." + arr[1];
let reader = new FileReader();
reader.onload = function (e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
vm.fileArray = [{
base64: fileJson
}];
vm.fileName = file.name;
vm.excelFileName = file.name;
vm.$message.info('读取完毕');
};
reader.readAsDataURL(file);
},
// 模板下载
uploadTemplate() {
window.location.href = QUESTION_UPLOAD_TEMPLATE
},
// 置灰不可点图片上传
beforeAvatarUpload_1(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,1,50,750,100)
},
// 点亮图片上传
beforeAvatarUpload_2(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,2,50,750,100)
},
// 提交图片上传
beforeAvatarUpload_3(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,3,50,750,100)
},
// 头图图片上传
beforeAvatarUpload_4(file) {
if (commonUtil.isEmptyUtils(file)) return;
vm.imgDoUpload(file,4,100,750,468)
},
imgDoUpload(file,urlType,size,w,h) {
const isSize = file.size / 1024 < size;
if(!isSize) {
vm.$message.info('上传图片要小于' + size + 'k')
return;
} }
var _img = new FileReader() } else {
_img.readAsDataURL(file) if (_this.width != w || _this.height != h) {
_img.onload = function(theFile) { vm.$message.info(
let image = new Image() "上传图片尺寸应为" + w + "*" + h + "，请重新上传"
image.src = theFile.target.result );
image.onload = function() { } else {
let _this = this uploadFlag = true;
if( _this.width != w || _this.height != h) {
vm.$message.info("上传图片尺寸应为"+ w +"*"+ h +"，请重新上传")
}else {
vm.$message.info('开始上传');
doUpload(vm,file, getFilePath(file,null), 'preview4', 'progress1', 1).then(function (path) {
if(urlType == 1) {
vm.questionEditList.nextDisableClickUrl = path.fullPath
}else if(urlType == 2) {
vm.questionEditList.nextClickUrl = path.fullPath
}else if(urlType == 3) {
vm.questionEditList.submitButtomUrl = path.fullPath
}else {
vm.questionEditList.headDiagramUrl = path.fullPath
}
vm.$message.success('上传成功')
});
}
}
}
},
// 提交
submitQuestion() {
let req = {
model: vm.questionEditList,
fileArray: vm.fileArray
}
if(vm.questionEditList.showType == 1) { // 单题显示
vm.questionEditList.subheading = ''
vm.questionEditList.questionIntro = ''
vm.questionEditList.headDiagramUrl = ''
}else {
vm.questionEditList.nextDisableClickUrl = ''
vm.questionEditList.nextClickUrl = ''
if(vm.questionEditList.headStyle == 1) { // 文字
vm.questionEditList.headDiagramUrl = ''
}else {
vm.questionEditList.subheading = ''
vm.questionEditList.startDate = ''
vm.questionEditList.endDate = ''
}
} }
if(!vm.questionEditList.id) { }
if(commonUtil.isEmptyList(vm.fileArray)) { if (uploadFlag) {
vm.$message.info('请导入题库') vm.$message.info("开始上传");
return doUpload(
} vm,
file,
getFilePath(file, null),
"preview4",
"progress1",
1
).then(function(path) {
if (urlType == 1) {
vm.questionEditList.nextDisableClickUrl = path.fullPath;
} else if (urlType == 2) {
vm.questionEditList.nextClickUrl = path.fullPath;
} else if (urlType == 3) {
vm.questionEditList.submitButtomUrl = path.fullPath;
} else {
vm.questionEditList.headDiagramUrl = path.fullPath;
}
vm.$message.success("上传成功");
});
}
};
};
},
// 提交
submitQuestion() {
let req = {
model: vm.questionEditList,
fileArray: vm.fileArray
};
if (vm.questionEditList.showType == 1) {
// 单题显示
vm.questionEditList.subheading = "";
vm.questionEditList.questionIntro = "";
vm.questionEditList.headDiagramUrl = "";
} else {
vm.questionEditList.nextDisableClickUrl = "";
vm.questionEditList.nextClickUrl = "";
if (vm.questionEditList.headStyle == 1) {
// 文字
vm.questionEditList.headDiagramUrl = "";
} else {
vm.questionEditList.subheading = "";
vm.questionEditList.startDate = "";
vm.questionEditList.endDate = "";
}
}
if (!vm.questionEditList.id) {
if (commonUtil.isEmptyList(vm.fileArray)) {
vm.$message.info("请导入题库");
return;
}
}
vm.$refs.questionForm.validate(valid => {
if (valid) {
commonUtil.openLoading(vm);
vm.POST(
"/campaign/adminQuestionnaire/insertOrUpdateQuestionnaire",
req
).then(res => {
commonUtil.closeLoading(vm);
if (res.code == "000000") {
vm.discussEditVisible = false;
vm.search();
} else {
vm.$message.info(res.message);
} }
vm.$refs.questionForm.validate((valid) => { });
if(valid) {
commonUtil.openLoading(vm)
vm.POST('/campaign/adminQuestionnaire/insertOrUpdateQuestionnaire',req).then((res) => {
commonUtil.closeLoading(vm)
if(res.code == '000000') {
vm.discussEditVisible = false
vm.search()
}else {
vm.$message.info(res.message)
}
})
}
})
} }
});
},
// 校验输入数字为正整数
checkLimitNum() {
const regexp = /^[1-9]\d*$/;
if (!regexp.test(vm.questionEditList.limitNum)) {
vm.questionEditList.limitNum = 1;
}
} }
} }
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.question-wrap { .question-wrap {
.question-content { .question-content {
background: #fff; background: #fff;
.add-question { .add-question {
float: right; float: right;
margin: 10px; margin: 10px;
} }
.table-empty { .table-empty {
img{ img {
width: 100px; width: 100px;
} }
p { p {
margin-top: -50px; margin-top: -50px;
} }
} }
} }
.submit-btn { .submit-btn {
display: inline-block; display: inline-block;
overflow: hidden; overflow: hidden;
p { p {
font-size: 12px; font-size: 12px;
}
.avatar-uploader {
float: right;
.el-button {
margin-left: 10px;
}
.head-btn {
margin-top: 48px !important;
}
}
.uploat-content {
float: left;
.bg-img {
width: 150px;
height: 30px;
}
.head-bg-img {
width: 80px;
height: 80px;
}
}
}
} }
.avatar-uploader {
float: right;
.el-button {
margin-left: 10px;
}
.head-btn {
margin-top: 48px !important;
}
}
.uploat-content {
float: left;
.bg-img {
width: 150px;
height: 30px;
}
.head-bg-img {
width: 80px;
height: 80px;
}
}
}
.login-auth {
width: 400px;
.el-checkbox {
display: inline-block;
width: 150px;
text-align: left;
}
}
}
</style> </style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或