可视化

src/api/base.js

@@ -24,7 +24,7 @@ if (
 }else {
   //------------------------------服务器路径**测试**----------------------------------
   base.alyIP = "/apialy";
-  base.alyIP2 = "/apiAjzbXzGaw";
+  base.alyIP2 = "/apiAjzb";
 }
 
 export default base;

src/components/SearchGraph.vue

+<template>
+  <div class="personSearch">
+    <el-form ref="form" :model="form" label-width="0px">
+      <el-form-item
+        v-for="item in propQueryField"
+        :key="item.id"
+        :prop="item.id"
+        v-show="!item.hidden"
+        :rules="item.rules"
+        :class="'demo-input-suffix zdycol' + item.col"
+      >
+        <!--输入框-->
+        <el-input
+          clearable
+          :placeholder="item.placeholder"
+          v-model="formData[item.id]"
+          v-if="item.type == 'text'"
+        >
+        </el-input>
+        <!--输入框-最大值与最小值-->
+        <div class="zdyInputW zdyInputCol2" v-else-if="item.type == 'zdyText'">
+          <el-input :placeholder="item.placeholder" v-model="formData[item.id]">
+          </el-input>
+          —
+          <el-input
+            :placeholder="item.placeholder2"
+            v-model="formData[item.id2]"
+            style="width: calc((100% - 150) / 2)"
+          >
+          </el-input>
+        </div>
+        <div class="zdyInputW zdyInputCol2" v-else-if="item.type == 'zdyDate'">
+          <el-date-picker
+            v-model="formData[item.id]"
+            type="date"
+            align="right"
+            :picker-options="item.pickerOptions"
+            unlink-panels
+            value-format="yyyy-MM-dd HH:mm:ss"
+          >
+          </el-date-picker>
+          至
+          <el-date-picker
+            v-model="formData[item.id2]"
+            type="date"
+            align="right"
+            :picker-options="item.pickerOptions2"
+            unlink-panels
+            value-format="yyyy-MM-dd HH:mm:ss"
+          >
+          </el-date-picker>
+        </div>
+        <!--下拉框-->
+        <el-select
+          v-model="formData[item.id]"
+          clearable
+          :placeholder="item.placeholder"
+          v-else-if="item.type == 'select'"
+        >
+          <el-option
+            v-for="item3 in item.selectData"
+            :key="item3.value"
+            :label="item3.name"
+            :value="item3.value"
+          >
+          </el-option>
+        </el-select>
+        <!--文本域-->
+        <el-input
+          type="textarea"
+          autosize
+          resize="none"
+          :placeholder="item.placeholder"
+          v-model="formData[item.id]"
+          v-else-if="item.type == 'textarea'"
+        >
+        </el-input>
+        <!--日期框 日期时间-->
+        <el-date-picker
+          v-model="formData[item.id]"
+          type="date"
+          align="right"
+          placeholder="选择日期"
+          unlink-panels
+          suffix-icon="el-icon-date"
+          value-format="yyyy-MM-dd"
+          v-else-if="item.type == 'date1'"
+        >
+        </el-date-picker>
+        <!--日期框 日期时间-->
+        <el-date-picker
+          v-model="formData[item.id]"
+          type="datetime"
+          align="right"
+          :picker-options="item.pickerOptions"
+          unlink-panels
+          suffix-icon="el-icon-date"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          v-else-if="item.type == 'datetime'"
+        >
+        </el-date-picker>
+        <!--日期框-->
+        <el-date-picker
+          v-model="formData[item.id]"
+          type="daterange"
+          align="right"
+          :picker-options="item.pickerOptions"
+          unlink-panels
+          range-separator="至"
+          start-placeholder="开始日期"
+          value-format="yyyy-MM-dd"
+          end-placeholder="结束日期"
+          suffix-icon="el-icon-date"
+          v-else-if="item.type == 'date'"
+        >
+        </el-date-picker>
+        <el-date-picker
+          v-model="formData[item.id]"
+          type="datetimerange"
+          align="right"
+          :picker-options="item.pickerOptions"
+          unlink-panels
+          range-separator="至"
+          start-placeholder="开始日期"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          end-placeholder="结束日期"
+          prefix-icon="el-icon-date"
+          v-else-if="item.type == 'datetimerange'"
+        >
+        </el-date-picker>
+        <!--多选框-->
+        <div class="zdyInputW" v-else-if="item.type == 'checkbox'">
+          <el-checkbox-group v-model="formData[item.id]" size="small">
+            <el-checkbox
+              v-for="city in item.checkList"
+              :label="city"
+              :key="city.val"
+              >{{ city.label }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </div>
+        <!--单选框-->
+        <div class="zdyInputW" v-else-if="item.type == 'radio'">
+          <el-radio-group v-model="formData[item.id]" size="small">
+            <el-radio
+              :label="item2.val"
+              v-for="item2 in item.radioData"
+              :key="item2.val"
+              >{{ item2.label }}
+            </el-radio>
+          </el-radio-group>
+        </div>
+      </el-form-item>
+      <el-button @click="search">搜索</el-button>
+    </el-form>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      form: this.formData,
+      propQueryField: this.formProp,
+      newChildrenXhrStr: this.childrenXhrStr,
+      newParams: this.params,
+      newPhotoXhrObject: this.photoXhrObject,
+      newNodeClickBoo: this.nodeClickBoo,
+      newNodedata: this.nodedata,
+      newUnfoldXhrStr: this.unfoldXhrStr,
+      newUnfoldParams: this.unfoldParams,
+      newHighLightArr: this.highLightArr,
+      newType: this.type,
+    };
+  },
+  props: {
+    formProp: {
+      type: Array,
+      required: true,
+      default: () => [],
+    },
+    formData: {
+      type: Object,
+      required: true,
+      default: () => {},
+    },
+    //初始化时接口调用
+    childrenXhrStr: {
+      type: String,
+      require: true,
+      default: () => null,
+    },
+    //初始化接口参数（如果值为input里面的值则设为formValue）
+    params: {
+      type: Object,
+      default: () => null,
+      require: true,
+    },
+    //根节点调用人员照片的接口
+    photoXhrObject: {
+      type: Object,
+      default: () => null,
+    },
+    //是否是一层层往外延伸(接口返回全部数据则为false)
+    nodeClickBoo: {
+      type: Boolean,
+      default: () => true,
+    },
+    //自己定义的根节点(不需要定义则不用传)
+    nodedata: {
+      type: Object,
+      default: () => null,
+    },
+    //展开时调用的接口(如果不传且为一层层展开则展开的接口为初始化的接口)
+    unfoldXhrStr: {
+      type: String,
+      default: () => null,
+    },
+    //展开节点时的参数
+    unfoldParams: {
+      type: Object,
+      default: () => null,
+    },
+    //需要高亮的数组
+    highLightArr: {
+      type: Array,
+      default: () => null,
+    },
+    //应用场景
+    type: String,
+  },
+  methods: {
+    search() {
+      this.$refs.form.validate((boo) => {
+        if (boo) {
+          let newParams = this.objectAssignment(this.newParams);
+          let newNodedata = this.objectAssignment(this.newNodedata);
+          let newPhotoXhrObject = this.objectAssignment(this.newPhotoXhrObject);
+          if (this.newParams) {
+            for (let key in this.newParams) {
+              if (this.form[this.newParams[key]]) {
+                this.$set(newParams, key, this.form[this.newParams[key]]);
+              }
+            }
+          }
+          if (this.newNodedata) {
+            for (let key in this.newNodedata) {
+              if (this.form[this.newNodedata[key]]) {
+                this.$set(newNodedata, key, this.form[this.newNodedata[key]]);
+              }
+            }
+          }
+          if (this.newPhotoXhrObject) {
+            for (let key in this.newPhotoXhrObject["params"]) {
+              if (newNodedata[this.newPhotoXhrObject["params"][key]]) {
+                newPhotoXhrObject.params[key] =
+                  newNodedata[this.newPhotoXhrObject["params"][key]];
+              }
+            }
+          }
+          let obj = {
+            childrenXhrStr: this.newChildrenXhrStr,
+            photoXhrObject: newPhotoXhrObject,
+            params: newParams,
+            nodedata: newNodedata,
+            nodeClickBoo: this.newNodeClickBoo,
+            unfoldXhrStr: this.newUnfoldXhrStr,
+            unfoldParams: this.newUnfoldParams,
+            highLightArr: this.newHighLightArr,
+            type: this.type,
+          };
+          sessionStorage.setItem("key", JSON.stringify(obj));
+          this.$router.pushToTab({
+            path: "/ypEcharts",
+            query: {
+              key: this.input,
+              title: this.$route.meta.title,
+            },
+          });
+        }
+      });
+    },
+    objectAssignment(value) {
+      if (
+        Object.prototype.toString.call(value) == "[object Object]" ||
+        Object.prototype.toString.call(value) == "[object Array]"
+      )
+        return JSON.parse(JSON.stringify(value));
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.personSearch /deep/ {
+  width: 100%;
+  text-align: center;
+  position: absolute;
+  top: 30%;
+  left: 50%;
+  transform: translateX(-50%);
+  .el-form-item {
+    display: inline-block;
+    width: 20%;
+    margin-right: 20px;
+  }
+  .el-cascader {
+    width: 100%;
+  }
+  .el-select {
+    width: 100%;
+  }
+  .el-input {
+    width: 100%;
+    border-radius: 4px;
+    margin-right: 20px;
+    .el-input__inner {
+      background: #0d3354;
+      border: 1px solid #0268ff;
+      color: #fff;
+    }
+  }
+  .el-button {
+    width: 72px;
+    background: #0268ff;
+    border-radius: 4px;
+    color: #fff;
+    border: none;
+  }
+}
+</style>

src/router/modules/ztyp.js

@@ -21,7 +21,7 @@ const menuLayouts = [
     path: "/queryDx",
     name: "queryDx",
     meta: {
-      title: '话单信息管理'
+      title: '电信信息管理'
     },
     component: () => import("@/views/ztyp/queryDx.vue")
   },
@@ -34,6 +34,14 @@ const menuLayouts = [
     component: () => import("@/views/ztyp/queryWl.vue")
   },
   {
+    path: "/queryHd",
+    name: "queryHd",
+    meta: {
+      title: '话单信息管理'
+    },
+    component: () => import("@/views/ztyp/queryHd.vue")
+  },
+  {
     path: "/argxfx",
     name: "argxfx",
     meta: {

src/views/ztyp/argxfx.vue

 <template>
-  <div class="Content">
-    <div class="search">
-      <el-input v-model="input" placeholder="请输入案件编号"></el-input>
-      <div class="searchBtn" @click="toInfor">搜索</div>
-    </div>
+  <div>
+    <SearchGraph
+      :formProp="formProp"
+      :formData="form"
+      childrenXhrStr="/apialy/ksh/getAjRwGxXx"
+      :nodeClickBoo="true"
+      placeholder="请输入案件编号"
+      :params="params"
+      :nodedata="nodedata"
+      :unfoldParams="unfoldParams"
+    />
   </div>
 </template>
-
 <script>
+import SearchGraph from "@c/SearchGraph.vue";
 export default {
-  name: "argxfx",
+  components: { SearchGraph },
   data() {
-    return {
-      input: "",
-    };
-  },
-  created() {},
-  methods: {
-    toInfor() {
-      let params = {
-        objectType: "lawcase",
-        objectValue: this.input,
-      };
-      let obj = {
-        childrenXhrStr: "/apialy/ksh/getAjRwGxXx",
-        photoXhrStr: null,
-        params: params,
-        nodedata: {
-          type: "lawcase",
-          id: 0,
-          name: this.input,
-          children: true,
+    return { 
+      formProp: [
+        {
+          id: "objectValue",
+          type: "text",
+          placeholder: "请输入案件编号",
+          col: "3",
+          rules: [
+            { required: true, message: "请输入案件编号", trigger: "blur" },
+          ],
         },
-        nodeClickBoo: false,
-      };
-      sessionStorage.setItem("key", JSON.stringify(obj));
-      this.$router.pushToTab({
-        path: "/ypEcharts",
-        query: {
-          key: this.input,
-          title: "案人关系分析",
+      ],
+      form: {
+        objectValue:""
+      },
+      nodedata: {
+        type: "lawcase",
+        id: 0,
+        name: "objectValue",
+        children: true,
+      },
+      params: {
+        objectType: "lawcase",
+        objectValue: "objectValue",
+        parentId: 0,
+      },
+      unfoldParams: {
+        objectValue: "name",
+        objectType: "type",
+        parentId: "parentId",
+      },
+       Menu: [
+        {
+          id: "argxfx",
+          label: "案人关系分析",
+          index: "argxfx",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
         },
-      });
-    },
+      ],
+    };
+  },
+  created(){
+    this.$store.commit("user/SET_Menu", this.Menu);
   },
 };
 </script>
-<style scoped lang="scss">
-.Content {
-  display: flex;
-  justify-content: center;
-  margin-top: 350px;
-  .search {
-    width: 400px;
-    display: flex;
-    /deep/ .el-input__inner {
-      height: 39px !important;
-    }
-    .searchBtn {
-      width: 76px;
-      height: 37px;
-      background: #0061f7;
-      box-shadow: 0px 2px 4px rgba(0, 122, 255, 0.2);
-      line-height: 37px;
-      border-radius: 4px;
-      font-size: 14px;
-      font-family: Source Han Sans CN;
-      font-weight: 400;
-      text-align: center;
-      color: #ffffff;
-      margin-left: 10px;
-      cursor: pointer;
-    }
-  }
-}
-</style>

src/views/ztyp/gxrfx.vue

 <template>
-  <div class="Content">
-    <div class="search">
-      <el-input v-model="input" placeholder="请输入身份证号"></el-input>
-      <div class="searchBtn" @click="toInfor">搜索</div>
-    </div>
+  <div>
+    <SearchGraph
+      :formProp="formProp"
+      :formData="form"
+      childrenXhrStr="/apialy/ksh/getGxrXx"
+      :nodeClickBoo="true"
+      placeholder="请输入身份证号"
+      :params="params"
+      :nodedata="nodedata"
+      :unfoldParams="unfoldParams"
+    />
   </div>
 </template>
-
 <script>
+import SearchGraph from "@c/SearchGraph.vue";
 export default {
-  name: "gxrfx",
+  components: { SearchGraph },
   data() {
-    return {
-      input: "",
-    };
-  },
-  created() {},
-  methods: {
-    toInfor() {
-      let params = {
-        objectValue: this.input,
-      };
-      let obj = {
-        childrenXhrStr: "/apialy/ksh/getGxrXx",
-        photoXhrStr: null,
-        params: params,
-        nodedata: {
-          type: "person",
-          id: 0,
-          name: this.input,
-          children: true,
+    return { 
+      formProp: [
+        {
+          id: "objectValue",
+          type: "text",
+          placeholder: "请输入身份证号",
+          col: "3",
+          rules: [
+            { required: true, message: "请输入身份证号", trigger: "blur" },
+          ],
         },
-        nodeClickBoo: false,
-      };
-      sessionStorage.setItem("key", JSON.stringify(obj));
-      this.$router.pushToTab({
-        path: "/ypEcharts",
-        query: {
-          key: this.input,
-          title: "关系人分析",
+      ],
+      form: {
+        objectValue:""
+      },
+      nodedata: {
+        type: "person",
+        id: 0,
+        name: "objectValue",
+        children: true,
+      },
+      params: {
+        objectValue: "objectValue",
+         objectType: "person",
+        parentId: 0,
+      },
+      unfoldParams: {
+        objectValue: "name",
+        objectType: "type",
+        parentId: "parentId",
+      },
+       Menu: [
+        {
+          id: "gxrfx",
+          label: "关系人分析",
+          index: "gxrfx",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
         },
-      });
-    },
+      ],
+    };
+  },
+  created(){
+    this.$store.commit("user/SET_Menu", this.Menu);
   },
 };
 </script>
-<style scoped lang="scss">
-.Content {
-  display: flex;
-  justify-content: center;
-  margin-top: 350px;
-  .search {
-    width: 400px;
-    display: flex;
-    /deep/ .el-input__inner {
-      height: 39px !important;
-    }
-    .searchBtn {
-        cursor: pointer;
-      width: 76px;
-      height: 37px;
-      background: #0061f7;
-      box-shadow: 0px 2px 4px rgba(0, 122, 255, 0.2);
-      line-height: 37px;
-      border-radius: 4px;
-      font-size: 14px;
-      font-family: Source Han Sans CN;
-      font-weight: 400;
-      text-align: center;
-      color: #ffffff;
-      margin-left: 10px;
-    }
-  }
-}
-</style>

src/views/ztyp/jztpfx.vue

 <template>
-  <div class="Content">
-    <div class="search">
-      <el-input v-model="input" placeholder="请输入身份证号"></el-input>
-      <div class="searchBtn" @click="toInfor">搜索</div>
-    </div>
+  <div>
+    <SearchGraph
+      :formProp="formProp"
+      :formData="form"
+      childrenXhrStr="/apialy/ksh/getJzTpByZjhm"
+      :nodeClickBoo="true"
+      placeholder="请输入身份证号"
+      :params="params"
+      :nodedata="nodedata"
+      :unfoldParams="unfoldParams"
+    />
   </div>
 </template>
-
 <script>
+import SearchGraph from "@c/SearchGraph.vue";
 export default {
-  name: "jztpfx",
+  components: { SearchGraph },
   data() {
     return {
-      input: "",
-    };
-  },
-  created() {},
-  methods: {
-    toInfor() {
-      let params = {
-        objectType: "lawcase",
-        objectValue: this.input,
-      };
-      let obj = {
-        childrenXhrStr: "/apialy/ksh/getJzTpByZjhm",
-        photoXhrStr: null,
-        params: params,
-        nodedata: {
-          type: "person",
-          id: 0,
-          name: this.input,
-          children: true,
+      formProp: [
+        {
+          id: "objectValue",
+          type: "text",
+          placeholder: "请输入身份证号",
+          col: "3",
+          rules: [
+            { required: true, message: "请输入身份证号", trigger: "blur" },
+          ],
         },
-        nodeClickBoo: false,
-      };
-      sessionStorage.setItem("key", JSON.stringify(obj));
-      this.$router.pushToTab({
-        path: "/ypEcharts",
-        query: {
-          key: this.input,
-          title: "家族图谱分析",
+      ],
+      form: {
+        objectValue: "",
+      },
+      nodedata: {
+        type: "person",
+        id: 0,
+        name: "objectValue",
+        children: true,
+      },
+      params: {
+        objectValue: "objectValue",
+        objectType: "person",
+        parentId: 0,
+      },
+      unfoldParams: {
+        objectValue: "name",
+        objectType: "type",
+        parentId: "parentId",
+      },
+          Menu: [
+        {
+          id: "jztpfx",
+          label: "家族图谱分析",
+          index: "jztpfx",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
         },
-      });
-    },
+      ],
+    };
+  },
+  created(){
+    this.$store.commit("user/SET_Menu", this.Menu);
   },
 };
 </script>
-<style scoped lang="scss">
-.Content {
-  display: flex;
-  justify-content: center;
-  margin-top: 350px;
-  .search {
-    width: 400px;
-    display: flex;
-    /deep/ .el-input__inner {
-      height: 39px !important;
-    }
-    .searchBtn {
-      cursor: pointer;
-      width: 76px;
-      height: 37px;
-      background: #0061f7;
-      box-shadow: 0px 2px 4px rgba(0, 122, 255, 0.2);
-      line-height: 37px;
-      border-radius: 4px;
-      font-size: 14px;
-      font-family: Source Han Sans CN;
-      font-weight: 400;
-      text-align: center;
-      color: #ffffff;
-      margin-left: 10px;
-    }
-  }
-}
-</style>
+
+

src/views/ztyp/queryDx.vue

@@ -89,7 +89,7 @@ export default {
       Menu: [
         {
           id: "queryDx",
-          label: "话单信息管理",
+          label: "电信信息管理",
           index: "queryDx",
           auth: "M0101",
           className: "iconfont iconrizhi",
@@ -113,7 +113,7 @@ export default {
         photoXhrStr: null,
         params: params,
         nodedata: {
-          type: "sjh",
+          type: "phone",
           id: 0,
           name: data.fsfsjh,
           children: true,

src/views/ztyp/queryHd.vue

+<template>
+  <div class="Content">
+    <right-content
+      :pageBs="pageBs"
+      :header="header"
+      :cxFormData="cxFormData"
+      :cxQueryField="cxQueryField"
+      :cxDefaultFormThead="cxDefaultFormThead"
+      :cxUrl="cxUrl"
+      ref="rightContent"
+      @toInfor="toInfor"
+    ></right-content>
+  </div>
+</template>
+
+<script>
+import rightContent from "@c/ptCxForm_components.vue";
+export default {
+  name: "queryZj",
+  components: {
+    rightContent,
+  },
+  data() {
+    return {
+      header: "主题研判",
+      pageBs: "queryZj",
+      cxFormData: {
+        limit: 10,
+        page: 1,
+        asjbh: "",
+        ckrsfzh: "",
+        ckrxm: "",
+        jzhm: "",
+        drsj:""
+      },
+      cxQueryField: [
+        {
+          name: "案件编号",
+          id: "asjbh",
+          type: "text",
+          value: "",
+          placeholder: "",
+          col: "3",
+        },
+        {
+          name: "案件名称",
+          id: "ajmc",
+          type: "text",
+          value: "",
+          placeholder: "",
+          col: "3",
+        },
+        {
+          name: "机主身份证号",
+          id: "ckrsfzh",
+          type: "text",
+          value: "",
+          placeholder: "",
+          col: "3",
+        },
+        {
+          name: "机主姓名",
+          id: "ckrxm",
+          type: "text",
+          value: "",
+          placeholder: "",
+          col: "3",
+        },
+        {
+          name: "机主号码",
+          id: "jzhm",
+          type: "text",
+          value: "",
+          placeholder: "",
+          col: "3",
+        },
+        {
+          name: "导入时间",
+          id: "drsj",
+          type: "text",
+          value: "",
+          placeholder: "",
+          col: "3",
+        },
+      ],
+
+      cxDefaultFormThead: [
+        {
+          label: "任务编号",
+          prop: "xxzjbh",
+          toInfor: true,
+        },
+        {
+          label: "机主号码",
+          prop: "jzhm",
+        },
+        {
+          label: "机主身份证号",
+          prop: "ckrsfzh",
+        },
+        {
+          label: "机主姓名",
+          prop: "ckrxm",
+        },
+         {
+          label: "运营商",
+          prop: "yysbh",
+        },
+        {
+          label: "导入总数",
+          prop: "drzs",
+        },
+        {
+          label: "案事件编号",
+          prop: "asjbh",
+        },
+        {
+          label: "导入时间",
+          prop: "drsj",
+        },
+      ],
+      cxUrl: "/ksh/getHdList",
+      Menu: [
+        {
+          id: "queryHd",
+          label: "话单信息管理",
+          index: "queryHd",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
+        },
+      ],
+    };
+  },
+  created() {
+    this.$store.commit("user/SET_Menu", this.Menu);
+    this.$store.commit("user/SET_Header", this.header);
+    // debugger;
+  },
+  methods: {
+    toInfor(data) {
+      let params = {
+        bddlxh: data.xxzjbh,
+      };
+      let obj = {
+        childrenXhrStr: "/apialy/ksh/getHdxxById",
+        photoXhrStr: null,
+        params: params,
+        nodedata: {
+          type: "phone",
+          id: 0,
+          name: data.jzhm,
+          children: true,
+        },
+        nodeClickBoo: false,
+      };
+      sessionStorage.setItem("key", JSON.stringify(obj));
+      this.$router.pushToTab({
+        path: "/ypEcharts",
+        query: {
+          key: data.xxzjbh,
+          title: "话单分析",
+        },
+      });
+    },
+  },
+};
+</script>
+<style>
+.el-dialog__body {
+  padding: 10px 15px !important;
+}
+.rightContent .el-input__inner,
+#formCommonPage .el-input__inner {
+  height: 32px;
+  line-height: 32px;
+  font-family: inherit;
+}
+.el-table__header-wrapper th,
+.el-table__header-wrapper tr {
+  background: #f4f6f7;
+}
+.rightContent .el-input__icon,
+#formCommonPage .el-input__icon,
+.el-input__suffix-inner {
+  line-height: 36px;
+}
+.rightContent .el-range-separator {
+  position: relative;
+  top: -4px;
+}
+.rightContent .el-textarea__inner,
+#formCommonPage .el-textarea__inner {
+  width: 100%;
+  font-family: inherit;
+}
+.rightContent .el-range-input,
+#formCommonPage .el-range-input {
+  vertical-align: top;
+}
+.rightContent .el-date-editor .el-range__close-icon {
+  margin-top: -4px;
+}
+.rightContent .el-form-item__error {
+  left: calc(66% - 27px);
+  top: 12px;
+}
+.success-row {
+  background-color: #fbf9f4 !important;
+}
+.Content .el-input,
+.Content .el-date-editor--daterange.el-input__inner {
+  width: 100% !important;
+}
+</style>
+<style scoped lang="scss">
+@import "@/assets/styles/rightContent.scss";
+</style>

src/views/ztyp/queryWl.vue

@@ -43,7 +43,7 @@ export default {
         //   codeOptions: [],
         //   codeTree: "CODE_FWBSH",
         // },
-           {
+        {
           name: "标识号类型",
           id: "bshlx",
           type: "radio",
@@ -75,13 +75,13 @@ export default {
       ],
       cxDefaultFormThead: [
         {
-          label: "标识号类型",
-          prop: "bshlx",
+          label: "发送方手机号",
+          prop: "fsfsjh",
           toInfor: true,
         },
         {
-          label: "发送方手机号",
-          prop: "fsfsjh",
+          label: "标识号类型",
+          prop: "bshlxStr",
         },
         {
           label: "发送方真实姓名",
@@ -101,7 +101,7 @@ export default {
       Menu: [
         {
           id: "queryDx",
-          label: "话单信息管理",
+          label: "网络信息管理",
           index: "queryDx",
           auth: "M0101",
           className: "iconfont iconrizhi",
@@ -144,36 +144,10 @@ export default {
     },
     searchBshlx(val) {
       switch (val) {
-        case "01":
-          return "sjh";
-        case "02":
-          return "sjh";
-        case "03":
-          return "zjl";
-        case "04":
-          return "zjl";
-        case "05":
-          return "zjl";
-        case "06":
-          return "zjl";
-        case "07":
-          return "zjl";
-        case "08":
-          return "zjl";
-        case "09":
-          return "zjl";
-        case "10":
-          return "zjl";
-        case "11":
-          return "zjl";
         case "12":
-          return "zjl";
+          return "qq";
         case "13":
-          return "zjl";
-        case "14":
-          return "zjl";
-        case "15":
-          return "zjl";
+          return "wechat";
       }
     },
   },

src/views/ztyp/queryZj.vue

@@ -114,7 +114,7 @@ export default {
         },
         {
           id: "queryDx",
-          label: "话单信息管理",
+          label: "电信信息管理",
           newAuth: "M01",
           index: "queryDx",
           className: "iconfont icongongnengfuwu",
@@ -128,6 +128,15 @@ export default {
           className: "iconfont icongongnengfuwu",
           hasChildren: false,
         },
+        {
+          id: "queryHd",
+          label: "话单信息管理",
+          newAuth: "M01",
+          index: "queryHd",
+          className: "iconfont icongongnengfuwu",
+          hasChildren: false,
+        },
+        
          {
           id: "argxfx",
           label: "案人关系分析",

src/views/ztyp/rafx.vue

 <template>
-  <div class="Content">
-    <div class="search">
-      <el-input v-model="input" placeholder="请输入身份证号"></el-input>
-      <div class="searchBtn" @click="toInfor">搜索</div>
-    </div>
+  <div>
+    <SearchGraph
+      :formProp="formProp"
+      :formData="form"
+      childrenXhrStr="/apialy/ksh/getAjRwGxXx"
+      :nodeClickBoo="true"
+      placeholder="请输入身份证号"
+      :params="params"
+      :nodedata="nodedata"
+      :unfoldParams="unfoldParams"
+    />
   </div>
 </template>
-
 <script>
+import SearchGraph from "@c/SearchGraph.vue";
 export default {
-  name: "rafx",
+  components: { SearchGraph },
   data() {
     return {
-      input: "",
-    };
-  },
-  created() {},
-  methods: {
-    toInfor() {
-      let params = {
-        objectType: "person",
-        objectValue: this.input,
-      };
-      let obj = {
-        childrenXhrStr: "/apialy/ksh/getAjRwGxXx",
-        photoXhrStr: null,
-        params: params,
-        nodedata: {
-          type: "person",
-          id: 0,
-          name: this.input,
-          children: true,
+      formProp: [
+        {
+          id: "objectValue",
+          type: "text",
+          placeholder: "请输入身份证号",
+          col: "3",
+          rules: [
+            { required: true, message: "请输入身份证号", trigger: "blur" },
+          ],
         },
-        nodeClickBoo: false,
-      };
-      sessionStorage.setItem("key", JSON.stringify(obj));
-      this.$router.pushToTab({
-        path: "/ypEcharts",
-        query: {
-          key: this.input,
-          title: "人案分析",
+      ],
+      form: {
+        objectValue: "",
+      },
+      nodedata: {
+        type: "person",
+        id: 0,
+        name: "objectValue",
+        children: true,
+      },
+      params: {
+        objectValue: "objectValue",
+        objectType: "person",
+        parentId: 0,
+      },
+      unfoldParams: {
+        objectValue: "name",
+        objectType: "type",
+        parentId: "parentId",
+      },
+       Menu: [
+        {
+          id: "rafx",
+          label: "人案分析",
+          index: "rafx",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
         },
-      });
-    },
+      ],
+    };
+  },
+  created(){
+    this.$store.commit("user/SET_Menu", this.Menu);
   },
 };
 </script>
-<style scoped lang="scss">
-.Content {
-  display: flex;
-  justify-content: center;
-  margin-top: 350px;
-  .search {
-    width: 400px;
-    display: flex;
-    /deep/ .el-input__inner {
-      height: 39px !important;
-    }
-    .searchBtn {
-        cursor: pointer;
-      width: 76px;
-      height: 37px;
-      background: #0061f7;
-      box-shadow: 0px 2px 4px rgba(0, 122, 255, 0.2);
-      line-height: 37px;
-      border-radius: 4px;
-      font-size: 14px;
-      font-family: Source Han Sans CN;
-      font-weight: 400;
-      text-align: center;
-      color: #ffffff;
-      margin-left: 10px;
-    }
-  }
-}
-</style>
+
+
+

src/views/ztyp/zhfx.vue

 <template>
-  <div class="Content">
-    <div class="search">
-      <el-input v-model="input" placeholder="请输入身份证号"></el-input>
-      <div class="searchBtn" @click="toInfor">搜索</div>
-    </div>
+  <div>
+    <SearchGraph
+      :formProp="formProp"
+      :formData="form"
+      childrenXhrStr="/apialy/ksh/getZhCxXx"
+      :nodeClickBoo="true"
+      placeholder="请输入身份证号"
+      :params="params"
+      :nodedata="nodedata"
+      :unfoldParams="unfoldParams"
+    />
   </div>
 </template>
-
 <script>
+import SearchGraph from "@c/SearchGraph.vue";
 export default {
-  name: "zhfx",
+  components: { SearchGraph },
   data() {
     return {
-      input: "",
-    };
-  },
-  created() {},
-  methods: {
-    toInfor() {
-      let params = {
-        objectType: "lawcase",
-        objectValue: this.input,
-      };
-      let obj = {
-        childrenXhrStr: "/apialy/ksh/getZhCxXx",
-        photoXhrStr: null,
-        params: params,
-        nodedata: {
-          type: "lawcase",
-          id: 0,
-          name: this.input,
-          children: true,
+      formProp: [
+        {
+          id: "objectValue",
+          type: "text",
+          placeholder: "请输入身份证号",
+          col: "3",
+          rules: [
+            { required: true, message: "请输入身份证号", trigger: "blur" },
+          ],
         },
-        nodeClickBoo: false,
-      };
-      sessionStorage.setItem("key", JSON.stringify(obj));
-      this.$router.pushToTab({
-        path: "/ypEcharts",
-        query: {
-          key: this.input,
-          title: "综合分析",
+      ],
+      form: {
+        objectValue: "",
+      },
+      nodedata: {
+        type: "person",
+        id: 0,
+        name: "objectValue",
+        children: true,
+      },
+      params: {
+        objectValue: "objectValue",
+        objectType: "person",
+        parentId: 0,
+      },
+      unfoldParams: {
+        objectValue: "name",
+        objectType: "type",
+        parentId: "parentId",
+      },
+       Menu: [
+        {
+          id: "zhfx",
+          label: "综合分析",
+          index: "zhfx",
+          auth: "M0101",
+          className: "iconfont iconrizhi",
+          disabled: false,
         },
-      });
-    },
+      ],
+    };
+  },
+  created(){
+    this.$store.commit("user/SET_Menu", this.Menu);
   },
 };
 </script>
-<style scoped lang="scss">
-.Content {
-  display: flex;
-  justify-content: center;
-  margin-top: 350px;
-  .search {
-    width: 400px;
-    display: flex;
-    /deep/ .el-input__inner {
-      height: 39px !important;
-    }
-    .searchBtn {
-      cursor: pointer;
-      width: 76px;
-      height: 37px;
-      background: #0061f7;
-      box-shadow: 0px 2px 4px rgba(0, 122, 255, 0.2);
-      line-height: 37px;
-      border-radius: 4px;
-      font-size: 14px;
-      font-family: Source Han Sans CN;
-      font-weight: 400;
-      text-align: center;
-      color: #ffffff;
-      margin-left: 10px;
-    }
-  }
-}
-</style>
+