协议规则弹窗 ruleCondition

协议规则组件ruleConditionContainer

src/api/index.ts

@@ -18,9 +18,10 @@ import teamApi from "@/api/modules/team.ts";
 import advertisementApi from "@/api/modules/advertisement.ts"
 import representativeApi from "@/api/modules/representative.ts";
 import contentApi from "@/api/modules/content.ts";
+import agreementApi  from "@/api/modules/agreement";
+
 // import { useRouter } from 'vue-router'
 // const router = useRouter()
-import router from "@/router"
 import lotteryApi from '@/api/modules/lottery.ts';
 
 const axiosInstance:ApiInstance = axios.create({
@@ -68,19 +69,12 @@ axiosInstance.interceptors.response.use(
     }
     else {
       if (response.data.code === 401) {
-        // console.log(router)
-        localStorage.setItem("token",'')
-        // router.push({
-        //   path:"/login"
-        // })
-
-        // console.log(localStorage.getItem('token'))
         Message({
           message: '登录信息已过期，请重新登录！！！',
           type: 'error',
           duration: 2000,
         })
-        // useUserStore().logout()
+        useUserStore().logout()
       }
       // useUserStore().logout()
     }
@@ -118,5 +112,6 @@ const api = {
   lotteryApi: lotteryApi(axiosInstance),
   contentApi:contentApi(axiosInstance),
   advertisementApi:advertisementApi(axiosInstance),
+  agreementApi:agreementApi(axiosInstance),
 }
 export default api

src/api/modules/agreement.ts

@@ -0,0 +1,48 @@
+import { ApiInstance } from '../type'
+import * as Types from '../types/agreementTypes';
+const agreementApi = (axiosInstance: ApiInstance) => ({
+
+  /**
+   * @param 协议管理
+   */
+  //协议添加
+  agreementAdd: (data: Types.agreementAddRequest) => axiosInstance.post('agreement/agreementAdd', data),
+  //协议修改
+  agreementUpdate: (data: Types.agreementAddRequest) => axiosInstance.post('agreement/agreementEdit', data),
+  //分页查询
+  agreementList: (data: Types.pagelistRequest) => axiosInstance.post('agreement/agreementList', data),
+  //详情信息查询
+  agreementGet: (data: any) => axiosInstance.get(`agreement/agreementGet?id=${data}`),
+  //协议授权保存
+  authSave: (data: Types.authSaveRequest) => axiosInstance.post('agreement/authSave', data),
+  //根据机构获取后线人员列表
+  getUserByDeptId: (data: string) => axiosInstance.get(`agreement/getUserByDeptId?deptId=${data}`),
+  //协议授权机构查询
+  agreementdeptTree: (id: string, deptName: string) => axiosInstance.get(`agreement/deptTree?id=${id}&deptName=${deptName}`),
+  //启用禁用
+  sysUpAndDown: (data: Types.sysUpAndDownRequest) => axiosInstance.post('agreement/sysUpAndDown', data),
+  //批量删除
+  agreementDelete: (ids: any) => axiosInstance.delete(`/agreement/agreementDelete?ids=${ids}`),
+  //获取保险公司数结构
+  findTree: (data: any) => axiosInstance.post('esmInsCompany/findTree', data),
+  /**
+    * @param 承保规则
+    */
+  //协议承保规则分组属性列表
+  ruleAttrGroup: (data: any) => axiosInstance.post('pltAgreement/attr/attrGroup', data),
+  //获取地区车牌
+  getAreaLicense: (data: any) => axiosInstance.get(`plt/areaLicense/getAreaLicense?parentNumber=${data}`),
+  //添加承保规则
+  agreementRulesAdd: (data: any) => axiosInstance.post('agreementRules/rulesAdd', data),
+  //修改承保规则
+  agreementRulesEdit: (data: any) => axiosInstance.post('agreementRules/rulesEdit', data),
+  //承保规则列表
+  agreementRulesList: (id: any) => axiosInstance.get(`agreementRules/rulesList?agreementId=${id}`),
+  //承保规则详情
+  agreementRulesGet: (id: any) => axiosInstance.post(`agreementRules/rulesGet?ruleId=${id}`),
+  //删除承保规则
+  agreementRulesDelete: (id: any) => axiosInstance.delete(`agreementRules/rulesDelete?id=${id}`, ),
+
+
+})
+export default agreementApi

src/api/types/agreementTypes.ts

@@ -0,0 +1,214 @@
+/**
+ * AgreementAddParam，协议表新增dto
+ */
+export type agreementAddRequest = {
+  /**
+   * 协议id
+   */
+  id?: string;
+  /**
+   * 协议简称
+   */
+  agreementAbbreviation: string;
+  /**
+   * 协议描述
+   */
+  agreementName: string;
+  /**
+   * 协议名称
+   */
+  agreementTitle: string;
+  /**
+   * 协议类型 1-平台协议-平台结算 2-私有协议-自行结算 3-网销协议-自行结算
+   */
+  agreementType: string;
+  /**
+   * 保司账号id
+   */
+  attributionId: string;
+  /**
+   * 关联-保险公司id
+   */
+  companyId: string;
+  /**
+   * 对接管理人id
+   */
+  custodianId: string;
+  /**
+   * 协议归属id
+   */
+  deptId: string;
+  /**
+   * 对接人
+   */
+  dockingPerson: string;
+  /**
+   * 联系方式（对接人）
+   */
+  dockingPhone: string;
+  /**
+   * 协议失效时间
+   */
+  endDate: string;
+  /**
+   * 协议文件
+   */
+  fileId?: string;
+  /**
+   * 结算周期
+   */
+  moneyTime: number;
+  /**
+   * 协议生效时间
+   */
+  startDate: string;
+  /**
+   * 是否含增值税结算 0-否 1-是
+   */
+  withTax: string;
+  [property: string]: any;
+}
+/**
+ * AgreementParam，协议表分页查询dto
+ */
+export type pagelistRequest = {
+  /**
+   * 协议类型 1-平台协议-平台结算 2-私有协议-自行结算 3-网销协议-自行结算
+   */
+  agreementType?: string;
+  /**
+   * 出单账号
+   */
+  attributionName?: string;
+  /**
+   * 关联-保险公司id
+   */
+  companyId?: string;
+  /**
+   * 对接人(手机号，名字查询)
+   */
+  dockingPerson?: string;
+  /**
+   * 协议状态 0-启用 1-停用
+   */
+  isEnable?: string;
+  /**
+   * 失效结束时间
+   */
+  loseEndDate?: string;
+  /**
+   * 失效开始时间
+   */
+  loseStartDate?: string;
+  page?: Page;
+  pages?: number;
+  /**
+   * 协议搜索值
+   */
+  searchValue?: string;
+  size?: number;
+  /**
+   * 生效结束时间
+   */
+  takeEndDate?: string;
+  /**
+   * 生效开始时间
+   */
+  takeStartDate?: string;
+  /**
+   * 有效状态 0.生效中 1.已失效
+   */
+  validStatus?: string;
+  /**
+   * 是否含增值税结算 0-否 1-是
+   */
+  withTax?: string;
+  [property: string]: any;
+}
+/**
+ * Page
+ */
+export type Page = {
+  countId?: string;
+  current?: number;
+  maxLimit?: number;
+  optimizeCountSql?: PageObject;
+  optimizeJoinOfCountSql?: boolean;
+  orders?: OrderItem[];
+  pages?: number;
+  records?: { [key: string]: any }[];
+  searchCount?: PageObject;
+  size?: number;
+  total?: number;
+  [property: string]: any;
+}
+
+/**
+* PageObject
+*/
+export type PageObject = {
+  countId?: string;
+  current?: number;
+  maxLimit?: number;
+  optimizeCountSql?: PageObject;
+  optimizeJoinOfCountSql?: boolean;
+  orders?: OrderItem[];
+  pages?: number;
+  records?: { [key: string]: any }[];
+  searchCount?: PageObject;
+  size?: number;
+  total?: number;
+  [property: string]: any;
+}
+
+/**
+* OrderItem
+*/
+export type OrderItem = {
+  asc?: boolean;
+  column?: string;
+  [property: string]: any;
+}
+/**
+ * AgreementAuthParam，协议授权保存dto
+ */
+export type authSaveRequest = {
+  /**
+   * 机构id数组
+   */
+  deptIds: string[];
+  /**
+   * 协议id
+   */
+  id: string;
+  [property: string]: any;
+}
+
+export type agreementdeptTreeRequest = {
+  id: string;
+  [property: string]: any;
+}
+
+/**
+ * UpAndDownVo，启用/禁用实体
+ */
+export type sysUpAndDownRequest = {
+  /**
+   * id集合
+   */
+  ids: string[];
+  /**
+   * 操作类型
+   */
+  opType: string;
+  [property: string]: any;
+}
+/**
+ * 操作类型
+ */
+
+export type agreementDeleteRequest = {
+  ids: string[];
+  [property: string]: any;
+}
+

src/assets/styles/globals.css

@@ -224,11 +224,16 @@ textarea {
   margin-bottom: 15px;
 }
 
+.m-btn-20 {
+  margin-bottom: 20px;
+}
+
 .vh100 {
   height: calc(100vh - 200px);
 }
 
 .strong {
+  font-size: 14px;
   font-weight: bold;
 }
 
@@ -248,6 +253,26 @@ textarea {
   padding: 30px;
 }
 
+.m-top-20 {
+  margin-top: 20px;
+}
+
+.m-left-10 {
+  margin-left: 10px;
+}
+
+.m-left-20 {
+  margin-left: 20px;
+}
+
+.m-right-10 {
+  margin-right: 20px;
+}
+
+.m-right-20 {
+  margin-right: 20px;
+}
+
 /* 消息提示弹窗 */
 .el-message-box {
   padding: 32px 32px 24px;

src/components/ruleCondition/index.vue

@@ -0,0 +1,298 @@
+<!-- 模板区域 -->
+<template>
+  <div>
+    <el-dialog v-model="props.ruleConditionVisible" title="规则条件" width="500" draggable>
+      <div class="Container flex f-c">
+        <div class="flex ">
+          <el-input v-model="attrName" style="margin-right: 20px;" clearable placeholder="搜索"
+            @keydown.enter="handleEnter" @clear="ruleAttr" />
+          <el-button @click="ruleAttr" type="primary">查找</el-button>
+        </div>
+        <div class="conditionSet flex ">
+          <div class="tabLeft">
+            <ul>
+              <li :class="{ active: item.name == activename }" v-for="(item, index) in typeList" :key="index"
+                @click="itemclick(item)">{{ item.name }}</li>
+            </ul>
+          </div>
+          <div class="tabRight flex f-c">
+            <el-checkbox-group v-model="VehicleInfoAttrList" @change="change($event, 'VehicleInformation')"
+              v-for="(item, index) in dataStore.VehicleInformation" :key="index" v-if="activename == '车辆信息'">
+              <el-checkbox v-model="item.id" :label="item.attrName" :value="item.attrName" size="large" />
+            </el-checkbox-group>
+            <el-checkbox-group v-model="VehicleInfoAttrList1" @change="change($event, 'VehicleOwnerInformation')"
+              v-for="(item, index) in dataStore.VehicleOwnerInformation" :key="index" v-if="activename == '车主信息'">
+              <el-checkbox v-model="item.id" :label="item.attrName" :value="item.attrName" size="large" />
+            </el-checkbox-group>
+            <el-checkbox-group v-model="VehicleInfoAttrList2" @change="change($event, 'PolicyholderInformation')"
+              v-for="(item, index) in dataStore.PolicyholderInformation" :key="index" v-if="activename == '投保人信息'">
+              <el-checkbox v-model="item.id" :label="item.attrName" :value="item.attrName" size="large" />
+            </el-checkbox-group>
+            <el-checkbox-group v-model="VehicleInfoAttrList3" @change="change($event, 'InsuredInformation')"
+              v-for="(item, index) in dataStore.InsuredInformation" :key="index" v-if="activename == '被保人信息'">
+              <el-checkbox v-model="item.id" :label="item.attrName" :value="item.attrName" size="large" />
+            </el-checkbox-group>
+            <el-checkbox-group v-model="VehicleInfoAttrList4" @change="change($event, 'InsuranceInformation')"
+              v-for="(item, index) in dataStore.InsuranceInformation" :key="index" v-if="activename == '商业险'">
+              <el-checkbox v-model="item.id" :label="item.attrName" :value="item.attrName" size="large" />
+            </el-checkbox-group>
+            <el-checkbox-group v-model="VehicleInfoAttrList5" @change="change($event, 'InsuranceCostFactor')"
+              v-for="(item, index) in dataStore.InsuranceCostFactor" :key="index" v-if="activename == '保司费用因子'">
+              <el-checkbox v-model="item.id" :label="item.attrName" :value="item.attrName" size="large" />
+            </el-checkbox-group>
+          </div>
+        </div>
+      </div>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="cancel">取消</el-button>
+          <el-button type="primary" @click="save">
+            保存
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+  </div>
+</template>
+
+<!-- 行为区域 -->
+<script lang='ts' setup>
+import { ref, reactive } from 'vue'
+import api from '@/api'
+import { defineProps, defineEmits } from "vue";
+const props = defineProps<{
+  ruleConditionVisible: boolean,
+}>();
+const emits = defineEmits(["cancel", 'save']);
+const cancel = () => {
+  emits("cancel")
+}
+const save = () => {
+  const mergedData = [
+    ...checkeddata.VehicleInformationlist,
+    ...checkeddata.VehicleOwnerInformationlist,
+    ...checkeddata.PolicyholderInformationlist,
+    ...checkeddata.InsuredInformationlist,
+    ...checkeddata.InsuranceInformationlist,
+    ...checkeddata.InsuranceCostFactorlist,
+  ]
+  emits("save", mergedData)// 返回已选集合
+}
+const attrName = ref();
+const activename = ref('车辆信息');
+const VehicleInfoAttrList = ref()
+const VehicleInfoAttrList1 = ref()
+const VehicleInfoAttrList2 = ref()
+const VehicleInfoAttrList3 = ref()
+const VehicleInfoAttrList4 = ref()
+const VehicleInfoAttrList5 = ref()
+const licensePlateRegion = ref();//车牌地区
+const licensePlateNumber = ref();//车牌号
+const typeList = ref([
+  {
+    name: "车辆信息",
+    type: 'VehicleInformation'
+  },
+  {
+    name: "车主信息",
+    type: 'VehicleOwnerInformation'
+
+  },
+  {
+    name: "投保人信息",
+    type: 'PolicyholderInformation'
+
+  },
+  {
+    name: "被保人信息",
+    type: 'InsuredInformation'
+
+  },
+  {
+    name: "商业险",
+    type: 'InsuranceInformation'
+
+  },
+  {
+    name: "保司费用因子",
+    type: 'InsuranceCostFactor'
+
+  }
+])
+const itemclick = (type: any) => {
+  activename.value = type.name;
+}
+interface checkeddata {
+  [key: string]: any[]
+}
+const checkeddata = reactive<checkeddata>({
+  VehicleInformationlist: [],
+  VehicleOwnerInformationlist: [],
+  PolicyholderInformationlist: [],
+  InsuredInformationlist: [],
+  InsuranceInformationlist: [],
+  InsuranceCostFactorlist: [],
+});//已勾选的规则集合
+interface VehicleInformation {
+  attrName: string,
+  id: string,
+}[]
+interface dataStore {
+  VehicleInformation: VehicleInformation[],
+  VehicleOwnerInformation: VehicleInformation[],
+  PolicyholderInformation: VehicleInformation[],
+  InsuredInformation: VehicleInformation[],
+  InsuranceInformation: VehicleInformation[],
+  InsuranceCostFactor: VehicleInformation[],
+}
+const dataStore = reactive<dataStore>({
+  VehicleInformation: [],//车辆信息
+  VehicleOwnerInformation: [],//车主信息
+  PolicyholderInformation: [],//车主信息
+  InsuredInformation: [],//车主信息
+  InsuranceInformation: [], //车主信息
+  InsuranceCostFactor: [],//保司费用因子
+})
+onMounted(() => {
+  ruleAttr();
+  regionLicenseRegion('0');//车牌地区
+  regionLicenseNumber('14');//车牌号
+})
+const ruleAttr = () => {
+  api.agreementApi.ruleAttrGroup({ attrName: attrName.value }).then((res: any) => {
+    if (res.code == '200') {
+      dataStore.VehicleInformation = processArray(res.data.VehicleInformation);
+      dataStore.VehicleOwnerInformation = processArray(res.data.VehicleOwnerInformation);
+      dataStore.PolicyholderInformation = processArray(res.data.PolicyholderInformation);
+      dataStore.InsuredInformation = processArray(res.data.InsuredInformation);
+      dataStore.InsuranceInformation = processArray(res.data.InsuranceInformation);
+      dataStore.InsuranceCostFactor = processArray(res.data.InsuranceCostFactor);
+    } else {
+    }
+  });
+}
+//选择事件集中处理
+type title = keyof typeof dataStore;
+const change = (value: any, title: title) => {
+  // 使用动态属性访问
+  let arrayToUpdate = dataStore[title];//获取对应类型数组
+  if (arrayToUpdate) {
+    checkeddata[title + 'list'] = [];//默认清空
+    arrayToUpdate = arrayToUpdate.map((val) => {
+      value.map((item: string) => {
+        if (val.attrName == item) {
+          checkeddata[title + 'list'].push(val)//匹配相同值选中数据存入
+        }
+      })
+      return val;
+    });
+    console.log(checkeddata.VehicleInformationlist)
+  } else {
+
+  }
+};
+// 遍历并处理每个数组
+const processArray = (array: any[]) => {
+  return array.map((val) => {
+    switch (val.attrType) {
+      case 'inputNumber':
+      case 'datetime':
+        if (!val.operator) {
+          val.operator = '1'; // 设置默认值
+        }
+        break;
+      default:
+        break;
+    }
+    if (val.attrCode == 'LicenseNo') {
+      val.dictLabal = licensePlateNumber.value;
+    }
+    if (val.attrCode == 'LicenseArea') {
+      val.dictLabal = licensePlateRegion.value;
+    }
+    return val;
+  });
+};
+const handleEnter = (e: any) => {
+  if (e.keyCode == 13 || e.keyCode == 108) {
+    ruleAttr();
+  }
+}
+const regionLicenseRegion = (value: string) => {
+  api.agreementApi.getAreaLicense(value).then((res: any) => {
+    if (res.code == '200') {
+      let data: any = [];
+      res.data.map((val: any) => {
+        data.push({
+          code: val.areaNumber,
+          name: val.license,
+        })
+        return val;
+      })
+      licensePlateRegion.value = data;
+    } else {
+    }
+  });
+}
+const regionLicenseNumber = (value: string) => {
+  api.agreementApi.getAreaLicense(value).then((res: any) => {
+    if (res.code == '200') {
+      let data: any = [];
+      res.data.map((val: any) => {
+        data.push({
+          code: val.areaNumber,
+          name: val.license,
+        })
+        return val;
+      })
+      licensePlateNumber.value = data;
+    } else {
+    }
+  });
+}
+</script>
+<!-- 样式区域 -->
+<style lang='scss' scoped>
+.conditionSet {
+  padding: 20px 0;
+  margin-top: 10px;
+
+  .tabLeft {
+    width: 100px;
+
+    ul {
+      padding: 0;
+      margin: 0;
+      list-style: none;
+      border-right: 1px solid #dcdfe6;
+
+      li {
+        height: 40px;
+        font-weight: 500;
+        line-height: 40px;
+        text-align: center;
+        cursor: pointer;
+      }
+
+      li:hover {
+        color: #0083ff;
+        background: #f4faff;
+        transition: 0.3s;
+      }
+    }
+  }
+
+  .active {
+    color: #0083ff;
+    background: #f4faff;
+  }
+
+  .tabRight {
+    flex: 1;
+    max-height: 300px;
+    padding: 0 20px;
+    overflow-y: auto;
+  }
+}
+</style>

src/components/ruleConditionContainer/index.vue

@@ -0,0 +1,138 @@
+<!-- 模板区域 -->
+<template>
+  <div>
+    <div class="flex f-c a-start m-top-20" style="width: 100%;">
+      <el-row v-for="(item, index) in props.rulesAttrList" :key="index" class="roleClass flex a-c" style="width: 100%;">
+        <el-col :span="5">
+          <el-input v-model="item.attrName" disabled />
+        </el-col>
+        <el-col :span="3">
+          <el-select v-model="item.operator" placeholder="运算符" style="width: 100px; margin: 0 10px;"
+            :disabled="item.attrType !== 'inputNumber' && item.attrType !== 'datetime' && item.attrType !== 'inputTag'">
+            <template v-if="item.attrType == 'inputTag'">
+              <el-option label="包含" value="1"></el-option>
+              <el-option label="不包含" value="2"></el-option>
+            </template>
+            <template v-else>
+              <el-option v-for="(rulesDictitem, rulesDictindex) in item.rulesDict" :key="rulesDictindex"
+                :label="rulesDictitem.label" :value="rulesDictitem.value" />
+            </template>
+          </el-select>
+        </el-col>
+        <el-col :span="15">
+          <template v-if="item.attrType == 'radio'">
+            <el-select v-model="item.min" placeholder="选择值" clearable filterable>
+              <el-option v-for="dictLabalitem in item.dictLabal" :key="dictLabalitem.id" :label="dictLabalitem.name"
+                :value="dictLabalitem.code" />
+            </el-select>
+          </template>
+          <template v-if="item.attrType == 'checkbox'">
+            <el-select v-model="item.minArray" placeholder="选择值" clearable filterable multiple
+              @change="change($event, index)">
+              <el-option v-for="dictLabalitem in item.dictLabal" :key="dictLabalitem.id" :label="dictLabalitem.name"
+                :value="dictLabalitem.name" />
+            </el-select>
+          </template>
+          <template v-if="item.attrType == 'inputNumber'">
+            <template v-if="item.operator == '1' || item.operator == null">
+              <el-input-number v-model="item.min"></el-input-number>
+              <span style="margin: 0 10px ;">-</span>
+              <el-input-number v-model="item.max"></el-input-number>
+            </template>
+            <template v-if="item.operator == '2'">
+              <span>＜</span>
+              <el-input-number v-model="item.min"></el-input-number>
+            </template>
+            <template v-if="item.operator == '3'">
+              <span>≤</span>
+              <el-input-number v-model="item.min"></el-input-number>
+            </template>
+            <template v-if="item.operator == '4'">
+              <span>＞</span>
+              <el-input-number v-model="item.max"></el-input-number>
+            </template>
+            <template v-if="item.operator == '5'">
+              <span>≥</span>
+              <el-input-number v-model="item.max"></el-input-number>
+            </template>
+          </template>
+          <template v-if="item.attrType == 'select'">
+            <el-select v-model="item.minArray" placeholder="选择值" clearable filterable multiple
+              @change="change($event, index)">
+              <el-option v-for="dictLabalitem in item.dictLabal" :key="dictLabalitem.id" :label="dictLabalitem.name"
+                :value="item.attrName == '车辆类型' ? dictLabalitem.code : dictLabalitem.name" />
+            </el-select>
+          </template>
+          <template v-if="item.attrType == 'inputTag'">
+            <el-input-tag v-model="item.minArray" @change="change($event, index)" placeholder="输入内容后按回车键隔开" />
+          </template>
+
+          <template v-if="item.attrType == 'datetime'">
+            <template v-if="item.operator == '1' || item.operator == null">
+              <el-date-picker v-model="item.min" type="datetime" format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" time-format="HH:mm:ss" placeholder="选择日期时间" style="width: 250px;">
+              </el-date-picker>
+              <span>~</span>
+              <el-date-picker v-model="item.max" type="datetime" format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" time-format="HH:mm:ss" placeholder="选择日期时间" style="width: 250px;">
+              </el-date-picker>
+            </template>
+            <template v-if="item.operator == '2'">
+              <span>＜</span>
+              <el-date-picker v-model="item.min" type="datetime" format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" time-format="HH:mm:ss" placeholder="选择日期时间" style="width: 170px;">
+              </el-date-picker>
+            </template>
+            <template v-if="item.operator == '3'">
+              <span>≤</span>
+              <el-date-picker v-model="item.min" type="datetime" format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" time-format="HH:mm:ss" placeholder="选择日期时间" style="width: 170px;">
+              </el-date-picker>
+            </template>
+            <template v-if="item.operator == '4'">
+              <span>＞</span>
+              <el-date-picker v-model="item.max" type="datetime" format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" time-format="HH:mm:ss" placeholder="选择日期时间" style="width: 170px;">
+              </el-date-picker>
+            </template>
+            <template v-if="item.operator == '5'">
+              <span>≥</span>
+              <el-date-picker v-model="item.max" type="datetime" format="YYYY-MM-DD HH:mm:ss"
+                value-format="YYYY-MM-DD HH:mm:ss" time-format="HH:mm:ss" placeholder="选择日期时间" style="width: 170px;">
+              </el-date-picker>
+            </template>
+          </template>
+        </el-col>
+        <el-col :span="1">
+          <el-icon color="#666" size="20" style="margin-left: 10px;" @click="attrDel(index)">
+            <CircleCloseFilled />
+          </el-icon>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<!-- 行为区域 -->
+<script lang='ts' setup>
+import { defineProps, defineEmits } from "vue";
+const props = defineProps<{
+  rulesAttrList: any[],//list集合
+}>();
+const emits = defineEmits(["Del", 'save', 'selectChange']);
+//右侧删除图标
+const attrDel = (index: number) => {
+  console.log(index)
+  emits('Del', index)
+}
+const change = (e: string[] | undefined, index: number) => {
+  console.log(e)
+  emits('selectChange', { e, index })
+}
+</script>
+<!-- 样式区域 -->
+<style lang='scss' scoped>
+.roleClass {
+  margin-bottom: 10px;
+}
+</style>

src/router/modules/quoteConfig.ts

@@ -26,7 +26,7 @@ const routes: RouteRecordRaw = {
           meta: {
             title: '协议添加',
             menu:false,
-            activeMenu: '/personnel/member',
+            activeMenu: '/quoteConfig/agreement/agreementIndex',
           },
         },
         {
@@ -36,7 +36,17 @@ const routes: RouteRecordRaw = {
           meta: {
             title: '复制协议',
             menu:false,
-            activeMenu: '/personnel/member',
+            activeMenu: '/quoteConfig/agreement/agreementIndex',
+          },
+        },
+        {
+          path: 'agreementDetails',
+          name: 'AgreementDetails',
+          component: () => import('@/views/quoteConfig/agreement/agreementDetails.vue'),
+          meta: {
+            title: '协议详情',
+            menu:false,
+            activeMenu: '/quoteConfig/agreement/agreementIndex',
           },
         },
       ]

src/settings.ts

@@ -31,10 +31,10 @@ const globalSettings: Settings.all = {
     enableHotkeys: false,
   },
   topbar: {
-    mode: 'static',
+    mode: 'fixed',
   },
   tabbar: {
-    enable: true,
+    enable: false,
     enableIcon: true,
     enableHotkeys: true,
   },

src/types/components.d.ts

@@ -8,6 +8,7 @@ export {}
 declare module 'vue' {
   export interface GlobalComponents {
     Auth: typeof import('./../components/Auth/index.vue')['default']
+    ComplexTable: typeof import('./../components/complexTable/index.vue')['default']
     DialogSetDeptLeader: typeof import('./../components/DialogSetDeptLeader/index.vue')['default']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
     FixedActionBar: typeof import('./../components/FixedActionBar/index.vue')['default']
@@ -37,10 +38,14 @@ declare module 'vue' {
     ResetPasswordForm: typeof import('./../components/ResetPasswordForm/index.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
+    RuleCondition: typeof import('./../components/ruleCondition/index.vue')['default']
+    RuleConditionContainer: typeof import('./../components/ruleConditionContainer/index.vue')['default']
     SearchBar: typeof import('./../components/SearchBar/index.vue')['default']
+    SearchForm: typeof import('./../components/SearchForm/index.vue')['default']
     SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default']
     SystemInfo: typeof import('./../components/SystemInfo/index.vue')['default']
     Table: typeof import('./../components/Table/index.vue')['default']
+    TableTree: typeof import('./../components/TableTree/index.vue')['default']
     Trend: typeof import('./../components/Trend/index.vue')['default']
   }
 }