Ver código fonte

驾意险配置/保险公司配置

@dongkboy 1 ano atrás
pai
commit
85cc6f1846

+ 3 - 1
src/api/index.ts

@@ -12,6 +12,7 @@ import tenantApi from './modules/tenant'
 import memberApi from './modules/member'
 import dept from './modules/dept'
 import company from './modules/insuranceCompany'
+import product from "./modules/product"
 const axiosInstance:ApiInstance = axios.create({
   baseURL: (import.meta.env.DEV && import.meta.env.VITE_OPEN_PROXY === 'true') ? '/proxy/' : import.meta.env.VITE_APP_API_BASEURL,
   timeout: 1000 * 60,
@@ -98,6 +99,7 @@ const api = {
   tenantApi: tenantApi(axiosInstance),
   member:memberApi(axiosInstance),
   dept:dept(axiosInstance),
-  company:company(axiosInstance)
+  company:company(axiosInstance),
+  product:product(axiosInstance)
 }
 export default api

+ 1 - 2
src/api/modules/dept.ts

@@ -14,11 +14,10 @@ const dept = (axiosInstance: ApiInstance) => ({
   deptBatchDeleteDept: (data: any) => axiosInstance.post('dept/batchDeleteDept', data),
   //机构树形查询
   getDeptTree: (data?: any) => axiosInstance.post('dept/getDeptTreePlatform', data),
-
   //机构区划查询
   queryTree: () => axiosInstance.post('area/queryTree'),
   // 机构信息查询
-  deptGet: (data: any) => axiosInstance.get(`dept/deptGet?id=${data}`),
+  deptGet: (data: any) => axiosInstance.get(`dept/deptGetPlatform?id=${data}`),
 
 })
 

+ 2 - 0
src/api/modules/insuranceCompany.ts

@@ -10,6 +10,8 @@ const company = (axiosInstance: ApiInstance) => ({
   editInsCompany: (data: Types.info) => axiosInstance.post('/esmInsCompany/editInsCompany', data),
   // 删除
   CompanyDel: (id: String) => axiosInstance.get(`/esmInsCompany/${id}`),
+  //查询一级列表
+  selectLevelList: (data: Types.companyTreeRequest) => axiosInstance.post('/esmInsCompany/selectLevelList', data),
 
 })
 

+ 18 - 0
src/api/modules/product.ts

@@ -0,0 +1,18 @@
+import { ApiInstance } from '../type'
+import * as Types from '../types/productTypes';
+const product = (axiosInstance: ApiInstance) => ({
+  //保存驾意险配置
+  jyxConfigAdd: (data: Types.jyxConfigRequest) => axiosInstance.post('/jyxConfig/saveAll', data),
+  //查询主险
+  selectMainInsurance: (company:string ) => axiosInstance.get(`/jyxConfig/selectMainInsurance?company=${company}`),
+  //查询驾意险列表
+  jyxList: (data: Types.jyxListRequest) => axiosInstance.post('/jyxConfig/jyxList', data),
+  //详情
+  jygetById: (id:string ) => axiosInstance.get(`/jyxConfig/getById?id=${id}`),
+  //驾意险修改
+  jyxupdateById: (data: Types.jyxConfigRequest) => axiosInstance.post('/jyxConfig/updateById', data),
+  //删除
+  deleteById: (id:string ) => axiosInstance.get(`/jyxConfig/deleteById?id=${id}`),
+})
+
+export default product

+ 170 - 0
src/api/types/productTypes.ts

@@ -0,0 +1,170 @@
+/**
+ * JyxConfigAdd,驾意险配置
+ */
+export type jyxConfigRequest = {
+  /**
+   * 别名
+   */
+  alias?: string;
+  /**
+   * id
+   */
+  id?: string;
+  /**
+   * 保险责任
+   */
+  blameList: JyxBlame[];
+  /**
+   * 保险公司
+   */
+  company: string;
+  /**
+   * 对接方式
+   */
+  connectionMethod: string;
+  /**
+   * 总保额
+   */
+  coverage: string;
+  /**
+   * 上级产品
+   */
+  parentId: string;
+  /**
+   * 总保费
+   */
+  premium: string;
+  /**
+   * 保费设置
+   */
+  premiumSetting: string;
+  /**
+   * 产品编码
+   */
+  productCode: string;
+  /**
+   * 产品名称
+   */
+  productName: string;
+  /**
+   * 产品类型
+   */
+  productType: string;
+  /**
+   * 驾意险保费设置
+   */
+  settingList: JyxSetting[];
+  [property: string]: any;
+}
+
+/**
+* JyxBlame,驾意险责任配置
+*/
+export type JyxBlame = {
+  /**
+   * 保险责任
+   */
+  blame?: string;
+  /**
+   * 责任编码
+   */
+  blameCode?: string;
+  /**
+   * 责任保额
+   */
+  blameCoverage?: number;
+  /**
+   * 责任保费
+   */
+  blamePremium?: number;
+  /**
+   * 创建人
+   */
+  createBy?: string;
+  /**
+   * 创建时间
+   */
+  createTime?: Date;
+  id?: string;
+  /**
+   * 是否删除
+   */
+  isDelete?: number;
+  jyxConfigId?: string;
+  systemCode?: string;
+  /**
+   * 修改人
+   */
+  updateBy?: string;
+  /**
+   * 修改时间
+   */
+  updateTime?: Date;
+  [property: string]: any;
+}
+
+/**
+* jyxSetting,驾意险保费设置
+*/
+export type JyxSetting = {
+  /**
+   * 保额
+   */
+  coverage?: number;
+  /**
+   * 创建人
+   */
+  createBy?: string;
+  /**
+   * 创建时间
+   */
+  createTime?: Date;
+  id?: string;
+  /**
+   * 是否删除
+   */
+  isDelete?: number;
+  jyxConfigId?: string;
+  /**
+   * 保费
+   */
+  premium?: number;
+  /**
+   * 座位数
+   */
+  seats?: number;
+  systemCode?: string;
+  /**
+   * 修改人
+   */
+  updateBy?: string;
+  /**
+   * 修改时间
+   */
+  updateTime?: Date;
+  [property: string]: any;
+}
+export type jyxConfigAddRequest = {
+  company: string;
+  [property: string]: any;
+}
+/**
+ * JyxConfigParam,驾意险配置查询DTO
+ */
+export type jyxListRequest = {
+  /**
+   * 查询参数 保险公司
+   */
+  company?: string;
+  /**
+   * 查询参数 输入产品名称,别名查找
+   */
+  params?: string;
+  parentId?: string;
+  /**
+   * 查询参数 输入座位数
+   */
+  seats?: string;
+  size?: number;
+  [property: string]: any;
+}

+ 5 - 0
src/assets/styles/globals.css

@@ -289,9 +289,14 @@ textarea {
 }
 
 .strong {
+  font-size: 14px;
   font-weight: bold;
 }
 
+.elementSpacing > * {
+  margin-bottom: 5px; /* 下边距 */
+}
+
 .size14 {
   font-size: 14px;
 }

+ 68 - 15
src/components/Table/index.vue

@@ -16,6 +16,40 @@
           </div>
         </template>
         <el-table-column type="selection" v-if="showSelect" :selectable="selectable" width="55" />
+        <el-table-column type="expand" v-if="secondaryTable">
+          <template #default="props">
+            <div>
+              <el-table :data="props.row.children" >
+              <el-table-column v-for="column in secondaryColumns" :key="column.prop" :prop="column.prop"
+                :label="column.label" :sortable="column.sortable ? 'custom' : false" :width="column.width">
+                <template #header>
+                  <slot name="search" :slotData="column"></slot>
+                </template>
+                <template #default="scope">
+                  <RouterLink v-if="column.component === 'RouterLink'" :to="getRouterLinkTo(scope.row, column)"
+                    class="custom-link">
+                    {{ scope.row[column.prop] }}
+                  </RouterLink>
+                  <el-tag v-else-if="column.component === 'Tag'" :type="getTagTypeAndText(scope.row, column).type">
+                    {{ getTagTypeAndText(scope.row, column).text }}
+                  </el-tag>
+                  <ImagePreview v-else-if="column.component === 'Image'" :src="getImgTo(scope.row, column)" width="50px"
+                    height="50px"></ImagePreview>
+                  <span v-else>
+                    {{ getDisplayText(scope.row, column) }}
+                  </span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" fixed="right" :width="props.columnwidth">
+                <template #default="scope">
+                  <slot name="secondary" :secondaryData="scope.row"></slot>
+                </template>
+              </el-table-column>
+            </el-table>
+            </div>
+
+          </template>
+        </el-table-column>
         <el-table-column v-if="showIndex" type="index" label="序号" width="55" />
         <el-table-column v-for="column in columns" :key="column.prop" :prop="column.prop" :label="column.label"
           :sortable="column.sortable ? 'custom' : false" :width="column.width">
@@ -23,19 +57,21 @@
             <slot name="search" :slotData="column"></slot>
           </template>
           <template #default="scope">
-            <RouterLink v-if="column.component === 'RouterLink'" :to="getRouterLinkTo(scope.row, column)" class="custom-link">
+            <RouterLink v-if="column.component === 'RouterLink'" :to="getRouterLinkTo(scope.row, column)"
+              class="custom-link">
               {{ scope.row[column.prop] }}
             </RouterLink>
             <el-tag v-else-if="column.component === 'Tag'" :type="getTagTypeAndText(scope.row, column).type">
               {{ getTagTypeAndText(scope.row, column).text }}
             </el-tag>
-            <ImagePreview v-else-if="column.component === 'Image'" :src="getImgTo(scope.row, column)" width="50px" height="50px"></ImagePreview>
+            <ImagePreview v-else-if="column.component === 'Image'" :src="getImgTo(scope.row, column)" width="50px"
+              height="50px"></ImagePreview>
             <span v-else>
               {{ getDisplayText(scope.row, column) }}
             </span>
           </template>
         </el-table-column>
-        <el-table-column label="操作" fixed="right" :width="props.columnheight">
+        <el-table-column label="操作" fixed="right" :width="props.columnwidth">
           <template #default="scope">
             <slot name="operation" :operationData="scope.row"></slot>
           </template>
@@ -50,7 +86,7 @@
 
       </el-table>
     </div>
-    <div class="page_box">
+    <div class="page_box" v-if="props.pageInfo">
       <el-pagination v-model:current-page="props.pageInfo.pageNum" v-model:page-size="props.pageInfo.pageSize"
         :page-sizes="props.pageInfo.sizes" layout="total, sizes, prev, pager, next, jumper"
         :total="props.pageInfo.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
@@ -68,7 +104,8 @@ interface TableRow {
 const emit = defineEmits(['getList', 'selectAllChange', 'selectionChange']);
 const props = defineProps<{
   tableData: Array<TableRow>;
-  columnheight: number,
+  columnwidth: number,//操作栏宽度
+  secondaryTable?: boolean,//是否展示二级表格
   columns: {
     prop: string;
     label: string;
@@ -79,7 +116,17 @@ const props = defineProps<{
     formatter?: (row: any, column: any, cellValue: any, index: number) => any;
 
   }[];
-  pageInfo: {
+  secondaryColumns?: {
+    prop: string;
+    label: string;
+    sortable?: boolean;
+    width?: string;
+    style?: string;
+    component?: string,
+    formatter?: (row: any, column: any, cellValue: any, index: number) => any;
+
+  }[];
+  pageInfo?: {
     pageNum: number;
     pageSize: number;
     sizes: number[];
@@ -120,8 +167,10 @@ onMounted(() => {
 });
 const selectable = () => true;
 const handleSizeChange = (val: number) => {
-  props.pageInfo.pageSize = val
-  emit('getList', props.pageInfo);
+  if (props.pageInfo) {
+    props.pageInfo.pageSize = val
+    emit('getList', props.pageInfo);
+  }
 }
 //多选
 
@@ -147,10 +196,10 @@ const selectionChange = (value: any[]) => {
   emit('selectionChange', newSelectionList.value)
 }
 const handleCurrentChange = (val: number) => {
-
-  props.pageInfo.pageNum = val
-  emit('getList', props.pageInfo);
-
+  if (props.pageInfo) {
+    props.pageInfo.pageNum = val
+    emit('getList', props.pageInfo);
+  }
 
 }
 //空值处理
@@ -169,7 +218,7 @@ function getTagTypeAndText(row: Row, column: any) {
   return column.formatter ? column.formatter(row, column, row[column.prop]) : { type: 'primary', text: row[column.prop] };
 }
 function getDisplayText(row: Row, column: any): string {
-  return column.formatter ? column.formatter(row, column, row[column.prop]) :displayValue(row[column.prop]);
+  return column.formatter ? column.formatter(row, column, row[column.prop]) : displayValue(row[column.prop]);
 }
 </script>
 <style lang="scss" scoped>
@@ -185,8 +234,12 @@ function getDisplayText(row: Row, column: any): string {
 }
 
 .custom-link {
-  color: #0083ff; /* 设置文字颜色 */
-  text-decoration: none; /* 去掉下划线 */
+  color: #0083ff;
+
+  /* 设置文字颜色 */
+  text-decoration: none;
+
+  /* 去掉下划线 */
 }
 
 .table_box {

+ 5 - 4
src/components/TableTree/index.vue

@@ -6,12 +6,13 @@
       </div>
       <el-table ref="TableTreeRef" class="custom-table" v-loading="props.loading"
         :header-cell-style="{ 'background-color': '#EEF1F6', 'border-bottom': '1px solid #EEF1F6', 'font-size': '15px', 'color': '#333', 'padding': '10px 0' }"
-        :data="props.tableData" :height="tableHeight" row-key="id" border
+        :data="props.tableData" :height="tableHeight" row-key="id"
          style="width: 100%;">
         <!-- 空内容自定义 -->
         <template #empty>
           <div class="flex f-c a-c ">
-            <el-empty image="../../../src/assets/images/empty.png" />
+            <img src="../../assets/images/empty.png" alt="">
+            <span style="font-size: 14px;color: #909399;">暂无数据</span>
           </div>
         </template>
         <el-table-column type="selection" v-if="showSelect" :selectable="selectable" width="55" />
@@ -34,7 +35,7 @@
             <slot name="search" :slotData="column"></slot>
           </template>
         </el-table-column>
-        <el-table-column label="操作" fixed="right" :width="props.columnheight" align="center">
+        <el-table-column label="操作" fixed="right" :width="props.columnwidth" align="center">
           <template #default="scope">
             <div class="flex j-c a-c">
               <slot name="operation" class="operationClass" :operationData="scope.row"></slot>
@@ -63,7 +64,7 @@ interface RouterLink {
 const emit = defineEmits([]);
 const props = defineProps<{
   tableData: Array<TableRow>;
-  columnheight: number,
+  columnwidth: number,
   loading?:boolean,
   columns: {
     prop: string;

+ 2 - 2
src/components/tablev2/index.vue

@@ -34,7 +34,7 @@
             <slot name="search" :slotData="column"></slot>
           </template>
         </el-table-column>
-        <el-table-column label="操作" fixed="right" :width="props.columnheight" align="center">
+        <el-table-column label="操作" fixed="right" :width="props.columnwidth" align="center">
           <template #default="scope">
             <div class="flex j-c a-c">
               <slot name="operation" class="operationClass" :operationData="scope.row"></slot>
@@ -63,7 +63,7 @@ interface RouterLink {
 const emit = defineEmits([]);
 const props = defineProps<{
   tableData: Array<TableRow>;
-  columnheight: number,
+  columnwidth: number,
   loading?:boolean,
   columns: {
     prop: string;

+ 1 - 1
src/layouts/components/Topbar/Toolbar/rightSide.vue

@@ -17,7 +17,7 @@ defineOptions({
 })
 const settingsStore = useSettingsStore()
 const userStore = useUserStore()
-const inputText = ref(userStore.userName); // 用户输入的中文文本
+const inputText = ref(userStore.realName); // 用户输入的中文文本
 const firstLetterPinyin = ref(''); // 转换为拼音首字母
 console.log(userStore.avatar)
 //获取

+ 11 - 11
src/router/modules/product.ts

@@ -29,21 +29,21 @@ const routes: RouteRecordRaw = {
             breadcrumb: false,
           },
         },
-        // {
-        //   path: 'organizationAdd',
-        //   name: 'OrganizationAdd',
-        //   component: () => import('@/views/organizationManagement/organization/organizationAdd.vue'),
-        //   meta: {
-        //     title: '驾意险添加',
-        //     menu: false,
-        //     activeMenu: '/organizationManagement/organization/organizationlist',
-        //   },
-        // },
+        {
+          path: 'drivingInsuranceAdd',
+          name: 'DrivingInsuranceAdd',
+          component: () => import('@/views/productConfiguration/drivingInsurance/drivingInsuranceAdd.vue'),
+          meta: {
+            title: '驾意险添加',
+            menu: false,
+            activeMenu: '/productConfiguration/drivingInsurance/index',
+          },
+        },
       ],
     },
 
     {
-      path: 'index',
+      path: '/productConfiguration/specialClause/index',
       name: 'SpecialClauseIndex',
       component: () => import('@/views/productConfiguration/specialClause/index.vue'),
       meta: {

+ 4 - 4
src/utils/composables/imageUtils.ts

@@ -1,7 +1,7 @@
-import avatar1 from '@/assets/images/user/avatar1.png';
-import avatar2 from '@/assets/images/user/avatar2.png';
-import avatar3 from '@/assets/images/user/avatar3.png';
-import avatar4 from '@/assets/images/user/avatar4.png';
+import avatar1 from '../../assets/images/user/avatar1.png';
+import avatar2 from '../../assets/images/user/avatar2.png';
+import avatar3 from '../../assets/images/user/avatar3.png';
+import avatar4 from '../../assets/images/user/avatar4.png';
 /**
  * 随机获取四个图片中的某一个
  * @returns 随机选中的图片URL或文件名

+ 1 - 5
src/views/insuranceCompanyConfiguration/insuranceCompanyConfig.vue

@@ -25,8 +25,7 @@
                 ref="multipleTableRef" :expand-column-key="expandColumnKey" header-class="header-class">
                 <template #cell="scope">
                   <div v-if="scope.column.key == 'option'" class="flex j-s a-c">
-                    <el-button type="primary" link @click="addSubsidiary(scope.rowData)"
-                      v-auth="'organizationlist.edit'"> 添加子公司
+                    <el-button type="primary" link @click="addSubsidiary(scope.rowData)"> 添加子公司
                     </el-button>
                     <el-dropdown placement="bottom-start">
                       <span class="el-dropdown-link">
@@ -431,10 +430,7 @@ const saveInfo = async (formEl: FormInstance | undefined) => {
         plain: true,
       })
     }
-
   })
-
-
 }
 const sysIconupload = (file: any) => {
   let files = file.raw;

+ 18 - 1
src/views/organizationManagement/organization/organizationAdd.vue

@@ -36,7 +36,6 @@
           <ElCol :md="24" :lg="12" v-if="!id">
             <el-form-item label="登录密码" prop="password">
               <el-input style="display: none;" type="text" />
-
               <el-input v-model="sysform.password" placeholder="请输入登录密码" show-password type="password"
                 autocomplete="new-password" />
             </el-form-item>
@@ -215,6 +214,22 @@ const sysTypelist = ref([
     name: "保险代理公司",
   }
 ])
+const validatepassword = (_rule: any, value: any, callback: any) => {
+  // 定义正则表达式,例如:只允许字母、数字,长度在4到10个字符之间
+  const codeRegex = /^[A-Z0-9]+$/i;
+  // 判断是否为空
+  if (!value) {
+    return callback(new Error('请输入code编码'));
+  }
+
+  // 验证是否符合正则表达式
+  if (!codeRegex.test(value)) {
+    return callback(new Error('code编码格式不正确,仅支持8~20位字母或数字'));
+  }
+
+  // 验证通过
+  callback();
+};
 const sysformRules = ref<FormRules>({
   sysCode: [
     { required: true, trigger: 'blur', message: '请输入编码(唯一标识)' },
@@ -234,6 +249,8 @@ const sysformRules = ref<FormRules>({
   ],
   password: [
     { required: true, trigger: 'blur', message: '请输入密码' },
+    { min: 8, max: 20, message: '仅支持8~20位字母或数字', trigger: 'blur' },
+    { validator: validatepassword, trigger: 'blur' }
   ],
 
   address: [

+ 1 - 1
src/views/organizationManagement/organization/organizationDetail.vue

@@ -80,7 +80,7 @@
             </el-descriptions>
           </el-tab-pane>
           <el-tab-pane label="下级机构" name="organization">
-            <TableTree :tableData="tableData" :columns="columns" :showIndex="false" :columnheight="200"
+            <TableTree :tableData="tableData" :columns="columns" :showIndex="false" :columnwidth="200"
               :showSelect="false">
               <template v-slot:table-title-btn>
                 <RouterLink :to="{ name: 'OrganizationDeptAdd', query: { code: code } }">

+ 7 - 5
src/views/organizationManagement/organization/organizationlist.vue

@@ -37,7 +37,7 @@
           </ElCol>
         </ElRow>
       </ElForm>
-      <Table :tableData="tableData" :columns="columns" :showIndex="false" :columnheight="200" :showSelect="true"
+      <Table :tableData="tableData" :columns="columns" :showIndex="false" :columnwidth="200" :showSelect="true"
         :pageInfo="pageInfo" @getList="getList" @selectAllChange="handleSelectionChange"
         @selectionChange="selectionChange">
         <template v-slot:table-title-btn>
@@ -187,14 +187,13 @@ const queryTreeQuery = () => {
   });
 }
 function findpage() {
-  api.tenantApi.sysList({ pageNum: pageInfo.value.pageNum, pageSize: pageInfo.value.pageSize, ...formInline }).then((res: any) => {
+  api.tenantApi.sysList({ pages: pageInfo.value.pageNum, size: pageInfo.value.pageSize, ...formInline }).then((res: any) => {
     if (res.code == 200) {
       tableData.value = res.data.records;
-      pageInfo.value.pageNum = res.data.page;
+      pageInfo.value.pageNum = res.data.pages;
       pageInfo.value.pageSize = res.data.size;
       pageInfo.value.total = res.data.total;
     }
-
   })
 }
 const columns = [
@@ -238,6 +237,8 @@ const columns = [
 function getList(item: PageInfo) {
   pageInfo.value.pageNum = item.pageNum;
   pageInfo.value.pageSize = item.pageSize;
+  findpage();
+
 };
 function tenantUpdate(item: any) {
   router.push({
@@ -391,7 +392,8 @@ const resetForm = () => {
   formInline.cityId = '';
   formInline.districtId = '';
   formInline.sysType = '';
-
+  provinceoptions.value=[];
+  findpage();
 }
 
 </script>

+ 7 - 6
src/views/personnel/memberManagement.vue

@@ -29,7 +29,7 @@
         </ElRow>
       </ElForm>
       <ElDivider border-style="dashed"></ElDivider>
-      <Table :tableData="tableData" :columns="columns" :showIndex="false" :columnheight="200" :showSelect="true"
+      <Table :tableData="tableData" :columns="columns" :showIndex="false" :columnwidth="200" :showSelect="true"
         :pageInfo="pageInfo" @getList="getList" @selectAllChange="handleSelectionChange"
         @selectionChange="selectionChange">
         <template v-slot:table-title-btn>
@@ -65,9 +65,9 @@
             <template #dropdown>
               <el-dropdown-menu>
                 <el-dropdown-item @click="del(scope.operationData.id)">删除</el-dropdown-item>
-                <el-dropdown-item v-if="scope.operationData.accountStatus == 1"
+                <el-dropdown-item v-if="scope.operationData.isEnable == 1"
                   @click="disable(scope.operationData.id)">禁用</el-dropdown-item>
-                <el-dropdown-item v-if="scope.operationData.accountStatus == 0"
+                <el-dropdown-item v-if="scope.operationData.isEnable == 0"
                   @click="enable(scope.operationData.id)">启用</el-dropdown-item>
               </el-dropdown-menu>
             </template>
@@ -179,7 +179,7 @@ onUnmounted(() => {
   window.removeEventListener('keydown', handleEnter, false)
 })
 function findpage() {
-  api.member.userList({ page: pageInfo.value.pageNum, size: pageInfo.value.pageSize, ...formInline }).then((res: any) => {
+  api.member.userList({ pages: pageInfo.value.pageNum, size: pageInfo.value.pageSize, ...formInline }).then((res: any) => {
     if (res.code == 200) {
       tableData.value = res.data.records;
       pageInfo.value.pageNum = res.data.current;
@@ -268,8 +268,8 @@ const columns = [
     }
   },
   {
-    prop: "accountStatus", label: "状态", component: 'Tag', formatter: (row: any) => {
-      if (row.accountStatus) {
+    prop: "isEnable", label: "状态", component: 'Tag', formatter: (row: any) => {
+      if (row.isEnable) {
         return { type: 'primary', text: '启用' };
       } else {
         return { type: 'danger', text: '禁用' };
@@ -280,6 +280,7 @@ const columns = [
 function getList(item: PageInfo) {
   pageInfo.value.pageNum = item.pageNum;
   pageInfo.value.pageSize = item.pageSize;
+  findpage();
 };
 function tenantUpdate(id: string) {
   dialogTitle.value = '编辑成员';

+ 6 - 3
src/views/personnel/roleManagement.vue

@@ -64,7 +64,10 @@
                 @check="handleCheckChange" />
             </div>
           </div>
-          <el-empty v-else image="../../../src/assets/images/empty.png" />
+          <div class="flex f-c a-c " v-else>
+            <img src="../../assets/images/empty.png" alt="">
+            <span style="font-size: 14px;color: #909399;">暂无数据</span>
+          </div>
         </ElCol>
       </ElRow>
 
@@ -258,12 +261,12 @@ function resetForm() {
 <style lang="scss" scoped>
 .roleitem {
   span:first-child {
-    font-size: 16px;
+    font-size: 14px;
     color: #333;
   }
 
   span:last-child {
-    font-size: 14px;
+    font-size: 12px;
     color: #666;
   }
 }

+ 452 - 0
src/views/productConfiguration/drivingInsurance/drivingInsuranceAdd.vue

@@ -0,0 +1,452 @@
+<template>
+  <div>
+    <PageMain style="padding: 20px;margin-bottom: 100px;">
+      <ElRow :gutter="60">
+        <ElCol :md="24" :lg="24" style="padding-bottom: 10px;font-size: 14px;">
+          <span class="strong">基本信息</span>
+        </ElCol>
+        <el-form :model="productform" label-width="120px" :rules="productformRules" label-position="top"
+          ref="productFormRef" style="max-width: 1000px;" class="flex a-c f-wrap" :size="fromSize">
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="产品类型" prop="productType">
+              <el-select v-model="productform.productType" :disabled="productType == '2' || type=='edit'" @change="productTypeChange"
+                placeholder="请选择产品类型" clearable filterable>
+                <el-option label="主险" value="1" />
+                <el-option label="附加险" value="2" />
+              </el-select>
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12" v-if="productform.productType != '1'">
+            <el-form-item label="上级产品" prop="parentId">
+              <el-select v-model="productform.parentId" :disabled="productType == '2' || type=='edit'" placeholder="请选择产品" clearable>
+                <el-option v-for="(item, index) in parentList" :key="index" :label="item.productName"
+                  :value="item.id" />
+              </el-select>
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="产品名称" prop="productName">
+              <el-input v-model="productform.productName" placeholder="输入产品名称" />
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="别名">
+              <el-input v-model="productform.alias" placeholder="输入产品别名" />
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="保险公司" prop="company">
+              <el-input v-model="productform.companyName" placeholder="保险公司" disabled />
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="产品编码" prop="productCode">
+              <el-input v-model="productform.productCode" placeholder="点击查询,获取产品编码" />
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="对接方式" prop="connectionMethod">
+              <el-select v-model="productform.connectionMethod" placeholder="请选择产品" clearable filterable>
+                <el-option label="API对接" value="1" />
+                <el-option label="Python对接" value="2" />
+              </el-select>
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="保费设置" prop="premiumSetting">
+              <el-select v-model="productform.premiumSetting" placeholder="请选择" clearable filterable>
+                <el-option label="产品统一价格" value="1" />
+                <el-option label="按座位数设置价格" value="2" />
+              </el-select>
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12" v-if="productform.premiumSetting == '1'">
+            <el-form-item label="总保额" prop="coverage">
+              <el-input v-model="productform.coverage" placeholder="请输入总保额">
+                <template #append>元</template>
+              </el-input>
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12" v-if="productform.premiumSetting == '1'">
+            <el-form-item label="总保费" prop="premium">
+              <el-input v-model="productform.premium" placeholder="请输入总保费">
+                <template #append>元</template>
+              </el-input>
+            </el-form-item>
+          </ElCol>
+        </el-form>
+        <ElCol :md="24" :lg="24" v-if="productform.premiumSetting == '2'">
+          <ElDivider style="margin: 10px 0;"></ElDivider>
+          <ElCol :md="24" :lg="24" style="padding-bottom: 10px;font-size: 14px;">
+            <span class="strong">保费设置</span>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-table :data="productform.settingList" style="width: 100%;">
+              <el-table-column prop="seats" label="座位数" width="180">
+                <template #default="scope">
+                  <el-input-number v-model="scope.row.seats" controls-position="right" style="width: 100%;" :min="5"
+                    :max="10">
+                    <template #suffix>
+                      <span>座</span>
+                    </template>
+                  </el-input-number>
+                </template>
+              </el-table-column>
+              <el-table-column prop="coverage" label="保额" width="180">
+                <template #default="scope">
+                  <el-input-number v-model="scope.row.coverage" :precision="2" controls-position="right"
+                    style="width: 100%;" :min="1" :max="9000000">
+                    <template #suffix>
+                      <span>元</span>
+                    </template>
+                  </el-input-number>
+                </template>
+              </el-table-column>
+              <el-table-column prop="premium" label="保费">
+                <template #default="scope">
+                  <el-input-number v-model="scope.row.premium" :precision="2" controls-position="right"
+                    style="width: 100%;" :min="1" :max="9000000">
+                    <template #suffix>
+                      <span>元</span>
+                    </template>
+                  </el-input-number>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作">
+                <template #default="scope">
+                  <el-button type="primary" link @click="settingDel(scope.$index)">删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+            <ElButton type="primary" style="margin-top: 10px;" @click="settingListAdd">
+              <template #icon>
+                <el-icon>
+                  <Plus />
+                </el-icon>
+              </template>
+              添加一条
+            </ElButton>
+          </ElCol>
+        </ElCol>
+        <ElCol :md="24" :lg="24">
+          <ElDivider style="margin: 10px 0;"></ElDivider>
+          <ElCol :md="24" :lg="24" style="padding-bottom: 10px;font-size: 14px;">
+            <span class="strong">保险责任</span>
+          </ElCol>
+          <el-table :data="productform.blameList" style="width: 100%;">
+            <el-table-column prop="blame" label="保险责任"></el-table-column>
+            <el-table-column prop="blameCode" label="保险责任编码" width="180" align="center"></el-table-column>
+            <el-table-column prop="blameCoverage" label="保险责任保额" width="180" align="center"></el-table-column>
+            <el-table-column prop="blamePremium" label="保险责任保费" width="180" align="center"></el-table-column>
+            <el-table-column label="操作" width="280" align="center">
+              <template #default="scope">
+                <el-button type="primary" link @click="blameDel(scope.$index)">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <ElButton type="primary" style="margin-top: 10px;" @click="blameListAdd">
+            <template #icon>
+              <el-icon>
+                <Plus />
+              </el-icon>
+            </template>
+            添加一条
+          </ElButton>
+        </ElCol>
+      </ElRow>
+    </PageMain>
+    <FixedActionBar>
+      <ElButton @click='router.back()'>
+        取消
+      </ElButton>
+      <ElButton type="primary" @click="submitForm(productFormRef)">
+        保存
+      </ElButton>
+      <ElButton type="primary" @click="submitForm(productFormRef)">
+        保存并继续添加
+      </ElButton>
+    </FixedActionBar>
+    <el-dialog v-model="blamedialogVisible" title="添加驾意险责任" width="50%">
+      <ElRow :gutter="20">
+        <el-form :model="blameFrom" :inline="true" label-width="120px" :rules="blameFromrules" label-position="top"
+          ref="blameFormRef" style="width: 100%;" :size="fromSize">
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="保险责任" prop="blame">
+              <el-input v-model="blameFrom.blame" placeholder="请输入保险责任" show-word-limit maxlength="50" />
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="责任编码" prop="blameCode">
+              <el-input v-model="blameFrom.blameCode" placeholder="请输入责任编码" />
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="总保额" prop="blameCoverage">
+              <el-input-number v-model="blameFrom.blameCoverage" :precision="2" controls-position="right"
+                style="width: 100%;" :min="1" :max="9000000">
+                <template #suffix>
+                  <span>元</span>
+                </template>
+              </el-input-number>
+            </el-form-item>
+          </ElCol>
+          <ElCol :md="24" :lg="12">
+            <el-form-item label="总保费" prop="blamePremium">
+              <el-input-number v-model="blameFrom.blamePremium" :precision="2" controls-position="right"
+                style="width: 100%;" :min="1" :max="9000000">
+                <template #suffix>
+                  <span>元</span>
+                </template>
+              </el-input-number>
+            </el-form-item>
+          </ElCol>
+        </el-form>
+      </ElRow>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="blamedialogVisible = false">取消</el-button>
+          <el-button type="primary" @click="blamesbimit(blameFormRef)">
+            保存
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+import { FormRules, FormInstance, ComponentSize, ElMessage } from 'element-plus';
+import { useRoute } from 'vue-router';
+import api from '@/api';
+import router from '@/router';
+import * as Types from '@/api/types/productTypes';
+const route = useRoute();
+const companyId = ref(route.query.companyID as string)//保险公司ID
+const companyName = ref(route.query.companyName as string)//保险公司名称
+const id = ref(route.query.id as string)//id标识
+const type = ref(route.query.type as string)//id标识
+const productType = ref(route.query.productType as string)
+// const dictLists = ref<{ [key: string]: any[] }>({});
+const parentList = ref<parentList>();
+const productFormRef = ref<FormInstance>()
+const blameFormRef = ref<FormInstance>()
+const fromSize = ref<ComponentSize>('default')
+const blamedialogVisible = ref(false);
+const productform = reactive<Types.jyxConfigRequest>({
+  id: "",
+  productType: "",//产品类型
+  parentId: "",//上级产品
+  productName: "",//产品名称
+  alias: '',//别名
+  company: "",//保险公司
+  companyName: "",
+  productCode: "",//产品编码
+  connectionMethod: "",//对接方式
+  premiumSetting: "",//保费设置
+  coverage: "",//总保额
+  premium: "",//总保费
+  settingList: [],
+  blameList: [],
+
+})
+const blameFrom = reactive({//保险责任表单弹窗
+  blame: "",
+  blameCode: '',
+  blameCoverage: 0,
+  blamePremium: 0,
+})
+interface parentList {
+  productName: string,
+  id: string,
+  [property: string]: any
+}
+const blameFromrules = ref<FormRules>({
+  blame: [
+    { required: true, trigger: 'blur', message: '请输入保险责任名称' },
+    { max: 50, message: '限制50个字符', trigger: 'blur' },
+
+  ],
+  blameCode: [
+    { required: true, trigger: 'blur', message: '请输入产品编码' },
+  ],
+  blameCoverage: [
+    { required: true, trigger: 'blur', message: '请输入总保额' },
+  ],
+  blamePremium: [
+    { required: true, trigger: 'blur', message: '请输入总保费' },
+  ],
+
+});
+const productformRules = ref<FormRules>({
+  productType: [
+    { required: true, trigger: 'change', message: '请选择产品类型' },
+  ],
+  parentId: [
+    { required: true, trigger: 'change', message: '请选择上级产品' },
+  ],
+  productName: [
+    { required: true, trigger: 'blur', message: '请输入产品名称' },
+  ],
+  company: [
+    { required: true, trigger: 'change', message: '请选择保险公司' },
+  ],
+  productCode: [
+    { required: true, trigger: 'blur', message: '请输入产品编码' },
+  ],
+  connectionMethod: [
+    { required: true, trigger: 'change', message: '请选择对接方式' },
+  ],
+  premiumSetting: [
+    { required: true, trigger: 'change', message: '请选择保费设置' },
+  ],
+  coverage: [
+    { required: true, trigger: 'blur', message: '请输入总保额' },
+  ],
+  premium: [
+    { required: true, trigger: 'blur', message: '请输入总保费' },
+  ],
+});
+
+onBeforeMount(() => {
+  if (companyId.value) {
+    productform.company = companyId.value;
+    productform.companyName = companyName.value;
+  }
+  if (productType.value) {
+    productform.productType = productType.value;
+    productform.parentId = id.value;
+    selectMainIns();
+  }
+  if (id.value && type.value == 'edit') {
+    detalis(id.value);
+  }
+
+});
+const settingListAdd = () => {
+  productform.settingList.push({
+    seats: 0,
+    coverage: 0,
+    premium: 0,
+  })
+}
+const settingDel = (index: any) => {
+  productform.settingList.splice(index, 1);
+}
+const blameListAdd = () => {
+  blamedialogVisible.value = true;
+
+}
+const blameDel = (index: any) => {
+  productform.blameList.splice(index, 1);
+
+}
+//类型事件
+const productTypeChange = (value: any) => {
+  if (value == 2) {
+    selectMainIns();
+  }
+}
+//查询主险
+const selectMainIns = () => {
+  api.product.selectMainInsurance(companyId.value).then((res: any) => {
+    if (res.code == '200') {
+      parentList.value = res.data;
+    } else {
+    }
+  });
+}
+const detalis = (id: string) => {
+  api.product.jygetById(id).then((res: any) => {
+    if (res.code == '200') {
+      selectMainIns();
+      Object.keys(productform).forEach((key) => {
+        if (res.data.hasOwnProperty(key)) {
+          productform[key as keyof typeof productform] = res.data[key as keyof typeof productform];
+        }
+      });
+      if (Array.isArray(res.data.settingList)) {
+        productform.settingList = res.data.settingList.map((item: any) => ({
+          seats: item.seats,
+          coverage: item.coverage,
+          premium: item.premium,
+        }));
+      }
+      if (Array.isArray(res.data.blameList)) {
+        productform.blameList = res.data.blameList.map((item: any) => ({
+          blame: item.blame,
+          blameCode: item.blameCode,
+          blameCoverage: item.blameCoverage,
+          blamePremium: item.blamePremium,
+        }));
+      }
+    } else {
+    }
+  });
+}
+//字典信息处理
+// const dictType = (type: string) => {
+//   api.toolApi.dictType({ dictCode: type }).then((res: any) => {
+//     if (res.code == '200') {
+//       dictLists.value[type + 'List'] = res.data.map((item: any) => {
+//         return {
+//           value: item.value,
+//           label: item.label
+//         };
+//       });
+//     }
+//   });
+// }
+const submitForm = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  await formEl.validate((valid) => {
+    if (valid) {
+      if (id.value && type.value == 'edit') {
+        api.product.jyxupdateById(productform).then((res: any) => {
+          if (res.code == 200) {
+            ElMessage({
+              type: 'success',
+              message: res.msg,
+              plain: true,
+            })
+            router.back()
+
+          }
+        })
+      } else {
+        api.product.jyxConfigAdd(productform).then((res: any) => {
+          if (res.code == 200) {
+            ElMessage({
+              type: 'success',
+              message: res.msg,
+              plain: true,
+            })
+            router.back()
+          }
+        })
+      }
+    } else {
+      ElMessage({
+        type: 'error',
+        message: '信息不完整',
+        plain: true,
+      })
+    }
+  })
+}
+const blamesbimit = async (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  await formEl.validate((valid) => {
+    if (valid) {
+      productform.blameList.push({ ...blameFrom })
+      blamedialogVisible.value = false;
+    } else {
+      ElMessage({
+        type: 'error',
+        message: '信息不完整',
+        plain: true,
+      })
+    }
+  })
+}
+</script>

+ 236 - 8
src/views/productConfiguration/drivingInsurance/index.vue

@@ -1,12 +1,240 @@
-<!-- 模板区域 -->
 <template>
   <div>
-  <PageMain>
-  </PageMain>
+    <PageMain class="vh100">
+      <ElRow :gutter="20" style="height: 100%;">
+        <ElCol :md="4">
+          <div class="flex f-c " style="height: 100%;">
+            <ElFormItem>
+              <ElInput v-model="companyName" placeholder="输入保险公司名称查找" type="text" tabindex="1" clearable style="width: 100%;"  @clear="companyQuery">
+                <template #append>
+                  <el-button :icon="Search" @click="companyQuery" />
+                </template>
+              </ElInput>
+            </ElFormItem>
+            <div style=" width: 100%;height: calc(100vh - 310px);  overflow-y: auto;" class="container ">
+              <div class="pad-1 roleitem " :class="{ active: companyactiveID === item.id }"
+                v-for="(item, index) in companyList" :key="index" @click="roleitemClick(item)">
+                <span>{{ item.name }}</span>
+              </div>
+            </div>
+          </div>
+        </ElCol>
+        <ElCol :md="1" style="flex: unset;">
+          <ElDivider direction="vertical" style="height: 100%;"></ElDivider>
+        </ElCol>
+        <ElCol :md="19">
+          <div class="flex j-s a-c">
+            <span class="strong">驾意险配置</span>
+            <RouterLink
+              :to="{ name: 'DrivingInsuranceAdd', query: { companyID: companyactiveID, companyName: companyactiveName } }">
+              <ElButton type="default" v-if="companyactiveID">
+                <template #icon>
+                  <el-icon>
+                    <Plus />
+                  </el-icon>
+                </template>
+                添加驾意险
+              </ElButton>
+            </RouterLink>
+
+          </div>
+          <ElDivider style="margin: 10px 0;"></ElDivider>
+          <div class="flex f-c elementSpacing">
+            <span class="strong">{{ companyactiveName ? companyactiveName : '-------------' }}</span>
+            <span style="font-size: 12px;">ID: {{ companyactiveID ? companyactiveID : '-------------' }} </span>
+            <el-form :inline="true" :model="formInline" class="demo-form-inline">
+              <el-form-item>
+                <el-input v-model="formInline.params" placeholder="输入产品名称,别名查找" clearable />
+              </el-form-item>
+              <el-form-item>
+                <el-input v-model="formInline.seats" placeholder="输入座位数查找" clearable>
+                  <template #append>座</template>
+                </el-input>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="findpage">查询</el-button>
+                <el-button type="default" @click="reset">重置</el-button>
+              </el-form-item>
+            </el-form>
+          </div>
+          <ElDivider style="margin: 10px 0;"></ElDivider>
+          <TableTree :tableData="tableData" :columns="columns" :showIndex="false" :columnwidth="200"
+            :showSelect="false">
+            <template v-slot:operation="scope">
+              <el-button type="primary" link style="margin-right: 15px;" v-if="scope.operationData.parentId == '0'"
+                @click="add(scope.operationData)"> 添加
+              </el-button>
+              <el-button type="primary" link style="margin-right: 15px;" @click="edit(scope.operationData.id)"> 编辑
+              </el-button>
+              <el-button type="primary" link style="margin-right: 15px;" @click="del(scope.operationData)"> 删除
+              </el-button>
+            </template>
+          </TableTree>
+        </ElCol>
+      </ElRow>
+
+    </PageMain>
   </div>
-  </template>
+</template>
+
+<script lang='ts' setup>
+import api from '@/api';
+import { RouterLink, useRouter } from "vue-router";
+import { ref, reactive, onBeforeMount } from 'vue';
+import { ElMessage, ElMessageBox } from 'element-plus';
+import { Search } from '@element-plus/icons-vue'
+onBeforeMount(() => {
+  companyQuery();
+});
+interface companyList {
+  nameSimple: string,
+  name: string,
+  id: string,
+  [key: string]: any
+}
+const router = useRouter();
+const companyName = ref<string>("")//保险公司检索条件
+const companyList = ref<companyList>();
+const companyactiveID = ref("");
+const companyactiveName = ref("")
+const tableData = ref([]);//驾意险数据
+const formInline = reactive<{
+  params: string,
+  seats: string,
+}>({
+  params: "",//名称、别名
+  seats: "",//座位数
+});
+const columns = [
+  { prop: "productName", label: "产品名称", align: 'left' },
+  { prop: "productCode", label: "产品编码", width: '180' },
+  { prop: "alias", label: "产品别名", width: '180' },
+
+];
+const reset=()=>{
+  formInline.params="";
+  formInline.seats="";
+}
+//获取驾意险
+const findpage = () => {
+  api.product.jyxList({ company: companyactiveID.value,...formInline }).then((res: any) => {
+    if (res.code == '200') {
+      tableData.value = res.data;
+    } else {
+    }
+  });
+}//获取保险公司列表
+const companyQuery = () => {
+  api.company.selectLevelList({ name: companyName.value }).then((res: any) => {
+    if (res.code == '200') {
+      companyList.value = res.data;
+    }
+  });
+}
+//租户列表事件
+async function roleitemClick(item: { id: string, name: string }) {
+  companyactiveID.value = item.id;
+  companyactiveName.value = item.name;
+  findpage();
+}
+const edit = (id: any) => {
+  router.push({
+    name: 'DrivingInsuranceAdd',
+    query: {
+      type: 'edit',
+      id: id,
+      companyID: companyactiveID.value,
+      companyName: companyactiveName.value,
+    }
+  })
+
+}
+
+const add = (item: any) => {
+  // return ;
+  router.push({
+    name: 'DrivingInsuranceAdd',
+    query: {
+      type: 'add',
+      id: item.id,
+      productType: '2',
+      companyID: companyactiveID.value,
+      companyName: companyactiveName.value,
+    }
+  })
+}
+const del = (item: any) => {
+  ElMessageBox.confirm(
+    item.parentId == '0' ? '该驾意险下有附加驾意险,删除该驾意险会连同附加驾意险一并删除,请确定是否删除?' : '删除后不可恢复,请谨慎操作',
+    '确定要删除该驾意险吗?',
+    {
+      confirmButtonText: '确定删除',
+      type: 'error',
+      center: true,
+      confirmButtonClass: 'el-button--danger',
+    }
+  )
+    .then(() => {
+      api.product.deleteById(item.id).then((res: any) => {
+        if (res.code == '200') {
+          findpage();
+          ElMessage({
+            type: 'success',
+            message: res.msg,
+            plain: true,
+          })
+        } else {
+        }
+      });
+    })
+    .catch(() => {
+    })
+}
+</script>
+
+<style lang="scss" scoped>
+.roleitem {
+  span:first-child {
+    font-size: 16px;
+    color: #333;
+  }
+
+  span:last-child {
+    font-size: 14px;
+    color: #666;
+  }
+}
+
+.roleitem:hover {
+  background: #f4faff;
+  transition: 0.2s;
+}
+
+.active {
+  background: #f4faff;
+  border-right: 2px solid #0083ff;
+}
+
+.el-pagination {
+  position: absolute;
+  bottom: 0;
+}
+
+.ElInputSearch {
+  color: #fff !important;
+  background: linear-gradient(91deg, #4fcaff 0%, #2b62ff 100%) !important;
+  border-color: #4fcaffe8 !important;
+  border-top-left-radius: 0 !important;
+  border-bottom-left-radius: 0 !important;
+}
+
+.footer {
+  width: 100%;
+}
+
+// .container::-webkit-scrollbar {
+//   display: none;
 
-  <!-- 行为区域 -->
-  <script lang='ts' setup>
-  </script>
-  <!-- 样式区域 -->
+//   /* 针对 Webkit 浏览器 (如 Chrome/Safari) */
+// }
+</style>