|
@@ -3,7 +3,7 @@
|
|
<el-row>
|
|
<el-row>
|
|
<el-col :span="24" class="title" v-if="is_title">
|
|
<el-col :span="24" class="title" v-if="is_title">
|
|
<el-col :span="24" class="title_1">
|
|
<el-col :span="24" class="title_1">
|
|
- <span>{{ title || meta }}</span>
|
|
|
|
|
|
+ <span>{{ title || route.meta.title }}</span>
|
|
<span>{{ tip }}</span>
|
|
<span>{{ tip }}</span>
|
|
</el-col>
|
|
</el-col>
|
|
<el-col :span="24" class="title_2">
|
|
<el-col :span="24" class="title_2">
|
|
@@ -18,15 +18,19 @@
|
|
<el-form-item :label="getField('label', item)" :prop="item.model">
|
|
<el-form-item :label="getField('label', item)" :prop="item.model">
|
|
<template v-if="!item.custom">
|
|
<template v-if="!item.custom">
|
|
<template v-if="item.type === 'select'">
|
|
<template v-if="item.type === 'select'">
|
|
- <el-select v-model="form[item.model]" v-bind="item.options" filterable clearable
|
|
|
|
- @change="dataChange(item.model)">
|
|
|
|
|
|
+ <el-select v-model="form[item.model]" v-bind="item.options" filterable clearable @change="dataChange(item.model)">
|
|
<slot :name="item.model" v-bind="{ item }"></slot>
|
|
<slot :name="item.model" v-bind="{ item }"></slot>
|
|
</el-select>
|
|
</el-select>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<template v-else>
|
|
- <el-input v-model="form[item.model]" :type="getField('type', item)"
|
|
|
|
- :placeholder="getField('place', item)" clearable v-bind="item.options"
|
|
|
|
- @change="dataChange(item.model)"></el-input>
|
|
|
|
|
|
+ <el-input
|
|
|
|
+ v-model="form[item.model]"
|
|
|
|
+ :type="getField('type', item)"
|
|
|
|
+ :placeholder="getField('place', item)"
|
|
|
|
+ clearable
|
|
|
|
+ v-bind="item.options"
|
|
|
|
+ @change="dataChange(item.model)"
|
|
|
|
+ ></el-input>
|
|
</template>
|
|
</template>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<template v-else>
|
|
@@ -46,18 +50,16 @@
|
|
<el-col :span="24" class="back" v-if="is_back">
|
|
<el-col :span="24" class="back" v-if="is_back">
|
|
<el-button type="primary" @click="toBack()">返回</el-button>
|
|
<el-button type="primary" @click="toBack()">返回</el-button>
|
|
</el-col>
|
|
</el-col>
|
|
- <el-col :span="24" class="slot">
|
|
|
|
- <slot name="isslot"></slot>
|
|
|
|
- </el-col>
|
|
|
|
|
|
+ <el-col :span="24" class="slot"><slot name="isslot"></slot></el-col>
|
|
</el-row>
|
|
</el-row>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
import { ref, toRefs } from 'vue';
|
|
import { ref, toRefs } from 'vue';
|
|
-import { useRoute } from 'vue-router';
|
|
|
|
import type { Ref } from 'vue';
|
|
import type { Ref } from 'vue';
|
|
-import _ from 'lodash';
|
|
|
|
|
|
+import { useRoute } from 'vue-router';
|
|
const route = useRoute();
|
|
const route = useRoute();
|
|
|
|
+import _ from 'lodash';
|
|
interface fieldsItem {
|
|
interface fieldsItem {
|
|
model: string;
|
|
model: string;
|
|
type: string;
|
|
type: string;
|
|
@@ -86,7 +88,6 @@ const { tip } = toRefs(props);
|
|
const { remark } = toRefs(props);
|
|
const { remark } = toRefs(props);
|
|
|
|
|
|
let form: Ref<{}> = ref({});
|
|
let form: Ref<{}> = ref({});
|
|
-let meta: Ref<any> = ref(route.meta.title);
|
|
|
|
const emit = defineEmits(['search', 'toReset', 'toBack', 'dataChange']);
|
|
const emit = defineEmits(['search', 'toReset', 'toBack', 'dataChange']);
|
|
const toSubmit = () => {
|
|
const toSubmit = () => {
|
|
const obj = _.pickBy(form.value);
|
|
const obj = _.pickBy(form.value);
|
|
@@ -120,22 +121,18 @@ const toBack = () => {
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
.title {
|
|
.title {
|
|
margin: 0 0 5px 0;
|
|
margin: 0 0 5px 0;
|
|
-
|
|
|
|
.title_1 {
|
|
.title_1 {
|
|
margin: 0 0 5px 0;
|
|
margin: 0 0 5px 0;
|
|
-
|
|
|
|
span:first-child {
|
|
span:first-child {
|
|
font-size: 20px;
|
|
font-size: 20px;
|
|
font-weight: 700;
|
|
font-weight: 700;
|
|
margin-right: 10px;
|
|
margin-right: 10px;
|
|
}
|
|
}
|
|
-
|
|
|
|
span:last-child {
|
|
span:last-child {
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
color: #979797;
|
|
color: #979797;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-
|
|
|
|
.title_2 {
|
|
.title_2 {
|
|
span {
|
|
span {
|
|
color: #8baae7;
|
|
color: #8baae7;
|
|
@@ -144,24 +141,19 @@ const toBack = () => {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-
|
|
|
|
.search {
|
|
.search {
|
|
margin: 0 0 10px 0;
|
|
margin: 0 0 10px 0;
|
|
-
|
|
|
|
.form {
|
|
.form {
|
|
display: flex;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
-
|
|
|
|
.form_1 {
|
|
.form_1 {
|
|
padding: 0 0 0 10px;
|
|
padding: 0 0 0 10px;
|
|
-
|
|
|
|
.el-form-item {
|
|
.el-form-item {
|
|
float: left;
|
|
float: left;
|
|
width: 100%;
|
|
width: 100%;
|
|
margin: 0 0 10px 0;
|
|
margin: 0 0 10px 0;
|
|
}
|
|
}
|
|
-
|
|
|
|
.el-select {
|
|
.el-select {
|
|
width: 100%;
|
|
width: 100%;
|
|
}
|
|
}
|
|
@@ -172,8 +164,8 @@ const toBack = () => {
|
|
text-align: right;
|
|
text-align: right;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-
|
|
|
|
.back {
|
|
.back {
|
|
text-align: left;
|
|
text-align: left;
|
|
margin: 0 0 10px 0;
|
|
margin: 0 0 10px 0;
|
|
-}</style>
|
|
|
|
|
|
+}
|
|
|
|
+</style>
|