违法信息通报通讯录

静态页面搭建

src/components/components/hooks/useCostMoreHook.ts

@@ -1,25 +0,0 @@
-import { ElMessage, ElMessageBox } from 'element-plus';
-
-const useCostMoreHook = (id: string) => {
-    const ids = ref([]);
-    const handleCostionChange = (val: any[]) => {
-        ids.value = val.map(item => item[id] as any);
-    };
-    const dialogShow = ref(false);
-    const handlerCost = async (data: any) => {
-        const selectItems = data.filter(m => m.calculationFormula.includes('·'));
-        if (selectItems.length > 0) {
-            ElMessage({
-                message: '所选数据中含有全局参数字段，无法生成费用',
-                type: 'error',
-                plain: true,
-            });
-            dialogShow.value = false;
-        } else {
-            dialogShow.value = true;
-        }
-    };
-    return { dialogShow, ids, handlerCost, handleCostionChange };
-};
-
-export default useCostMoreHook;

src/components/components/pageDetails.vue

@@ -7,7 +7,6 @@
             center
             @close="handleExcel(ruleFormRef)"
             :close-on-click-modal="false"
-
         >
             <div class="form">
                 <el-form
@@ -174,7 +173,6 @@ function setDialogVisible(isNew: boolean = true, check: boolean = false) {
     }
     isEdit.value = !isNew;
 }
-const toOne = ref(0);
 // 点击确定
 function handleConfirmClick(formEl: FormInstance | undefined) {
     formData.value = Object.assign(formData.value,props.otherInfo);

src/components/components/pageSearch.vue

@@ -1,231 +1,258 @@
 <template>
-	<div class="search">
-		<!-- 1.1.表单输入 -->
-		<el-form
-			:model="searchForm"
-			ref="formRef"
-			:label-width="searchConfig.labelWidth ? searchConfig.labelWidth : 100"
-			size="large"
-		>
-			<el-row :gutter="16">
-				<template v-for="item in searchConfig.formItems" :key="item.prop">
-					<el-col :span="8">
-						<el-form-item :label="item.label" :prop="item.prop">
-							<template v-if="item.type === 'input'">
-								<el-input v-model="searchForm[item.prop]" :placeholder="item.placeholder" />
-							</template>
-							<template v-if="item.type === 'select'">
-								<el-select
-									v-model="searchForm[item.prop]"
-									collapse-tags
-									filterable
-									:multiple="item.multiple ? true : false"
-									:placeholder="item.placeholder"
-									:disabled="item.disabled"
-								>
-									<template v-for="i in item.options" :key="i.label">
-										<el-option :label="i.label" :value="i.value" />
-									</template>
-								</el-select>
-							</template>
-							<template v-if="item.type === 'date-picker'">
-								<el-date-picker
-									type="daterange"
-									range-separator="-"
-									start-placeholder="开始时间"
-									end-placeholder="结束时间"
-									v-model="searchForm[item.prop]"
-									@change="onDatePickerChange"
-								/>
-							</template>
-							<template v-if="item.type === 'date-month'">
-								<el-date-picker
-									v-model="searchForm[item.prop]"
-									type="monthrange"
-									range-separator="-"
-									:disabled-date="disabledDate"
-									placeholder="请选择费用周期"
-									start-placeholder="开始时间"
-									end-placeholder="结束时间"
-									@change="getMonthDate($event, item.prop)"
-								/>
-							</template>
-						</el-form-item>
-					</el-col>
-				</template>
-				<!-- 1.2.搜索按钮  -->
-				<el-col :span="spanLength" class="flex-b">
-					<div></div>
-					<div class="btns">
-						<el-button size="default" @click="handleResetClick">重置</el-button>
-						<el-button size="default" type="primary" @click="handleQueryClick">查询</el-button>
-					</div>
-				</el-col>
-			</el-row>
-		</el-form>
-	</div>
+  <div class="search">
+    <el-form
+      ref="formRef"
+      :model="searchForm"
+      :label-width="searchConfig.labelWidth || 100"
+      size="large"
+      class="search-form"
+    >
+      <!-- 第一行：筛选项（自动换行，每行3列） -->
+      <el-row :gutter="16" class="form-row">
+        <template v-for="item in searchConfig.formItems" :key="item.prop">
+          <!-- 响应式列：大屏3列，中屏2列，小屏1列 -->
+          <el-col
+            :span="8"
+            :md="12"
+            :sm="24"
+            class="form-col"
+          >
+            <el-form-item :label="item.label" :prop="item.prop">
+              <template v-if="item.type === 'input'">
+                <el-input v-model="searchForm[item.prop]" :placeholder="item.placeholder" />
+              </template>
+              <template v-if="item.type === 'select'">
+                <el-select
+                  v-model="searchForm[item.prop]"
+                  collapse-tags
+                  filterable
+                  :multiple="item.multiple || false"
+                  :placeholder="item.placeholder"
+                  :disabled="item.disabled"
+                >
+                  <el-option 
+                    v-for="i in item.options" 
+                    :key="i.value" 
+                    :label="i.label" 
+                    :value="i.value" 
+                  />
+                </el-select>
+              </template>
+              <template v-if="item.type === 'date-picker'">
+                <el-date-picker
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始时间"
+                  end-placeholder="结束时间"
+                  v-model="searchForm[item.prop]"
+                  @change="onDatePickerChange"
+                />
+              </template>
+              <template v-if="item.type === 'date-month'">
+                <el-date-picker
+                  v-model="searchForm[item.prop]"
+                  type="monthrange"
+                  range-separator="-"
+                  :disabled-date="disabledDate"
+                  placeholder="请选择费用周期"
+                  start-placeholder="开始时间"
+                  end-placeholder="结束时间"
+                  @change="getMonthDate($event, item.prop)"
+                />
+              </template>
+            </el-form-item>
+          </el-col>
+        </template>
+      </el-row>
+
+      <!-- 第二行：按钮区域（独立成行，右对齐） -->
+      <el-row class="btn-row">
+        <el-col :span="24">
+          <div class="btns">
+            <el-button size="default" @click="handleResetClick">重置</el-button>
+            <el-button size="default" type="primary" @click="handleQueryClick">查询</el-button>
+          </div>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
 </template>
 
 <script setup lang="ts" name="page-search">
 import type { ElForm } from 'element-plus';
-import { reactive, ref } from 'vue';
+import { reactive, ref, computed } from 'vue';
 import useSystemStore from '@/store/main';
 import useUserStore from '@/store/modules/user';
 import { parseTime } from '@/utils/ruoyi';
 import dayjs from 'dayjs';
 import { useSharedValueStore } from './sharedValueStore';
 
+// 初始化数据
+const formRef = ref<InstanceType<typeof ElForm>>();
+const systemStore = useSystemStore();
+const sharedValueStore = useSharedValueStore();
+const { searchObj } = storeToRefs(systemStore);
 const userStore = useUserStore().userInfo.userName === 'admin' ? '' : useUserStore().userInfo.userId;
 
+// Props 定义
 interface IProps {
-	searchConfig: {
-		pageName: string;
-		status: string;
-		createUser: string;
-		oneself: number;
-		formItems: any[];
-		labelWidth?: number;
-		pageListParams?: {};
-	};
+  searchConfig: {
+    pageName: string;
+    status: string;
+    createUser: string;
+    oneself: number;
+    formItems: Array<{
+      prop: string;
+      label: string;
+      type: 'input' | 'select' | 'date-picker' | 'date-month';
+      placeholder?: string;
+      initialValue?: any;
+      multiple?: boolean;
+      disabled?: boolean;
+      options?: Array<{ label: string; value: any }>;
+    }>;
+    labelWidth?: number;
+    pageListParams?: Record<string, any>;
+  };
 }
 const props = defineProps<IProps>();
 const emit = defineEmits(['datePickerChange', 'handleSure']);
-// 请求数据
-const systemStore = useSystemStore();
-const sharedValueStore = useSharedValueStore();
-const { searchObj } = storeToRefs(systemStore);
-function updateValue(newVal: any) {
-	sharedValueStore.updateSharedValue(newVal);
-}
-const pageNumValue = computed(() => sharedValueStore.pageNum);
-const pageSizeValue = computed(() => sharedValueStore.pageSize);
-const pageNum = systemStore.pageInfo.pageNum;
-const pageSize = systemStore.pageInfo.pageSize;
-const energyDates = ref([]);
-// 禁用早于当前月份的选项
-const disabledDate = date => {
-	// 获取当前时间的年月
-	const current = new Date();
-	const currentYear = current.getFullYear();
-	const currentMonth = current.getMonth(); // 月份范围 0-11
-
-	// 传入的日期（月份选择器会传入该月的第一天，如 2023-10-01）
-	const year = date.getFullYear();
-	const month = date.getMonth();
-
-	// 判断逻辑：年份小于当前年，或同年且月份小于当前月
-	return year > currentYear || (year === currentYear && month >= currentMonth);
-};
-// 获取列表
-function fetchPageListData(queryInfo: any = {}) {
-	systemStore.pageInfo.pageNum = 1;
-	// 2.发生网络请求
-	systemStore.getPageListDataAction(props.searchConfig.pageName, {
-		pageNum: 1,
-		pageSize: pageSize,
-		userId: userStore,
-		status: props.searchConfig.status,
-		createUser: props.searchConfig.createUser,
-		oneself: props.searchConfig.oneself,
-		...queryInfo,
-		...props.searchConfig.pageListParams,
-	});
-}
 
-// 1.创建表单的数据
-const initialForm: any = {};
+// 表单数据初始化
+const initialForm: Record<string, any> = {};
 for (const item of props.searchConfig.formItems) {
-	initialForm[item['prop']] = item['initialValue'] ?? '';
-}
-let searchForm = reactive(initialForm);
-
-if (props.searchConfig.status !== '') {
-	for (const item of props.searchConfig.formItems) {
-		if (item['prop'] === 'status') {
-			searchForm[item['prop']] = props.searchConfig.status;
-		}
-	}
+  initialForm[item.prop] = item.initialValue ?? '';
 }
+const searchForm = reactive<Record<string, any>>(initialForm);
 
-// 2.监听按钮的点击
-const formRef = ref<InstanceType<typeof ElForm>>();
-function handleResetClick() {
-	formRef.value?.resetFields();
-	fetchPageListData();
-	sharedValueStore.upDatePageNum(2);
-}
+// 禁用日期（月份选择器）
+const disabledDate = (date: Date) => {
+  const current = new Date();
+  return date.getFullYear() > current.getFullYear() || 
+    (date.getFullYear() === current.getFullYear() && date.getMonth() > current.getMonth());
+};
 
-function parseTimeWithCheck(value) {
-	// 如果已经是期望的格式（8 位数字），则直接返回
-	if (/^\d{8}$/.test(value)) {
-		return value;
-	}
-	return parseTime(value)?.slice(0, 10).replaceAll('-', '');
-}
-async function handleQueryClick() {
-	updateValue(searchForm);
-	props.searchConfig.formItems.forEach(item => {
-		if (item.type === 'date-picker' && searchForm[item.prop]) {
-			searchForm[item.prop][0] = parseTimeWithCheck(searchForm[item.prop][0]);
-			searchForm[item.prop][1] = parseTimeWithCheck(searchForm[item.prop][1]);
-		}
-	});
-	props.searchConfig.formItems.forEach(item => {
-		if (item.type === 'date-month' && searchForm[item.prop]) {
-			searchForm[item.prop][0] = dayjs(searchForm[item.prop][0]).format('YYYY-MM');
-			searchForm[item.prop][1] = dayjs(searchForm[item.prop][1]).format('YYYY-MM');
-		}
-	});
-	await fetchPageListData(searchForm);
-	searchObj.value = searchForm;
-	sharedValueStore.upDatePageNum(2);
-	emit('handleSure');
+// 重置表单
+const handleResetClick = () => {
+  formRef.value?.resetFields();
+  // 重置为初始值
+  Object.assign(searchForm, initialForm);
+  fetchPageListData();
+  sharedValueStore.upDatePageNum(2);
+};
+
+// 查询表单
+const handleQueryClick = async () => {
+  // 格式化日期范围（如需要）
+  props.searchConfig.formItems.forEach(item => {
+    if (item.type === 'date-picker' && searchForm[item.prop]) {
+      searchForm[item.prop][0] = parseTimeWithCheck(searchForm[item.prop][0]);
+      searchForm[item.prop][1] = parseTimeWithCheck(searchForm[item.prop][1]);
+    }
+    if (item.type === 'date-month' && searchForm[item.prop]) {
+      searchForm[item.prop][0] = dayjs(searchForm[item.prop][0]).format('YYYY-MM');
+      searchForm[item.prop][1] = dayjs(searchForm[item.prop][1]).format('YYYY-MM');
+    }
+  });
+
+  await fetchPageListData(searchForm);
+  searchObj.value = { ...searchForm };
+  sharedValueStore.upDatePageNum(2);
+  emit('handleSure');
+};
+
+// 请求列表数据
+function fetchPageListData(queryInfo: Record<string, any> = {}) {
+  systemStore.pageInfo.pageNum = 1;
+  systemStore.getPageListDataAction(props.searchConfig.pageName, {
+    pageNum: 1,
+    pageSize: systemStore.pageInfo.pageSize,
+    userId: userStore,
+    status: props.searchConfig.status,
+    createUser: props.searchConfig.createUser,
+    oneself: props.searchConfig.oneself,
+    ...queryInfo,
+    ...props.searchConfig.pageListParams,
+  });
 }
 
-const spanLength = computed(() => {
-	const length = ref(0);
-	if (props.searchConfig.formItems.length % 3 === 0) {
-		length.value = 24;
-	} else if (props.searchConfig.formItems.length % 3 === 1) {
-		length.value = 16;
-	} else if (props.searchConfig.formItems.length % 3 === 2) {
-		length.value = 8;
-	}
-	return length.value;
-});
+// 工具函数：格式化时间
+function parseTimeWithCheck(value: any) {
+  if (/^\d{8}$/.test(value)) return value;
+  return parseTime(value)?.slice(0, 10).replaceAll('-', '') || '';
+}
 
+// 日期选择器change事件
 const onDatePickerChange = (date: any) => {
-	emit('datePickerChange', date);
+  emit('datePickerChange', date);
 };
-const getMonthDate = (ent: any, prop: any) => {};
+const getMonthDate = (event: any, prop: string) => { /* 实现月份处理逻辑 */ };
+
+// 暴露方法
 defineExpose({
-	searchForm,
-	fetchPageListData,
-	handleResetClick,
-	handleQueryClick,
+  searchForm,
+  fetchPageListData,
+  handleResetClick,
+  handleQueryClick,
 });
 </script>
 
 <style scoped lang="scss">
 .search {
-	background-color: #fff;
-	// margin-top: 20px;
-	padding-bottom: 20px;
-	border-radius: 5px;
-
-	.el-form-item {
-		padding: 15px 20px;
-		margin-bottom: 0;
-	}
-
-	.el-select--large {
-		width: 22vw;
-	}
-}
+  background-color: #fff;
+  padding: 15px 20px;
+  border-radius: 5px;
+  overflow: hidden; /* 防止内部元素溢出 */
+
+  .search-form {
+    width: 100%;
+  }
+
+  /* 筛选项行样式 */
+  .form-row {
+    margin-bottom: 15px; /* 与按钮行保持间距 */
+  }
+
+  /* 筛选项列样式 */
+  .form-col {
+    padding: 0 8px; /* 微调列间距，避免 gutter 过大 */
+  }
+
+  /* 表单项目样式 */
+  .el-form-item {
+    margin-bottom: 0;
+    padding: 5px 0; /* 减少内部 padding，避免行高过大 */
+
+    .el-form-item__content {
+      width: 100%; /* 确保输入框容器占满列宽 */
+    }
+  }
+
+  /* 输入框/选择器样式 */
+  .el-input--large,
+  .el-select--large {
+    width: 100% !important; /* 强制占满列宽，自适应列宽变化 */
+    min-width: 200px; /* 最小宽度，避免过度压缩 */
+  }
+
+  /* 按钮行样式 */
+  .btn-row {
+    .btns {
+      display: flex;
+      justify-content: flex-end; /* 按钮右对齐 */
+      gap: 10px; /* 按钮间距 */
+      padding: 10px 0;
+    }
+  }
 
-.btns {
-	margin-top: 19px;
-	text-align: right;
-	padding-right: 20px !important;
+  /* 响应式调整：小屏幕下优化间距 */
+  @media (max-width: 768px) {
+    .form-col {
+      padding: 0 4px;
+    }
+    .el-form-item {
+      padding: 8px 0;
+    }
+  }
 }
-</style>
+</style>

src/views/addressBook/components/detail.vue

@@ -13,8 +13,7 @@
                             </template>
                             <template v-if="item.type === 'number'">
                                 <el-input v-model="formData[item.prop]" type="number" :min="0" :max="999999999999"
-                                    :disabled="item.disabled" :placeholder="item.placeholder"
-                                    @blur="onBlur(formData[item.prop], item.prop, item.numberType)" />
+                                    :disabled="item.disabled" :placeholder="item.placeholder"/>
                             </template>
                             <template v-if="item.type === 'select'">
                                 <el-select v-model="formData[item.prop]" :placeholder="item.placeholder"
@@ -29,121 +28,6 @@
                                     start-placeholder="开始时间" end-placeholder="结束时间" v-model="formData[item.prop]"
                                     :disabled="item.disabled" />
                             </template>
-                            <!-- 关联部门 -->
-                            <template v-if="item.type === 'deptId'">
-                                <el-tree-select v-model="formData.deptId" :data="deptOptions"
-                                    @change="dapartTreeChange(formData.deptId)"
-                                    :props="{ value: 'deptId', label: 'deptName', children: 'children' }"
-                                    value-key="deptId" placeholder="选择上级部门" style="width: 100%" check-strictly
-                                    clearable />
-                            </template>
-                            <!-- 能源单价标志 -->
-                            <template v-if="item.type === 'unitPriceSign'">
-                                <el-radio-group v-model="formData.unitPriceSign"
-                                    @change="unitPriceChange(formData.unitPriceSign)">
-                                    <el-radio v-for="item in unitPriceOptions" :value="item.value"
-                                        :label="item.value">{{ item.label }}</el-radio>
-                                </el-radio-group>
-                            </template>
-                            <!-- 能源列表 -->
-                            <template v-if="item.type === 'energyList'">
-                                <!-- 能源单价标志为否的时候 -->
-                                <el-tabs v-if="formData.unitPriceSign === '2'" v-model="customEnergy" type="card"
-                                    class="demo-tabs">
-                                    <el-tab-pane v-for="item in formData.energyList" :key="item.energyUnitPriceId"
-                                        :label="item.energyName" :name="item.energyUnitPriceId">
-                                        <!-- <el-input
-                                            v-model="item.valleyValueUnitPrice"
-                                            placeholder="请输入谷值单价"
-                                            type="number"
-                                            :min="0"
-                                            :max="999999999999"
-                                        >
-                                            <template #prepend>谷值单价(元)</template>
-</el-input>
-<el-input v-model="item.peakUnitPrice" placeholder="请输入峰值单价" type="number" :min="0" :max="999999999999">
-    <template #prepend>峰值单价(元)</template>
-</el-input> -->
-                                        <el-input v-model="item.averageUnitPrice" placeholder="请输入平均单价" type="number"
-                                            :min="0" :max="999999999999">
-                                            <template #prepend>平段单价(元)</template>
-                                        </el-input>
-                                    </el-tab-pane>
-                                </el-tabs>
-
-                                <!-- 能源单价标志为是的时候 -->
-                                <el-tabs v-else v-model="initEnergy" type="card" class="demo-tabs">
-                                    <el-tab-pane v-for="item in initEnergyList" :key="item.energyUnitPriceId"
-                                        :label="item.energyName" :name="item.energyUnitPriceId">
-                                        <!-- <el-input
-                                            v-model="item.valleyValueUnitPrice"
-                                            placeholder="请输入谷值单价"
-                                            :disabled="true"
-                                        >
-                                            <template #prepend>谷值单价(元)</template>
-                                        </el-input>
-                                        <el-input v-model="item.peakUnitPrice" placeholder="请输入峰值单价" :disabled="true">
-                                            <template #prepend>峰值单价(元)</template>
-                                        </el-input> -->
-                                        <el-input v-model="item.averageUnitPrice" placeholder="请输入平均单价"
-                                            :disabled="true">
-                                            <template #prepend>平段单价(元)</template>
-                                        </el-input>
-                                    </el-tab-pane>
-                                </el-tabs>
-                            </template>
-                            <!-- 计算公式 -->
-                            <template v-if="item.type === 'calculationFormulaName'">
-                                <Formula :dictType="dictType" @getValue="getValue"></Formula>
-                            </template>
-                            <!-- 电能耗系统ID(加) -->
-                            <template v-if="item.type === 'energyElectricIds'">
-                                <el-select v-model="formData[item.prop]" multiple filterable remote reserve-keyword
-                                    :disabled="item.disabled" style="width: 100%">
-                                    <el-option v-for="item in elecEnerty" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </template>
-                            <!-- 电能耗系统ID(减) -->
-                            <template v-if="item.type === 'energyElectricIdsMin'">
-                                <el-select v-model="formData[item.prop]" multiple filterable remote reserve-keyword
-                                    :disabled="item.disabled" style="width: 100%">
-                                    <el-option v-for="item in elecEnerty" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </template>
-                            <!-- 气能耗系统ID(加) -->
-                            <template v-if="item.type === 'energyGasIds'">
-                                <el-select v-model="formData[item.prop]" multiple filterable remote reserve-keyword
-                                    :disabled="item.disabled" style="width: 100%">
-                                    <el-option v-for="item in gasEnerty" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </template>
-                            <!-- 气能耗系统ID(减) -->
-                            <template v-if="item.type === 'energyGasIdsMin'">
-                                <el-select v-model="formData[item.prop]" multiple filterable remote reserve-keyword
-                                    :disabled="item.disabled" style="width: 100%">
-                                    <el-option v-for="item in gasEnerty" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </template>
-                            <!-- 水能耗系统ID(加) -->
-                            <template v-if="item.type === 'energyWaterIds'">
-                                <el-select v-model="formData[item.prop]" multiple filterable remote reserve-keyword
-                                    :disabled="item.disabled" style="width: 100%">
-                                    <el-option v-for="item in waterEnerty" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </template>
-                            <!-- 水能耗系统ID(减) -->
-                            <template v-if="item.type === 'energyWaterIdsMin'">
-                                <el-select v-model="formData[item.prop]" multiple filterable remote reserve-keyword
-                                    :disabled="item.disabled" style="width: 100%">
-                                    <el-option v-for="item in waterEnerty" :key="item.value" :label="item.label"
-                                        :value="item.value" />
-                                </el-select>
-                            </template>
                         </el-form-item>
                     </template>
                 </el-form>
@@ -161,16 +45,9 @@
 
 <script setup lang="ts" name="modal">
 import { reactive, ref } from 'vue';
-import type { FormInstance, FormRules } from 'element-plus';
+import type { FormInstance } from 'element-plus';
 import useSystemStore from '@/store/main';
-import { listDept } from '@/api/system/dept';
-import { ComponentInternalInstance } from 'vue';
-import cache from '@/plugins/cache';
-import Formula from '@/components/Formula/index.vue';
 import { outTypeList } from '@/libs/commonMeth';
-const elecEnerty = outTypeList('dh_ec_electricity');
-const gasEnerty = outTypeList('dh_ec_gas');
-const waterEnerty = outTypeList('dh_ec_water');
 // 定义props
 interface IProps {
     modalConfig: {
@@ -197,88 +74,9 @@ const ruleFormRef = ref<FormInstance>();
 const systemStore = useSystemStore();
 
 const { pageDetailInfo, pageOperateType } = storeToRefs(systemStore);
-import { energyUnitPrice } from '@/api/leasingCompany';
-import { matchStringAndFormat } from '@/utils/commonMeth';
-
-// 获取字段
-const dictType = 'dh_company_independent_energy_costs_calculation_formula_value';
-// 组合两个字典数组
-let fieldNameList = ref([] as any);
-// 获取费用计算公式组件的数据
-const getValue = (calculationFormulaName, dictList, globalList) => {
-    formData.value.calculationFormulaName = calculationFormulaName;
-    fieldNameList.value = [...dictList.value, ...globalList.value];
-};
-// 父组件的值
-const formulaValue = ref('初始值') as any;
-provide('calculationFormulaName', formulaValue);
-
-// 重置数据
-const handleClearDate = () => {
-    // 重置父组件的值
-    formData.value.calculationFormulaName = '';
-    // 重置子组件的值
-    formulaValue.value = +new Date();
-};
-// ---------------------费用总计 结束----------------------
 
-onMounted(async () => {
-    await getListDept();
-    await getEnergyUnitPrice();
-});
-
-// 获取能源单价
-const getEnergyUnitPrice = () => {
-    energyUnitPrice().then((res: any) => {
-        initEnergyList.value = res.rows;
-        initEnergy.value = res.rows[0].energyUnitPriceId;
-    });
-};
-
-// 部门树形数据
-const deptOptions = ref<any[]>([]);
-const departTree = ref([]);
-const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const getListDept = async () => {
-    // 获取关联部门列表
-    await listDept().then(response => {
-        departTree.value = response.data;
-        deptOptions.value = proxy!.handleTree(response.data, 'deptId');
-    });
-};
-// 部门树形的chang事件
-const dapartTreeChange = id => {
-    departTree.value.forEach((item: any) => {
-        if (item.deptId === id) {
-            formData.value.numberOfPersonnel = item.numberOfPersonnel;
-        }
-    });
-    console.log(formData.value.numberOfPersonnel);
-};
-// 能源单价标志
-const unitPriceOptions = [
-    {
-        label: '是',
-        value: '0',
-    },
-    {
-        label: '否',
-        value: '2',
-    },
-];
-// 水电燃气单价
-const customEnergy = ref('1');
-const initEnergyList = ref([] as any);
-const initEnergy = ref('1');
-// 能源单价标志的change事件
-const unitPriceChange = async (e: string) => {
-    customEnergy.value = '1';
-    initEnergy.value = '1';
-    console.log(formData.value.energyList);
+onMounted(async () => {});
 
-    await getEnergyUnitPrice();
-};
-// ----------------------------------------------------------------
 // 定义数据绑定
 const initialForm: any = {};
 for (const item of props.modalConfig.formItems) {
@@ -288,27 +86,16 @@ for (const item of props.modalConfig.formItems) {
 let formData = ref(JSON.parse(JSON.stringify(initialForm)));
 
 const dialogTitle = ref();
-const initData = ref({});
 // 新建或者编辑
 async function setDialogVisible(isNew: boolean = true, check: boolean = false) {
-    await getEnergyUnitPrice();
     dialogVisible.value = true;
     ruleFormRef.value?.resetFields();
-    // 清空数据
-    handleClearDate();
     await nextTick();
     if (!isNew) {
         watch(pageDetailInfo, newVal => {
             formData.value = pageDetailInfo.value;
-            console.log(formData.value);
-            // 赋值
-            formulaValue.value = formData.value.calculationFormulaName;
         });
 
-        customEnergy.value = '1';
-        initEnergy.value = '1';
-
-        // 判断如果不是新增的话就获取store中的详情
         if (check) {
             dialogTitle.value = props.modalConfig.detailTitle;
             systemStore.getDetailType('detail');
@@ -319,7 +106,7 @@ async function setDialogVisible(isNew: boolean = true, check: boolean = false) {
     } else {
         props.modalConfig.formItems.map((m: any) => {
             if (m.numberType === '2') {
-                if (m.porp === initialForm[m.porp]) {
+                if (m.prop === initialForm[m.prop]) {
                     initialForm[m.prop] = (0.0).toFixed(2);
                 }
             } else if (m.numberType === '1') {
@@ -330,11 +117,6 @@ async function setDialogVisible(isNew: boolean = true, check: boolean = false) {
         });
         formData.value = JSON.parse(JSON.stringify(initialForm));
         await nextTick();
-        setTimeout(() => {
-            formData.value.energyList = initEnergyList.value;
-        }, 500);
-        customEnergy.value = '1';
-        initEnergy.value = '1';
         dialogTitle.value = props.modalConfig.addTitle;
         systemStore.detailPageEval(initialForm);
         systemStore.getDetailType('add');
@@ -346,21 +128,8 @@ function handleConfirmClick(formEl: FormInstance | undefined) {
     if (!formEl) return;
     formEl.validate((valid, fields) => {
         if (valid) {
-            // 费用计算公式数据处理
-            // formData.value.calculationFormula = formData.value.calculationFormulaName
-            formData.value.calculationFormula = matchStringAndFormat(
-                formData.value.calculationFormulaName,
-                fieldNameList.value
-            );
             dialogVisible.value = false;
             let data = { ...formData.value };
-            data.energyList.forEach((item, index) => {
-                initEnergyList.value.forEach((row, d) => {
-                    if (index === d) {
-                        item.energyUnitPriceId = row.energyUnitPriceId;
-                    }
-                });
-            });
             if (props.otherInfo) {
                 data = { ...data, ...props.otherInfo };
             }
@@ -396,38 +165,6 @@ function onPageDetail(urlId: number | [] | string) {
     systemStore.detailPageDataAction(props.modalConfig.pageName, urlId);
 }
 
-function onBlur(e: any, prop: any, type: any) {
-    let a = 0;
-    if (type === '1') {
-        if (e < 0) {
-            e = 0;
-        } else if (e > 999999999999999) {
-            e = 999999999999999;
-        }
-        a = Math.trunc(e);
-        for (const item of props.modalConfig.formItems) {
-            if (item.type === 'number') {
-                if (prop === item.prop) {
-                    formData.value[item.prop] = a;
-                }
-            }
-        }
-    } else if (type === '2') {
-        if (e < 0) {
-            e = 0.0;
-        } else if (e > 999999999999999) {
-            e = 999999999999999.0;
-        }
-        a = Number(Number(e).toFixed(2));
-        for (const item of props.modalConfig.formItems) {
-            if (item.type === 'number') {
-                if (prop === item.prop) {
-                    formData.value[item.prop] = a;
-                }
-            }
-        }
-    }
-}
 defineExpose({
     setDialogVisible,
     onPageDetail,

src/views/addressBook/components/treeSelect.vue

@@ -0,0 +1,209 @@
+<template>
+  <div class="tree-container">
+    <!-- 搜索区域 -->
+    <div class="search-bar">
+      <el-input
+        v-model="searchKeyword"
+        placeholder="快速检索"
+        class="search-input"
+        prefix-icon="Search"
+      />
+      <el-button type="primary" class="search-btn" @click="handleSearch">查询</el-button>
+      <el-button type="default" class="reset-btn" @click="handleReset">重置</el-button>
+    </div>
+
+    <!-- 树形结构区域 -->
+    <div class="tree-wrapper">
+      <el-tree
+        v-model:checkedKeys="checkedKeys"
+        :data="treeData"
+        :props="treeProps"
+        show-checkbox
+        node-key="id"
+        :filter-node-method="filterNode"
+        ref="treeRef"
+        class="custom-tree"
+        :indent="16"
+        :icon="renderIcon"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import { ElTree } from 'element-plus';
+import { CircleClose, CircleCheck } from '@element-plus/icons-vue';
+
+// 树形结构数据（模拟后端返回数据）
+const treeData = ref([
+  {
+    id: 1,
+    label: '交通部根节点',
+    children: [
+      { id: 11, label: 'XXXXXXXX机构', checked: true },
+      { 
+        id: 12, 
+        label: 'XXXXXXXX机构', 
+        checked: true,
+        children: [
+          { id: 121, label: 'XXXXXXXX机构', checked: true },
+          { id: 122, label: 'XXXXXXXX机构' },
+          { id: 123, label: 'XXXXXXXX机构' },
+          { id: 124, label: 'XXXXXXXX机构' },
+          { id: 125, label: 'XXXXXXXX机构' },
+          { id: 126, label: 'XXXXXXXX机构', checked: true },
+        ]
+      },
+      { 
+        id: 13, 
+        label: 'XXXXXXXX机构', 
+        checked: true,
+        children: [
+          { id: 121, label: 'XXXXXXXX机构', checked: true },
+          { id: 122, label: 'XXXXXXXX机构' },
+          { id: 123, label: 'XXXXXXXX机构' },
+          { id: 124, label: 'XXXXXXXX机构' },
+          { id: 125, label: 'XXXXXXXX机构' },
+          { id: 126, label: 'XXXXXXXX机构', checked: true },
+        ]
+      },
+      { 
+        id: 14, 
+        label: 'XXXXXXXX机构', 
+        checked: true,
+        children: [
+          { id: 121, label: 'XXXXXXXX机构', checked: true },
+          { id: 122, label: 'XXXXXXXX机构' },
+          { id: 123, label: 'XXXXXXXX机构' },
+          { id: 124, label: 'XXXXXXXX机构' },
+          { id: 125, label: 'XXXXXXXX机构' },
+          { id: 126, label: 'XXXXXXXX机构', checked: true },
+        ]
+      },
+    ]
+  }
+]);
+
+// 树形配置项
+const treeProps = ref({
+  label: 'label',
+  children: 'children',
+  disabled: (data: any) => data.disabled, // 可自定义禁用节点
+});
+
+// 搜索关键词
+const searchKeyword = ref('');
+// 选中的节点ID（受控于v-model:checkedKeys）
+const checkedKeys = ref<(string | number)[]>([]);
+// 树形组件实例
+const treeRef = ref<InstanceType<typeof ElTree>>();
+
+// 过滤节点（搜索功能）
+const filterNode = (value: string, data: any) => {
+  if (!value) return true;
+  return data.label.toLowerCase().includes(value.toLowerCase());
+};
+
+// 处理搜索
+const handleSearch = () => {
+  treeRef.value?.filter(searchKeyword.value);
+};
+
+// 处理重置
+const handleReset = () => {
+  searchKeyword.value = '';
+  treeRef.value?.filter(''); // 清空搜索过滤
+};
+
+const renderIcon = (props: any) => {
+  if (!props.data) return null;
+  const isLeaf = !props.data.children || props.data.children.length === 0;
+  // 叶子节点且未勾选：空复选框图标
+  if (isLeaf && !props.checked) {
+    return h(CircleClose, { class: 'tree-icon unchecked' });
+  }
+  // 叶子节点且勾选：绿色勾选图标
+  if (isLeaf && props.checked) {
+    return h(CircleCheck, { class: 'tree-icon checked' });
+  }
+  return null;
+};
+</script>
+
+<style scoped lang="scss">
+.tree-container {
+  width: 100%;
+  padding: 20px;
+  background: #fff;
+  border-radius: 4px;
+}
+
+
+/* 搜索区域样式 */
+.search-bar {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 20px;
+
+  .search-input {
+    flex: 1;
+    height: 38px;
+    width: 150px;
+  }
+
+  .search-btn, .reset-btn {
+    min-width: 80px;
+    height: 38px;
+    padding: 0 16px;
+  }
+
+  .reset-btn {
+    border: 1px solid #dcdfe6;
+    color: #606266;
+    margin-left: 0;
+  }
+}
+
+/* 树形结构样式 */
+.tree-wrapper {
+  border: 1px solid #e4e7ed;
+  border-radius: 4px;
+  max-height: 500px;
+  overflow-y: auto;
+  padding: 10px 0;
+}
+
+.custom-tree {
+  --el-tree-node-content-hover-bg-color: transparent; /* 移除节点hover背景 */
+
+  .el-tree-node__content {
+    height: 36px;
+    align-items: center;
+  }
+
+  /* 复选框样式调整 */
+  .el-checkbox .el-checkbox__inner {
+    width: 18px;
+    height: 18px;
+    border-radius: 4px;
+  }
+
+  .el-checkbox__input.is-checked .el-checkbox__inner {
+    background-color: #10b981; /* 绿色勾选背景 */
+    border-color: #10b981;
+  }
+
+  /* 自定义图标样式 */
+  .tree-icon {
+    font-size: 18px;
+    &.checked {
+      color: #10b981; /* 绿色勾选图标 */
+    }
+    &.unchecked {
+      color: #c0c6cf; /* 未勾选灰色图标 */
+    }
+  }
+}
+</style>

src/views/addressBook/config/content.config.ts

@@ -4,27 +4,17 @@ const contentConfig = {
         title: '费用输入列表',
     },
     propsList: [
-        // { type: 'index', label: '序号' },
-        { type: 'normal', label: '公司编码', prop: 'rentalCompanyCode', fixed: true },
-        { type: 'normal', label: '公司名称', prop: 'rentalCompanyName', width: 140 },
-        { type: 'normal', label: '关联部门', prop: 'deptName', width: 140 },
-        // { type: 'normal', label: '人员数', prop: 'numberOfPersonnel', width: 80 },
-        // { type: 'normal', label: '密集架节数', prop: 'shelving', width: 90 },
-        // { type: 'custom', label: '水单价(元)', slotName: 'water', prop: 'water', width: 220 },
-        // { type: 'custom', label: '电单价(元)', slotName: 'electric', prop: 'electric', width: 220 },
-        // { type: 'custom', label: '燃气单价(元)', slotName: 'coal', prop: 'coal', width: 220 },
-        { type: 'normal', label: '电能耗系统(加)', prop: 'energyElectricName', width: 140 },
-        { type: 'normal', label: '电能耗系统(减)', prop: 'energyElectricNameMin', width: 140 },
-        // { type: 'normal', label: '电能耗占比(%)', prop: 'energyElectricExpense', width: 140 },
-        { type: 'normal', label: '气能耗系统(加)', prop: 'energyGasName', width: 140 },
-        { type: 'normal', label: '气能耗系统(减)', prop: 'energyGasNameMin', width: 140 },
-        // { type: 'normal', label: '气能耗占比(%)', prop: 'energyGasExpense', width: 140 },
-        { type: 'normal', label: '水能耗系统(加)', prop: 'energyWaterName', width: 140 },
-        { type: 'normal', label: '水能耗系统(减)', prop: 'energyWaterNameMin', width: 140 },
-        // { type: 'normal', label: '水能耗占比(%)', prop: 'energyWaterExpense', width: 140 },
-        { type: 'normal', label: '创建时间', prop: 'createTime', width: 180 },
-        { type: 'normal', label: '修改时间', prop: 'updateTime', width: 180 },
-        { type: 'normal', label: '备注', prop: 'notes', width: 140 },
+        { type: 'index', label: '序号' },
+        { type: 'normal', label: '单位名称', prop: 'rentalCompanyCode', fixed: true },
+        { type: 'normal', label: '所属部门', prop: 'rentalCompanyName', width: 140 },
+        { type: 'normal', label: '职务', prop: 'deptName', width: 140 },
+        { type: 'normal', label: '联络人姓名', prop: 'energyElectricName', width: 140 },
+        { type: 'normal', label: '联系方式', prop: 'energyElectricNameMin', width: 140 },
+        { type: 'normal', label: '固定电话', prop: 'energyGasName', width: 140 },
+        { type: 'normal', label: '短信接收人', prop: 'energyGasNameMin', width: 140 },
+        { type: 'normal', label: '传真号', prop: 'energyWaterName', width: 140 },
+        { type: 'normal', label: '电子邮箱', prop: 'energyWaterNameMin', width: 140 },
+        { type: 'normal', label: '通讯录状态', prop: 'createTime', width: 180 },
         { type: 'handler', label: '操作', slotName: 'operate', width: 180 },
     ],
 };

src/views/addressBook/config/detail.config.ts

@@ -1,132 +1,74 @@
 const modalConfig = {
     pageName: 'rentalCompany',
-    addTitle: '新建租赁公司',
-    editTitle: '编辑租赁公司',
+    addTitle: '新增违法信息通报通讯录',
+    editTitle: '编辑违法信息通报通讯录',
+    detailTitle: '查看违法信息通报通讯录',
     labelWidth: '150px',
     formRules: {
-        rentalCompanyCode: [{ required: true, message: '请输入公司编码', trigger: 'change' }],
-        rentalCompanyName: [{ required: true, message: '请输入公司名称', trigger: 'change' }],
+        rentalCompanyCode: [{ required: true, message: '请选择单位名称', trigger: 'change' }],
+        rentalCompanyName: [{ required: true, message: '请输入联络人名称', trigger: 'change' }],
         deptId: [{ required: true, message: '请选择关联部门', trigger: 'change' }],
         calculationFormulaName: [{ required: true, message: '请输入费用计算公式', trigger: 'change' }],
-        // energyElectricIds: [{ required: true, message: '电能耗系统ID不能为空', trigger: 'select' }],
-        // energyGasIds: [{ required: true, message: '气能耗系统ID不能为空', trigger: 'select' }],
-        // energyWaterIds: [{ required: true, message: '水能耗系统ID不能为空', trigger: 'select' }],
     },
     formItems: [
         {
-            label: '公司编码',
+            label: '单位名称',
             prop: 'rentalCompanyCode',
-            type: 'input',
-            placeholder: '请输入公司编码',
+            type: 'select',
+            placeholder: '请选择单位名称',
         },
         {
-            label: '公司名称',
+            label: '联络人名称',
             prop: 'rentalCompanyName',
             type: 'input',
-            placeholder: '请输入公司名称',
-        },
-        {
-            label: '关联部门',
-            prop: 'deptId',
-            type: 'deptId',
-            placeholder: '请选择关联部门',
+            placeholder: '请输入联络人名称',
         },
-        // {
-        //     label: '公司人员数',
-        //     prop: 'numberOfPersonnel',
-        //     type: 'number',
-        //     numberType: '1',
-        //     placeholder: '请输入人员数',
-        // },
-        // {
-        //     label: '密集架节数',
-        //     prop: 'shelving',
-        //     type: 'number',
-        //     numberType: '1',
-        //     initialValue: 0,
-        //     placeholder: '请输入密集架节数',
-        // },
-        // {
-        //     label: '能源单价标志',
-        //     prop: 'unitPriceSign',
-        //     type: 'unitPriceSign',
-        //     initialValue: '0',
-        // },
-        // {
-        //     label: '能源列表',
-        //     prop: 'energyList',
-        //     type: 'energyList',
-        // },
         {
-            label: '电能耗系统ID(加)',
-            prop: 'energyElectricIds',
-            type: 'energyElectricIds',
-            placeholder: '请输入电能耗系统ID',
+            label: '所属部门',
+            prop: 'rentalCompanyCode',
+            type: 'select',
+            placeholder: '请选择所属部门',
         },
         {
-            label: '电能耗系统ID(减)',
-            prop: 'energyElectricIdsMin',
-            type: 'energyElectricIdsMin',
-            placeholder: '请输入电能耗系统ID',
+            label: '所属职务',
+            prop: 'rentalCompanyCode',
+            type: 'select',
+            placeholder: '请选择所属职务',
         },
-        // {
-        //     label: '电能耗占比(%)',
-        //     prop: 'energyElectricExpense',
-        //     type: 'number',
-        //     numberType: '1',
-        //     initialValue: 100,
-        //     placeholder: '请输入电能耗占比',
-        // },
         {
-            label: '气能耗系统ID(加)',
-            prop: 'energyGasIds',
-            type: 'energyGasIds',
-            placeholder: '请输入气能耗系统ID',
+            label: '微信号',
+            prop: 'rentalCompanyName',
+            type: 'input',
+            placeholder: '请输入微信号',
         },
         {
-            label: '气能耗系统ID(减)',
-            prop: 'energyGasIdsMin',
-            type: 'energyGasIdsMin',
-            placeholder: '请输入气能耗系统ID',
+            label: '联系电话',
+            prop: 'rentalCompanyName',
+            type: 'input',
+            placeholder: '请输入联系电话',
         },
-        // {
-        //     label: '气能耗占比(%)',
-        //     prop: 'energyGasExpense',
-        //     type: 'number',
-        //     initialValue: 100,
-        //     numberType: '1',
-        //     placeholder: '请输入气能耗占比',
-        // },
         {
-            label: '水能耗系统ID(加)',
-            prop: 'energyWaterIds',
-            type: 'energyWaterIds',
-            placeholder: '请输入水能耗系统ID',
+            label: '固定电话',
+            prop: 'rentalCompanyName',
+            type: 'input',
+            placeholder: '请输入固定电话',
         },
         {
-            label: '水能耗系统ID(减)',
-            prop: 'energyWaterIdsMin',
-            type: 'energyWaterIdsMin',
-            placeholder: '请输入水能耗系统ID',
+            label: '传真号',
+            prop: 'rentalCompanyName',
+            type: 'input',
+            placeholder: '请输入传真号',
         },
-        // {
-        //     label: '水能耗占比(%)',
-        //     prop: 'energyWaterExpense',
-        //     type: 'number',
-        //     numberType: '1',
-        //     initialValue: 100,
-        //     placeholder: '请输入水能耗占比',
-        // },
         {
-            label: '备注',
-            prop: 'notes',
+            label: '电子邮箱',
+            prop: 'rentalCompanyName',
             type: 'input',
-            placeholder: '请输入备注',
+            placeholder: '请输入电子邮箱',
         },
         {
-            label: '天费用计算公式',
-            prop: 'calculationFormulaName',
-            type: 'calculationFormulaName',
+            label: '短信接收人',
+            prop: 'textMessage',
+            type: 'textMessage',
         },
     ],
 };

src/views/addressBook/config/search.config.ts

@@ -6,36 +6,35 @@ interface Inew {
 const searchConfig = {
     pageName: 'rentalCompany',
     formItems: [
-        // {
-        //     label: '状态',
-        //     prop: 'status',
-        //     type: 'select',
-        //     options: [] as Array<Inew>,
-        //     placeholder: '请选择状态',
-        // },
         {
-            label: '公司编码',
-            prop: 'rentalCompanyCode',
-            type: 'input',
-            placeholder: '请输入公司编码',
+            label: '单位名称',
+            prop: 'unitLevel',
+            type: 'select',
+            options: [] as Array<Inew>,
+            multiple: true,
+            placeholder: '请选择单位名称',
         },
         {
-            label: '公司名称',
-            prop: 'rentalCompanyName',
+            label: '姓名',
+            prop: 'rentalCompanyCode',
             type: 'input',
-            placeholder: '请输入公司名称',
+            placeholder: '请输入姓名',
         },
         {
-            label: '关联部门',
-            prop: 'deptName',
-            type: 'input',
-            placeholder: '请输入关联部门',
+            label: '通讯录状态',
+            prop: 'status',
+            type: 'select',
+            options: [] as Array<Inew>,
+            multiple: true,
+            placeholder: '请选择通讯录状态',
         },
         {
-            label: '创建时间',
-            prop: 'createDate',
-            type: 'date-picker',
-            placeholder: '请选择创建时间',
+            label: '短信接收人',
+            prop: 'person',
+            type: 'select',
+            options: [] as Array<Inew>,
+            multiple: true,
+            placeholder: '请选择短信接收人',
         },
    
     ],

src/views/addressBook/index.vue

@@ -1,72 +1,32 @@
 <template>
-    <div class="sensitive-words">
-        <pageSearch ref="searchTableRef" :searchConfig="searchConfig" />
-
-        <pageContent ref="tableListRef" :total="total" :contentConfig="contentConfig" :pageList="tableData">
-            <template #button>
-                <el-button type="primary" @click="handleAdd()"
-                    v-hasPermi="['business:rentalCompany:add']">新增</el-button>
-            </template>
-            <!-- 水 -->
-            <template #water="scope">
-                <div class="flex">
-                    <!-- <div class="mr5">
-                        谷值:<span>{{ scope.row.energyList[0].peakUnitPrice }}</span>
-                    </div>
-                    <div class="mr5">
-                        峰值:<span>{{ scope.row.energyList[0].valleyValueUnitPrice }}</span>
-                    </div> -->
-                    <div>
-                        平段单价:<span>{{ scope.row.energyList[0].averageUnitPrice }}</span>
-                    </div>
-                </div>
-            </template>
-            <!-- 电 -->
-            <template #electric="scope">
-                <div class="flex">
-                    <!-- <div class="mr5">
-                        谷值:<span>{{ scope.row.energyList[1].peakUnitPrice }}</span>
-                    </div>
-                    <div class="mr5">
-                        峰值:<span>{{ scope.row.energyList[1].valleyValueUnitPrice }}</span>
-                    </div> -->
-                    <div>
-                        平段单价:<span>{{ scope.row.energyList[1].averageUnitPrice }}</span>
-                    </div>
-                </div>
-            </template>
-            <!-- 燃气 -->
-            <template #coal="scope">
-                <div class="flex">
-                    <!-- <div class="mr5">
-                        谷值:<span>{{ scope.row.energyList[2].peakUnitPrice }}</span>
-                    </div>
-                    <div class="mr5">
-                        峰值:<span>{{ scope.row.energyList[2].valleyValueUnitPrice }}</span>
-                    </div> -->
-                    <div>
-                        平段单价:<span>{{ scope.row.energyList[2].averageUnitPrice }}</span>
-                    </div>
-                </div>
-            </template>
-            <template #operate="scope">
-                <el-button type="primary" link @click="handleEdit(scope.row.rentalCompanyId)"
-                    v-hasPermi="['business:rentalCompany:edit']">
-                    编辑
-                </el-button>
-                <el-button type="primary" link @click="handleDelete(scope.row.rentalCompanyId)"
-                    v-hasPermi="['business:rentalCompany:remove']">
-                    删除
-                </el-button>
-            </template>
-        </pageContent>
-        <pageDetail :modalConfig="detailConfig" ref="modalRef"> </pageDetail>
+    <div class="sensitive-words flex">
+        <TreeSelect class="mr20"></TreeSelect>
+        <div class="table-box">
+            <pageSearch ref="searchTableRef" :searchConfig="searchConfig" />
+            <pageContent ref="tableListRef" :total="total" :contentConfig="contentConfig" :pageList="tableData">
+                <template #button>
+                    <el-button type="primary" @click="onAdd()">新增</el-button>
+                    <el-button type="primary" @click="onImport()">导入</el-button>
+                    <el-button type="primary" @click="onExport()">导出</el-button>
+                </template>
+                <template #operate="scope">
+                    <el-button type="primary" link @click="handleEdit(scope.row.rentalCompanyId)">
+                        编辑
+                    </el-button>
+                    <el-button type="primary" link @click="handleCheck(scope.row.rentalCompanyId)">
+                        查看
+                    </el-button>
+                    <el-button type="primary" link @click="onDelete(scope.row.rentalCompanyId)">
+                        删除
+                    </el-button>
+                </template>
+            </pageContent>
+            <pageDetail :modalConfig="detailConfig" ref="modalRef"> </pageDetail>
+        </div>
     </div>
 </template>
 
 <script setup lang="ts">
-import { ComponentInternalInstance } from 'vue';
-// import { useRouter } from 'vue-router';
 import router from '@/router';
 import contentConfig from './config/content.config';
 import pageContent from '@/components/components/pageContent.vue';
@@ -75,6 +35,8 @@ import pageSearch from '@/components/components/pageSearch.vue';
 import detailConfig from './config/detail.config';
 import pageDetail from './components/detail.vue';
 import useSystemStore from '@/store/main';
+import FileUpload from '@/components/FileUpload/index.vue'
+import TreeSelect from './components/treeSelect.vue';
 // 使用pinia数据
 const systemStore = useSystemStore();
 const { pageDetailInfo } = storeToRefs(systemStore);
@@ -94,23 +56,21 @@ const handleEdit = async (id: string) => {
     await handleEditDataClick();
 };
 
+const handleCheck = async (id: string) => {
+    await handlePageDetail(id);
+    await handleCheckDataClick();
+}
+
 // 新增按钮
-const handleAdd = () => {
+const onAdd = () => {
     handleNewDataClick();
 };
+const onImport = () => {}
+const onExport = () => {}
 const searchTableRef = ref();
-const onClickDeleta = async (row: any) => {
-    ElMessageBox.confirm('确认删除此条数据吗？', '删除', {
-        confirmButtonText: '确认',
-        cancelButtonText: '取消',
-        type: 'warning',
-    }).then(() => {
-        // 删除后的回调
-    });
-};
 // 删除按钮
-function handleDelete(value: any) {
-    ElMessageBox.confirm('是否删除这条数据？', '删除提示', {
+function onDelete(value: any) {
+    ElMessageBox.confirm('确定删除该条违法信息通报通讯录吗？', '删除提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning',
@@ -140,7 +100,6 @@ searchItem();
 <style scoped lang="scss">
 .sensitive-words {
     margin: 20px;
-    // background-color: #fff;
 }
 
 .status {
@@ -157,4 +116,8 @@ searchItem();
 .dialog-tip {
     text-align: center;
 }
+
+.table-box {
+    width: 70%
+}
 </style>