|
|
@@ -0,0 +1,133 @@
|
|
|
+<template>
|
|
|
+ <vxe-modal v-model="dialogVisible" :title="title" show-zoom resize show-footer destroy-on-close transfer @hide="close" :width="width">
|
|
|
+ <template #default>
|
|
|
+ <div class="d-flex flex-cln" style="height: 60vh;">
|
|
|
+ <div class="flex1 ov-hd" style="height:50vh">
|
|
|
+ <vxe-table ref="tableRef" :loading="loading" border :data="list" height="auto" :column-config="{ resizable: true }" :row-config="{keyField: 'id',isCurrent: true, isHover: true}" :checkbox-config="{ highlight: true, range: true, trigger: 'row', reserve: true }">
|
|
|
+ <vxe-column type="checkbox" width="60"></vxe-column>
|
|
|
+ <vxe-column type="seq" width="60" title="序号" align="center" />
|
|
|
+ <!-- 企业名称 -->
|
|
|
+ <vxe-column title="企业名称" field="cpyName" min-width="100" :formatter="colNoData" />
|
|
|
+ <!-- 会员级别 -->
|
|
|
+ <vxe-column title="会员级别" field="vipLevel" min-width="100" :formatter="colNoData" />
|
|
|
+ <!-- 企业地址 -->
|
|
|
+ <vxe-column title="企业地址" min-width="100" :formatter="colNoData">
|
|
|
+ <template #default="{ row }">{{ row.regionCodeName }}{{ row.address }}</template>
|
|
|
+ </vxe-column>
|
|
|
+ <!-- 单位负责人 -->
|
|
|
+ <vxe-column title="单位负责人" field="contactPerson" width="90" />
|
|
|
+ <!-- 负责人联系电话 -->
|
|
|
+ <vxe-column title="负责人联系电话" field="tel" width="120" />
|
|
|
+ </vxe-table>
|
|
|
+ </div>
|
|
|
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
|
|
+ </div>
|
|
|
+ <div class="d-flex j-c pd-16">
|
|
|
+ <el-form ref="formRef" :model="form" :rules="rules" label-width="auto" inline>
|
|
|
+ <el-form-item label="监测点有效期至" prop="endDate">
|
|
|
+ <el-date-picker v-model="form.endDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择监测点有效期至" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template #footer>
|
|
|
+ <el-button @click="close">取消</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm">确认提交</el-button>
|
|
|
+ </template>
|
|
|
+ </vxe-modal>
|
|
|
+</template>
|
|
|
+<script setup name="addStation" lang="ts">
|
|
|
+import { addOriginCpy, listByPage } from '@/api/price/station';
|
|
|
+import { colNoData } from '@/utils/noData';
|
|
|
+import { propTypes } from '@/utils/propTypes';
|
|
|
+const emit = defineEmits(['update:show', 'close', 'sueccess']);
|
|
|
+const props = defineProps({
|
|
|
+ title: propTypes.string.def('添加监测点'),
|
|
|
+ width: propTypes.number.def(1200),
|
|
|
+ show: propTypes.bool.def(false)
|
|
|
+})
|
|
|
+const dialogVisible = ref(false);
|
|
|
+const { query }: any = useRoute()
|
|
|
+const router = useRouter();
|
|
|
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
+const list = ref<any[]>([]);
|
|
|
+const loading = ref(true);
|
|
|
+const total = ref(0);
|
|
|
+const queryFormRef = ref<ElFormInstance>();
|
|
|
+const data = reactive<any>({
|
|
|
+ form: {
|
|
|
+ endDate: ''
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ endDate: [
|
|
|
+ { required: true, message: '请选择监测点有效期至', trigger: 'blur' }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ status: '1'
|
|
|
+ }
|
|
|
+});
|
|
|
+const formRef = ref<ElFormInstance>();
|
|
|
+const { queryParams, form, rules } = toRefs(data);
|
|
|
+
|
|
|
+/** 查询会员信息列表 */
|
|
|
+const getList = async () => {
|
|
|
+ loading.value = true;
|
|
|
+ const res = await listByPage({ ...queryParams.value, packageId: props?.packageId });
|
|
|
+ list.value = res.rows;
|
|
|
+ total.value = res.total;
|
|
|
+ loading.value = false;
|
|
|
+};
|
|
|
+
|
|
|
+/** 搜索按钮操作 */
|
|
|
+const handleQuery = (level?: any) => {
|
|
|
+ queryParams.value.pageNum = 1;
|
|
|
+ getList();
|
|
|
+};
|
|
|
+
|
|
|
+/** 重置按钮操作 */
|
|
|
+const resetQuery = () => {
|
|
|
+ queryFormRef.value?.resetFields();
|
|
|
+ queryParams.value.startDate = '';
|
|
|
+ queryParams.value.endDate = '';
|
|
|
+ handleQuery();
|
|
|
+};
|
|
|
+
|
|
|
+const close = () => {
|
|
|
+ // formRef.value?.resetFields();
|
|
|
+ emit('update:show', false);
|
|
|
+ emit('close', false);
|
|
|
+};
|
|
|
+const tableRef = ref<any>();
|
|
|
+const submitForm = async () => {
|
|
|
+ const ids = tableRef.value?.getCheckboxReserveRecords(true).concat(tableRef.value?.getCheckboxRecords());
|
|
|
+ if (!ids.length) {
|
|
|
+ proxy?.$modal.msgWarning('请选择企业');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // 表单校验
|
|
|
+ const valid = await formRef.value?.validate();
|
|
|
+ if (!valid) return;
|
|
|
+ const cpyIds = ids.map((item: any) => item.id);
|
|
|
+ proxy?.$modal.loading('提交中...');
|
|
|
+ const res = await addOriginCpy({ cpyIds, endDate: form.value?.endDate }).finally(() => {
|
|
|
+ proxy?.$modal.closeLoading();
|
|
|
+ });
|
|
|
+ if (!res || res.code !== 200) return
|
|
|
+ proxy?.$modal.msgSuccess('提交成功');
|
|
|
+ emit('sueccess', true);
|
|
|
+ close();
|
|
|
+};
|
|
|
+watch(
|
|
|
+ () => props.show,
|
|
|
+ (val) => {
|
|
|
+ dialogVisible.value = val;
|
|
|
+ },
|
|
|
+ { immediate: true }
|
|
|
+);
|
|
|
+onMounted(() => {
|
|
|
+ getList();
|
|
|
+});
|
|
|
+</script>
|
