提交 5842f173 authored 作者: gjx's avatar gjx

地块管理修改样式以及开始日期结束日期校验问题

上级 65ee53f0
......@@ -323,7 +323,7 @@
label: '行业类别',
field: 'hylb',
component: 'Input',
colProps: { span: 24 },
// colProps: { span: 23 },
componentProps: {
readonly: true,
},
......@@ -368,7 +368,7 @@
field: 'zbsm',
defaultValue: 'CGCS2000',
component: 'Input',
colProps: { span: 8 },
colProps: { span: 7 },
componentProps: {
readonly: true,
},
......@@ -428,7 +428,7 @@
field: 'dkszfw',
required: true,
component: 'Input',
colProps: { span: 24 },
// colProps: { span: 23.5 },
},
{
label: '启动缘由',
......
......@@ -4,16 +4,18 @@
<BasicForm @register="registerForm">
<template #gstype="{ model, field }">
<!-- 如果是组件需要进行双向绑定,model当前表单对象,field当前字段名称 -->
<a-radio-group v-model:value="model[field]" style="display: flex; justify-content: space-between">
<a-radio :value="1" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="qt = ''">网址</a-radio>
<a-input v-model:value="model['gswz']" @blur="onBlur(model)" placeholder="请输入网址" :disabled="model[field] != 1"
style="width: 40%" />
<a-radio :value="3" :style="{ height: '30px', lineHeight: '30px', width: '60px' }"
@change="model['gswz'] = ''">其它</a-radio>
<a-input v-model:value="qt" placeholder="请输入信息" :disabled="model[field] != 3" style="width: 40%" />
<a-radio-group v-model:value="model[field]" style="display: flex">
<div class="w-[50%]">
<a-radio :value="1" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="qt = ''">网址</a-radio>
<a-input v-model:value="model['gswz']" @blur="onBlur(model)" placeholder="请输入网址" :disabled="model[field] != 1" style="width: 77%" />
</div>
<div class="w-[50%]">
<a-radio :value="3" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['gswz'] = ''">其它</a-radio>
<a-input v-model:value="qt" placeholder="请输入信息" :disabled="model[field] != 3" style="width: 90%" />
</div>
</a-radio-group>
</template>
<template #jsxl="{ }">
<template #jsxl="{}">
<div class="table-page-wrapper">
<table style="width: 100%" border="1" cellspacing="1">
<colgroup>
......@@ -121,277 +123,278 @@
</template>
<script lang="ts" setup>
//引入依赖
import { nextTick, watch, toRaw, ref } from 'vue';
import { useForm, BasicForm, FormSchema } from '/@/components/Form';
import { useMessage } from '/@/hooks/web/useMessage';
//引入依赖
import { nextTick, watch, toRaw, ref } from 'vue';
import { useForm, BasicForm, FormSchema } from '/@/components/Form';
import { useMessage } from '/@/hooks/web/useMessage';
const { createMessage } = useMessage();
const props = defineProps({
labelFirst: {
type: String,
default: '风险管控',
},
data: {
type: Object,
default: {},
},
jslx: {
type: Object,
default: {},
},
});
const qt = ref('');
//自定义表单字段
const formSchemas: FormSchema[] = [
{
label: '污染地块id',
field: 'wrdkid',
component: 'Input',
show: false,
},
{
label: 'id',
field: 'id',
component: 'Input',
show: false,
},
{
label: '网址',
field: 'gswz',
component: 'Input',
show: false,
},
{
label: `${props.labelFirst}方案标题`,
field: 'bt',
component: 'Input',
required: true,
},
{
label: `${props.labelFirst}方案编制完成日期`,
field: 'fbsj',
component: 'DatePicker',
required: true,
componentProps: {
format: 'YYYY-MM-DD',
//返回值格式化(绑定值的格式)
valueFormat: 'YYYY-MM-DD',
//是否显示今天按钮
showToday: true,
const { createMessage } = useMessage();
const props = defineProps({
labelFirst: {
type: String,
default: '风险管控',
},
},
{
label: '公示',
field: 'gkfs',
component: 'JDictSelectTag',
defaultValue: 1,
slot: 'gstype',
colProps: { span: 24 },
required: true,
},
{
label: `${props.labelFirst}工程措施开始日期`,
field: 'tmStar',
required: true,
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
showToday: true,
data: {
type: Object,
default: {},
},
},
{
label: `${props.labelFirst}工程措施结束日期`,
field: 'tmEnd',
component: 'DatePicker',
required: true,
componentProps: {
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
showToday: true,
jslx: {
type: Object,
default: {},
},
},
{
label: `技术线路`,
field: 'jslx',
});
const qt = ref('');
//自定义表单字段
const formSchemas: FormSchema[] = [
{
label: '污染地块id',
field: 'wrdkid',
component: 'Input',
show: false,
},
{
label: 'id',
field: 'id',
component: 'Input',
show: false,
},
{
label: '网址',
field: 'gswz',
component: 'Input',
show: false,
},
{
label: `${props.labelFirst}方案标题`,
field: 'bt',
component: 'Input',
required: true,
},
{
label: `${props.labelFirst}方案编制完成日期`,
field: 'fbsj',
component: 'DatePicker',
required: true,
componentProps: {
format: 'YYYY-MM-DD',
//返回值格式化(绑定值的格式)
valueFormat: 'YYYY-MM-DD',
//是否显示今天按钮
showToday: true,
},
},
{
label: '公示',
field: 'gkfs',
component: 'JDictSelectTag',
defaultValue: 1,
slot: 'gstype',
colProps: { span: 24 },
required: true,
},
{
label: `${props.labelFirst}工程措施开始日期`,
field: 'tmStar',
required: true,
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
showToday: true,
},
},
{
label: `${props.labelFirst}工程措施结束日期`,
field: 'tmEnd',
component: 'DatePicker',
required: true,
componentProps: {
format: 'YYYY-MM-DD',
valueFormat: 'YYYY-MM-DD',
showToday: true,
},
},
{
label: `技术线路`,
field: 'jslx',
component: 'DatePicker',
colProps: { span: 24 },
ifShow: () => {
let flg = false;
if (props.labelFirst == '修复' || props.labelFirst == '管控及修复') flg = true;
else flg = false;
return flg;
component: 'DatePicker',
colProps: { span: 24 },
ifShow: () => {
let flg = false;
if (props.labelFirst == '修复' || props.labelFirst == '管控及修复') flg = true;
else flg = false;
return flg;
},
slot: 'jsxl',
},
slot: 'jsxl',
},
];
];
const jslx = ref<any>([
{
bt: '',
sortindex: '0',
jz: '土壤修复技术',
jslx: '物理化学修复技术',
yw: [],
iw: [],
},
{
bt: '',
sortindex: '1',
jz: '土壤修复技术',
jslx: '生物修复技术',
yw: [],
iw: [],
},
{
bt: '',
sortindex: '2',
jz: '土壤修复技术',
jslx: '热处理技术',
yw: [],
iw: [],
},
{
bt: '',
sortindex: '3',
jz: '地下水修复技术',
jslx: '地下水修复技术',
yw: [],
iw: [],
},
{
bt: false,
sortindex: '4',
jslx: '其他',
jz: '其他',
yw: '',
iw: '',
},
]);
/**
* BasicForm绑定注册;
*/
const [registerForm, { getFieldsValue, setFieldsValue, validate }] = useForm({
//注册表单列
schemas: formSchemas,
//不显示查询和重置按钮
showActionButtonGroup: false,
rowProps: { gutter: 24, justify: 'start', align: 'middle' },
//全局col列占比(每列显示多少位),和schemas中的colProps属性一致
baseColProps: { span: 12 },
//使用labelCol的样式参数来控制标题宽度
labelCol: { style: { width: '250px' } },
//row行的样式
baseRowStyle: { width: '100%' },
//表单布局属性,支持(vertical,horizontal),默认为horizontal
layout: 'horizontal',
});
watch(
() => props.data,
async (val: any) => {
val &&
nextTick(async () => {
const obj = toRaw(val);
if (obj.gkfs == 3) {
qt.value = val.gswz;
obj.gswz = '';
}
if (!obj.gkfs) obj.gkfs = 1;
await setFieldsValue({
...obj,
const jslx = ref<any>([
{
bt: '',
sortindex: '0',
jz: '土壤修复技术',
jslx: '物理化学修复技术',
yw: [],
iw: [],
},
{
bt: '',
sortindex: '1',
jz: '土壤修复技术',
jslx: '生物修复技术',
yw: [],
iw: [],
},
{
bt: '',
sortindex: '2',
jz: '土壤修复技术',
jslx: '热处理技术',
yw: [],
iw: [],
},
{
bt: '',
sortindex: '3',
jz: '地下水修复技术',
jslx: '地下水修复技术',
yw: [],
iw: [],
},
{
bt: false,
sortindex: '4',
jslx: '其他',
jz: '其他',
yw: '',
iw: '',
},
]);
/**
* BasicForm绑定注册;
*/
const [registerForm, { getFieldsValue, setFieldsValue, validate }] = useForm({
//注册表单列
schemas: formSchemas,
//不显示查询和重置按钮
showActionButtonGroup: false,
rowProps: { gutter: 24, justify: 'start', align: 'middle' },
//全局col列占比(每列显示多少位),和schemas中的colProps属性一致
baseColProps: { span: 12 },
//使用labelCol的样式参数来控制标题宽度
labelCol: { style: { width: '250px' } },
//row行的样式
baseRowStyle: { width: '100%' },
//表单布局属性,支持(vertical,horizontal),默认为horizontal
layout: 'horizontal',
});
watch(
() => props.data,
async (val: any) => {
val &&
nextTick(async () => {
const obj = toRaw(val);
if (obj.gkfs == 3) {
qt.value = val.gswz;
obj.gswz = '';
}
if (!obj.gkfs) obj.gkfs = 1;
await setFieldsValue({
...obj,
});
});
});
},
{ deep: true, immediate: true }
);
watch(
() => props.jslx,
async () => {
// 技术路线的回显
},
{ deep: true, immediate: true }
);
watch(
() => props.jslx,
async () => {
// 技术路线的回显
if (props.labelFirst == '修复' || props.labelFirst == '管控及修复') {
if (!props.jslx || props.jslx.length == 0) return;
jslx.value = props.jslx;
jslx.value.forEach((item: any, index) => {
if (index != 4) {
if (!(item.yw instanceof Array)) item.yw = item.yw.split(',');
if (!(item.iw instanceof Array)) item.iw = item.iw.split(',');
} else {
if (item.yw) item.bt = true;
}
});
console.log(jslx.value, 'jslx.value');
}
},
{ deep: true, immediate: true }
);
// 失去焦点校验网址
function onBlur(model) {
console.log(model.gswz, 'v');
const reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
if (!reg.test(model.gswz)) createMessage.info('请输入正确的网址');
}
// 获取子组件 列表
async function getFormValueReport() {
console.log('子组件执行');
//获取所有值
let fieldsValue = await getFieldsValue();
fieldsValue = await validate();
if (fieldsValue.gkfs == 3) {
fieldsValue.gswz = qt.value;
}
if (props.labelFirst == '修复' || props.labelFirst == '管控及修复') {
if (!props.jslx || props.jslx.length == 0) return;
jslx.value = props.jslx;
jslx.value.forEach((item: any, index) => {
if (index != 4) {
if (!(item.yw instanceof Array)) item.yw = item.yw.split(',');
if (!(item.iw instanceof Array)) item.iw = item.iw.split(',');
fieldsValue.jslx = [];
fieldsValue.jslx = toRaw(jslx.value);
fieldsValue.jslx.forEach((v, index) => {
if (index == 4) {
if (v.bt) {
v.bt = '其他';
}
} else {
if (item.yw) item.bt = true;
v.yw = v.yw ? v.yw.toString() : '';
v.iw = v.iw ? v.iw.toString() : '';
}
});
console.log(jslx.value, 'jslx.value');
}
},
{ deep: true, immediate: true }
);
// 失去焦点校验网址
function onBlur(model) {
console.log(model.gswz, 'v');
const reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
if (!reg.test(model.gswz)) createMessage.info('请输入正确的网址');
}
// 获取子组件 列表
async function getFormValueReport() {
console.log('子组件执行');
//获取所有值
let fieldsValue = await getFieldsValue();
fieldsValue = await validate();
if (fieldsValue.gkfs == 3) {
fieldsValue.gswz = qt.value;
return fieldsValue;
}
if (props.labelFirst == '修复' || props.labelFirst == '管控及修复') {
fieldsValue.jslx = [];
fieldsValue.jslx = toRaw(jslx.value);
fieldsValue.jslx.forEach((v, index) => {
if (index == 4) {
if (v.bt) {
v.bt = '其他';
}
} else {
v.yw = v.yw?v.yw.toString():'';
v.iw = v.iw?v.iw.toString():'';
}
});
}
return fieldsValue;
}
// 通过ref必须把在父组件里面的方法导出
defineExpose({
getFormValueReport,
});
// 通过ref必须把在父组件里面的方法导出
defineExpose({
getFormValueReport,
});
</script>
<style scoped>
/** 时间和数字输入框样式 */
:deep(.ant-input-number) {
width: 100%;
}
/** 时间和数字输入框样式 */
:deep(.ant-input-number) {
width: 100%;
}
:deep(.ant-picker) {
width: 100%;
}
:deep(.ant-picker) {
width: 100%;
}
table {
border-collapse: collapse;
border: 1px #dfe6ec solid
}
table {
border-collapse: collapse;
border: 1px #dfe6ec solid;
}
tbody tr td {
padding: 6px;
height: 40px;
}
tbody tr td {
padding: 6px;
height: 40px;
}
.bgColor {
background-color: rgba(244, 247, 249, 0.8);
text-align: center;
}
.bgColor {
background-color: rgba(244, 247, 249, 0.8);
text-align: center;
}
/* :deep(.ant-radio-wrapper) {
/* :deep(.ant-radio-wrapper) {
width: 120px;
text-align: left;
} */</style>
} */
</style>
......@@ -4,11 +4,15 @@
<BasicForm @register="registerForm">
<template #gstype="{ model, field }">
<!-- 如果是组件需要进行双向绑定,model当前表单对象,field当前字段名称 -->
<a-radio-group v-model:value="model[field]" style="display: flex; justify-content: space-between">
<a-radio :value="1" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['qt'] = ''">网址</a-radio>
<a-input v-model:value="model['gswz']" placeholder="请输入网址" @blur="onBlur(model)" :disabled="model[field] != 1" style="width: 40%" />
<a-radio :value="3" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['gswz'] = ''">其它</a-radio>
<a-input v-model:value="model['qt']" placeholder="请输入信息" :disabled="model[field] != 3" style="width: 40%" />
<a-radio-group v-model:value="model[field]" style="display: flex">
<div class="w-[50%]">
<a-radio :value="1" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['qt'] = ''">网址</a-radio>
<a-input v-model:value="model['gswz']" placeholder="请输入网址" @blur="onBlur(model)" :disabled="model[field] != 1" style="width: 73%" />
</div>
<div class="w-[50%]">
<a-radio :value="3" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['gswz'] = ''">其它</a-radio>
<a-input v-model:value="model['qt']" placeholder="请输入信息" :disabled="model[field] != 3" style="width: 73%" />
</div>
</a-radio-group>
</template>
</BasicForm>
......
......@@ -4,11 +4,15 @@
<BasicForm @register="registerForm">
<template #gstype="{ model, field }">
<!-- 如果是组件需要进行双向绑定,model当前表单对象,field当前字段名称 -->
<a-radio-group v-model:value="model[field]" style="display: flex; justify-content: space-between">
<a-radio value="1" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['qt'] = ''">网址</a-radio>
<a-input v-model:value="model['gswz']" placeholder="请输入网址" :disabled="model[field] != 1" style="width: 40%" />
<a-radio value="3" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['gswz'] = ''">其它</a-radio>
<a-input v-model:value="model['qt']" placeholder="请输入信息" :disabled="model[field] != 3" style="width: 40%" />
<a-radio-group v-model:value="model[field]" style="display: flex">
<div class="w-[50%]">
<a-radio value="1" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['qt'] = ''">网址</a-radio>
<a-input v-model:value="model['gswz']" placeholder="请输入网址" :disabled="model[field] != 1" style="width: 77%" />
</div>
<div class="w-[50%]">
<a-radio value="3" :style="{ height: '30px', lineHeight: '30px', width: '60px' }" @change="model['gswz'] = ''">其它</a-radio>
<a-input v-model:value="model['qt']" placeholder="请输入信息" :disabled="model[field] != 3" style="width: 91%" />
</div>
</a-radio-group>
</template>
</BasicForm>
......
......@@ -94,11 +94,20 @@
createMessage.warn('请填写网址');
return;
}
if (!reg.test(res.gswz)){
if (!reg.test(res.gswz)) {
createMessage.warn('请输入正确的网址');
return false;
}
}
if (new Date(res.tmStar) > new Date(res.tmEnd)) {
createMessage.warn('风险管控工程措施开始日期不能大于风险管控工程措施结束日期');
return;
}
// if (new Date(res.fbsj) > new Date(res.tmStar)) {
// createMessage.warn('风险管控方案编制完成日期不能大于风险管控工程措施开始日期');
// return;
// }
await saveGkxf(res);
}
// 风险管控措施信息
......@@ -106,9 +115,9 @@
async function saveCsxx(event) {
event.stopPropagation();
const res = await chilrenReportxx?.value.getFormValueGKxx();
if(res.kzfxgktrmj > dsInfor.value.wrdkjbxxb.zdmj){
createMessage.warn('开展风险管控土壤面积不能超过地块占地面积');
return false
if (res.kzfxgktrmj > dsInfor.value.wrdkjbxxb.zdmj) {
createMessage.warn('开展风险管控土壤面积不能超过地块占地面积');
return false;
}
await saveGkxf(res);
}
......
......@@ -135,6 +135,15 @@
return false;
}
}
if (new Date(res.tmStar) > new Date(res.tmEnd)) {
createMessage.warn('管控及修复工程措施开始日期不能大于管控及修复工程措施结束日期');
return;
}
// if (new Date(res.fbsj) > new Date(res.tmStar)) {
// createMessage.warn('管控及修复方案编制完成日期不能大于管控及修复工程措施开始日期');
// return;
// }
await saveGkxf(res);
}
//风险管控措施
......
......@@ -12,7 +12,7 @@
<a-collapse v-model:activeKey="activeKey" :bordered="false" class="!bg-[#fff]">
<a-collapse-panel key="1" header="地块信息" :forceRender="true">
<template #extra><a-button type="primary" @click.prevent="DkFormAddEdit($event)">保存</a-button></template>
<DkForm :data="dsInfor" ref="childrenOne" @getMj="getMj" />
<DkForm :data="dsInfor" ref="childrenOne" @getMj="getMj" />
<!-- <DkForm :data="dsInfor" ref="childrenOne" @getMj="getMj" @getDyjddcqk="getDyjddcqk" /> -->
</a-collapse-panel>
......@@ -424,19 +424,23 @@
const chilrenReport = ref<any>(null);
async function saveReport(event) {
event.stopPropagation();
const res = await chilrenReport?.value.getFormValueReport();
const res = await chilrenReport?.value.getFormValueReport();
const reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
debugger
if (res.projectType == 1) {
if (!res.gswz) {
createMessage.warn('请填写网址');
return;
}
if (!reg.test(res.gswz)){
if (!reg.test(res.gswz)) {
createMessage.warn('请输入正确的网址');
return;
}
}
if (new Date(res.fbsj) > new Date(res.wcsj)) {
createMessage.warn('调查开始日期不能大于调查结束日期');
return;
}
await updateCbdc(res);
}
// 详细调查
......@@ -444,9 +448,21 @@
async function saveXx(event) {
event.stopPropagation();
const res = await chilrenxxReport?.value.getFormValueReport();
const reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/;
if (res.projectType == 1) {
if (!res.gswz) createMessage.warn('请输入网址');
if (!res.gswz) {
createMessage.warn('请输入网址');
return;
}
if (!reg.test(res.gswz)) {
createMessage.warn('请输入正确的网址');
return;
}
}
if (new Date(res.fbsj) > new Date(res.wcsj)) {
createMessage.warn('调查开始日期不能大于调查结束日期');
return;
}
await updateXxdc(res);
}
......
......@@ -135,6 +135,15 @@
return false;
}
}
if (new Date(res.tmStar) > new Date(res.tmEnd)) {
createMessage.warn('修复工程措施开始日期不能大于修复工程措施结束日期');
return;
}
// if (new Date(res.fbsj) > new Date(res.tmStar)) {
// createMessage.warn('修复方案编制完成日期不能大于修复工程措施开始日期');
// return;
// }
await saveGkxf(res);
}
// 修复措信息
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论