feat(front):前端样式调整;

master
jiyufei 3 months ago
parent f10ddf1c0f
commit a19b22db69

@ -1,84 +1,84 @@
<template> <template>
<el-dialog :title="!dataForm.id ? '新建' :'编辑'" :close-on-click-modal="false" append-to-body :visible.sync="visible" <el-dialog :title="!dataForm.id ? '新建' : '编辑'" :close-on-click-modal="false" append-to-body :visible.sync="visible"
class="JNPF-dialog JNPF-dialog_center" lock-scroll width="1000px"> class="JNPF-dialog JNPF-dialog_center" lock-scroll width="1000px">
<el-row :gutter="15" class=""> <el-row :gutter="15" class="">
<el-form ref="formRef" :model="dataForm" :rules="dataRule" size="small" label-width="100px" <el-form ref="formRef" :model="dataForm" :rules="dataRule" size="small" label-width="100px"
label-position="right"> label-position="right">
<template v-if="!loading"> <template v-if="!loading">
<!-- 具体表单 --> <!-- 具体表单 -->
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="用户编码" prop="userCode"> <jnpf-form-tip-item label="用户编码" prop="userCode">
<JnpfInput v-model="dataForm.userCode" @change="changeData('userCode',-1)" placeholder="请输入" clearable <JnpfInput v-model="dataForm.userCode" :disabled="!changeId" @change="changeData('userCode', -1)"
:style='{"width":"100%"}'> placeholder="请输入" clearable :style='{ "width": "100%" }'>
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="用户名" prop="userName"> <jnpf-form-tip-item label="用户名" prop="userName">
<JnpfInput v-model="dataForm.userName" @change="changeData('userName',-1)" placeholder="请输入" clearable <JnpfInput v-model="dataForm.userName" @change="changeData('userName', -1)" placeholder="请输入" clearable
:style='{"width":"100%"}'> :style='{ "width": "100%" }'>
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="联系电话" prop="phone"> <jnpf-form-tip-item label="联系电话" prop="phone">
<JnpfInput v-model="dataForm.phone" @change="changeData('phone',-1)" placeholder="请输入" clearable <JnpfInput v-model="dataForm.phone" @change="changeData('phone', -1)" placeholder="请输入" clearable
:style='{"width":"100%"}'> :style='{ "width": "100%" }'>
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="人员归属" prop="userAscription"> <jnpf-form-tip-item label="人员归属" prop="userAscription">
<JnpfSelect v-model="dataForm.userAscription" @change="changeData('userAscription',-1)" placeholder="请选择" <JnpfSelect v-model="dataForm.userAscription" @change="changeData('userAscription', -1)" placeholder="请选择"
clearable :style='{"width":"100%"}' :options="userAscriptionOptions" :props="userAscriptionProps"> clearable :style='{ "width": "100%" }' :options="userAscriptionOptions" :props="userAscriptionProps">
</JnpfSelect> </JnpfSelect>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="身份证号" prop="idCard"> <jnpf-form-tip-item label="身份证号" prop="idCard">
<JnpfInput v-model="dataForm.idCard" @change="changeData('idCard',-1)" placeholder="请输入" clearable <JnpfInput v-model="dataForm.idCard" @change="changeData('idCard', -1)" placeholder="请输入" clearable
:style='{"width":"100%"}'> :style='{ "width": "100%" }'>
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="开始时间" prop="effectiveStartTime"> <jnpf-form-tip-item label="开始时间" prop="effectiveStartTime">
<JnpfDatePicker v-model="dataForm.effectiveStartTime" @change="changeData('effectiveStartTime',-1)" <JnpfDatePicker v-model="dataForm.effectiveStartTime" @change="changeData('effectiveStartTime', -1)"
:startTime="dateTime(false,1,1,'','')" :endTime="dateTime(false,1,1,'','')" placeholder="请选择" clearable :startTime="dateTime(false, 1, 1, '', '')" :endTime="dateTime(false, 1, 1, '', '')" placeholder="请选择" clearable
:style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss"> :style='{ "width": "100%" }' type="datetime" format="yyyy-MM-dd">
</JnpfDatePicker> </JnpfDatePicker>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="结束时间" prop="effectiveEndTime"> <jnpf-form-tip-item label="结束时间" prop="effectiveEndTime">
<JnpfDatePicker v-model="dataForm.effectiveEndTime" @change="changeData('effectiveEndTime',-1)" <JnpfDatePicker v-model="dataForm.effectiveEndTime" @change="changeData('effectiveEndTime', -1)"
:startTime="dateTime(false,1,1,'','')" :endTime="dateTime(false,1,1,'','')" placeholder="请选择" clearable :startTime="dateTime(false, 1, 1, '', '')" :endTime="dateTime(false, 1, 1, '', '')" placeholder="请选择" clearable
:style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss"> :style='{ "width": "100%" }' type="datetime" format="yyyy-MM-dd">
</JnpfDatePicker> </JnpfDatePicker>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="出入码" prop="entryCodes"> <jnpf-form-tip-item label="出入码" prop="entryCodes">
<JnpfInput v-model="dataForm.entryCodes" @change="changeData('entryCodes',-1)" placeholder="请输入" clearable <JnpfInput v-model="dataForm.entryCodes" @change="changeData('entryCodes', -1)" placeholder="请输入" clearable
:style='{"width":"100%"}'> :style='{ "width": "100%" }'>
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="12">
<jnpf-form-tip-item label="归属部门" prop="merchantId" v-if="dataForm.userAscription == 2"> <jnpf-form-tip-item label="归属部门" prop="merchantId" v-if="dataForm.userAscription == 2">
<JnpfDepSelect v-model="dataForm.merchantId" @change="depSelectChangeData" placeholder="请选择" <JnpfDepSelect v-model="dataForm.merchantId" @change="depSelectChangeData" placeholder="请选择"
selectType="all" :ableIds="ableAll.merchantIdableIds" clearable :style='{"width":"100%"}'> selectType="all" :ableIds="ableAll.merchantIdableIds" clearable :style='{ "width": "100%" }'>
</JnpfDepSelect> </JnpfDepSelect>
</jnpf-form-tip-item> </jnpf-form-tip-item>
<jnpf-form-tip-item label="归属商户" prop="merchantId" v-if="dataForm.userAscription == 1"> <jnpf-form-tip-item label="归属商户" prop="merchantId" v-if="dataForm.userAscription == 1">
<JnpfPopupSelect v-model="dataForm.merchantId" @change="selectChangeData" :rowIndex="null" <JnpfPopupSelect v-model="dataForm.merchantId" @change="selectChangeData" :rowIndex="null"
:formData="dataForm" :templateJson="interfaceRes.merchantId" placeholder="请选择" propsValue="id" :formData="dataForm" :templateJson="interfaceRes.merchantId" placeholder="请选择" propsValue="id"
popupWidth="800px" popupTitle="选择数据" popupType="dialog" relationField='cmp_nm' field='merchantId' popupWidth="800px" popupTitle="选择数据" popupType="dialog" relationField='cmp_nm' field='merchantId'
interfaceId="582919057313895877" :pageSize="20" :columnOptions="merchantIdcolumnOptions" clearable interfaceId="587625521974612357" :pageSize="20" :columnOptions="merchantIdcolumnOptions" clearable
:style='{"width":"100%"}'> :style='{ "width": "100%" }'>
</JnpfPopupSelect> </JnpfPopupSelect>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
@ -86,7 +86,7 @@
</template> </template>
</el-form> </el-form>
<SelectDialog v-if="selectDialogVisible" :config="currTableConf" :formData="dataForm" ref="selectDialog" <SelectDialog v-if="selectDialogVisible" :config="currTableConf" :formData="dataForm" ref="selectDialog"
@select="addForSelect" @close="selectDialogVisible=false" /> @select="addForSelect" @close="selectDialogVisible = false" />
</el-row> </el-row>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<!-- <div class="upAndDown-button" v-if="dataForm.id"> <!-- <div class="upAndDown-button" v-if="dataForm.id">
@ -107,33 +107,33 @@
<script> <script>
import request from '@/utils/request' import request from '@/utils/request'
import { import {
mapGetters mapGetters
} from "vuex"; } from "vuex";
import { import {
getDataInterfaceRes getDataInterfaceRes
} from '@/api/systemData/dataInterface' } from '@/api/systemData/dataInterface'
import { import {
getDictionaryDataSelector getDictionaryDataSelector
} from '@/api/systemData/dictionary' } from '@/api/systemData/dictionary'
import { import {
getDefaultCurrentValueUserId getDefaultCurrentValueUserId
} from '@/api/permission/user' } from '@/api/permission/user'
import { import {
getDefaultCurrentValueDepartmentId getDefaultCurrentValueDepartmentId
} from '@/api/permission/organize' } from '@/api/permission/organize'
import { import {
getDateDay, getDateDay,
getLaterData, getLaterData,
getBeforeData, getBeforeData,
getBeforeTime, getBeforeTime,
getLaterTime getLaterTime
} from '@/components/Generator/utils/index.js' } from '@/components/Generator/utils/index.js'
import { import {
thousandsFormat thousandsFormat
} from "@/components/Generator/utils/index" } from "@/components/Generator/utils/index"
export default { export default {
components: {}, components: {},
props: [], props: [],
data() { data() {
@ -178,17 +178,17 @@
required: true, required: true,
message: '请输入', message: '请输入',
trigger: 'blur' trigger: 'blur'
}, ], },],
userName: [{ userName: [{
required: true, required: true,
message: '请输入', message: '请输入',
trigger: 'blur' trigger: 'blur'
}, ], },],
idCard: [{ idCard: [{
required: true, required: true,
message: '请输入', message: '请输入',
trigger: 'blur' trigger: 'blur'
}, ], },],
phone: [{ phone: [{
required: true, required: true,
message: '请输入', message: '请输入',
@ -204,22 +204,22 @@
required: true, required: true,
message: '请至少选择一个', message: '请至少选择一个',
trigger: 'change' trigger: 'change'
}, ], },],
effectiveStartTime: [{ effectiveStartTime: [{
required: true, required: true,
message: '请选择身份证有效开始时间', message: '请选择身份证有效开始时间',
trigger: 'change' trigger: 'change'
}, ], },],
effectiveEndTime: [{ effectiveEndTime: [{
required: true, required: true,
message: '请选择身份证有效结束时间', message: '请选择身份证有效结束时间',
trigger: 'change' trigger: 'change'
}, ], },],
entryCodes: [{ entryCodes: [{
required: true, required: true,
message: '请输入', message: '请输入',
trigger: 'blur' trigger: 'blur'
}, ], },],
}, },
userAscriptionOptions: [{ userAscriptionOptions: [{
"fullName": "商户", "fullName": "商户",
@ -238,7 +238,7 @@
}, { }, {
"label": "名称", "label": "名称",
"value": "cmp_nm" "value": "cmp_nm"
}, ], },],
childIndex: -1, childIndex: -1,
isEdit: false, isEdit: false,
interfaceRes: { interfaceRes: {
@ -255,6 +255,9 @@
} }
}, },
computed: { computed: {
changeId() {
return !this.dataForm.id;
},
...mapGetters(['userInfo']) ...mapGetters(['userInfo'])
}, },
watch: {}, watch: {},
@ -263,13 +266,13 @@
this.initDefaultData() this.initDefaultData()
this.dataValueAll = JSON.parse(JSON.stringify(this.dataForm)) this.dataValueAll = JSON.parse(JSON.stringify(this.dataForm))
}, },
mounted() {}, mounted() { },
methods: { methods: {
selectChangeData(var1, var2){ selectChangeData(var1, var2) {
this.dataForm.merchantId = var2.id; this.dataForm.merchantId = var2.id;
this.dataForm.merchantName = var2.cmp_nm; this.dataForm.merchantName = var2.cmp_nm;
}, },
depSelectChangeData(var1, var2){ depSelectChangeData(var1, var2) {
this.dataForm.merchantId = var2.id; this.dataForm.merchantId = var2.id;
this.dataForm.merchantName = var2.fullName; this.dataForm.merchantName = var2.fullName;
}, },
@ -349,7 +352,7 @@
} }
} }
}, },
dataAll() {}, dataAll() { },
clearData() { clearData() {
this.dataForm = JSON.parse(JSON.stringify(this.dataValueAll)) this.dataForm = JSON.parse(JSON.stringify(this.dataValueAll))
}, },
@ -550,5 +553,5 @@
this.childIndex = -1 this.childIndex = -1
}, },
}, },
} }
</script> </script>

@ -56,12 +56,12 @@
</el-table-column> </el-table-column>
<el-table-column prop="effectiveStartTime" label="有效开始时间" align="center"> <el-table-column prop="effectiveStartTime" label="有效开始时间" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.effectiveStartTime | toDate("yyyy-MM-dd HH:mm:ss") }} {{ scope.row.effectiveStartTime | toDate("yyyy-MM-dd") }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="effectiveEndTime" label="有效结束时间" align="center"> <el-table-column prop="effectiveEndTime" label="有效结束时间" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.effectiveEndTime | toDate("yyyy-MM-dd HH:mm:ss") }} {{ scope.row.effectiveEndTime | toDate("yyyy-MM-dd") }}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" fixed="right" width="150"align="center"> <el-table-column label="操作" fixed="right" width="150"align="center">

@ -51,11 +51,11 @@
<p>{{ dataForm.ascriptionId }}</p> <p>{{ dataForm.ascriptionId }}</p>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col>
<el-col :span="8"> <!-- <el-col :span="8">
<jnpf-form-tip-item label="归属名称" prop="ascriptionName"> <jnpf-form-tip-item label="归属名称" prop="ascriptionName">
<p>{{ dataForm.ascriptionName }}</p> <p>{{ dataForm.ascriptionName }}</p>
</jnpf-form-tip-item> </jnpf-form-tip-item>
</el-col> </el-col> -->
</template> </template>
</el-form> </el-form>
</el-row> </el-row>

@ -8,7 +8,7 @@
<!-- 具体表单 --> <!-- 具体表单 -->
<el-col :span="8"> <el-col :span="8">
<jnpf-form-tip-item label="车牌号" prop="vehicleNumber"> <jnpf-form-tip-item label="车牌号" prop="vehicleNumber">
<JnpfInput v-model="dataForm.vehicleNumber" @change="changeData('vehicleNumber',-1)" placeholder="请输入" <JnpfInput v-model="dataForm.vehicleNumber" :disabled="!changeId" @change="changeData('vehicleNumber',-1)" placeholder="请输入"
clearable :style='{"width":"100%"}'> clearable :style='{"width":"100%"}'>
</JnpfInput> </JnpfInput>
</jnpf-form-tip-item> </jnpf-form-tip-item>
@ -87,7 +87,7 @@
<JnpfPopupSelect v-model="dataForm.ascriptionId" @change="selectChangeData" :rowIndex="null" <JnpfPopupSelect v-model="dataForm.ascriptionId" @change="selectChangeData" :rowIndex="null"
:formData="dataForm" :templateJson="interfaceRes.ascriptionName" placeholder="请选择" propsValue="id" :formData="dataForm" :templateJson="interfaceRes.ascriptionName" placeholder="请选择" propsValue="id"
popupWidth="800px" popupTitle="选择数据" popupType="dialog" relationField='cmp_nm' field='ascriptionId' popupWidth="800px" popupTitle="选择数据" popupType="dialog" relationField='cmp_nm' field='ascriptionId'
interfaceId="582919057313895877" :pageSize="20" :columnOptions="ascriptionNamecolumnOptions" clearable interfaceId="587625521974612357" :pageSize="20" :columnOptions="ascriptionNamecolumnOptions" clearable
:style='{"width":"100%"}'> :style='{"width":"100%"}'>
</JnpfPopupSelect> </JnpfPopupSelect>
</jnpf-form-tip-item> </jnpf-form-tip-item>

Loading…
Cancel
Save