wangqing 4 years ago
parent
commit
75a1e3442b
  1. 36
      src/components/form/PhoneVerification/index.vue
  2. 12
      src/utils/convert.js
  3. 20
      src/views/form/preview/ProjectForm.vue
  4. 31
      src/views/form/statistics/index.vue
  5. 2
      src/views/form/statistics/public.vue

36
src/components/form/PhoneVerification/index.vue

@ -12,19 +12,21 @@
<el-dialog :visible.sync="open" title="手机号验证"> <el-dialog :visible.sync="open" title="手机号验证">
<el-form ref="form" :model="phoneValidateForm" :rules="rules" label-width="80px"> <el-form ref="form" :model="phoneValidateForm" :rules="rules" label-width="80px">
<el-form-item label="手机号" prop="phoneNumber"> <el-form-item label="手机号" prop="phoneNumber">
<el-input v-model="phoneValidateForm.phoneNumber" style="width: 80%;" maxlength="11" prefix-icon=" el-icon-mobile " <el-input v-model="phoneValidateForm.phoneNumber" class="input" maxlength="11" prefix-icon=" el-icon-mobile "
show-word-limit show-word-limit
/> />
</el-form-item> </el-form-item>
<el-form-item label="验证码" prop="code"> <el-form-item label="验证码" prop="code">
<el-input v-model="phoneValidateForm.code" style="width: 60%;" prefix-icon="el-icon-message" /> <el-input v-model="phoneValidateForm.code" class="input" prefix-icon="el-icon-message">
<el-button :disabled="phoneValidateCodeBtn" <el-button
style="width: 15%;" slot="append"
type="primary" :disabled="phoneValidateCodeBtn"
@click="sendValidateMsgHandle" type="primary"
> @click="sendValidateMsgHandle"
{{ phoneValidateCodeBtnText }} >
</el-button> {{ phoneValidateCodeBtnText }}
</el-button>
</el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
@ -37,7 +39,7 @@
<script> <script>
export default { export default {
name: 'Index', name: 'PhoneVerification',
props: { props: {
value: null value: null
}, },
@ -113,8 +115,22 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.phone-number-container { .phone-number-container {
display: flex; display: flex;
.input {
width: 70%;
}
} }
.phone-number-container ::v-deep.el-form-item__label { .phone-number-container ::v-deep.el-form-item__label {
float: left; float: left;
} }
@media screen and (max-width: 500px) {
.phone-number-container ::v-deep.el-form-item__label {
float: none !important;
}
::v-deep.el-form-item .el-form-item__content {
margin-left: 0 !important;
}
.input {
width: 100% !important;
}
}
</style> </style>

12
src/utils/convert.js

@ -3,7 +3,13 @@
* *
*/ */
import _ from 'lodash' import _ from 'lodash'
import {assistComponents, imageComponents, inputComponents, selectComponents} from '@/components/generator/config' import {
assistComponents,
imageComponents,
inputComponents,
personalInfoComponents,
selectComponents
} from '@/components/generator/config'
/** /**
* 表单json转换为后台需要的对象 * 表单json转换为后台需要的对象
@ -20,7 +26,7 @@ export function formItemConvertData(item, projectKey) {
'regList': item.__config__.regList, 'regList': item.__config__.regList,
'showLabel': item.__config__.showLabel, 'showLabel': item.__config__.showLabel,
'span': item.__config__.span, 'span': item.__config__.span,
'displayType': item.displayType, 'displayType': item.__config__.displayType,
'projectKey': projectKey 'projectKey': projectKey
} }
let expand = {} let expand = {}
@ -49,7 +55,7 @@ export function dbDataConvertForItemJson(data) {
} }
if (!typeMap.size > 0) { if (!typeMap.size > 0) {
// 根据类型获取默认数据 // 根据类型获取默认数据
_.concat(inputComponents, selectComponents, imageComponents, assistComponents).forEach(item => { _.concat(inputComponents, selectComponents, imageComponents, assistComponents, personalInfoComponents).forEach(item => {
typeMap.set(item.typeId, item) typeMap.set(item.typeId, item)
}) })
} }

20
src/views/form/preview/ProjectForm.vue

@ -314,4 +314,24 @@ export default {
min-width: 300px !important; min-width: 300px !important;
} }
} }
@media screen and (max-width: 500px) {
.el-message-box {
width: 300px !important;
}
}
@media screen and (max-width: 500px) {
.el-dialog__wrapper .el-dialog {
width: 300px !important;
.el-dialog__body {
padding: 10px 20px !important;
.el-form-item__label {
width: 68px !important;
}
//.el-select,
//.el-input {
// width: 180px !important;
}
//}
}
}
</style> </style>

31
src/views/form/statistics/index.vue

@ -20,6 +20,7 @@
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="queryProjectResult">查询</el-button> <el-button type="primary" @click="queryProjectResult">查询</el-button>
<el-button type="primary" @click="customFilterDialogVisible=true">条件</el-button>
<el-button type="success" @click="exportProjectResult">导出</el-button> <el-button type="success" @click="exportProjectResult">导出</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -106,7 +107,7 @@
</el-col> </el-col>
</el-row> </el-row>
<el-divider /> <el-divider />
<el-checkbox-group v-model="checkFixedCustomColumns"> <el-checkbox-group v-model="checkedFixedCustomColumns">
<el-row> <el-row>
<el-col v-for="(val, key) in fixedDefaultLabelFormColumn" :key="key" :span="4"> <el-col v-for="(val, key) in fixedDefaultLabelFormColumn" :key="key" :span="4">
<el-checkbox :label="key">{{ val }}</el-checkbox> <el-checkbox :label="key">{{ val }}</el-checkbox>
@ -127,6 +128,24 @@
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
<el-dialog :visible.sync="customFilterDialogVisible" center title="结构化筛选">
<div class="flex-center">
<el-transfer
v-model="checkedFilterColumns"
filterable
:props="{
key: 'formItemId',
label: 'label'
}"
filter-placeholder="请输入问题名称"
:data="projectItemList"
/>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="customColumnDialogVisible = false"> </el-button>
<el-button type="primary" @click="saveStatisticsCheckedColumns"> </el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
@ -146,11 +165,13 @@ export default {
data() { data() {
return { return {
projectKey: null, projectKey: null,
customFilterDialogVisible: false,
customColumnDialogVisible: false, customColumnDialogVisible: false,
checkedFilterColumns: [],
// //
fixedCustomColumns: fixedDefaultFormColumn, fixedCustomColumns: fixedDefaultFormColumn,
// //
checkFixedCustomColumns: fixedDefaultFormColumn, checkedFixedCustomColumns: fixedDefaultFormColumn,
fixedDefaultLabelFormColumn: fixedDefaultLabelFormColumn, fixedDefaultLabelFormColumn: fixedDefaultLabelFormColumn,
// //
checkOtherCustomColumns: [], checkOtherCustomColumns: [],
@ -205,7 +226,7 @@ export default {
}, },
saveStatisticsCheckedColumns() { saveStatisticsCheckedColumns() {
this.customColumnDialogVisible = false this.customColumnDialogVisible = false
this.fixedCustomColumns = this.checkFixedCustomColumns this.fixedCustomColumns = this.checkedFixedCustomColumns
this.otherCustomColumns = this.checkOtherCustomColumns this.otherCustomColumns = this.checkOtherCustomColumns
saveCheckedColumn(this.projectKey, { saveCheckedColumn(this.projectKey, {
fixedCustomColumns: this.fixedCustomColumns, fixedCustomColumns: this.fixedCustomColumns,
@ -220,7 +241,7 @@ export default {
let {fixedCustomColumns, otherCustomColumns} = checkedColumn let {fixedCustomColumns, otherCustomColumns} = checkedColumn
if (fixedCustomColumns) { if (fixedCustomColumns) {
this.fixedCustomColumns = fixedCustomColumns this.fixedCustomColumns = fixedCustomColumns
this.checkFixedCustomColumns = fixedCustomColumns this.checkedFixedCustomColumns = fixedCustomColumns
} }
if (otherCustomColumns) { if (otherCustomColumns) {
this.otherCustomColumns = otherCustomColumns this.otherCustomColumns = otherCustomColumns
@ -248,7 +269,7 @@ export default {
}) })
}, },
queryProjectItems() { queryProjectItems() {
this.$api.get('/user/project/item/list', {params: {key: this.projectKey}}).then(res => { this.$api.get('/user/project/item/list', {params: {key: this.projectKey, displayType: false}}).then(res => {
if (res.data) { if (res.data) {
res.data.map(item => { res.data.map(item => {
_.set(this.projectItemColumns, `field${item.formItemId}`, item.label) _.set(this.projectItemColumns, `field${item.formItemId}`, item.label)

2
src/views/form/statistics/public.vue

@ -130,7 +130,7 @@ export default {
}) })
}, },
queryProjectItems() { queryProjectItems() {
this.$api.get('/user/project/item/list', {params: {key: this.projectKey}}).then(res => { this.$api.get('/user/project/item/list', {params: {key: this.projectKey, displayType: true}}).then(res => {
if (res.data) { if (res.data) {
res.data.map(item => { res.data.map(item => {
_.set(this.projectItemColumns, `field${item.formItemId}`, item.label) _.set(this.projectItemColumns, `field${item.formItemId}`, item.label)

Loading…
Cancel
Save