diff --git a/vue/src/router/index.js b/vue/src/router/index.js
index 5c053b10..1a490220 100644
--- a/vue/src/router/index.js
+++ b/vue/src/router/index.js
@@ -17,6 +17,7 @@ import wheeldataRouter from './modules/wheeldata'
 import vwNoBarcodeRouter from './modules/vwKBNoBarcodedata'
 import JobTimeDataRouter from './modules/jobtimedata'
 import newjitRouter from './modules/newjit-basedata'
+import pgfis from './modules/fis'
 
 /**
  * Note: sub-menu only appear when route children.length >= 1
@@ -173,6 +174,7 @@ export const asyncRoutes = [
   billdataRouter,//销售结算与开票报表
   //wheeldataRouter,//二配
   JobTimeDataRouter,//后台作业监控
+  pgfis,//派格fis
   // 404 page must be placed at the end !!!
   { path: '*', redirect: '/404', hidden: true }
 
diff --git a/vue/src/router/modules/fis.js b/vue/src/router/modules/fis.js
new file mode 100644
index 00000000..10c78188
--- /dev/null
+++ b/vue/src/router/modules/fis.js
@@ -0,0 +1,83 @@
+/** 派格fis路由 */
+//import Layout from '@/layout/firstLayout'
+import Layout from '@/layout'
+
+const pgfis = {
+    path: '/pg-fis',
+    component: Layout,
+    redirect: 'fis',
+    name: 'pgfis',
+    meta: {
+        //requiresAuth: true,
+        title: '派格fis',
+        index: 0,
+        type: 'crm',
+        icon: '业务',
+        keepAlive: false,
+    },
+    children: [
+        {
+            path: '/customerPartCfg',
+            component: () => import('@/views/pg-fis/basedate/customerPartCfg'),
+            name: 'customerPartCfg',//命名路由
+            meta: {
+                title: '客户零件管理',
+                roles: ['SettleAccount.Reports'],
+                icon: '发货'
+            }
+        },
+        {
+            path: '/pg-assemblyCfg',
+            component: () => import('@/views/pg-fis/basedate/assemblyCfg'),
+            name: 'pg-assemblyCfg',//命名路由
+            meta: {
+                title: '总成模块管理',
+                roles: ['SettleAccount.Reports'],
+                icon: '发货'
+            }
+        },
+        {
+            path: '/pg-workLine',
+            component: () => import('@/views/pg-fis/basedate/workLine'),
+            name: 'pg-workLine',
+            meta: {
+                title: '生产线权限',
+                roles: ['SettleAccount.Reports'],
+                icon: '供货'
+            }
+        },
+        {
+            path: '/pg-M100BIll',
+            component: () => import('@/views/pg-fis/basedate/m100BIll'),
+            name: 'pg-M100BIll',//命名路由
+            meta: {
+                title: 'M100单据信息维护',
+                roles: ['SettleAccount.Reports'],
+                icon: '客户零件'
+            }
+        },
+        {
+            path: '/pg-M100Online',
+            component: () => import('@/views/pg-fis/basedate/m100Online'),
+            name: 'pg-M100Online',//命名路由
+            meta: {
+                title: 'M100上线信息',
+                roles: ['SettleAccount.Reports'],
+                icon: '客户零件'
+            }
+        },
+        {
+            path: '/pg-R100Online',
+            component: () => import('@/views/pg-fis/basedate/r100Online'),
+            name: 'pg-M100Online',//命名路由
+            meta: {
+                title: 'R100上线信息',
+                roles: ['SettleAccount.Reports'],
+                icon: '客户零件'
+            }
+        }
+    ]
+}
+
+export default pgfis
+
diff --git a/vue/src/views/pg-fis/basedate/assemblyCfg/detail.vue b/vue/src/views/pg-fis/basedate/assemblyCfg/detail.vue
new file mode 100644
index 00000000..7cf4f451
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/assemblyCfg/detail.vue
@@ -0,0 +1,312 @@
+<!--FIS发运数据对比输出表-明细数据-->
+<template>
+  <div class="cr-body-content">
+    <flexbox class="content-header">
+      <!-- <el-button
+        class="filter-item"
+        size="mini"
+        type="info"
+        icon="el-icon-download"
+        @click="handleDownload()"
+        >导出全部
+      </el-button>
+      <el-input
+        v-model="searchContent"
+        clearable
+        size="small"
+        placeholder="支持模糊搜索..."
+        style="width: 230px"
+        class="search-container"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-button
+        size="mini"
+        type="success"
+        icon="el-icon-search"
+        @click="handleFilter"
+        >搜索
+      </el-button> -->
+    </flexbox>
+    <!--表格渲染-->
+    <el-table
+      ref="multipleTable"
+      v-loading="listLoading"
+      element-loading-text="拼命加载中..."
+      element-loading-spinner="el-icon-loading"
+      class="cr-table"
+      :data="list"
+      :height="tableHeight"
+      :cell-style="cellStyle"
+      :header-cell-style="headerRowStyle"
+      size="small"
+      stripe
+      border
+      highlight-current-row
+      style="width: 100%"
+      @sort-change="sortChange"
+      @selection-change="handleSelectionChange"
+      @row-click="handleRowClick"
+    >
+      <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+      <el-table-column prop="partCode" label="客户零件代码"> </el-table-column>
+      <el-table-column prop="description" label="客户零件名称"> </el-table-column>
+      <el-table-column prop="partNum" label="客户零件数量"> </el-table-column>
+      <el-table-column prop="isKey" label="是否Key件">
+        <template slot-scope="scope">
+          <span v-if="scope.row.isKey == true">
+            <span style="color: #00b46d">是</span>
+          </span>
+          <span v-else>
+            <span style="color: #d75c89">否</span>
+          </span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
+import permission from "@/directive/permission/index.js";
+import CRMTableHead from "../../components/CRMTableHead";
+import { downloadFile } from "@/utils/crmindex.js";
+import Detail from "./detail";
+
+export default {
+  name: "sendUnsettledDiffReport",
+  components: { Pagination, CRMTableHead, Detail },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  props: {
+    customerInfos: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {
+      crmType: "stockFisDiffReport",
+      rules: {
+        //前端定义的规则，后端也有验证
+        erpMaterialCode: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      searchContent: "", // 输入内容
+      customerInfo: {
+        parentId: "",
+      },
+      form: {
+        dicDetailID: "",
+        customerId: "",
+        projectId: "",
+      },
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      formLoading: false,
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listQuery: {
+        Filters: [
+          {
+            logic: 0,
+            column: "Enabled",
+            action: 0,
+            value: "true",
+          }, //默认查询可用的
+        ],
+        //OrgID:"",
+        SkipCount: 0,
+        MaxResultCount: 15,
+        assemblyProductID: "",
+      },
+      page: 1,
+      dialogFormVisible: false,
+      multipleSelection: [],
+      formTitle: "",
+      drawer: false,
+      showExcelImport: false,
+      tableHeight: document.documentElement.clientHeight - 260,
+      isEdit: false,
+    };
+  },
+  mounted() {
+    var self = this;
+    window.onresize = function () {
+      var offsetHei = document.documentElement.clientHeight;
+      self.tableHeight = offsetHei - 190;
+    };
+  },
+  created() {
+    this.getList();
+  },
+  watch: {
+    customerInfos: {
+      handler(newVal) {
+        if (newVal == "" || newVal == "undefined") {
+          //TODO
+        } else {
+          newVal.forEach((element) => {
+            this.customerInfo.parentId = element.ParentId;
+          });
+          if (this.customerInfo.parentId != "") {
+            this.getList(this.searchContent);
+          }
+        }
+      },
+      immediate: true,
+    },
+  },
+  computed: {
+    /** 列表字段 */
+    getDefaultField() {
+      var tempsTabs = [];
+      tempsTabs.push({ label: "客户零件代码", prop: "partCode ", width: 120 });
+      tempsTabs.push({ label: "客户零件数量", prop: "partNum", width: 160 });
+      tempsTabs.push({ label: "是否Key件", prop: "isKey", width: 95 });
+      tempsTabs.push({ label: "描述", prop: "description", width: 280 });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      if (column.property === "isKey") {
+        return { 0: "未生效", 1: "已生效" }[row[column.property]];
+      }
+      return row[column.property] || "--";
+    },
+    importExcelData() {
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+      this.getList();
+    },
+    getList(partCode) {
+      this.listLoading = true;
+      console.log("详表条件：" + JSON.stringify(this.customerInfo.parentId));
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + this.customerInfo.parentId)
+        .then((response) => {
+          console.log(partCode)
+          if(partCode !== "" && partCode !== undefined)
+          {
+            //console.log(partCode)
+            this.list = response.item.details.filter(u => u.partCode === partCode);
+          }
+          else
+          {
+            this.list = response.item.details;
+          }
+          //alert(JSON.stringify(response.Items))
+          //this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    /** 筛选操作 */
+    handleFilter() {
+      this.page = 1;
+      this.getList();
+      this.listQuery.Filters = [];
+      if (this.searchContent != "") {
+        var column = "partCode";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 6,
+          value: this.searchContent,
+        };
+        this.listQuery.Filters.push(filter);
+      }
+      //console.log(this.searchContent)
+      this.getList(this.searchContent);
+    },
+    resetQuery() {},
+
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (
+        column.property === "fisQty" ||
+        column.property === "diffQty" ||
+        column.property === "stockQty"
+      ) {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (
+        column.property === "fisQty" ||
+        column.property === "diffQty" ||
+        column.property === "stockQty"
+      ) {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../styles/crmtable.scss";
+</style>
+
diff --git a/vue/src/views/pg-fis/basedate/assemblyCfg/index.vue b/vue/src/views/pg-fis/basedate/assemblyCfg/index.vue
new file mode 100644
index 00000000..b79d5b3b
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/assemblyCfg/index.vue
@@ -0,0 +1,844 @@
+<!--总成模块信息管理页-->
+<template>
+  <div class="cr-body-content">
+    <div ref="box">
+    <flexbox class="content-header">
+      <el-form
+        :model="listQuery"
+        ref="queryForm"
+        v-show="showSearch"
+        :inline="true"
+      >
+
+        <el-form-item label="总成编码" prop="ErpAssemblyCode " class="forimitem">
+          <el-input
+            v-model="listQuery.ErpAssemblyCode"
+            placeholder="请输入总成编码"
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="总成名称" prop="ErpAssemblyName " class="forimitem">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder="请输入总成名称"
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+      <el-form-item label="车型：" prop="vehicleModelCode" class="forimitem">
+        <el-select
+          v-model="listQuery.vehicleModelCode"
+          clearable
+          placeholder="请选择"
+          size="medium"
+          style="margin-right: 15px"
+          @change="valueselectChange"
+        >
+          <el-option label="结算" value="R0003"></el-option>
+          <el-option label="二配" value="R0001"></el-option>
+        </el-select>
+      </el-form-item>
+
+        <el-form-item class="forimitem">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleFilter"
+            >搜索</el-button
+          >
+          <el-button
+            icon="el-icon-refresh"
+            size="mini"
+            @click="resetQuery('queryForm')"
+            >重置</el-button
+          >
+          <el-button
+            type="warning"
+            plain
+            icon="el-icon-download"
+            size="mini"
+            style="margin-left: 15px"
+            @click="handleDownload()"
+            >导出(Excel)
+          </el-button>
+        </el-form-item>
+        <el-divider class="divider1" ></el-divider>
+        <el-form-item  style="margin-bottom: 0px;margin-top: 10px">
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-plus"
+            @click="handleCreate"
+            >新增
+          </el-button>
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-edit"
+            @click="handleUpdate"
+            >修改
+          </el-button>
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-delete"
+            @click="handleDelete"
+            >删除
+          </el-button>
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-plus"
+            @click="handleImportSAP"
+            >导入（SAP对接）
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </flexbox>
+    </div>
+    <div class="l-table">
+      <!--表格渲染-->
+      <el-table
+        ref="multipleTable"
+        v-loading="listLoading"
+        element-loading-text="拼命加载中..."
+        element-loading-spinner="el-icon-loading"
+        class="cr-table"
+        :data="list"
+        :height="tableHeight"
+        :cell-style="cellStyle"
+        :header-cell-style="headerRowStyle"
+        size="small"
+        stripe
+        border
+        highlight-current-row
+        style="width: 100%"
+        @sort-change="sortChange"
+        @selection-change="handleSelectionChange"
+        @row-click="handleRowClick"
+      >
+        <el-table-column type="selection" width="44px"></el-table-column>
+        <el-table-column
+          label="ERP总成编码"
+          prop="erpAssemblyCode"
+          sortable="custom"
+          align="center"
+          width="420px"
+        >
+          <template slot-scope="scope">
+            <span class="link-type" @click="handleDrawerOpen(scope.row)">{{
+              scope.row.erpAssemblyCode
+            }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="ERP总成名称"
+          prop="erpAssemblyName "
+          sortable="custom"
+          align="center"
+        >
+          <template slot-scope="scope">
+            <span>{{ scope.row.erpAssemblyName }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="ERP总成版本"
+          prop="erpAssemblyVersion "
+          sortable="custom"
+          align="center"
+        >
+          <template slot-scope="scope">
+            <span>{{ scope.row.erpAssemblyVersion }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column
+          label="车型"
+          prop="vehicleModel "
+          sortable="custom"
+          align="center"
+        >
+          <template slot-scope="scope">
+            <span>{{ scope.row.model }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!--表单渲染-->
+      <el-dialog
+        :visible.sync="dialogFormVisible"
+        :close-on-click-modal="false"
+        :title="formTitle"
+        width="700px"
+      >
+        <el-form
+          ref="form"
+          :inline="true"
+          :model="form"
+          :rules="rules"
+          size="small"
+          label-width="120px"
+        >
+          <el-row>
+            <el-col :span="4">
+              <el-form-item label="总成编码：" required />
+            </el-col>
+            <el-col :span="20">
+              <el-form-item prop="erpAssemblyCode ">
+                <el-input
+                  style="width: 400px"
+                  v-model="form.erpAssemblyCode"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="4">
+              <el-form-item label="总成名称：" required />
+            </el-col>
+            <el-col :span="20">
+              <el-form-item prop="erpAssemblyName ">
+                <el-input
+                  style="width: 400px"
+                  v-model="form.erpAssemblyName"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="4">
+              <el-form-item label="总成类型：" required />
+            </el-col>
+            <el-col :span="20">
+              <el-form-item prop="erpAssemblyType ">
+                <el-input
+                  style="width: 200px"
+                  v-model="form.erpAssemblyType"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="4">
+              <el-form-item label="车型：" required />
+            </el-col>
+            <el-col :span="20">
+              <el-form-item prop="vehicleModel ">
+                <el-input
+                  style="width: 200px"
+                  v-model="form.model"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-table
+              ref="DetialTable"
+              v-loading="listLoading"
+              element-loading-text="拼命加载中..."
+              element-loading-spinner="el-icon-loading"
+              class="cr-table"
+              :data="form.details"
+              :height="detailTableHeight"
+              :cell-style="cellStyle"
+              :header-cell-style="headerRowStyle"
+              size="small"
+              stripe
+              border
+              highlight-current-row
+              style="width: 100%"
+              @row-click="handleRowClick"
+            >
+              <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+              <el-table-column prop="partCode" label="客户零件代码" width="150px" > 
+                <template slot-scope="scope">
+                  <el-input v-model="scope.row.partCode" size="mini" style="width:135px"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="description" label="客户零件名称">
+                <template slot-scope="scope">
+                  <el-input v-model="scope.row.description" size="mini"></el-input>
+                </template> 
+              </el-table-column>
+              <el-table-column prop="partNum" label="客户零件数量" width="120px" >
+                <template slot-scope="scope">
+                  <el-input-number v-model="scope.row.partNum" :min="1"  size="mini" style="width:100px"></el-input-number>
+                </template>
+              </el-table-column>
+              <el-table-column prop="isKey" label="是否Key件" align="center"  width="80px" > <!-- label-class-name="DisabledSelection" 去除列头全选-->
+                <template slot-scope="scope">
+                  <el-checkbox v-model="scope.row.isKey"></el-checkbox>
+                </template>
+              </el-table-column>
+              <!-- <el-table-column prop="description" label="描述">
+               <template slot-scope="scope">
+                  <el-input v-model="scope.row.disdescriptionKey"></el-input>
+                </template>
+              </el-table-column> -->
+              <el-table-column prop="description" width="35px"> 
+                <template slot="header">
+                  <el-button @click="handleAddDetails" icon="el-icon-plus" type="text"></el-button>
+                </template>
+                <template slot-scope="scope">
+                  <el-button @click="handleDeleteDetails(scope.$index, scope.row)" icon="el-icon-minus" type="text"></el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-row>
+        </el-form>
+        <!--表格渲染-->
+        <div slot="footer" class="dialog-footer">
+          <el-button type="text" @click="dialogFormVisible = false"
+            >取消</el-button
+          >
+          <el-button v-loading="formLoading" type="primary" @click="save"
+            >确认</el-button
+          >
+        </div>
+      </el-dialog>
+    </div>
+
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+    </div>
+      <!-- 抽屉控件 -->
+      <el-drawer
+        title="信息详细页"
+        size="75%"
+        direction="rtl"
+        :visible.sync="drawer"
+        :before-close="handleDrawerClose"
+      >
+        <div>
+          <Detail
+            v-bind:customerInfos="customerInfos"
+            style="margin-top: -35px"
+          ></Detail>
+        </div>
+      </el-drawer>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination";
+import permission from "@/directive/permission/index.js";
+import CRMTableHead from "../../components/CRMTableHead";
+import importExcel from "@/components/ImportExcel-vw";
+import Lockr from "lockr";
+import moment from "moment";
+import Detail from "./detail.vue";
+import { downloadFile } from "@/utils/crmindex.js";
+
+//组件计量单位
+const bomUnit = [
+  { key: 0, display_name: "PC" },
+  { key: 1, display_name: "TON" },
+  { key: 2, display_name: "Other" },
+];
+const projectTypeKeyValue = bomUnit.reduce((acc, cur) => {
+  acc[cur.key] = cur.display_name;
+  return acc;
+}, {});
+
+export default {
+  name: "AssemblyCfgERP",
+  components: { Pagination, CRMTableHead, importExcel, Detail },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  data() {
+    const validVersion = (rule, value, callback) => {
+      let numberReg = /^\d{6}$/;
+      if (!numberReg.test(value)) {
+        callback(new Error("只能为6位数字！"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      crmType: "AssemblyCfgERP",
+      rules: {
+        erpAssemblyName: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      valueSelect: "",
+      customerInfos: [],
+      dialogOptions: [],
+      versionValue: "",
+      searchContent: "", // 输入内容
+      showExcelImport: false,
+      form: {},
+      drawer: false,
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      customerInfo: {
+        bomId: "",
+      },
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listQuery: {
+        SkipCount: 0,
+        MaxResultCount: 15,
+        ErpAssemblyName: undefined,
+        ErpAssemblyCode: undefined,
+        vehicleModel:undefined,
+      },
+      listExportQuery: {
+        erpAssemblyCode: undefined,
+        erpAssemblyName: undefined,
+      },
+      form:{
+        details:[]
+      },
+      page: 1,
+      // 显示搜索条件
+      showSearch: true,
+      bomUnit,
+      multipleSelection: [],
+      drawer: false,
+      dialogFormVisible: false,
+      formTitle: "",
+      isEdit: false,
+      formLoading: false,
+      dialogFormVisible: false,
+      tableHeight: document.documentElement.clientHeight - 280,
+      detailTableHeight:250,
+      details:[] //修改子表数据源
+    };
+  },
+  mounted() {
+    this.$nextTick(() => { 
+        var offsetHei = document.documentElement.clientHeight;
+        //console.log(offsetHei);
+        let boxH = this.$refs.box.offsetHeight;
+        this.tableHeight = offsetHei - boxH - 57 - 79;//57为footer高度，79为页面上部标签高度
+        //console.log(boxH);
+        //console.log(this.tableHeight);
+    });
+  },
+  created() {
+    this.getList();
+  },
+  computed: {
+    getDefaultField() {
+      var tempsTabs = [];
+      // tempsTabs.push({
+      //   label: "ERP总成名称",
+      //   prop: "erpAssemblyName ",
+      //   width: 220,
+      // });
+      tempsTabs.push({
+        label: "ERP总成版本",
+        prop: "erpAssemblyVersion ",
+        width: 100,
+      });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    //抽屉
+    handleDrawerOpen(param) {
+      this.drawer = true;
+      var parentId = param.id; //主键id
+      this.customerInfos = [
+        {
+          ParentId: parentId,
+        },
+      ];
+    },
+    handleDrawerClose(done) {
+      done();
+    },
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          console.log("保存参数:" + JSON.stringify(this.form));
+          this.formLoading = true;
+          if (this.isEdit) {
+            //修改
+            this.$axios
+              .puts("/api/newjit/assembly-cfg-erp/" + this.form.id, this.form)
+              .then((response) => {
+                this.formLoading = false;
+                this.$notify({
+                  title: "成功",
+                  message: "更新成功",
+                  type: "success",
+                  duration: 2000,
+                });
+                this.dialogFormVisible = false;
+                this.getList();
+              })
+              .catch(() => {
+                this.formLoading = false;
+              });
+          } else {
+            //insert添加
+            console.log(JSON.stringify(this.form));
+            this.$axios
+              .posts("/api/newjit/assembly-cfg-erp", this.form)
+              .then((response) => {
+                this.formLoading = false;
+                this.$notify({
+                  title: "成功",
+                  message: "新增成功",
+                  type: "success",
+                  duration: 2000,
+                });
+                this.dialogFormVisible = false;
+                this.getList();
+              })
+              .catch(() => {
+                this.formLoading = false;
+              });
+          }
+        }
+      });
+    },
+    /** 新增 */
+    handleCreate() {
+      if (this.$refs["form"] !== undefined) {
+        this.$nextTick(() => {
+          this.$refs["form"].resetFields();
+        });
+      }
+      this.formTitle = "新增";
+      this.isEdit = false;
+      this.form = {};
+      this.details = [];
+      this.dialogFormVisible = true;
+    },
+    /** 修改 */
+    handleUpdate(row) {
+      this.formTitle = "修改";
+      this.isEdit = true;
+      this.details = [];
+        if (this.multipleSelection.length != 1) {
+          this.$message({
+            message: "编辑必须选择单行",
+            type: "warning",
+          });
+          return;
+        } else {
+          this.fetchData(this.multipleSelection[0].id);
+          this.dialogFormVisible = true;
+        }
+    },
+    /** 删除 */
+    handleDelete(row) {
+      if (this.multipleSelection.length != 1) {
+          this.$message({
+            message: "编辑必须选择单行",
+            type: "warning",
+          });
+          return;
+      }
+        // this.$alert("暂时不支持批量删除", "提示", {
+        //   confirmButtonText: "确定",
+        //   callback: (action) => {
+        //     //
+        //   },
+        // });  
+        this.$confirm("是否删除总成" + this.multipleSelection[0].erpAssemblyCode + "?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+        .then(() => {
+          this.$axios
+            .deletes("/api/newjit/assembly-cfg-erp/"+ this.multipleSelection[0].id)
+            .then((response) => {
+              const index = this.list.indexOf(this.multipleSelection[0]);
+              this.$notify({
+                title: "成功",
+                message: "删除成功",
+                type: "success",
+                duration: 2000,
+              });
+              this.getList();
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    fetchData(id) {
+      //循环动态
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + id)
+        .then((response) => {
+          this.form = response.item;
+          //this.details = response.item.details;
+          //console.log(this.details);
+        });
+    },
+    /** 导出功能 */
+    handleDownload() {
+      this.listLoading = true;
+      this.listExportQuery.erpAssemblyCode = this.listQuery.ErpAssemblyCode;
+      this.listExportQuery.erpAssemblyName = this.listQuery.ErpAssemblyName;
+      console.log(JSON.stringify(this.listExportQuery));
+      this.$axios
+        .posts("/api/newjit/assembly-cfg-erp/export", this.listExportQuery)
+        .then((res) => {
+          let filename = res.item;
+          this.$axios
+            .BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
+            .then((response) => {
+              if (filename.indexOf("_") != -1) {
+                let downName =
+                  filename.slice(0, filename.lastIndexOf("_")) +
+                  filename.slice(filename.lastIndexOf("."));
+                downloadFile(response, downName);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              } else {
+                downloadFile(response, filename);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              }
+              this.listLoading = false;
+            });
+        });
+      this.listLoading = false;
+    },
+    /** 重置按钮操作 */
+    resetQuery(refName) {
+      //this.$refs[refName].resetFields();
+      this.listQuery.ErpAssemblyName = "";
+      this.listQuery.ErpAssemblyCode = "";
+      this.listQuery.vehicleModelCode = "";
+      this.handleQuery();
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.listQuery.SkipCount = 1;
+      this.getList();
+    },
+    selectValue(params) {
+      //版本下拉选择
+      this.versionValue = params.value;
+      this.getList();
+    },
+
+    selectOptionsChange(item) {
+      this.getList();
+    },
+    importExcelData() {
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+      //this.getList();
+    },
+
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+
+    handleAddDetails() {
+      if (this.form.details === undefined) {
+        this.form.details = [];
+        //console.log(679);
+      }
+      let obj = {};
+      obj.partCode = "";
+      obj.description = "";
+      obj.partNum = "";
+      obj.isKey = false;
+      obj.description = "";
+
+      //console.log(this.form.details);
+      this.form.details.push(obj);
+      //console.log(688);
+    },
+    handleDeleteDetails(index){
+      this.form.details.splice(index, 1);
+      //console.log(693);
+    },
+
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      if (column.property === "billStatus") {
+        return { 0: "未生效", 2: "已生效", 3: "已发布" }[row[column.property]];
+      }
+      if (column.property == "onlineTime" || column.property == "receiveTime") {
+        var date = row[column.property];
+        if (date == undefined) {
+          return "";
+        }
+        return moment(date).format("YYYY-MM-DD HH:mm:ss");
+      }
+      return row[column.property] || "--";
+    },
+    roleFilter(type) {
+      return projectTypeKeyValue[type];
+    },
+    getList() {
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.page - 1) * 10;
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/list", this.listQuery)
+        .then((response) => {
+          this.list = response.items;
+          this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    
+    getDetialList(partCode) {
+      this.listLoading = true;
+      console.log("详表条件：" + JSON.stringify(this.customerInfo.parentId));
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + this.customerInfo.parentId)
+        .then((response) => {
+          console.log(partCode)
+          if(partCode !== "" && partCode !== undefined)
+          {
+            //console.log(partCode)
+            this.list = response.item.details.filter(u => u.partCode === partCode);
+          }
+          else
+          {
+            this.list = response.item.details;
+          }
+          //alert(JSON.stringify(response.Items))
+          //this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    valueselectChange(){},
+    handleImportSAP(){},
+
+    handleFilter() {
+      this.page = 1;
+      this.getList();
+    },
+
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../../ux/styles/crmtable.scss";
+
+// /*表格全选框去除空框*/
+// .el-table >>> .DisabledSelection .cell .el-checkbox__inner {
+//   display: none;
+//   position: relative;
+// }
+// /*表格全选框改为：选择*/
+// .el-table >>> .DisabledSelection .cell:before {
+//   content: "是否Key件";
+//   position: absolute;
+//   left: 7px;
+// }
+.divider1{
+  margin: 0 ;
+  width: 118%;
+}
+.formitem{
+  margin-bottom: 0;
+}
+</style>
+
diff --git a/vue/src/views/pg-fis/basedate/customerPartCfg/index.vue b/vue/src/views/pg-fis/basedate/customerPartCfg/index.vue
new file mode 100644
index 00000000..80ade2ac
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/customerPartCfg/index.vue
@@ -0,0 +1,740 @@
+<!--零件匹配关系页-->
+<template>
+  <div class="cr-body-content">
+    <div ref="box">
+    <flexbox class="content-header">
+
+      <el-form
+        :model="listQuery"
+        ref="queryForm"
+        v-show="showSearch"
+        :inline="true"
+      >
+      <!-- <span>版本:</span>
+
+      <XhJSSelect
+        :options="versionList"
+        style="width: 200px"
+        class="search-container"
+        @value-change="selectValue"
+      ></XhJSSelect> -->
+
+      
+      <el-form-item label="零件代码：" prop="partCode">
+        <el-input
+          v-model="partCode"
+          clearable
+          size="small"
+          placeholder=""
+          style="width: 200px"
+          class="search-container"
+          @keyup.enter.native="handleFilter"
+        />
+      </el-form-item>
+      
+      <el-form-item label="零件名称：" prop="partName">
+        <el-input
+          v-model="partName"
+          clearable
+          size="small"
+          placeholder=""
+          style="width: 200px"
+          class="search-container"
+          @keyup.enter.native="handleFilter"
+        />
+      </el-form-item>
+
+      <el-form-item label="零件类型：" prop="partType">
+        <el-select
+          v-model="partType"
+          clearable
+          placeholder="请选择"
+          size="medium"
+          style="margin-right: 15px"
+          @change="valueselectChange"
+        >
+          <el-option label="结算" value="R0003"></el-option>
+          <el-option label="二配" value="R0001"></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="零件子类型：" prop="partChildType">
+        <el-select
+          v-model="partChildType"
+          clearable
+          placeholder="请选择"
+          size="medium"
+          style="margin-right: 15px"
+          @change="valueselectChange"
+        >
+          <el-option label="结算" value="R0003"></el-option>
+          <el-option label="二配" value="R0001"></el-option>
+        </el-select>
+      </el-form-item>
+
+      <!-- <el-input
+        v-model="searchContent"
+        clearable
+        size="small"
+        placeholder="按照结算件基本信息搜索..."
+        style="width: 200px"
+        class="search-container"
+        @keyup.enter.native="handleFilter"
+      /> -->
+      <el-form-item>
+        <el-button
+          size="mini"
+          type="success"
+          icon="el-icon-search"
+          @click="handleFilter"
+          >搜索
+        </el-button>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          icon="el-icon-refresh"
+          size="mini"
+          @click="resetQuery('queryForm')"
+          >重置
+        </el-button>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          class="filter-item"
+          plain
+          size="mini"
+          type="warning"
+          icon="el-icon-bottom"
+          @click="handleDownload()"
+          >导出Excel
+        </el-button>
+      </el-form-item>
+      <!--表格头组件，filter查询-->
+      <!-- <c-r-m-table-head
+        ref="crmTableHead"
+        :crm-type="crmType"
+        @handle="handleHandle"
+        @filter="handleFilters"
+      >
+      </c-r-m-table-head> -->
+      </el-form>
+    </flexbox>
+    </div>
+    <!--表格渲染-->
+    <el-table
+      ref="multipleTable"
+      v-loading.fullscreen.lock="listLoading"
+      element-loading-text="拼命加载中..."
+      element-loading-spinner="el-icon-loading"
+      class="cr-table"
+      :data="list"
+      :height="tableHeight"
+      :cell-style="cellStyle"
+      :header-cell-style="headerRowStyle"
+      size="small"
+      stripe
+      border
+      highlight-current-row
+      style="width: 100%"
+      @sort-change="sortChange"
+      @selection-change="handleSelectionChange"
+      @row-click="handleRowClick"
+    >
+      <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+      <!-- <el-table-column
+        label="版本"
+        prop="version"
+        sortable="custom"
+        align="center"
+        width="100px"
+      >fixed 默认固定在左边
+        <template slot-scope="scope">
+          <el-tooltip :content="scope.row.version" placement="top">
+            <span class="link-type">{{ scope.row.version }}</span>
+          </el-tooltip>
+        </template>
+      </el-table-column> -->
+      <el-table-column
+        v-for="(item, index) in getDefaultField"
+        :key="index"
+        :prop="item.prop"
+        :label="item.label"
+        :min-width="item.width"
+        :formatter="fieldFormatter"
+        sortable="custom"
+        show-overflow-tooltip
+        :gutter="0"
+      >
+        <template slot="header" slot-scope="scope">
+          {{ scope.column.label }}
+        </template>
+      </el-table-column>
+    </el-table>
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+      <!-- 导入Excel组件 -->
+      <importExcel
+        ref="importexcel"
+        :show="showExcelImport"
+        :crmType="crmType"
+        @close="importExcelData"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
+import permission from "@/directive/permission/index.js";
+import importExcel from "@/components/ImportExcel-invoice";
+import CRMTableHead from "../../components/CRMTableHead";
+import moment from "moment";
+import Lockr from "lockr";
+import { downloadFile } from "@/utils/crmindex.js";
+import XhJSSelect from "@/components/CreateCom/Xh-JS-Select-Label.vue";
+
+export default {
+  name: "CustomerPartCfg",
+  components: { Pagination, CRMTableHead, importExcel, XhJSSelect },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  props: {
+    customerInfos: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {
+      crmType: "customerPartCfg",
+      versionValue: "",
+      //valueSelect: "R0003",
+      versionList: [], //版本列表
+      rules: {
+        //前端定义的规则，后端也有验证
+        erpMaterialCode: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      searchContent: "", // 输入内容
+      customerInfo: {
+        settleAccountId: "",
+      },
+      form: {
+        dicDetailID: "",
+        customerId: "",
+        projectId: "",
+      },
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      formLoading: false,
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listVersionQuery: {
+        SkipCount: 0,
+        MaxResultCount: 15,
+      },
+      listQuery: {
+        Filters: [
+          {
+            logic: 0,
+            column: "Enabled",
+            action: 0,
+            value: "true",
+          }, //默认查询可用的
+        ],
+        //OrgID:"",
+        SkipCount: 0,
+        MaxResultCount: 15,
+        version: "",
+        //site: "TH",
+        customerCode: "",
+        //userId: "00000000-0000-0000-0000-000000000000",
+        partCode:"",//零件编码
+        partName:"",//零件名称
+        partType:"",//零件类型
+        partChildType:"",//零件子类型
+      },
+      listExportQuery: {
+        Filters: [
+          {
+            logic: 0,
+            column: "Enabled",
+            action: 0,
+            value: "true",
+          }, //默认查询可用的
+        ],
+        //OrgID:"",
+        SkipCount: 0,
+        MaxResultCount: 15,
+        version: "",
+        fileType: 0,
+        userId: "",
+      },
+      showSearch: true,
+      page: 1,
+      dialogFormVisible: false,
+      multipleSelection: [],
+      formTitle: "",
+      drawer: false,
+      showExcelImport: false,
+      tableHeight: document.documentElement.clientHeight - 260,
+      isEdit: false,
+      sortState:false, //标记刷新是否是排序调用
+
+      partCode:'',
+      partName:'',
+      partType:'',
+      partChildType:'',
+      
+    };
+  },
+  mounted() {
+    this.$nextTick(() => { 
+        var offsetHei = document.documentElement.clientHeight;
+        console.log(offsetHei);
+        let boxH = this.$refs.box.offsetHeight;
+        this.tableHeight = offsetHei - boxH - 57 - 79;//57为footer高度，79为页面上部标签高度
+        console.log(this.$refs.box.offsetHeight);
+        console.log(this.tableHeight);
+    });
+  },
+  created() {
+    //this.getVersionInfo();
+    //if (this.versionList == []) {
+      this.getList();
+    //}
+  },
+  computed: {
+    /** 列表字段 */
+    getDefaultField() {
+      var tempsTabs = [];
+
+      tempsTabs.push({
+        label: "零件代码",
+        prop: "partCode",
+        width: 100,
+      });
+      tempsTabs.push({
+        label: "零件名称",
+        prop: "partName",
+        width: 150,
+      });
+      tempsTabs.push({ 
+        label: "零件类型", 
+        prop: "partType", 
+        width: 120
+      });
+      tempsTabs.push({
+        label: "零件子类型",
+        prop: "partChildType",
+        width: 120,
+      });
+      tempsTabs.push({
+        label: "零件描述",
+        prop: "Description",
+        width: 150,
+      });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    selectValue(params) {
+      //版本下拉选择
+      this.versionValue = params.value;
+      this.getList();
+    },
+    valueselectChange(data) {
+      //alert(data);
+      //版本下拉选择
+      this.valueSelect = data;
+      this.getList();
+    },
+    handleTypeDrop(command, params = {}) {
+      if (command == "updateFis") {
+        this.listLoading = true;
+        //this.listQuery.SkipCount = (this.page - 1) * 10000;
+        this.$axios
+          .posts("/api/settleaccount/SettlementPart/updateFis")
+          .then((res) => {
+            if (res == true) {
+              this.$notify({
+                title: "成功",
+                message: "FIS数据-更新成功！",
+                type: "success",
+                duration: 2000,
+              });
+            } else {
+              this.$message({
+                type: "warning",
+                message: "FIS数据-更新失败！",
+              });
+            }
+            this.listLoading = false;
+          });
+      } else if (command == "enter") {
+      }
+    },
+    selectOptionsChange(item) {
+      this.getList();
+    },
+    getVersionInfo() {
+      //取版本列表信息
+      //this.listLoading = true;
+      this.listVersionQuery.SkipCount = (this.page - 1) * 1000;
+      this.$axios
+        .posts(
+          "/api/settleaccount/SettlementPart/versionlist",
+          this.listVersionQuery
+        )
+        .then((response) => {
+          this.versionList = [];
+          response.items.forEach((element) => {
+            let options = {};
+            options.value = element.id;
+            options.label = element.version;
+            this.versionList.push(options);
+          });
+          const res = new Map()
+          this.versionList = this.versionList.filter((item) => !res.has(item.label) && res.set(item.label, 1))
+          if (JSON.stringify(this.versionList) != "[]") {
+            //因版本下拉有默认值，所以详表要自动绑定子表数据
+            this.versionValue = this.versionList[0].label;
+            this.getList();
+          }
+        })
+        .catch(() => {
+          //this.listLoading = false;
+        });
+    },
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      /* if (column.property === "state") {
+        return { 0: "其他", 2: "已结" }[row[column.property]];
+      }
+      if (column.property == "accountDate" || column.property == "date") {
+        var date = row[column.property];
+        if (date == undefined) {
+          return "";
+        }
+        //return moment(date).format("YYYY-MM-DD HH:mm:ss");
+        return moment(date).format("YYYY-MM-DD");
+      } */
+      if(column.property === 'customerCode')
+      {
+        if(row[column.property] === 'R0001')
+        {
+          var vname = '二配';
+          return vname;
+        }
+        else if(row[column.property] === 'R0003')
+        {
+          var vname = '结算';
+          return vname;
+        }
+        else
+        {
+          return row[column.property];
+        }
+      }
+      return row[column.property] || "--";
+    },
+    importExcelData() {
+      this.getVersionInfo();
+      this.listLoading = false;
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+    },
+    //导出功能
+    async handleDownload() {
+      this.listLoading = true;
+      if (this.versionValue === "") {
+        this.$message.error("必需选择版本！");
+        this.listLoading = false;
+        return;
+      }
+      if (this.versionValue != "") {
+        this.listQuery.version = this.versionValue;
+      }
+      console.log("发票导出：" + JSON.stringify(this.listQuery));
+      this.$axios
+        .posts(
+          "/api/settleaccount/SettlementPart/Export",
+          this.listQuery
+        )
+        .then((res) => {
+          let fileNameOfProject = res;
+          this.$axios
+            .BolbGets(
+              "/api/settleaccount/getblobfile/download/" + fileNameOfProject
+            )
+            .then((response) => {
+              if (fileNameOfProject.indexOf("_") != -1) {
+                let downName =
+                  fileNameOfProject.slice(
+                    0,
+                    fileNameOfProject.lastIndexOf("_")
+                  ) +
+                  fileNameOfProject.slice(fileNameOfProject.lastIndexOf("."));
+                downloadFile(response, downName);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              } else {
+                downloadFile(response, fileNameOfProject);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              }
+              this.listLoading = false;
+            });
+        });
+    },
+    getList() {
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.page - 1) * 10;
+      if (this.versionValue != "") {
+        this.listQuery.version = this.versionValue;
+      }
+      if (this.valueSelect != "") {
+        this.listQuery.customerCode = this.valueSelect;
+      } else {
+        this.listQuery.customerCode = "";
+      }
+      console.log("列表查询条件：" + JSON.stringify(this.listQuery));
+      this.$axios
+        .posts(
+          "/api/newjit/part-cfg/list",
+          this.listQuery
+        )
+        .then((response) => {
+          this.list = response.items;
+          this.list.forEach(item => {
+            if(item.customerCode === 'R0001')
+            {
+              item.customerCode = '二配';
+            }
+            else if(item.customerCode === 'R0003')
+            {
+              item.customerCode = '结算';
+            }
+          });
+          this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    fetchData(id) {
+      //循环动态
+      this.$axios
+        .gets("/api/settleaccount/SettlementPart/" + id)
+        .then((response) => {
+          this.form = response;
+        });
+    },
+    /** 筛选操作 */
+    handleFilter() {
+      this.page = 1;
+      //#region 
+      /*
+      this.listQuery.Filters = [];
+      if (this.partCode != "") {
+        var column = "partCode";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partCode,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partCode")
+        this.listQuery.Filters.push(filter);
+      }
+
+      if (this.partName != "") {
+        var column = "partName";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partName,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partName")
+        this.listQuery.Filters.push(filter);
+      }
+
+      if (this.partType != "") {
+        var column = "partType";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partType,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partType")
+        this.listQuery.Filters.push(filter);
+      }
+
+      if (this.partChildType != "") {
+        var column = "partChildType";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partChildType,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partChildType")
+        this.listQuery.Filters.push(filter);
+      }
+      */
+     //#endregion
+      this.getList();
+    },
+    /** 多项筛选操作 */
+    /** 筛选操作 */
+    handleFilters(data) {
+      if (data === null) {
+        this.listQuery.Filters = [];
+        this.getList(); //查询所有
+      } else {
+        console.log(data)
+        this.filterObj = data;
+        console.log("筛选" + JSON.stringify(data));
+        var offsetHei = document.documentElement.clientHeight;
+        var removeHeight = Object.keys(this.filterObj).length > 0 ? 310 : 240;
+        this.tableHeight = offsetHei - removeHeight;
+        this.currentPage = 1;
+        let Filter = [];
+        data.forEach((item) => {
+          let filter = {};
+          if (item.formType === "datetime" || item.formType === "datetime") {
+            //日期类型的过滤条件是 (datetime >= a and  datetime <=b)
+            filter["Column"] = item.fieldName;
+            filter["Logic"] = 0;
+            filter["Value"] = item.value[0];
+            filter["Action"] = item.action;
+            Filter.push(filter);
+
+            if (item.value[1] != null) {
+              filter["Value"] = item.value[1];
+              filter["Action"] = 5;
+              Filter.push(filter);
+            }
+          } else {
+            filter["Column"] = item.fieldName;
+            filter["Value"] = item.value;
+            filter["Logic"] = 0;
+            filter["Action"] = item.action;
+            Filter.push(filter);
+          }
+        });
+        console.log("筛选条件" + JSON.stringify(Filter));
+        this.listQuery.Filters = Filter;
+        this.getList();
+      }
+    },
+    /** 重置按钮操作 */
+    resetQuery(refName) {
+      this.OnlineTimeVale = [];
+      this.ReceiveTimeVale = [];
+      this.$refs[refName].resetFields();
+      this.handleFilter();
+    },
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      console.log(this.listQuery.Sorting);
+      if(this.listQuery.Filters.length>0 && this.listQuery.Filters[0].column === "Enabled")
+      {
+        this.sortState = false;
+      }
+      else
+      {
+        this.sortState = true;
+      }
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../styles/crmtable.scss";
+</style>
+<style lang="scss">
+.el-table .cell.el-tooltip {
+  white-space: pre-wrap;
+}
+</style>
+
+
diff --git a/vue/src/views/pg-fis/basedate/m100BIll/index.vue b/vue/src/views/pg-fis/basedate/m100BIll/index.vue
new file mode 100644
index 00000000..8ba688d5
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/m100BIll/index.vue
@@ -0,0 +1,1067 @@
+<!--总成模块信息管理页-->
+<template>
+  <div class="cr-body-content">
+    <div ref="box">
+    <flexbox class="content-header" >
+      <el-form
+        :model="listQuery"
+        ref="queryForm"
+        v-show="showSearch"
+        :inline="true"
+      >
+      <!-- <el-row> -->
+        <el-form-item label="生产线:" prop="workLine">
+          <el-select
+            v-model="listQuery.workLine"
+            clearable
+            placeholder="请选择"
+            size="medium"
+            style="margin-right: 15px"
+            @change="valueselectChange"
+          >
+            <el-option label="门板" value="R0003"></el-option>
+            <el-option label="二配" value="R0001"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="" prop="workLineCode">
+          <el-select
+            v-model="listQuery.workLineCode"
+            clearable
+            placeholder="请选择"
+            size="medium"
+            style="margin-right: 15px"
+            @change="valueselectChange"
+          >
+            <el-option label="01-C8" value="01-C8"></el-option>
+            <el-option label="01-C9" value="01-C9"></el-option>
+          </el-select>
+        </el-form-item>
+
+          <el-form-item label="版本:" prop="Version">
+            <el-input
+              v-model="listQuery.Version"
+              placeholder=""
+              clearable
+              size="small"
+              style="width: 240px"
+              @keyup.enter.native="handleQuery"
+            />
+          </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="大众顺序号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="KNR:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="底盘号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName ">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="上线日期">
+          <el-date-picker
+            v-model="listQuery.OnlineTimeVale"
+            size="small"
+            style="width: 380px"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="接收日期">
+          <el-date-picker
+            v-model="listQuery.ReceiveTimeVale"
+            size="small"
+            style="width: 380px"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+
+        <el-form-item style="margin: 0px">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleFilter"
+            >搜索</el-button
+          >
+          <el-button
+            icon="el-icon-refresh"
+            size="mini"
+            @click="resetQuery('queryForm')"
+            >重置</el-button
+          >
+          <el-button
+            type="warning"
+            plain
+            icon="el-icon-download"
+            size="mini"
+            style="margin-left: 15px"
+            @click="handleDownload()"
+            >导出(Excel)
+          </el-button>
+        </el-form-item>
+      <!-- </el-row> -->
+        <el-divider class="divider1" ></el-divider>
+        <el-form-item style="margin-bottom: 0px;margin-top: 10px">
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-plus"
+            @click="handleCreate"
+            >新增
+          </el-button>
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-edit"
+            @click="handleUpdate"
+            >修改
+          </el-button>
+          <el-button
+            class="filter-item"
+            size="mini"
+            type="primary"
+            icon="el-icon-delete"
+            @click="handleDelete"
+            >删除
+          </el-button>
+        </el-form-item>
+      </el-form>
+    </flexbox>
+    </div>
+    <div class="l-table">
+      <!--表格渲染-->
+      <el-table
+        ref="multipleTable"
+        v-loading="listLoading"
+        element-loading-text="拼命加载中..."
+        element-loading-spinner="el-icon-loading"
+        class="cr-table"
+        :data="list"
+        :height="tableHeight"
+        :cell-style="cellStyle"
+        :header-cell-style="headerRowStyle"
+        size="small"
+        stripe
+        border
+        highlight-current-row
+        style="width: 100%"
+        @sort-change="sortChange"
+        @selection-change="handleSelectionChange"
+        @row-click="handleRowClick"
+      >
+        
+        <el-table-column
+          label="底盘号"
+          prop="vin "
+          sortable="custom"
+          align="center"
+          
+          width="180px"
+        >
+          <template slot-scope="scope">
+            <span class="link-type" @click="handleDrawerOpen(scope.row)">{{
+              scope.row.vin
+            }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-for="(item, index) in getDefaultField"
+          :key="index"
+          :prop="item.prop"
+          :label="item.label"
+          :min-width="item.width"
+          :formatter="fieldFormatter"
+          sortable="custom"
+          show-overflow-tooltip
+          :gutter="0"
+        >
+          <template slot="header" slot-scope="scope">
+            {{ scope.column.label }}
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!--表单渲染-->
+      <el-dialog
+        :visible.sync="dialogFormVisible"
+        :close-on-click-modal="false"
+        :title="formTitle"
+        width="1000px"
+      >
+        <el-form
+          ref="form"
+          :inline="true"
+          :model="form"
+          :rules="rules"
+          size="small"
+          label-width="120px"
+        >
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="KNR:" prop="erpAssemblyCode" required >
+                <el-input
+                  style="width: 350px"
+                  v-model="form.erpAssemblyCode"
+                  :disabled="isEdit"
+                  placeholder="请选择添加M100信息对应的KNR号"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="车型:" prop="vehicleModel" required >
+                <el-select
+                  style="width: 350px"
+                  v-model="form.model"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="底盘号:"  prop="erpAssemblyCode" required >
+                <el-input
+                  style="width: 350px"
+                  v-model="form.erpAssemblyCode"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="大众顺序号:"  prop="vehicleModel" required >
+                <el-input
+                  style="width: 350px"
+                  v-model="form.model"
+                  :disabled="isEdit"
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="上线日期:">
+              <el-date-picker
+                v-model="form.year"
+                style="width: 350px"
+                type="datetime"
+                value-format="yyyy-MM-dd HH:mm:ss"
+                placeholder="选择时间"
+                :disabled="isEdit"
+              >
+              </el-date-picker>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12">
+              <div style="border:1px solid #E4E4E4;width:94%">
+                <el-row>
+                  <div style="background:#F1F1F1;width:100%;height:30px;line-height:31px;">
+                    <label style="margin-left:15px">ERP总成</label>
+                  </div>
+                </el-row>
+                <el-row>
+                  <el-table
+                    ref="ERPDetialTable"
+                    v-loading="listLoading"
+                    element-loading-text="拼命加载中..."
+                    element-loading-spinner="el-icon-loading"
+                    class="cr-table"
+                    :data="form.details"
+                    :height="detailTableHeight"
+                    :cell-style="cellStyle"
+                    :header-cell-style="headerRowStyle"
+                    size="small"
+                    stripe
+                    border
+                    highlight-current-row
+                    style="width: 95%;margin:10px"
+                    @row-click="handleRowClick"
+                  >
+                    <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+                    <el-table-column prop="partCode" label="ERP总成编号" width="150px" > 
+                      <template slot-scope="scope">
+                        <el-input v-model="scope.row.partCode" size="mini" style="width:135px"></el-input>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="partName" label="ERP总成名称">
+                      <template slot-scope="scope">
+                        <el-input v-model="scope.row.partName" size="mini"></el-input>
+                      </template> 
+                    </el-table-column>
+                    <el-table-column prop="description" width="35px"> 
+                      <template slot="header">
+                        <!-- <el-button @click="handleAddDetails" icon="el-icon-plus" type="text"></el-button> -->
+                      </template>
+                      <template slot-scope="scope">
+                        <el-button @click="handleDeleteDetails(scope.$index, scope.row)" icon="el-icon-minus" type="text"></el-button>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                </el-row>
+                <el-divider class="divider2"  content-position="left">添加ERP总成</el-divider>
+                <el-row>
+                  <el-form-item label="ERP总成编码:" prop="erpAssemblyCode" required >
+                    <el-input
+                      style="width: 315px"
+                      v-model="form.erpAssemblyCode"
+                      :disabled="isEdit"
+                      placeholder="请输入总成编码"
+                    />
+                  </el-form-item>
+                </el-row>
+                <el-row>
+                  <el-form-item label="ERP总成名称:" prop="erpAssemblyName" required >
+                    <el-input
+                      style="width: 315px"
+                      v-model="form.erpAssemblyName"
+                      :disabled="isEdit"
+                      placeholder="请输入总成名称"
+                    />
+                  </el-form-item>
+                </el-row>
+                <el-row>
+                  <el-form-item label="车型:" prop="erpAssemblyName" required >
+                    <el-select
+                      style="width: 315px"
+                      v-model="form.erpAssemblyName"
+                      :disabled="isEdit"
+                      placeholder="请输入总成名称"
+                    />
+                  </el-form-item>
+                </el-row>
+                <div style="text-align:center;margin: 0px;margin-bottom: 15px;">
+                  <el-button type="primary">添加总成</el-button>
+                </div>
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div style="border:1px solid #E4E4E4;width:94%">
+                <el-row>
+                  <div style="background:#F1F1F1;width:100%;height:30px;line-height:31px;">
+                    <label style="margin-left:15px">ERP结算件</label>
+                  </div>
+                </el-row>
+                <el-row>
+                  <el-table
+                    ref="DetialTable"
+                    v-loading="listLoading"
+                    element-loading-text="拼命加载中..."
+                    element-loading-spinner="el-icon-loading"
+                    class="cr-table"
+                    :data="form.details"
+                    :height="detailTableHeight"
+                    :cell-style="cellStyle"
+                    :header-cell-style="headerRowStyle"
+                    size="small"
+                    stripe
+                    border
+                    highlight-current-row
+                    style="width: 95%;margin:10px"
+                    @row-click="handleRowClick"
+                  >
+                    <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+                    <el-table-column prop="partCode" label="客户零件代码" width="150px" > 
+                      <template slot-scope="scope">
+                        <el-input v-model="scope.row.partCode" size="mini" style="width:135px"></el-input>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="partName" label="客户零件名称">
+                      <template slot-scope="scope">
+                        <el-input v-model="scope.row.partName" size="mini"></el-input>
+                      </template> 
+                    </el-table-column>
+                    <el-table-column prop="partNum" label="客户零件数量" width="120px" >
+                      <template slot-scope="scope">
+                        <el-input-number v-model="scope.row.partNum" :min="1"  size="mini" style="width:100px"></el-input-number>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="description" width="35px"> 
+                      <template slot="header">
+                        <!-- <el-button @click="handleAddDetails" icon="el-icon-plus" type="text"></el-button> -->
+                      </template>
+                      <template slot-scope="scope">
+                        <el-button @click="handleDeleteDetails(scope.$index, scope.row)" icon="el-icon-minus" type="text"></el-button>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                </el-row>
+                <el-divider class="divider2"  content-position="left">添加ERP结算件</el-divider>
+                <el-row>
+                  <el-form-item label="客户零件代码:" prop="customerPartCode" required >
+                    <el-input
+                      style="width: 315px"
+                      v-model="form.erpAssemblyCode"
+                      :disabled="isEdit"
+                      placeholder="请输入客户零件代码"
+                    />
+                  </el-form-item>
+                </el-row>
+                <el-row>
+                  <el-form-item label="客户零件名称:" prop="customerPartName" required >
+                    <el-input
+                      style="width: 315px"
+                      v-model="form.erpAssemblyName"
+                      :disabled="isEdit"
+                      placeholder="请输入总成名称"
+                    />
+                  </el-form-item>
+                </el-row>
+                <el-row>
+                  <el-form-item label="数量:" prop="partQty" required >
+                    <el-input-number
+                      style="width: 315px"
+                      v-model="form.partQty"
+                      :disabled="isEdit"
+                      :min="1"
+                    />
+                  </el-form-item>
+                </el-row>
+                <div style="text-align:center;margin: 0px;margin-bottom: 15px;">
+                  <el-button type="primary">添加零件</el-button>
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+        </el-form>
+        <!--表格渲染-->
+        <div slot="footer" class="dialog-footer">
+          <el-button type="text" @click="dialogFormVisible = false"
+            >取消</el-button
+          >
+          <el-button v-loading="formLoading" type="primary" @click="save"
+            >确认</el-button
+          >
+        </div>
+      </el-dialog>
+    </div>
+
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+      <!-- 抽屉控件 -->
+      <el-drawer
+        title="信息详细页"
+        size="75%"
+        direction="rtl"
+        :visible.sync="drawer"
+        :before-close="handleDrawerClose"
+      >
+        <div>
+          <Detail
+            v-bind:customerInfos="customerInfos"
+            style="margin-top: -35px"
+          ></Detail>
+        </div>
+      </el-drawer>
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination";
+import permission from "@/directive/permission/index.js";
+import CRMTableHead from "../../components/CRMTableHead";
+import importExcel from "@/components/ImportExcel-vw";
+import Lockr from "lockr";
+import moment from "moment";
+import { downloadFile } from "@/utils/crmindex.js";
+
+//组件计量单位
+const bomUnit = [
+  { key: 0, display_name: "PC" },
+  { key: 1, display_name: "TON" },
+  { key: 2, display_name: "Other" },
+];
+const projectTypeKeyValue = bomUnit.reduce((acc, cur) => {
+  acc[cur.key] = cur.display_name;
+  return acc;
+}, {});
+
+export default {
+  name: "m100Bill",
+  components: { Pagination, CRMTableHead, importExcel },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  data() {
+    const validVersion = (rule, value, callback) => {
+      let numberReg = /^\d{6}$/;
+      if (!numberReg.test(value)) {
+        callback(new Error("只能为6位数字！"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      crmType: "m100Bill",
+      rules: {
+        erpAssemblyName: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      valueSelect: "",
+      customerInfos: [],
+      dialogOptions: [],
+      versionValue: "",
+      searchContent: "", // 输入内容
+      showExcelImport: false,
+      form: {},
+      drawer: false,
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      customerInfo: {
+        bomId: "",
+      },
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listQuery: {
+        SkipCount: 0,
+        MaxResultCount: 15,
+        ErpAssemblyName: undefined,
+        ErpAssemblyCode: undefined,
+        carType:undefined,
+        OnlineTimeVale:undefined,
+        ReceiveTimeVale:undefined,
+
+      },
+      listExportQuery: {
+        erpAssemblyCode: undefined,
+        erpAssemblyName: undefined,
+      },
+      form:{
+        details:[]
+      },
+      page: 1,
+      // 显示搜索条件
+      showSearch: true,
+      bomUnit,
+      multipleSelection: [],
+      drawer: false,
+      dialogFormVisible: false,
+      formTitle: "",
+      isEdit: false,
+      formLoading: false,
+      tableHeight: document.documentElement.clientHeight - 335,
+      detailTableHeight:250,
+      details:[] //修改子表数据源
+    };
+  },
+  mounted() {
+    this.$nextTick(() => { 
+        var offsetHei = document.documentElement.clientHeight;
+        console.log(offsetHei);
+        let boxH = this.$refs.box.offsetHeight;
+        this.tableHeight = offsetHei - boxH - 57 - 79;//57为footer高度，79为页面上部标签高度
+        console.log(this.$refs.box.offsetHeight);
+        console.log(this.tableHeight);
+    });
+  },
+  created() {
+    this.getList();
+  },
+  computed: {
+    getDefaultField() {
+      
+      var tempsTabs = [];
+      tempsTabs.push({ label: "流水号", prop: "serialNum", width: 100 });
+      tempsTabs.push({ label: "大众顺序号", prop: "hostSN", width: 120 });
+      tempsTabs.push({
+        label: "KNR",
+        prop: "knr",
+        width: 120,
+      });
+      // tempsTabs.push({
+      //   label: "底盘号",
+      //   prop: "vin",
+      //   width: 130,
+      // });
+      tempsTabs.push({
+        label: "上线时间",
+        prop: "onlineTime",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "接收时间",
+        prop: "receiveTime",
+        width: 180,
+      });
+      tempsTabs.push({
+        label: "车型代码",
+        prop: "vehicleModelCode",
+        width: 120,
+      });
+      tempsTabs.push({
+        label: "版本",
+        prop: "version",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "采集点",
+        prop: "collectionPoint",
+        width: 120,
+      });
+      tempsTabs.push({
+        label: "文件名称",
+        prop: "fileName",
+        width: 120,
+      });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    //抽屉
+    handleDrawerOpen(param) {
+      this.drawer = true;
+      var parentId = param.id; //主键id
+      this.customerInfos = [
+        {
+          ParentId: parentId,
+        },
+      ];
+    },
+    handleDrawerClose(done) {
+      done();
+    },
+    save() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          console.log("保存参数:" + JSON.stringify(this.form));
+          this.formLoading = true;
+          if (this.isEdit) {
+            //修改
+            this.$axios
+              .puts("/api/newjit/assembly-cfg-erp/" + this.form.id, this.form)
+              .then((response) => {
+                this.formLoading = false;
+                this.$notify({
+                  title: "成功",
+                  message: "更新成功",
+                  type: "success",
+                  duration: 2000,
+                });
+                this.dialogFormVisible = false;
+                this.getList();
+              })
+              .catch(() => {
+                this.formLoading = false;
+              });
+          } else {
+            //insert添加
+            console.log(JSON.stringify(this.form));
+            this.$axios
+              .posts("/api/newjit/assembly-cfg-erp", this.form)
+              .then((response) => {
+                this.formLoading = false;
+                this.$notify({
+                  title: "成功",
+                  message: "新增成功",
+                  type: "success",
+                  duration: 2000,
+                });
+                this.dialogFormVisible = false;
+                this.getList();
+              })
+              .catch(() => {
+                this.formLoading = false;
+              });
+          }
+        }
+      });
+    },
+    /** 新增 */
+    handleCreate() {
+      if (this.$refs["form"] !== undefined) {
+        this.$nextTick(() => {
+          this.$refs["form"].resetFields();
+        });
+      }
+      this.formTitle = "新增";
+      this.isEdit = false;
+      this.form = {};
+      this.details = [];
+      this.dialogFormVisible = true;
+    },
+    /** 修改 */
+    handleUpdate(row) {
+      this.formTitle = "修改";
+      this.isEdit = true;
+      this.details = [];
+        if (this.multipleSelection.length != 1) {
+          this.$message({
+            message: "编辑必须选择单行",
+            type: "warning",
+          });
+          return;
+        } else {
+          this.fetchData(this.multipleSelection[0].id);
+          this.dialogFormVisible = true;
+        }
+    },
+    /** 删除 */
+    handleDelete(row) {
+      if (this.multipleSelection.length != 1) {
+          this.$message({
+            message: "编辑必须选择单行",
+            type: "warning",
+          });
+          return;
+      }
+        // this.$alert("暂时不支持批量删除", "提示", {
+        //   confirmButtonText: "确定",
+        //   callback: (action) => {
+        //     //
+        //   },
+        // });  
+        this.$confirm("是否删除" + this.multipleSelection[0].erpAssemblyCode + "?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        })
+        .then(() => {
+          this.$axios
+            .deletes("/api/newjit/assembly-cfg-erp/", this.multipleSelection[0].id)
+            .then((response) => {
+              const index = this.list.indexOf(this.multipleSelection[0]);
+              this.$notify({
+                title: "成功",
+                message: "删除成功",
+                type: "success",
+                duration: 2000,
+              });
+              this.getList();
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    fetchData(id) {
+      //循环动态
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + id)
+        .then((response) => {
+          this.form = response.item;
+          //this.details = response.item.details;
+          //console.log(this.details);
+        });
+    },
+    /** 导出功能 */
+    handleDownload() {
+      this.listLoading = true;
+      this.listExportQuery.erpAssemblyCode = this.listQuery.ErpAssemblyCode;
+      this.listExportQuery.erpAssemblyName = this.listQuery.ErpAssemblyName;
+      console.log(JSON.stringify(this.listExportQuery));
+      this.$axios
+        .posts("/api/newjit/assembly-cfg-erp/export", this.listExportQuery)
+        .then((res) => {
+          let filename = res.item;
+          this.$axios
+            .BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
+            .then((response) => {
+              if (filename.indexOf("_") != -1) {
+                let downName =
+                  filename.slice(0, filename.lastIndexOf("_")) +
+                  filename.slice(filename.lastIndexOf("."));
+                downloadFile(response, downName);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              } else {
+                downloadFile(response, filename);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              }
+              this.listLoading = false;
+            });
+        });
+      this.listLoading = false;
+    },
+    /** 重置按钮操作 */
+    resetQuery(refName) {
+      //this.$refs[refName].resetFields();
+      this.listQuery.ErpAssemblyName = "";
+      this.listQuery.ErpAssemblyCode = "";
+      this.handleQuery();
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.listQuery.SkipCount = 1;
+      this.getList();
+    },
+    selectValue(params) {
+      //版本下拉选择
+      this.versionValue = params.value;
+      this.getList();
+    },
+
+    selectOptionsChange(item) {
+      this.getList();
+    },
+    importExcelData() {
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+      //this.getList();
+    },
+
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+
+    handleAddDetails() {
+      if (this.form.details === undefined) {
+        this.form.details = [];
+        //console.log(679);
+      }
+      let obj = {};
+      obj.partCode = "";
+      obj.partName = "";
+      obj.partNum = "";
+      obj.isKey = false;
+      obj.description = "";
+
+      console.log(this.form.details);
+      this.form.details.push(obj);
+      //console.log(688);
+    },
+    handleDeleteDetails(index){
+      this.form.details.splice(index, 1);
+      //console.log(693);
+    },
+
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      if (column.property === "billStatus") {
+        return { 0: "未生效", 2: "已生效", 3: "已发布" }[row[column.property]];
+      }
+      if (column.property == "onlineTime" || column.property == "receiveTime") {
+        var date = row[column.property];
+        if (date == undefined) {
+          return "";
+        }
+        return moment(date).format("YYYY-MM-DD HH:mm:ss");
+      }
+      return row[column.property] || "--";
+    },
+    roleFilter(type) {
+      return projectTypeKeyValue[type];
+    },
+    getList() {
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.page - 1) * 10;
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/list", this.listQuery)
+        .then((response) => {
+          this.list = response.items;
+          this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    
+    getDetialList(partCode) {
+      this.listLoading = true;
+      console.log("详表条件：" + JSON.stringify(this.customerInfo.parentId));
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + this.customerInfo.parentId)
+        .then((response) => {
+          console.log(partCode)
+          if(partCode !== "" && partCode !== undefined)
+          {
+            //console.log(partCode)
+            this.list = response.item.details.filter(u => u.partCode === partCode);
+          }
+          else
+          {
+            this.list = response.item.details;
+          }
+          //alert(JSON.stringify(response.Items))
+          //this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    valueselectChange(){},
+    handleImportSAP(){},
+
+    handleFilter() {
+      this.page = 1;
+      this.getList();
+    },
+
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../../ux/styles/crmtable.scss";
+
+// /*表格全选框去除空框*/
+// .el-table >>> .DisabledSelection .cell .el-checkbox__inner {
+//   display: none;
+//   position: relative;
+// }
+// /*表格全选框改为：选择*/
+// .el-table >>> .DisabledSelection .cell:before {
+//   content: "是否Key件";
+//   position: absolute;
+//   left: 7px;
+// }
+.divider1{
+  margin: 0 ;
+}
+.divider2{
+  margin: 10px;
+  margin-bottom: 20px ;
+  width: 95%;
+}
+</style>
+
diff --git a/vue/src/views/pg-fis/basedate/m100Online/index.vue b/vue/src/views/pg-fis/basedate/m100Online/index.vue
new file mode 100644
index 00000000..29450307
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/m100Online/index.vue
@@ -0,0 +1,730 @@
+<!--总成模块信息管理页-->
+<template>
+  <div class="cr-body-content">
+    <div ref="box">
+    <flexbox class="content-header" >
+      <el-form
+        :model="listQuery"
+        ref="queryForm"
+        v-show="showSearch"
+        :inline="true"
+      >
+      <!-- <el-row> -->
+        <el-form-item label="生产线:" prop="workLine">
+          <el-select
+            v-model="listQuery.workLine"
+            clearable
+            placeholder="请选择"
+            size="medium"
+            style="margin-right: 15px"
+            @change="valueselectChange"
+          >
+            <el-option label="门板" value="R0003"></el-option>
+            <el-option label="二配" value="R0001"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="" prop="workLineCode">
+          <el-select
+            v-model="listQuery.workLineCode"
+            clearable
+            placeholder="请选择"
+            size="medium"
+            style="margin-right: 15px"
+            @change="valueselectChange"
+          >
+            <el-option label="01-C8" value="01-C8"></el-option>
+            <el-option label="01-C9" value="01-C9"></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="版本:" prop="Version">
+          <el-input
+            v-model="listQuery.Version"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+      <!-- </el-row> -->
+        <el-form-item label="流水号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName ">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+      <!-- <el-row> -->
+        <el-form-item label="大众顺序号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="KNR:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="底盘号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName ">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="上线日期">
+          <el-date-picker
+            v-model="listQuery.OnlineTimeVale"
+            size="small"
+            style="width: 380px"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="接收日期">
+          <el-date-picker
+            v-model="listQuery.ReceiveTimeVale"
+            size="small"
+            style="width: 380px"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="单据状态" prop="State">
+          <el-checkbox-group  v-model="listQuery.state" >
+            <el-checkbox v-for="item in billState" :key="item.id" :label="item.id">
+              {{ item.name }}
+            </el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
+
+        <el-form-item style="margin: 0px">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleFilter"
+            >搜索</el-button
+          >
+          <el-button
+            icon="el-icon-refresh"
+            size="mini"
+            @click="resetQuery('queryForm')"
+            >重置</el-button
+          >
+          <el-button
+            type="warning"
+            plain
+            icon="el-icon-download"
+            size="mini"
+            style="margin-left: 15px"
+            @click="handleDownload()"
+            >导出(Excel)
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            style="margin-left: 15px"
+            @click="print()"
+            >打印发货排序单
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            style="margin-left: 15px"
+            @click="rePrint()"
+            >重新打印发货排序单
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            style="margin-left: 15px"
+            @click="makeUpPrint()"
+            >补打发货排序单
+          </el-button>
+        </el-form-item>
+      <!-- </el-row> -->
+      </el-form>
+    </flexbox>
+    </div>
+    <div class="l-table">
+      <!--表格渲染-->
+      <el-table
+        ref="multipleTable"
+        v-loading="listLoading"
+        element-loading-text="拼命加载中..."
+        element-loading-spinner="el-icon-loading"
+        class="cr-table"
+        :data="list"
+        :height="tableHeight"
+        :cell-style="cellStyle"
+        :header-cell-style="headerRowStyle"
+        size="small"
+        stripe
+        border
+        highlight-current-row
+        style="width: 100%"
+        @sort-change="sortChange"
+        @selection-change="handleSelectionChange"
+        @row-click="handleRowClick"
+      >
+        
+        <el-table-column
+          label="底盘号"
+          prop="vin "
+          sortable="custom"
+          align="center"
+          
+          width="180px"
+        >
+          <template slot-scope="scope">
+            <span class="link-type" @click="handleDrawerOpen(scope.row)">{{
+              scope.row.vin
+            }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-for="(item, index) in getDefaultField"
+          :key="index"
+          :prop="item.prop"
+          :label="item.label"
+          :min-width="item.width"
+          :formatter="fieldFormatter"
+          sortable="custom"
+          show-overflow-tooltip
+          :gutter="0"
+        >
+          <template slot="header" slot-scope="scope">
+            {{ scope.column.label }}
+          </template>
+        </el-table-column>
+      </el-table>
+
+    </div>
+
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+      <!-- 抽屉控件 -->
+      <el-drawer
+        title="信息详细页"
+        size="75%"
+        direction="rtl"
+        :visible.sync="drawer"
+        :before-close="handleDrawerClose"
+      >
+      </el-drawer>
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination";
+import permission from "@/directive/permission/index.js";
+import CRMTableHead from "../../components/CRMTableHead";
+import importExcel from "@/components/ImportExcel-vw";
+import Lockr from "lockr";
+import moment from "moment";
+import { downloadFile } from "@/utils/crmindex.js";
+
+//组件计量单位
+const bomUnit = [
+  { key: 0, display_name: "PC" },
+  { key: 1, display_name: "TON" },
+  { key: 2, display_name: "Other" },
+];
+
+
+const projectTypeKeyValue = bomUnit.reduce((acc, cur) => {
+  acc[cur.key] = cur.display_name;
+  return acc;
+}, {});
+
+export default {
+  name: "M100Online",
+  components: { Pagination, CRMTableHead, importExcel },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  data() {
+    const validVersion = (rule, value, callback) => {
+      let numberReg = /^\d{6}$/;
+      if (!numberReg.test(value)) {
+        callback(new Error("只能为6位数字！"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      crmType: "M100Online",
+      rules: {
+        erpAssemblyName: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      billState:[
+        {id:0,name:"已匹配"},
+        {id:1,name:"已导出"}
+      ],
+      valueSelect: "",
+      customerInfos: [],
+      dialogOptions: [],
+      versionValue: "",
+      searchContent: "", // 输入内容
+      showExcelImport: false,
+      form: {},
+      drawer: false,
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      customerInfo: {
+        bomId: "",
+      },
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listQuery: {
+        SkipCount: 0,
+        MaxResultCount: 15,
+        ErpAssemblyName: undefined,
+        ErpAssemblyCode: undefined,
+        carType:undefined,
+        OnlineTimeVale:undefined,
+        ReceiveTimeVale:undefined,
+        state:[],
+
+      },
+      listExportQuery: {
+        erpAssemblyCode: undefined,
+        erpAssemblyName: undefined,
+      },
+      form:{
+        details:[]
+      },
+      page: 1,
+      // 显示搜索条件
+      showSearch: true,
+      bomUnit,
+      multipleSelection: [],
+      drawer: false,
+      dialogFormVisible: false,
+      formTitle: "",
+      isEdit: false,
+      formLoading: false,
+      tableHeight: document.documentElement.clientHeight - 335,
+      detailTableHeight:250,
+      details:[], //修改子表数据源
+    };
+  },
+  mounted() {
+    this.$nextTick(() => { 
+        var offsetHei = document.documentElement.clientHeight;
+        //console.log(offsetHei);
+        let boxH = this.$refs.box.offsetHeight;
+        this.tableHeight = offsetHei - boxH - 57 - 79;//57为footer高度，79为页面上部标签高度
+        //console.log(this.$refs.box.offsetHeight);
+        //console.log(this.tableHeight);
+    });
+  },
+  created() {
+    this.getList();
+  },
+  computed: {
+    getDefaultField() {
+      
+      var tempsTabs = [];
+      tempsTabs.push({ label: "流水号", prop: "serialNum", width: 100 });
+      tempsTabs.push({ label: "大众顺序号", prop: "hostSN", width: 120 });
+      tempsTabs.push({
+        label: "KNR",
+        prop: "knr",
+        width: 120,
+      });
+      // tempsTabs.push({
+      //   label: "底盘号",
+      //   prop: "vin",
+      //   width: 130,
+      // });
+      tempsTabs.push({
+        label: "KNR",
+        prop: "knr",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "M100上线时间",
+        prop: "m100OnlineTime",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "M100接收时间",
+        prop: "m100ReceiveTime",
+        width: 180,
+      });
+      tempsTabs.push({
+        label: "车型代码",
+        prop: "vehicleModelCode",
+        width: 120,
+      });
+      tempsTabs.push({
+        label: "版本",
+        prop: "version",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "R100上线时间",
+        prop: "r100OnlineTime",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "R100接收时间",
+        prop: "r100ReceiveTime",
+        width: 180,
+      });
+      tempsTabs.push({
+        label: "备注",
+        prop: "remark",
+        width: 120,
+      });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    //抽屉
+    handleDrawerOpen(param) {
+      this.drawer = true;
+      var parentId = param.id; //主键id
+      this.customerInfos = [
+        {
+          ParentId: parentId,
+        },
+      ];
+    },
+    handleDrawerClose(done) {
+      done();
+    },
+    fetchData(id) {
+      //循环动态
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + id)
+        .then((response) => {
+          this.form = response.item;
+          //this.details = response.item.details;
+          //console.log(this.details);
+        });
+    },
+    /** 导出功能 */
+    handleDownload() {
+      this.listLoading = true;
+      this.listExportQuery.erpAssemblyCode = this.listQuery.ErpAssemblyCode;
+      this.listExportQuery.erpAssemblyName = this.listQuery.ErpAssemblyName;
+      console.log(JSON.stringify(this.listExportQuery));
+      this.$axios
+        .posts("/api/newjit/assembly-cfg-erp/export", this.listExportQuery)
+        .then((res) => {
+          let filename = res.item;
+          this.$axios
+            .BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
+            .then((response) => {
+              if (filename.indexOf("_") != -1) {
+                let downName =
+                  filename.slice(0, filename.lastIndexOf("_")) +
+                  filename.slice(filename.lastIndexOf("."));
+                downloadFile(response, downName);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              } else {
+                downloadFile(response, filename);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              }
+              this.listLoading = false;
+            });
+        });
+      this.listLoading = false;
+    },
+    /** 重置按钮操作 */
+    resetQuery(refName) {
+      //this.$refs[refName].resetFields();
+      this.listQuery.ErpAssemblyName = "";
+      this.listQuery.ErpAssemblyCode = "";
+      this.handleQuery();
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.listQuery.SkipCount = 1;
+      this.getList();
+    },
+    selectValue(params) {
+      //版本下拉选择
+      this.versionValue = params.value;
+      this.getList();
+    },
+
+    selectOptionsChange(item) {
+      this.getList();
+    },
+    importExcelData() {
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+      //this.getList();
+    },
+
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+
+    handleAddDetails() {
+      if (this.form.details === undefined) {
+        this.form.details = [];
+        //console.log(679);
+      }
+      let obj = {};
+      obj.partCode = "";
+      obj.partName = "";
+      obj.partNum = "";
+      obj.isKey = false;
+      obj.description = "";
+
+      console.log(this.form.details);
+      this.form.details.push(obj);
+      //console.log(688);
+    },
+    handleDeleteDetails(index){
+      this.form.details.splice(index, 1);
+      //console.log(693);
+    },
+
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      if (column.property === "billStatus") {
+        return { 0: "未生效", 2: "已生效", 3: "已发布" }[row[column.property]];
+      }
+      if (column.property == "onlineTime" || column.property == "receiveTime") {
+        var date = row[column.property];
+        if (date == undefined) {
+          return "";
+        }
+        return moment(date).format("YYYY-MM-DD HH:mm:ss");
+      }
+      return row[column.property] || "--";
+    },
+    roleFilter(type) {
+      return projectTypeKeyValue[type];
+    },
+    getList() {
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.page - 1) * 10;
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/list", this.listQuery)
+        .then((response) => {
+          this.list = response.items;
+          this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    
+    getDetialList(partCode) {
+      this.listLoading = true;
+      console.log("详表条件：" + JSON.stringify(this.customerInfo.parentId));
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + this.customerInfo.parentId)
+        .then((response) => {
+          console.log(partCode)
+          if(partCode !== "" && partCode !== undefined)
+          {
+            //console.log(partCode)
+            this.list = response.item.details.filter(u => u.partCode === partCode);
+          }
+          else
+          {
+            this.list = response.item.details;
+          }
+          //alert(JSON.stringify(response.Items))
+          //this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    valueselectChange(){},
+    handleImportSAP(){},
+
+    handleFilter() {
+      this.page = 1;
+      this.getList();
+    },
+
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+    print(){},
+    rePrint(){},
+    makeUpPrint(){},
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../../ux/styles/crmtable.scss";
+
+// /*表格全选框去除空框*/
+// .el-table >>> .DisabledSelection .cell .el-checkbox__inner {
+//   display: none;
+//   position: relative;
+// }
+// /*表格全选框改为：选择*/
+// .el-table >>> .DisabledSelection .cell:before {
+//   content: "是否Key件";
+//   position: absolute;
+//   left: 7px;
+// }
+.divider1{
+  margin: 0 ;
+}
+.divider2{
+  margin: 10px;
+  margin-bottom: 20px ;
+  width: 95%;
+}
+</style>
+
diff --git a/vue/src/views/pg-fis/basedate/r100Online/index.vue b/vue/src/views/pg-fis/basedate/r100Online/index.vue
new file mode 100644
index 00000000..81100237
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/r100Online/index.vue
@@ -0,0 +1,688 @@
+<!--总成模块信息管理页-->
+<template>
+  <div class="cr-body-content">
+    <div ref="box">
+    <flexbox class="content-header" >
+      <el-form
+        :model="listQuery"
+        ref="queryForm"
+        v-show="showSearch"
+        :inline="true"
+      >
+      <!-- <el-row> -->
+        <el-form-item label="生产线:" prop="workLine">
+          <el-select
+            v-model="listQuery.workLine"
+            clearable
+            placeholder="请选择"
+            size="medium"
+            style="margin-right: 15px"
+            @change="valueselectChange"
+          >
+            <el-option label="门板" value="R0003"></el-option>
+            <el-option label="二配" value="R0001"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="" prop="workLineCode">
+          <el-select
+            v-model="listQuery.workLineCode"
+            clearable
+            placeholder="请选择"
+            size="medium"
+            style="margin-right: 15px"
+            @change="valueselectChange"
+          >
+            <el-option label="01-C8" value="01-C8"></el-option>
+            <el-option label="01-C9" value="01-C9"></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="版本:" prop="Version">
+          <el-input
+            v-model="listQuery.Version"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="大众顺序号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="KNR:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="底盘号:" prop="ErpAssemblyName">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item label="-" prop="ErpAssemblyName ">
+          <el-input
+            v-model="listQuery.ErpAssemblyName"
+            placeholder=""
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+
+        <el-form-item label="上线日期">
+          <el-date-picker
+            v-model="listQuery.OnlineTimeVale"
+            size="small"
+            style="width: 380px"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+      <!-- </el-row> -->
+      <!-- <el-row> -->
+        <el-form-item label="接收日期">
+          <el-date-picker
+            v-model="listQuery.ReceiveTimeVale"
+            size="small"
+            style="width: 380px"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item label="单据状态" prop="State">
+          <el-checkbox-group  v-model="listQuery.state" >
+            <el-checkbox v-for="item in billState" :key="item.id" :label="item.id">
+              {{ item.name }}
+            </el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
+
+        <el-form-item style="margin: 0px">
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleFilter"
+            >搜索</el-button
+          >
+          <el-button
+            icon="el-icon-refresh"
+            size="mini"
+            @click="resetQuery('queryForm')"
+            >重置</el-button
+          >
+          <el-button
+            type="warning"
+            plain
+            icon="el-icon-download"
+            size="mini"
+            style="margin-left: 15px"
+            @click="handleDownload()"
+            >导出(Excel)
+          </el-button>
+          <el-button
+            type="primary"
+            size="mini"
+            style="margin-left: 15px"
+            @click="SAPExport()"
+            >导出Excel（用于SAP导入）
+          </el-button>
+        </el-form-item>
+      <!-- </el-row> -->
+      </el-form>
+    </flexbox>
+    </div>
+    <div class="l-table">
+      <!--表格渲染-->
+      <el-table
+        ref="multipleTable"
+        v-loading="listLoading"
+        element-loading-text="拼命加载中..."
+        element-loading-spinner="el-icon-loading"
+        class="cr-table"
+        :data="list"
+        :height="tableHeight"
+        :cell-style="cellStyle"
+        :header-cell-style="headerRowStyle"
+        size="small"
+        stripe
+        border
+        highlight-current-row
+        style="width: 100%"
+        @sort-change="sortChange"
+        @selection-change="handleSelectionChange"
+        @row-click="handleRowClick"
+      >
+        
+        <!-- <el-table-column
+          label="底盘号"
+          prop="vin "
+          sortable="custom"
+          align="center"
+          
+          width="180px"
+        >
+          <template slot-scope="scope">
+            <span class="link-type" @click="handleDrawerOpen(scope.row)">{{
+              scope.row.vin
+            }}</span>
+          </template>
+        </el-table-column> -->
+        <el-table-column
+          v-for="(item, index) in getDefaultField"
+          :key="index"
+          :prop="item.prop"
+          :label="item.label"
+          :min-width="item.width"
+          :formatter="fieldFormatter"
+          sortable="custom"
+          show-overflow-tooltip
+          :gutter="0"
+        >
+          <template slot="header" slot-scope="scope">
+            {{ scope.column.label }}
+          </template>
+        </el-table-column>
+      </el-table>
+
+    </div>
+
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+      <!-- 抽屉控件 -->
+      <el-drawer
+        title="信息详细页"
+        size="75%"
+        direction="rtl"
+        :visible.sync="drawer"
+        :before-close="handleDrawerClose"
+      >
+      </el-drawer>
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination";
+import permission from "@/directive/permission/index.js";
+import CRMTableHead from "../../components/CRMTableHead";
+import importExcel from "@/components/ImportExcel-vw";
+import Lockr from "lockr";
+import moment from "moment";
+import { downloadFile } from "@/utils/crmindex.js";
+
+//组件计量单位
+const bomUnit = [
+  { key: 0, display_name: "PC" },
+  { key: 1, display_name: "TON" },
+  { key: 2, display_name: "Other" },
+];
+
+
+const projectTypeKeyValue = bomUnit.reduce((acc, cur) => {
+  acc[cur.key] = cur.display_name;
+  return acc;
+}, {});
+
+export default {
+  name: "M100Online",
+  components: { Pagination, CRMTableHead, importExcel },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  data() {
+    const validVersion = (rule, value, callback) => {
+      let numberReg = /^\d{6}$/;
+      if (!numberReg.test(value)) {
+        callback(new Error("只能为6位数字！"));
+      } else {
+        callback();
+      }
+    };
+    return {
+      crmType: "M100Online",
+      rules: {
+        erpAssemblyName: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      billState:[
+        {id:0,name:"已匹配"},
+        {id:1,name:"已导出"}
+      ],
+      valueSelect: "",
+      customerInfos: [],
+      dialogOptions: [],
+      versionValue: "",
+      searchContent: "", // 输入内容
+      showExcelImport: false,
+      form: {},
+      drawer: false,
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      customerInfo: {
+        bomId: "",
+      },
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listQuery: {
+        SkipCount: 0,
+        MaxResultCount: 15,
+        ErpAssemblyName: undefined,
+        ErpAssemblyCode: undefined,
+        carType:undefined,
+        OnlineTimeVale:undefined,
+        ReceiveTimeVale:undefined,
+        state:[],
+
+      },
+      listExportQuery: {
+        erpAssemblyCode: undefined,
+        erpAssemblyName: undefined,
+      },
+      form:{
+        details:[]
+      },
+      page: 1,
+      // 显示搜索条件
+      showSearch: true,
+      bomUnit,
+      multipleSelection: [],
+      drawer: false,
+      dialogFormVisible: false,
+      formTitle: "",
+      isEdit: false,
+      formLoading: false,
+      tableHeight: document.documentElement.clientHeight - 335,
+      detailTableHeight:250,
+      details:[], //修改子表数据源
+    };
+  },
+  mounted() {
+    this.$nextTick(() => { 
+        var offsetHei = document.documentElement.clientHeight;
+        //console.log(offsetHei);
+        let boxH = this.$refs.box.offsetHeight;
+        this.tableHeight = offsetHei - boxH - 57 - 79;//57为footer高度，79为页面上部标签高度
+        //console.log(this.$refs.box.offsetHeight);
+        //console.log(this.tableHeight);
+    });
+  },
+  created() {
+    this.getList();
+  },
+  computed: {
+    getDefaultField() {
+      
+      var tempsTabs = [];
+      tempsTabs.push({ label: "大众顺序号", prop: "hostSN", width: 120 });
+      tempsTabs.push({
+        label: "KNR",
+        prop: "knr",
+        width: 120,
+      });
+      // tempsTabs.push({
+      //   label: "底盘号",
+      //   prop: "vin",
+      //   width: 130,
+      // });
+      tempsTabs.push({
+        label: "KNR",
+        prop: "knr",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "单据状态",
+        prop: "billState",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "上线时间",
+        prop: "onlineTime",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "接收时间",
+        prop: "receiveTime",
+        width: 180,
+      });
+      tempsTabs.push({
+        label: "车型代码",
+        prop: "vehicleModelCode",
+        width: 120,
+      });
+      tempsTabs.push({
+        label: "版本",
+        prop: "version",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "总成编号",
+        prop: "erpAssemblyCode",
+        width: 150,
+      });
+      tempsTabs.push({
+        label: "总成名称",
+        prop: "erpAssemblyName",
+        width: 180,
+      });
+      tempsTabs.push({
+        label: "备注",
+        prop: "remark",
+        width: 120,
+      });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    //抽屉
+    handleDrawerOpen(param) {
+      this.drawer = true;
+      var parentId = param.id; //主键id
+      this.customerInfos = [
+        {
+          ParentId: parentId,
+        },
+      ];
+    },
+    handleDrawerClose(done) {
+      done();
+    },
+    /** 导出功能 */
+    handleDownload() {
+      this.listLoading = true;
+      this.listExportQuery.erpAssemblyCode = this.listQuery.ErpAssemblyCode;
+      this.listExportQuery.erpAssemblyName = this.listQuery.ErpAssemblyName;
+      console.log(JSON.stringify(this.listExportQuery));
+      this.$axios
+        .posts("/api/newjit/assembly-cfg-erp/export", this.listExportQuery)
+        .then((res) => {
+          let filename = res.item;
+          this.$axios
+            .BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
+            .then((response) => {
+              if (filename.indexOf("_") != -1) {
+                let downName =
+                  filename.slice(0, filename.lastIndexOf("_")) +
+                  filename.slice(filename.lastIndexOf("."));
+                downloadFile(response, downName);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              } else {
+                downloadFile(response, filename);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              }
+              this.listLoading = false;
+            });
+        });
+      this.listLoading = false;
+    },
+    /** 重置按钮操作 */
+    resetQuery(refName) {
+      //this.$refs[refName].resetFields();
+      this.listQuery.ErpAssemblyName = "";
+      this.listQuery.ErpAssemblyCode = "";
+      this.handleQuery();
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.listQuery.SkipCount = 1;
+      this.getList();
+    },
+    selectValue(params) {
+      //版本下拉选择
+      this.versionValue = params.value;
+      this.getList();
+    },
+
+    selectOptionsChange(item) {
+      this.getList();
+    },
+    importExcelData() {
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+      //this.getList();
+    },
+
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+
+    handleAddDetails() {
+      if (this.form.details === undefined) {
+        this.form.details = [];
+        //console.log(679);
+      }
+      let obj = {};
+      obj.partCode = "";
+      obj.partName = "";
+      obj.partNum = "";
+      obj.isKey = false;
+      obj.description = "";
+
+      console.log(this.form.details);
+      this.form.details.push(obj);
+      //console.log(688);
+    },
+    handleDeleteDetails(index){
+      this.form.details.splice(index, 1);
+      //console.log(693);
+    },
+
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      if (column.property === "billStatus") {
+        return { 0: "未生效", 2: "已生效", 3: "已发布" }[row[column.property]];
+      }
+      if (column.property == "onlineTime" || column.property == "receiveTime") {
+        var date = row[column.property];
+        if (date == undefined) {
+          return "";
+        }
+        return moment(date).format("YYYY-MM-DD HH:mm:ss");
+      }
+      return row[column.property] || "--";
+    },
+    roleFilter(type) {
+      return projectTypeKeyValue[type];
+    },
+    getList() {
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.page - 1) * 10;
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/list", this.listQuery)
+        .then((response) => {
+          this.list = response.items;
+          this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    
+    getDetialList(partCode) {
+      this.listLoading = true;
+      console.log("详表条件：" + JSON.stringify(this.customerInfo.parentId));
+      this.$axios
+        .gets("/api/newjit/assembly-cfg-erp/" + this.customerInfo.parentId)
+        .then((response) => {
+          console.log(partCode)
+          if(partCode !== "" && partCode !== undefined)
+          {
+            //console.log(partCode)
+            this.list = response.item.details.filter(u => u.partCode === partCode);
+          }
+          else
+          {
+            this.list = response.item.details;
+          }
+          //alert(JSON.stringify(response.Items))
+          //this.totalCount = response.totalCount;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+
+    valueselectChange(){},
+    handleImportSAP(){},
+
+    handleFilter() {
+      this.page = 1;
+      this.getList();
+    },
+
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+    SAPExport(){},
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../../ux/styles/crmtable.scss";
+
+// /*表格全选框去除空框*/
+// .el-table >>> .DisabledSelection .cell .el-checkbox__inner {
+//   display: none;
+//   position: relative;
+// }
+// /*表格全选框改为：选择*/
+// .el-table >>> .DisabledSelection .cell:before {
+//   content: "是否Key件";
+//   position: absolute;
+//   left: 7px;
+// }
+.divider1{
+  margin: 0 ;
+}
+.divider2{
+  margin: 10px;
+  margin-bottom: 20px ;
+  width: 95%;
+}
+</style>
+
diff --git a/vue/src/views/pg-fis/basedate/workLine/index.vue b/vue/src/views/pg-fis/basedate/workLine/index.vue
new file mode 100644
index 00000000..3c848f3d
--- /dev/null
+++ b/vue/src/views/pg-fis/basedate/workLine/index.vue
@@ -0,0 +1,952 @@
+<!--零件匹配关系页-->
+<template>
+  <div class="cr-body-content">
+    <div ref="box">
+    <flexbox class="content-header">
+
+      <el-form
+        :model="listQuery"
+        ref="queryForm"
+        v-show="showSearch"
+        :inline="true"
+      >
+      <!-- <span>版本:</span>
+
+      <XhJSSelect
+        :options="versionList"
+        style="width: 200px"
+        class="search-container"
+        @value-change="selectValue"
+      ></XhJSSelect> -->
+
+      
+      <el-form-item label="操作员登录名:" prop="userName">
+        <el-input
+          v-model="listQuery.userName"
+          clearable
+          size="small"
+          placeholder=""
+          style="width: 200px"
+          class="search-container"
+          @keyup.enter.native="handleFilter"
+        />
+      </el-form-item>
+      
+      <el-form-item label="操作员真实名称:" prop="name">
+        <el-input
+          v-model="listQuery.name"
+          clearable
+          size="small"
+          placeholder=""
+          style="width: 200px"
+          class="search-container"
+          @keyup.enter.native="handleFilter"
+        />
+      </el-form-item>
+
+      <el-form-item label="部门:" prop="dep">
+        <el-select
+          v-model="listQuery.dep"
+          clearable
+          placeholder="请选择"
+          size="medium"
+          style="margin-right: 15px"
+          @change="valueselectChange"
+        >
+          <el-option label="结算" value="R0003"></el-option>
+          <el-option label="二配" value="R0001"></el-option>
+        </el-select>
+      </el-form-item>
+
+      <el-form-item label="生产线:" prop="productLineCode">
+        <el-select
+          v-model="listQuery.productLineCode"
+          clearable
+          placeholder="请选择"
+          size="medium"
+          style="margin-right: 15px"
+          @change="valueselectChange"
+        >
+          <el-option
+            v-for="item in PLList"
+            :key="item.productLineCode"
+            :label="item.productLineName"
+            :value="item.productLineCode"/>
+        </el-select>
+      </el-form-item>
+
+      <!-- <el-input
+        v-model="searchContent"
+        clearable
+        size="small"
+        placeholder="按照结算件基本信息搜索..."
+        style="width: 200px"
+        class="search-container"
+        @keyup.enter.native="handleFilter"
+      /> -->
+      <el-form-item>
+        <el-button
+          size="mini"
+          type="primary"
+          icon="el-icon-search"
+          @click="handleFilter"
+          >搜索
+        </el-button>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          icon="el-icon-refresh"
+          size="mini"
+          @click="resetQuery('queryForm')"
+          >重置
+        </el-button>
+      </el-form-item>
+
+      <el-form-item>
+        <el-button
+          class="filter-item"
+          plain
+          size="mini"
+          type="warning"
+          icon="el-icon-bottom"
+          @click="handleDownload()"
+          >导出Excel
+        </el-button>
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          class="filter-item"
+          plain
+          size="mini"
+          type="primary"
+          @click="permissionConfig()"
+          >权限配置
+        </el-button>
+      </el-form-item>
+      <!--表格头组件，filter查询-->
+      <!-- <c-r-m-table-head
+        ref="crmTableHead"
+        :crm-type="crmType"
+        @handle="handleHandle"
+        @filter="handleFilters"
+      >
+      </c-r-m-table-head> -->
+      </el-form>
+    </flexbox>
+    </div>
+    <!--表格渲染-->
+    <el-row>
+      <!--主表-->
+      <el-col :span="14">
+        <el-table
+          ref="multipleTable"
+          v-loading.fullscreen.lock="listLoading"
+          element-loading-text="拼命加载中..."
+          element-loading-spinner="el-icon-loading"
+          class="cr-table"
+          :data="list"
+          :height="tableHeight"
+          :cell-style="cellStyle"
+          :header-cell-style="headerRowStyle"
+          size="small"
+          stripe
+          border
+          highlight-current-row
+          style="width: 100%"
+          @sort-change="sortChange"
+          @selection-change="handleSelectionChange"
+          @row-click="handleRowClick"
+        >
+          <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+          <el-table-column
+            type="index" label="序号"
+            :index="1">
+          </el-table-column>
+          <el-table-column
+            v-for="(item, index) in getDefaultField"
+            :key="index"
+            :prop="item.prop"
+            :label="item.label"
+            :min-width="item.width"
+            :formatter="fieldFormatter"
+            sortable="custom"
+            show-overflow-tooltip
+            :gutter="0"
+          >
+            <template slot="header" slot-scope="scope">
+              {{ scope.column.label }}
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+      <!--子表-->
+      <el-col :span="10">
+        <el-table
+          ref="detailTable"
+          v-loading.fullscreen.lock="listDetailLoading"
+          element-loading-text="拼命加载中..."
+          element-loading-spinner="el-icon-loading"
+          class="cr-table"
+          :data="detaillist"
+          :height="tableHeight"
+          :cell-style="cellDetailStyle"
+          :header-cell-style="headerDetailRowStyle"
+          size="small"
+          stripe
+          border
+          highlight-current-row
+          style="width: 100%"
+          @sort-change="sortDetailChange"
+          @selection-change="handleDetailSelectionChange"
+          @row-click="handleDetailRowClick"
+        >
+          <!-- <el-table-column type="selection" width="44px"></el-table-column> -->
+          <!-- <el-table-column
+            label="版本"
+            prop="version"
+            sortable="custom"
+            align="center"
+            width="100px"
+          >fixed 默认固定在左边
+            <template slot-scope="scope">
+              <el-tooltip :content="scope.row.version" placement="top">
+                <span class="link-type">{{ scope.row.version }}</span>
+              </el-tooltip>
+            </template>
+          </el-table-column> -->
+          <el-table-column
+            type="index" label="序号"
+            :index="1">
+          </el-table-column>
+          <el-table-column
+            v-for="(item, index) in getChildDefaultField"
+            :key="index"
+            :prop="item.prop"
+            :label="item.label"
+            :min-width="item.width"
+            :formatter="fieldFormatter"
+            sortable="custom"
+            show-overflow-tooltip
+            :gutter="0"
+          >
+            <template slot="header" slot-scope="scope">
+              {{ scope.column.label }}
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-col>
+    </el-row>
+    <!--表单渲染-->
+      <el-dialog
+        :visible.sync="dialogFormVisible"
+        :close-on-click-modal="false"
+        :title="formTitle"
+        width="700px"
+      >
+        <el-form
+          ref="form"
+          :inline="true"
+          :model="form"
+          :rules="rules"
+          size="small"
+          label-width="120px"
+        >
+          <el-row>
+            <el-col :span="4">
+              <el-form-item label="操作员" required />
+            </el-col>
+            <el-col :span="20">
+                <el-input
+                  style="width: 400px"
+                  v-model="form.userName"
+                  :disabled="isEdit"
+                />
+            </el-col>
+          </el-row>
+          
+
+          <el-row>
+            <el-transfer
+              v-model="form.worklines"
+              :titles="['可操作的生产线', '全部生产线']"
+              filterable
+              :data="UsePLList">
+            </el-transfer>
+          </el-row>
+        </el-form>
+        
+        <div slot="footer" class="dialog-footer">
+          <el-button type="text" @click="dialogFormVisible = false"
+            >取消</el-button
+          >
+          <el-button v-loading="formLoading" type="primary" @click="save"
+            >确认</el-button
+          >
+        </div>
+      </el-dialog>
+    <div class="table-footer">
+      <!-- 分页控件 style="margin-top: -25px;margin-bottom:-25px;float:right;"-->
+      <pagination
+        v-show="totalCount > 0"
+        :total="totalCount"
+        :page.sync="page"
+        :limit.sync="listQuery.MaxResultCount"
+        @pagination="getList"
+      />
+      <!-- 导入Excel组件 -->
+      <importExcel
+        ref="importexcel"
+        :show="showExcelImport"
+        :crmType="crmType"
+        @close="importExcelData"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
+import permission from "@/directive/permission/index.js";
+import importExcel from "@/components/ImportExcel-invoice";
+import CRMTableHead from "../../components/CRMTableHead";
+import moment from "moment";
+import Lockr from "lockr";
+import { downloadFile } from "@/utils/crmindex.js";
+import XhJSSelect from "@/components/CreateCom/Xh-JS-Select-Label.vue";
+import { filter } from 'jszip/lib/object';
+
+export default {
+  name: "CustomerPartCfg",
+  components: { Pagination, CRMTableHead, importExcel, XhJSSelect },
+  directives: { permission },
+  filters: {
+    IsCustomerSignFilter(status) {
+      //翻译是否签字
+      const statusMap = {
+        true: "是",
+        false: "否",
+      };
+      return statusMap[status];
+    },
+  },
+  props: {
+    customerInfos: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+  },
+  data() {
+    return {
+      crmType: "customerPartCfg",
+      versionValue: "",
+      //valueSelect: "R0003",
+      versionList: [], //版本列表
+      rules: {
+        //前端定义的规则，后端也有验证
+        erpMaterialCode: [
+          { required: true, message: "必须输入！", trigger: "blur" },
+        ],
+      },
+      searchContent: "", // 输入内容
+      customerInfo: {
+        settleAccountId: "",
+      },
+      form: {
+        worklines:[]
+      },
+      list: null,
+      totalCount: 0,
+      listLoading: true,
+      listDetailLoading: false,
+      formLoading: false,
+      // 高级搜索
+      filterObj: {
+        type: Object,
+        default: () => {
+          return {};
+        },
+      },
+      listVersionQuery: {
+        SkipCount: 0,
+        MaxResultCount: 15,
+      },
+      listQuery: {
+        Filters: [
+          {
+            logic: 0,
+            column: "Enabled",
+            action: 0,
+            value: "true",
+          }, //默认查询可用的
+        ],
+        //OrgID:"",
+        SkipCount: 0,
+        MaxResultCount: 15,
+        version: "",
+        customerCode: "",
+        //userId: "00000000-0000-0000-0000-000000000000",
+        userName:"",//用户名称
+        name:"",//真实姓名
+        productLineCode:"",//生产线
+      },
+      listExportQuery: {
+        Filters: [
+          {
+            logic: 0,
+            column: "Enabled",
+            action: 0,
+            value: "true",
+          }, //默认查询可用的
+        ],
+        //OrgID:"",
+        SkipCount: 0,
+        MaxResultCount: 15,
+        version: "",
+        fileType: 0,
+        userId: "",
+      },
+      listPLQuery:{
+        BillType: 1,
+        //UserId: "00000000-0000-0000-0000-000000000000",
+      },
+      saveQuery:{
+        userId: 1,
+        productLineIdList:[],
+      },
+      showSearch: true,
+      page: 1,
+      multipleSelection: [],
+      formTitle: "人员产线权限变更",
+      drawer: false,
+      showExcelImport: false,
+      tableHeight: document.documentElement.clientHeight - 260,
+      isEdit: false,
+      sortState:false, //标记刷新是否是排序调用
+      detaillist:[],
+      PLList:[],
+      UsePLList : [],
+
+      dialogFormVisible:false,//窗口显隐
+      
+    };
+  },
+  mounted() {
+    this.$nextTick(() => { 
+        var offsetHei = document.documentElement.clientHeight;
+        //console.log(offsetHei);
+        let boxH = this.$refs.box.offsetHeight;
+        this.tableHeight = offsetHei - boxH - 57 - 79;//57为footer高度，79为页面上部标签高度
+        //console.log(this.$refs.box.offsetHeight);
+        //console.log(this.tableHeight);
+    });
+  },
+  created() {
+      this.getList();
+      this.getProductLine();
+  },
+  computed: {
+    /** 列表字段 */
+    getDefaultField() {
+      var tempsTabs = [];
+
+      // tempsTabs.push({
+      //   label: "序号",
+      //   prop: "seq",
+      //   width: 50,
+      // });
+      tempsTabs.push({
+        label: "操作员登录名",
+        prop: "userName",
+        width: 140,
+      });
+      tempsTabs.push({ 
+        label: "操作员真实名称", 
+        prop: "name", 
+        width: 140
+      });
+      tempsTabs.push({
+        label: "部门",
+        prop: "dep",
+        width: 120,
+      });
+      return tempsTabs;
+    },
+    /** 列表字段 */
+    getChildDefaultField() {
+      var tempsTabs = [];
+
+      tempsTabs.push({
+        label: "序号",
+        prop: "seq",
+        width: 50,
+      });
+      tempsTabs.push({
+        label: "生产线编码",
+        prop: "workLineCode",
+        width: 100,
+      });
+      tempsTabs.push({ 
+        label: "生产线名称", 
+        prop: "workLineName", 
+        width: 170
+      });
+      return tempsTabs;
+    },
+  },
+  methods: {
+    selectValue(params) {
+      //版本下拉选择
+      this.versionValue = params.value;
+      this.getList();
+    },
+    valueselectChange(data) {
+      //alert(data);
+      //版本下拉选择
+      this.valueSelect = data;
+      this.getList();
+    },
+    handleTypeDrop(command, params = {}) {
+      if (command == "updateFis") {
+        this.listLoading = true;
+        //this.listQuery.SkipCount = (this.page - 1) * 10000;
+        this.$axios
+          .posts("/api/settleaccount/SettlementPart/updateFis")
+          .then((res) => {
+            if (res == true) {
+              this.$notify({
+                title: "成功",
+                message: "FIS数据-更新成功！",
+                type: "success",
+                duration: 2000,
+              });
+            } else {
+              this.$message({
+                type: "warning",
+                message: "FIS数据-更新失败！",
+              });
+            }
+            this.listLoading = false;
+          });
+      } else if (command == "enter") {
+      }
+    },
+    selectOptionsChange(item) {
+      this.getList();
+    },
+    getVersionInfo() {
+      //取版本列表信息
+      //this.listLoading = true;
+      this.listVersionQuery.SkipCount = (this.page - 1) * 1000;
+      this.$axios
+        .posts(
+          "/api/settleaccount/SettlementPart/versionlist",
+          this.listVersionQuery
+        )
+        .then((response) => {
+          this.versionList = [];
+          response.items.forEach((element) => {
+            let options = {};
+            options.value = element.id;
+            options.label = element.version;
+            this.versionList.push(options);
+          });
+          const res = new Map()
+          this.versionList = this.versionList.filter((item) => !res.has(item.label) && res.set(item.label, 1))
+          if (JSON.stringify(this.versionList) != "[]") {
+            //因版本下拉有默认值，所以详表要自动绑定子表数据
+            this.versionValue = this.versionList[0].label;
+            this.getList();
+          }
+        })
+        .catch(() => {
+          //this.listLoading = false;
+        });
+    },
+    /** 刷新列表 */
+    handleHandle(data) {
+      if (data.type !== "edit") {
+        this.getList();
+      }
+    },
+    /** 格式化字段 */
+    fieldFormatter(row, column) {
+      /* if (column.property === "state") {
+        return { 0: "其他", 2: "已结" }[row[column.property]];
+      }
+      if (column.property == "accountDate" || column.property == "date") {
+        var date = row[column.property];
+        if (date == undefined) {
+          return "";
+        }
+        //return moment(date).format("YYYY-MM-DD HH:mm:ss");
+        return moment(date).format("YYYY-MM-DD");
+      } */
+      if(column.property === 'customerCode')
+      {
+        if(row[column.property] === 'R0001')
+        {
+          var vname = '二配';
+          return vname;
+        }
+        else if(row[column.property] === 'R0003')
+        {
+          var vname = '结算';
+          return vname;
+        }
+        else
+        {
+          return row[column.property];
+        }
+      }
+      return row[column.property] || "--";
+    },
+    importExcelData() {
+      //this.getVersionInfo();
+      this.listLoading = false;
+      //关闭导入窗体时调用
+      this.showExcelImport = false;
+    },
+    //导出功能
+    async handleDownload() {
+      this.listLoading = true;
+      // if (this.versionValue === "") {
+      //   this.$message.error("必需选择版本！");
+      //   this.listLoading = false;
+      //   return;
+      // }
+      // if (this.versionValue != "") {
+      //   this.listQuery.version = this.versionValue;
+      // }
+      console.log("发票导出:" + JSON.stringify(this.listQuery));
+      this.$axios
+        .posts(
+          "/api/newjit/product-line-authority/export",
+          this.listQuery
+        )
+        .then((res) => {
+          let filename = res.item;
+          this.$axios
+            .BolbGets("/api/newjit/exclude-part-cfg/download/" + filename)
+            .then((response) => {
+              if (filename.indexOf("_") != -1) {
+                let downName =
+                  filename.slice(0, filename.lastIndexOf("_")) +
+                  filename.slice(filename.lastIndexOf("."));
+                downloadFile(response, downName);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              } else {
+                downloadFile(response, filename);
+                this.$notify({
+                  title: "成功",
+                  message: "数据-导出成功！",
+                  type: "success",
+                  duration: 2000,
+                });
+              }
+              this.listLoading = false;
+            });
+        });
+    },
+    getList() {
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.page - 1) * 10;
+      console.log("列表查询条件:" + JSON.stringify(this.listQuery));
+      this.$axios
+        .gets(
+          "/api/newjit/product-line-authority/list",
+          this.listQuery
+        )
+        .then((response) => {
+          this.list = response.item;
+          this.totalCount = response.item.length;
+          setTimeout(() => {
+            //大数据量加载时
+            this.listLoading = false;
+          }, 500);
+        })
+        .catch(() => {
+          this.listLoading = false;
+        });
+    },
+    fetchData(id) {
+      //循环动态
+      this.$axios
+        .gets("/api/settleaccount/SettlementPart/" + id)
+        .then((response) => {
+          this.form = response;
+        });
+    },
+    /** 筛选操作 */
+    handleFilter() {
+      this.page = 1;
+      //#region 
+      /*
+      this.listQuery.Filters = [];
+      if (this.partCode != "") {
+        var column = "partCode";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partCode,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partCode")
+        this.listQuery.Filters.push(filter);
+      }
+
+      if (this.partName != "") {
+        var column = "partName";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partName,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partName")
+        this.listQuery.Filters.push(filter);
+      }
+
+      if (this.partType != "") {
+        var column = "partType";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partType,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partType")
+        this.listQuery.Filters.push(filter);
+      }
+
+      if (this.partChildType != "") {
+        var column = "partChildType";
+        let filter = {
+          logic: 0,
+          column: column,
+          action: 0,
+          value: this.partChildType,
+        };
+        this.listQuery.Filters = this.listQuery.Filters.filter(u => u.column !== "partChildType")
+        this.listQuery.Filters.push(filter);
+      }
+      */
+     //#endregion
+      this.getList();
+    },
+    /** 多项筛选操作 */
+    /** 筛选操作 */
+    handleFilters(data) {
+      if (data === null) {
+        this.listQuery.Filters = [];
+        this.getList(); //查询所有
+      } else {
+        console.log(data)
+        this.filterObj = data;
+        console.log("筛选" + JSON.stringify(data));
+        var offsetHei = document.documentElement.clientHeight;
+        var removeHeight = Object.keys(this.filterObj).length > 0 ? 310 : 240;
+        this.tableHeight = offsetHei - removeHeight;
+        this.currentPage = 1;
+        let Filter = [];
+        data.forEach((item) => {
+          let filter = {};
+          if (item.formType === "datetime" || item.formType === "datetime") {
+            //日期类型的过滤条件是 (datetime >= a and  datetime <=b)
+            filter["Column"] = item.fieldName;
+            filter["Logic"] = 0;
+            filter["Value"] = item.value[0];
+            filter["Action"] = item.action;
+            Filter.push(filter);
+
+            if (item.value[1] != null) {
+              filter["Value"] = item.value[1];
+              filter["Action"] = 5;
+              Filter.push(filter);
+            }
+          } else {
+            filter["Column"] = item.fieldName;
+            filter["Value"] = item.value;
+            filter["Logic"] = 0;
+            filter["Action"] = item.action;
+            Filter.push(filter);
+          }
+        });
+        console.log("筛选条件" + JSON.stringify(Filter));
+        this.listQuery.Filters = Filter;
+        this.getList();
+      }
+    },
+    /** 重置按钮操作 */
+    resetQuery(refName) {
+      this.listQuery.userName = "";
+      this.listQuery.name = "";
+      this.listQuery.dep = "";
+      this.listQuery.productLineCode = "";
+      //this.$refs[refName].resetFields();
+      this.handleFilter();
+      this.getProductLine();
+    },
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      console.log(this.listQuery.Sorting);
+      if(this.listQuery.Filters.length>0 && this.listQuery.Filters[0].column === "Enabled")
+      {
+        this.sortState = false;
+      }
+      else
+      {
+        this.sortState = true;
+      }
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    /** 通过回调控制style */
+    cellStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+      this.detaillist = row.productLineList;
+      //console.log(this.detaillist)
+    },
+    /** 通过回调控制style */
+    cellDetailStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right" };
+      } else {
+        return { textAlign: "left" };
+      }
+    },
+    /** 通过回调控制表头style */
+    headerDetailRowStyle({ row, column, rowIndex, columnIndex }) {
+      if (column.property === "qty") {
+        return { textAlign: "right", background: "#FAFAFA" };
+      } else {
+        return { textAlign: "left", background: "#FAFAFA" };
+      }
+    },
+    handleDetailRowClick(row, column, event) {
+      this.$refs.detailTable.clearSelection();
+      this.$refs.detailTable.toggleRowSelection(row);
+    },
+    handleDetailSelectionChange(){},
+    sortDetailChange(){},
+    getProductLine()
+    {
+      this.$axios
+          .gets(
+            "/api/newjit/product-line/list",this.listPLQuery
+          )
+          .then((response) => {
+            console.log(response);
+            this.PLList = response.item;
+            //console.log()
+          })
+          .catch(() => {
+          });
+    },
+
+    //权限配置
+    permissionConfig()
+    {
+      if(this.multipleSelection.length != 1)
+      {
+        this.$message({
+          message: "必须选择单行",
+          type: "warning",
+        });
+        return;
+      }
+      this.UsePLList = [];
+      this.dialogFormVisible = true;
+      this.form.worklines = [];
+      var templist = this.PLList;
+      this.multipleSelection[0].productLineList.forEach(element => {
+        templist = this.templist.filter(u => u.productLineCode !== element.productLineCode);
+        
+      });
+      templist.forEach(element => {
+        this.form.worklines.push(
+            parseInt(element.productLineCode));
+      });
+      //console.log(this.form.worklines)
+      this.PLList.forEach(element => {
+        this.UsePLList.push(
+          {
+            key:parseInt(element.productLineCode),
+            label:element.productLineName,
+            id:"",
+            disabled:false,
+          }
+        );
+      });
+      this.form.userName = this.multipleSelection[0].userName;
+    },
+
+    //窗口确认
+    save()
+    {
+      console.log(this.form.worklines);
+      console.log(this.UsePLList);
+      var templist = this.UsePLList;
+      this.form.worklines.forEach(element => {
+        templist = templist.filter(u => u.key !== element);
+      });
+      console.log(918);
+      console.log(templist);
+
+      this.$axios
+          .gets(
+            "/api/newjit/product-line-authority/do-authority",this.listPLQuery
+          )
+          .then((response) => {
+            console.log(response);
+            this.PLList = response.item;
+            //console.log()
+          })
+          .catch(() => {
+          });
+    },
+  },
+};
+</script>
+
+
+<style lang="scss" scoped>
+@import "../../styles/crmtable.scss";
+</style>
+<style lang="scss">
+.el-table .cell.el-tooltip {
+  white-space: pre-wrap;
+}
+</style>
+
+
diff --git a/vue/src/views/pg-fis/components/CRMCreateView.vue b/vue/src/views/pg-fis/components/CRMCreateView.vue
new file mode 100644
index 00000000..e4acf007
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMCreateView.vue
@@ -0,0 +1,2674 @@
+<template>
+  <create-view
+    :loading="loading"
+    :body-style="{ height: '100%' }"
+    :width="width"
+  >
+    <flexbox direction="column" align="stretch" class="crm-create-container">
+      <flexbox class="crm-create-header">
+        <div style="flex: 1; font-size: 17px; color: #333">{{ title }}</div>
+        <img
+          class="close"
+          src="@/assets/img/task_close.png"
+          @click="hidenView"
+        />
+      </flexbox>
+      <div class="crm-create-flex">
+        <create-sections title="基本信息">
+          <flexbox direction="column" align="stretch">
+            <div class="crm-create-body">
+              <el-form
+                ref="crmForm"
+                :model="crmForm"
+                label-position="top"
+                class="crm-create-box"
+              >
+              <!-- :prop="'crmFields.' + index + '.value'" -->
+                <el-form-item
+                  v-for="(item, index) in crmForm.crmFields"
+                  :key="item.key"
+                  :prop="'crmFields.' + index + '.value'"
+                  :class="{
+                    'crm-create-block-item': item.showblock,
+                    'crm-create-item': !item.showblock,
+                  }"
+                  :rules="crmRules[item.key]"
+                  :style="{
+                    'padding-left': getPaddingLeft(item, index),
+                    'padding-right': getPaddingRight(item, index),
+                  }"
+                >
+                  <div slot="label" style="display: inline-block">
+                    <div
+                      style="
+                        margin: 5px 0;
+                        font-size: 12px;
+                        word-wrap: break-word;
+                        word-break: break-all;
+                      "
+                    >
+                      {{ item.data.name }} 
+                      <span style="color: #999">
+                        {{
+                          item.data.inputTips
+                            ? "（" + item.data.inputTips + "）"
+                            : ""
+                        }}
+                      </span>
+                    </div>
+                  </div>
+                  <component
+                    :is="item.data.formType | typeToComponentName"
+                    :value="item.value"
+                    :index="index"
+                    :item="item"
+                    :relation="item.relation"
+                    :radio="false"
+                    :disabled="item.disabled"
+                    @value-change="fieldValueChange"
+                  />
+                </el-form-item>
+              </el-form>
+            </div>
+          </flexbox>
+        </create-sections>
+      </div>
+<!-- 
+      <DialogTable
+        ref="formDialog"
+        :logMessage="{}"
+        v-if="crmType == 'dicts' && action.type != 'update'"
+      ></DialogTable> -->
+
+      <div class="handle-bar">
+        <el-button class="handle-button" @click.native="hidenView"
+          >取消</el-button
+        >
+        <el-button
+          class="handle-button"
+          type="primary"
+          :disabled="saveDisabled"
+          @click.native="saveField(false)"
+          >保存</el-button
+        >
+      </div>
+    </flexbox>
+  </create-view>
+</template>
+<script type="text/javascript">
+import crmTypeModel from "@/views/ux/model/crmTypeModel";
+import CreateView from "@/components/CreateView";
+import CreateSections from "@/components/CreateSections";
+import DialogTable from "../dict/components/DialogTable";
+import { crmLeadsSave, crmLeadsRead, crmLeadsUpdate } from "@/api/ux/clue";
+import {
+  crmDictsSave,
+  crmDictsRead,
+  crmDictsUpdate,
+  crmDictsItemDetailRead,
+  crmDictsItemIndex,
+  crmDictsItemAdd,
+  crmDictsItemUpdate,
+} from "@/api/dict/dict";
+import {
+  crmTransactionSave,
+  crmTransactionRead,
+  crmTransactionUpdate,
+} from "@/api/transaction/transaction";
+import {
+  crmStrategySave,
+  crmStrategyRead,
+  crmStrategyUpdate,
+} from "@/api/strategy/strategy";
+import { crmRuleSave, crmRuleRead, crmRuleUpdate } from "@/api/rule/rule";
+import {
+  crmStrategyRulesSave,
+  crmStrategyRulesRead,
+  crmStrategyRulesUpdate,
+} from "@/api/strategyRules/strategyRules";
+import {
+  crmVerificationSave,
+  crmVerificationRead,
+  crmVerificationUpdate,
+} from "@/api/verification/verification";
+import { crmStageSave, crmStageRead, crmStageUpdate } from "@/api/stage/stage";
+import {
+  crmCustomerSave,
+  crmCustomerRead,
+  crmCustomerUpdate,
+} from "@/api/customer/customer";
+import {
+  crmSlgItemSave,
+  crmSlgItemRead,
+  crmSlgItemUpdate,
+} from "@/api/slgItem/slgItem";
+//add-fdw-引入bom-保存、读取、更新
+import { crmBomSave, crmBomRead, crmBomUpdate } from "@/api/bom/bom";
+//add-fdw-引主uomgroup-保存、读取、更新
+import {
+  crmUomGroupSave,
+  crmUomGroupRead,
+  crmUomGroupUpdate,
+} from "@/api/uomGroup/uomGroup";
+import { crmUomSave, crmUomRead, crmUomUpdate } from "@/api/uom/uom";
+import {
+  crmInterfaceCalendarSave,
+  crmInterfaceCalendarRead,
+  crmInterfaceCalendarUpdate,
+} from "@/api/interfaceCalendar/interfaceCalendar";
+import {
+  crmVerificationStagesSave,
+  crmVerificationStagesRead,
+  crmVerificationStagesUpdate,
+} from "@/api/verificationStages/verificationStages";
+import { crmAreaSave, crmAreaRead, crmAreaUpdate } from "@/api/area/area"; // 区域
+import {
+  crmAreaItemSave,
+  crmAreaItemRead,
+  crmAreaItemUpdate,
+} from "@/api/areaItem/areaItem"; // 区域-物品
+import {
+  crmCurrencySave,
+  crmCurrencyRead,
+  crmCurrencyUpdate,
+} from "@/api/currency/currency"; // 货币
+import {
+  crmCurrencyExchangeSave,
+  crmCurrencyExchangeRead,
+  crmCurrencyExchangeUpdate,
+} from "@/api/currencyExchange/currencyExchange"; // 货币换算
+import {
+  crmCustomerBomSave,
+  crmCustomerBomRead,
+  crmCustomerBomUpdate,
+} from "@/api/customerBom/customerBom"; // 客户物品产品结构
+import {
+  crmCustomerItemSave,
+  crmCustomerItemRead,
+  crmCustomerItemUpdate,
+} from "@/api/customerItem/customerItem"; // 客户物品
+import {
+  crmEqptTypeSave,
+  crmEqptTypeRead,
+  crmEqptTypeUpdate,
+} from "@/api/eqptType/eqptType"; // 器具类型
+import {
+  crmEqptTypeItemSave,
+  crmEqptTypeItemRead,
+  crmEqptTypeItemUpdate,
+} from "@/api/eqptTypeItem/eqptTypeItem"; // 器具类型-物品
+import { crmItemSave, crmItemRead, crmItemUpdate } from "@/api/item/item"; // 物品
+import {
+  crmItemTransTypeInventoryRouteSave,
+  crmItemTransTypeInventoryRouteRead,
+  crmItemTransTypeInventoryRouteUpdate,
+} from "@/api/itemTransTypeInventoryRoute/itemTransTypeInventoryRoute"; // 物品-事务类型-物流路线分配
+import {
+  crmItemTransTypeOpStrategySave,
+  crmItemTransTypeOpStrategyRead,
+  crmItemTransTypeOpStrategyUpdate,
+} from "@/api/itemTransTypeOpStrategy/itemTransTypeOpStrategy"; // 物品-事务类型-工序-策略分配
+import { crmLocSave, crmLocRead, crmLocUpdate } from "@/api/loc/loc"; // 库位
+import {
+  crmMachineSave,
+  crmMachineRead,
+  crmMachineUpdate,
+} from "@/api/machine/machine"; // 机器
+import { crmParamSave, crmParamRead, crmParamUpdate } from "@/api/param/param"; // 参数
+import { crmPortSave, crmPortRead, crmPortUpdate } from "@/api/port/port"; // 收货口
+import {
+  crmProdLineSave,
+  crmProdLineRead,
+  crmProdLineUpdate,
+} from "@/api/prodLine/prodLine"; // 生产线
+import {
+  crmProdLineItemSave,
+  crmProdLineItemRead,
+  crmProdLineItemUpdate,
+} from "@/api/prodLineItem/prodLineItem"; // 生产线-物品
+import {
+  crmProjectSave,
+  crmProjectRead,
+  crmProjectUpdate,
+} from "@/api/project/project"; // 项目
+import { crmShiftSave, crmShiftRead, crmShiftUpdate } from "@/api/shift/shift"; // 班次
+import { crmSlgSave, crmSlgRead, crmSlgUpdate } from "@/api/slg/slg"; // 库位组
+import {
+  crmSupplierSave,
+  crmSupplierRead,
+  crmSupplierUpdate,
+} from "@/api/supplier/supplier"; // 供应商
+import {
+  crmSupplierItemSave,
+  crmSupplierItemRead,
+  crmSupplierItemUpdate,
+} from "@/api/supplierItem/supplierItem"; // 供应商物品
+import { crmTeamSave, crmTeamRead, crmTeamUpdate } from "@/api/team/team"; // 班组
+import {
+  crmUomConversionSave,
+  crmUomConversionRead,
+  crmUomConversionUpdate,
+} from "@/api/uomConversion/uomConversion"; // 计量单位转换
+import { crmWlgSave, crmWlgRead, crmWlgUpdate } from "@/api/wlg/wlg"; // 工作组
+import {
+  crmWlgItemSave,
+  crmWlgItemRead,
+  crmWlgItemUpdate,
+} from "@/api/wlgItem/wlgItem"; // 工作组-物品
+import {
+  crmWorkCalendarSave,
+  crmWorkCalendarRead,
+  crmWorkCalendarUpdate,
+} from "@/api/workCalendar/workCalendar"; // 工作日历
+import {
+  crmWorkCenterSave,
+  crmWorkCenterRead,
+  crmWorkCenterUpdate,
+} from "@/api/workCenter/workCenter"; // 工作中心
+import {
+  crmInventoryRouteSave,
+  crmInventoryRouteRead,
+  crmInventoryRouteUpdate,
+  crmInventoryRouteDetailRead,
+  crmInventoryRouteDetailIndex,
+  crmInventoryRouteDetailAdd,
+  crmInventoryRouteDetailUpdate,
+} from "@/api/inventoryRoute/inventoryRoute"; //物流路线
+import {
+  crmPurchasePriceSheetSave,
+  crmPurchasePriceSheetRead,
+  crmPurchasePriceSheetUpdate,
+  crmPurchasePriceDetailRead,
+  crmPurchasePriceDetailIndex,
+  crmPurchasePriceDetailAdd,
+  crmPurchasePriceDetailUpdate,
+} from "@/api/purchasePriceSheet/purchasePriceSheet"; //采购价格单
+import {
+  crmRouteSave,
+  crmRouteRead,
+  crmRouteUpdate,
+  crmRouteDetailRead,
+  crmRouteDetailIndex,
+  crmRouteDetailAdd,
+  crmRouteDetailUpdate,
+} from "@/api/route/route"; //工艺路线
+
+import {
+  crmSalePriceSheetSave,
+  crmSalePriceSheetRead,
+  crmSalePriceSheetUpdate,
+  crmSalePriceDetailRead,
+  crmSalePriceDetailIndex,
+  crmSalePriceDetailAdd,
+  crmSalePriceDetailUpdate,
+} from "@/api/salePriceSheet/salePriceSheet"; //销售价格单
+
+import {
+  crmStdCostPriceSheetSave,
+  crmStdCostPriceSheetRead,
+  crmStdCostPriceSheetUpdate,
+  crmStdCostPriceDetailRead,
+  crmStdCostPriceDetailIndex,
+  crmStdCostPriceDetailAdd,
+  crmStdCostPriceDetailUpdate,
+} from "@/api/stdCostPriceSheet/stdCostPriceSheet"; //标准成本价格单
+
+import { crmOrgRead } from "@/api/org/org";
+//import {crmUomRead} from '@/api/uom/uom'
+//新增业务的创建、修改引入的两个json文件
+import data from "../../../../static/createField";
+import dataupdate from "../../../../static/updateField";
+import crmtypes from "../../../../static/crmTypes";
+
+import {
+  regexIsInt,
+  regexIsNumber,
+  regexIsCRMNumber,
+  regexIsCRMNumber2,
+  regexIsCRMNumber4,
+  regexIsCRMMoneyNumber,
+  regexIsCRMMobile,
+  regexIsCRMEmail,
+  regexIsCRMRate,
+  objDeepCopy,
+} from "@/utils";
+
+import { isArray } from "@/utils/types";
+
+import Lockr from "lockr";
+
+import {
+  XhInput,
+  XhTextarea,
+  XhSelect,
+  XhSwitch,
+  XhMultipleSelect,
+  XhDate,
+  XhDateTime,
+  XhUserCell,
+  XhStructureCell,
+  XhFiles,
+  CrmRelativeCell,
+  XhProuctCate,
+  XhProduct,
+  XhBusinessStatus,
+  XhCustomerAddress,
+  XhReceivablesPlan, // 回款计划期数
+} from "@/components/CreateCom";
+
+export default {
+  name: "CrmCreateView", // 所有新建效果的view
+  components: {
+    CreateView,
+    CreateSections,
+    XhInput,
+    XhTextarea,
+    XhSelect,
+    XhSwitch,
+    XhMultipleSelect,
+    XhDate,
+    XhDateTime,
+    XhUserCell,
+    XhStructureCell,
+    XhFiles,
+    CrmRelativeCell,
+    XhProuctCate,
+    XhProduct,
+    XhBusinessStatus,
+    XhCustomerAddress,
+    XhReceivablesPlan,
+    DialogTable, //子表表格组件
+  },
+  filters: {
+    /** 根据type 找到组件 */
+    typeToComponentName(formType) {
+      // if (
+      //   formType == "text" ||
+      //   formType == "number" ||
+      //   formType == "floatnumber" ||
+      //   formType == "mobile" ||
+      //   formType == "email"
+      // ) 
+      
+      if(formType == "text" || 
+         formType== "int" || 
+         formType == "number" ||
+         formType == "number2" || 
+         formType == "number4" ||  
+         formType == "moneynumber" || 
+         formType == "mobile" ||  
+         formType == "email" ||
+         formType == "rate" )
+      {
+        return "XhInput";
+      } else if (formType == "textarea") {
+        return "XhTextarea";
+      } else if (formType == "select" || formType == "business_status") {
+        return "XhSelect";
+      } else if (formType == "switch") {
+        return "XhSwitch";
+      } else if (formType == "checkbox") {
+        return "XhMultipleSelect";
+      } else if (formType == "date") {
+        return "XhDate";
+      } else if (formType == "datetime") {
+        return "XhDateTime";
+      } else if (formType == "user") {
+        return "XhUserCell";
+      } else if (formType == "structure") {
+        return "XhStructureCell";
+      } else if (formType == "file") {
+        return "XhFiles";
+      } else if (
+        //add-fdw-自定义弹出框
+        formType == "contacts" ||
+        formType == "customer" ||
+        formType == "contract" ||
+        formType == "business" ||
+        formType == "strategy" ||
+        formType == "rule" ||
+        formType == "route" ||
+        formType == "org" ||
+        formType == "slg" ||
+        formType == "item" ||
+        formType == "bom" ||
+        formType == "uom" ||
+        formType == "uomGroup" ||
+        formType == "verification" ||
+        formType == "stage" ||
+        formType == "area" ||
+        formType == "areaItem" ||
+        formType == "currency" ||
+        formType == "currencyExchange" ||
+        formType == "customerBom" ||
+        formType == "customerItem" ||
+        formType == "eqptType" ||
+        formType == "eqptTypeItem" ||
+        formType == "itemTransTypeInventoryRoute" ||
+        formType == "itemTransTypeOpStrategy" ||
+        formType == "loc" ||
+        formType == "machine" ||
+        formType == "param" ||
+        formType == "port" ||
+        formType == "prodLine" ||
+        formType == "prodLineItem" ||
+        formType == "project" ||
+        formType == "shift" ||
+        formType == "slg" ||
+        formType == "supplier" ||
+        formType == "supplierItem" ||
+        formType == "team" ||
+        formType == "uomConversion" ||
+        formType == "wlg" ||
+        formType == "wlgItem" ||
+        formType == "workCalendar" ||
+        formType == "workCenter" ||
+        formType == "inventoryRoute" ||
+        formType == "purchaseUomConversion" ||
+        formType == "stockUomConversion" ||
+        formType == "productionUomConversion" ||
+        formType == "sellUomConversion" ||
+        formType == "allocation"
+      ) {
+        return "CrmRelativeCell";
+      } else if (formType == "category") {
+        // 产品类别
+        return "XhProuctCate";
+      } else if (formType == "business_type") {
+        // 商机类别
+        return "XhBusinessStatus";
+      } else if (formType == "product") {
+        return "XhProduct";
+      } else if (formType == "map_address") {
+        return "XhCustomerAddress";
+      } else if (formType == "receivables_plan") {
+        return "XhReceivablesPlan";
+      }
+    },
+  },
+  props: {
+    // CRM类型
+    crmType: {
+      type: String,
+      default: "",
+    },
+    action: {
+      type: Object,//updata:更新 create:新建 detail:详细信息
+      default: () => {
+        return {
+          type: "save",
+          id: "",
+          subid: "",
+          data: {}, // 编辑所需信息
+        };
+      },
+    },
+    width: {
+      type: String,
+      default: "700px",
+    },
+    formTitle:''
+  },
+  data() {
+    return {
+      // 标题展示名称
+      title: "",
+      loading: false,
+      saveAndCreate: false, // 保存并新建
+      // 自定义字段验证规则
+      crmRules: {},
+      // 自定义字段信息表单
+      crmForm: {
+        crmFields: [],
+      },
+      // 审批信息
+      examineInfo: {},
+      formLabelWidth: "80px",
+      limitNum: 1,
+      dialogImageUrl: "",
+      //表单信息
+      crmData: {},
+      //子表信息
+      subtableData: [],
+      crmTypes:{},
+      saveDisabled:false
+    };
+  },
+  computed: {
+    
+  },
+  watch: {
+    crmType: function (value) {
+      this.title = this.getTitle();
+      this.crmRules = {};
+      this.crmForm = {
+        crmFields: [],
+      };
+      this.examineInfo = {};
+      this.getField();
+    },
+  },
+  mounted() {
+    // 获取title展示名称
+    document.body.appendChild(this.$el);
+    this.crmTypes=crmtypes;
+    if(this.action.type == "detail")
+    {
+      this.saveDisabled=true;
+    }
+    else {
+      this.saveDisabled=false;
+    }
+    this.title = this.getTitle();
+    this.getField();
+
+    // 注册子表组件传来的数据方法
+    this.$bus.$on("updateData", (content) => {
+      this.subtableData = content;
+      console.log(JSON.stringify(this.subtableData));
+    });
+  },
+  destroyed() {
+    // remove DOM node after destroy
+    if (this.$el && this.$el.parentNode) {
+      this.$el.parentNode.removeChild(this.$el);
+    }
+    this.crmData = {};
+    // this.bus.$off('updateData',(content)=>{
+    // });
+  },
+  methods: {
+    // 审批信息值更新
+    examineValueChange(data) {
+      this.examineInfo = data;
+    },
+    // 字段的值更新
+    fieldValueChange(data) {
+      var item = this.crmForm.crmFields[data.index];
+      item.value = data.value;
+
+      // 无事件的处理 后期可换成input实现
+      if (
+        item.data.formType == "user" ||
+        item.data.formType == "structure" ||
+        item.data.formType == "file" ||
+        item.data.formType == "category" ||
+        item.data.formType == "customer" ||
+        item.data.formType == "business" ||
+        item.data.formType == "contract" ||
+        item.data.formType == "strategy" ||
+        item.data.formType == "rule" ||
+        item.data.formType == "org" ||
+        item.data.formType == "slg" ||
+        item.data.formType == "item" ||
+        item.data.formType == "bom" ||
+        item.data.formType == "uom" ||
+        item.data.formType == "uomGroup" ||
+        item.data.formType == "verification" ||
+        item.data.formType == "stage" ||
+        item.data.formType == "area" ||
+        item.data.formType == "areaItem" ||
+        item.data.formType == "currency" ||
+        item.data.formType == "currencyExchange" ||
+        item.data.formType == "customerBom" ||
+        item.data.formType == "customerItem" ||
+        item.data.formType == "eqptType" ||
+        item.data.formType == "eqptTypeItem" ||
+        item.data.formType == "itemTransTypeInventoryRoute" ||
+        item.data.formType == "itemTransTypeOpStrategy" ||
+        item.data.formType == "loc" ||
+        item.data.formType == "machine" ||
+        item.data.formType == "param" ||
+        item.data.formType == "port" ||
+        item.data.formType == "prodLine" ||
+        item.data.formType == "prodLineItem" ||
+        item.data.formType == "project" ||
+        item.data.formType == "shift" ||
+        item.data.formType == "slg" ||
+        item.data.formType == "supplier" ||
+        item.data.formType == "supplierItem" ||
+        item.data.formType == "team" ||
+        item.data.formType == "uomConversion" ||
+        item.data.formType == "wlg" ||
+        item.data.formType == "wlgItem" ||
+        item.data.formType == "workCalendar" ||
+        item.data.formType == "workCenter"|| 
+        item.data.formType == "route"
+      ) {
+        this.$refs.crmForm.validateField("crmFields." + data.index + ".value");
+      }
+    },
+
+    getField() {
+      this.loading = true;
+       // 进行编辑操作
+      if (this.action.type == "update" || this.action.type == "detail") {
+        this.getUpdateField();
+      } else {
+        console.log("----- 添加 -----");
+        const filedList = data[this.crmType].data;
+        this.getcrmRulesAndModel(filedList);
+      }
+      this.loading = false;
+    },
+
+    getUpdateField() {
+      this.loading = true;
+      const filedListEdit = dataupdate[this.crmType].data;
+      // 获取自定义字段的更新时间
+      var params = {
+        label: crmTypeModel[this.crmType],
+      };
+
+      params.id = this.action.id;
+      params.subid = this.action.subid; //子表Id
+
+      //1.查询要编辑表的详细信息
+      let crmRequest = this.getReadRequest();
+      crmRequest(params.id, params.subid)
+        .then((res) => {
+          this.crmData = res;
+          console.log(JSON.stringify(res));
+          //2.遍历UpdateJson中的属性
+          filedListEdit.map((item) => {
+            //3.遍历从接口获取的返回值‘res’的属性
+            Object.keys(res).forEach((key) => {
+              if (key == item.fieldName) {
+                //3.1如果字段的值来自关联表
+                if (key.endsWith("ID") && item.formType != "text") {
+                  //3.1.1获取关联表的请求
+                  let relationReadRequest = this.getReadRequest(item.formType);
+                  if (
+                    relationReadRequest == undefined ||
+                    relationReadRequest == ""
+                  ) {
+                    console.log(
+                      "------ update没有找到 " +
+                        item.formType +
+                        " 的 crmXXXXRead -----"
+                    );
+                  } else {
+                    relationReadRequest(res[key]).then((resRelation) => {
+                      let _json = {};
+                      _json["Id"] = res[key];
+                      _json[key] = res[key];
+
+                      if (key === "OrgID") {
+                        _json["branchName"] = resRelation.name;
+                      }
+                      else
+                      { 
+                        _json["Code"] = resRelation.Code;
+                        _json["Name"] = resRelation.Name;
+                      }
+                  
+                      var _array = [_json];
+                      item.value = _array;
+                    }) .catch((error) => {
+                      this.loading = false;
+                    });;
+                  }
+                }
+                //3.2 直接
+                else {
+                  item.value = res[key];
+                }
+              }
+              this.loading = false;
+            });
+          });
+          //4.根据filedListEdit渲染界面
+          setTimeout((item) => {
+            this.getcrmRulesAndModel(filedListEdit);
+          }, 500);
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+
+    // 根据自定义字段获取自定义字段规则及Model
+    getcrmRulesAndModel(list) {
+      console.log("----- 根据自定义字段获取自定义字段规则 -----");
+      let showStyleIndex = -1;
+      for (let index = 0; index < list.length; index++) {
+        const item = list[index];
+        showStyleIndex += 1;
+
+        //规则
+        this.crmRules[item.fieldName] = this.getItemRulesArrayFromItem(item);
+        // let otherRules=this.getOtherRulesArrayFromItem(item,this.crmForm.crmFields);
+        var params = {};
+        if (this.action.type == "update") //编辑
+        {
+          params["value"] = item.value; //  
+          params["disabled"]=item.disabled ||false; //控件是否可用
+        } else if(this.action.type == "detail") //详细信息
+        {
+          params["value"] = item.value;
+          params["disabled"]=true; //控件不可用
+        }
+        else //新增
+         {
+          //赋初始值
+          if (item.formType === "text") {
+            params["value"] = item.defaultValue || "";
+           } else if(item.formType === "int" || 
+            item.formType === "number"  || 
+            item.formType === "number2" || 
+            item.formType === "number4" || 
+            item.formType === "moneynumber" || 
+            item.formType === "rate")
+          {
+            //params["value"] =item.isNull===1? 0:null; 
+            params["value"] =0; 
+          } else if (item.formType === "switch") {
+            params["value"] = true;
+          } else if (item.formType === "datetime") {
+            //params["value"] =item.isNull===1? this.getNowDate():null; 
+            params["value"] =this.getNowDate()
+          }else {
+            params["value"] = item.defaultValue;
+          }
+          params["disabled"]=false; //新增控件可用
+        }
+        params["key"] = item.fieldName;
+        params["data"] = item;
+        params["styleIndex"] = showStyleIndex;
+        this.crmForm.crmFields.push(params);
+      }
+    },
+
+    // 保存数据
+    saveField(saveAndCreate, isDraft = false) {
+      console.log("-------- 保存 --------");
+      this.saveAndCreate = saveAndCreate;
+      this.$refs.crmForm.validate((valid) => {
+        if (valid) {
+          //其他校验
+          var otherValid=this.getCrmFormOtherValidate()
+          if(otherValid)
+          {
+            var params = this.getSubmiteParams(this.crmForm.crmFields);
+            //获取其他参数
+            this.getOtherParams(params);
+           
+            console.log("params" + JSON.stringify(params));
+            this.submiteParams(params);
+          }
+        } else {
+          this.$message.error('表单校验未通过,请查看表单信息');
+          return false;
+        }
+      });
+    }, 
+    //获取其他校验规则
+    getCrmFormOtherValidate()
+    {
+      if(this.crmType==='strategyRules' ||
+         this.crmType==='uom' ||
+         this.crmType==='uomConversion'  
+      )
+      {
+        var EffectiveTimeValue= this.crmForm.crmFields.find(item=>{return item.key==='EffectiveTime'}).value;
+        var ExpireTimeValue= this.crmForm.crmFields.find(item=>{return item.key==='ExpireTime'}).value;
+
+         if(EffectiveTimeValue >= ExpireTimeValue){
+            this.$message.error('生效时间不能大于等于失效时间');
+            return false;
+         } 
+      }
+      else if( 
+              this.crmType==='project' ||
+              this.crmType==='workCalendar' ||
+              this.crmType==='shift' ||
+              this.crmType==='interfaceCalendar' ||
+              this.crmType==='purchasePriceDetail' ||
+              this.crmType == "salePriceDetail" ||
+              this.crmType == "stdCostPriceDetail"   )
+      {
+        var BeginTimeValue= this.crmForm.crmFields.find(item=>{return item.key==='BeginTime'}).value;
+        var EndTimeValue= this.crmForm.crmFields.find(item=>{return item.key==='EndTime'}).value;
+
+         if(BeginTimeValue >= EndTimeValue){
+            this.$message.error('开始时间不能大于等于结束时间');
+            return false;
+         } 
+      }
+      else if(this.crmType==='customerBom' ||  this.crmType==='bom' )
+      {
+         var ParentItemCodeValue= this.crmForm.crmFields.find(item=>{return item.key==='ParentItemID'}).value;
+         var ChildItemCodeValue= this.crmForm.crmFields.find(item=>{return item.key==='ChildItemID'}).value;
+           if(ParentItemCodeValue!=null && ChildItemCodeValue!=null &&   ParentItemCodeValue[0].Id === ChildItemCodeValue[0].Id){
+            this.$message.error('主物品不能等于子物品');
+            return false;
+         } 
+
+        var failureTime='FailureTime';
+        if(this.crmType==='bom' )
+        {
+          failureTime='ExpireTime'
+        }
+         var EffectiveTimeValue= this.crmForm.crmFields.find(item=>{return item.key==='EffectiveTime'}).value;
+         var FailureTimeValue= this.crmForm.crmFields.find(item=>{return item.key===failureTime}).value;
+
+         if(EffectiveTimeValue >= FailureTimeValue){
+            this.$message.error('生效时间不能大于等于失效时间');
+            return false;
+         } 
+
+      }
+      return true;    
+    },
+
+    /* 提交 */
+    submiteParams(params) {
+      this.loading = true;
+      if (this.action.type == "update") {
+        this.submiteUpdateRequest(params);
+      }
+      //新增
+      else {
+        this.submiteAddRequest(params);
+      }
+    },
+
+    submiteAddRequest(params) {
+      let crmRequest = this.getSubmiteRequest();
+      console.log("ID:" +this.action.id);
+      //子主表保存的参数类型是数组
+      if (
+        this.crmType == "dictssub" ||
+        this.crmType == "stdCostPriceDetail" ||
+        this.crmType == "inventoryRouteDetail" ||
+        this.crmType == "purchasePriceDetail" ||
+        this.crmType == "routeDetail" ||
+        this.crmType == "salePriceDetail"
+      ) {
+        let newParams = [];
+        newParams.push(params);
+        crmRequest(this.action.id, newParams)
+          .then((res) => {
+            this.submiteParamsCallBack(res);
+          })
+          .catch((error) => {
+            this.loading = false;
+            // this.$message.error(error.message); 系统已经默认弹出提示
+            console.log(error.details);
+          });
+      } //其他表保存的参数类型是单独Dto
+      else {
+        crmRequest(params)
+          .then((res) => {
+            this.submiteParamsCallBack(res);
+          })
+          .catch((err) => {
+            //唯一索引重复
+            if(err.message==='An error occurred while updating the entries. See the inner exception for details.')
+            {
+              //SqlException 返回的异常消息 ,包括唯一索引重复
+              if(err.details.indexOf('SqlException: '))
+              {
+                let beginindex= err.details.indexOf('SqlException: ')
+                let endindex= err.details.indexOf('语句已终止。')
+                //语句已终止。
+                let message=  err.details.substring(beginindex, endindex);
+                this.$message.error(message);
+              }
+              
+            }
+            else
+            {
+              //this.$message.error(err.message); 系统已经默认弹出提示
+            }
+            console.log(err.details);
+            this.loading = false;
+          });
+      }
+    },
+
+    submiteUpdateRequest(params) {
+      console.log("ID:" +this.action.id);
+      console.log("ID:" +params);
+
+      let crmRequest = this.getSubmiteUpdateRequest();
+      if (
+        this.crmType == "dictssub" ||
+        this.crmType == "stdCostPriceDetail" ||
+        this.crmType == "inventoryRouteDetail" ||
+        this.crmType == "purchasePriceDetail" ||
+        this.crmType == "routeDetail" ||
+        this.crmType == "salePriceDetail"
+      ) {
+        let newParams = [];
+        newParams.push(params);
+        console.log("parentID:" +this.action.id);
+        crmRequest(this.action.id, newParams)
+          .then((res) => {
+            this.submiteParamsCallBack(res);
+          })
+          .catch(() => {
+            this.loading = false;
+          });
+      } else {
+        crmRequest(this.action.id, params)
+          .then((res) => {
+            this.submiteParamsCallBack(res);
+          })
+          .catch(() => {
+            this.loading = false;
+          });
+      }
+    },
+
+    submiteParamsCallBack(res) {
+      this.loading = false;
+      this.hidenView();
+      this.$message.success(
+        this.action.type == "update" ? "编辑成功" : "添加成功"
+      );
+      // 回到保存成功
+      this.$emit("save-success", {
+        type: this.crmType,
+        data: res.data || {},
+        saveAndCreate: this.saveAndCreate,
+      });
+    },
+
+    /**获取详情url**/
+    getReadRequest(crmTypes = this.crmType) {
+      console.log(
+        "----- 方法 : 获取详情url getReadRequest(crmTypes = " + crmTypes + ")"
+      );
+      if (crmTypes == "leads") {
+        return crmLeadsRead;
+      } else if (crmTypes == "dicts") {
+        return crmDictsRead;
+      } else if (crmTypes == "dictssub") {
+        return crmDictsItemDetailRead;
+      } else if (crmTypes == "transaction") {
+        return crmTransactionRead;
+      } else if (crmTypes == "strategy") {
+        return crmStrategyRead;
+      } else if (crmTypes == "rule") {
+        return crmRuleRead;
+      } else if (crmTypes == "strategyRules") {
+        return crmStrategyRulesRead;
+      } else if (crmTypes == "verification") {
+        return crmVerificationRead;
+      } else if (crmTypes == "stage") {
+        return crmStageRead;
+      } else if (crmTypes == "customer") {
+        return crmCustomerRead;
+      } else if (crmTypes == "slgItem") {
+        return crmSlgItemRead;
+      } else if (crmTypes == "bom") {
+        return crmBomRead;
+      } else if (crmTypes == "uomGroup") {
+        //add-fdw
+        return crmUomGroupRead;
+      } else if (crmTypes == "uom") {
+        //add-fdw
+        return crmUomRead;
+      } else if (crmTypes == "interfaceCalendar") {
+        return crmInterfaceCalendarRead;
+      } else if (crmTypes == "verificationStages") {
+        return crmVerificationStagesRead;
+      } else if (crmTypes == "area") {
+        // 区域
+        return crmAreaRead;
+      } else if (crmTypes == "areaItem") {
+        // 区域-物品
+        return crmAreaItemRead;
+      } else if (crmTypes == "currency") {
+        // 货币
+        return crmCurrencyRead;
+      } else if (crmTypes == "currencyExchange") {
+        // 货币换算
+        return crmCurrencyExchangeRead;
+      } else if (crmTypes == "customerBom") {
+        // 客户物品产品结构
+        return crmCustomerBomRead;
+      } else if (crmTypes == "customerItem") {
+        // 客户物品
+        return crmCustomerItemRead;
+      } else if (crmTypes == "eqptType") {
+        // 器具类型
+        return crmEqptTypeRead;
+      } else if (crmTypes == "eqptTypeItem") {
+        // 器具类型-物品
+        return crmEqptTypeItemRead;
+      } else if (crmTypes == "item") {
+        // 物品
+        return crmItemRead;
+      } else if (crmTypes == "itemTransTypeInventoryRoute") {
+        // 物品-事务类型-物流路线分配
+        return crmItemTransTypeInventoryRouteRead;
+      } else if (crmTypes == "itemTransTypeOpStrategy") {
+        // 物品-事务类型-工序-策略分配
+        return crmItemTransTypeOpStrategyRead;
+      } else if (crmTypes == "loc") {
+        // 库位
+        return crmLocRead;
+      } else if (crmTypes == "machine") {
+        // 机器
+        return crmMachineRead;
+      } else if (crmTypes == "param") {
+        // 参数
+        return crmParamRead;
+      } else if (crmTypes == "port") {
+        // 收货口
+        return crmPortRead;
+      } else if (crmTypes == "prodLine") {
+        // 生产线
+        return crmProdLineRead;
+      } else if (crmTypes == "prodLineItem") {
+        // 生产线-物品
+        return crmProdLineItemRead;
+      } else if (crmTypes == "project") {
+        // 项目
+        return crmProjectRead;
+      } else if (crmTypes == "shift") {
+        // 班次
+        return crmShiftRead;
+      } else if (crmTypes == "slg") {
+        // 库位组
+        return crmSlgRead;
+      } else if (crmTypes == "supplier") {
+        // 供应商
+        return crmSupplierRead;
+      } else if (crmTypes == "supplierItem") {
+        // 供应商物品
+        return crmSupplierItemRead;
+      } else if (crmTypes == "team") {
+        // 班组
+        return crmTeamRead;
+      } else if (crmTypes == "uomConversion") {
+        // 计量单位转换
+        return crmUomConversionRead;
+      } else if (crmTypes == "wlg") {
+        // 工作组
+        return crmWlgRead;
+      } else if (crmTypes == "wlgItem") {
+        // 工作组-物品
+        return crmWlgItemRead;
+      } else if (crmTypes == "workCalendar") {
+        // 工作日历
+        return crmWorkCalendarRead;
+      } else if (crmTypes == "workCenter") {
+        // 工作中心
+        return crmWorkCenterRead;
+      } else if (crmTypes == "inventoryRoute") {
+        // 物流路线
+        return crmInventoryRouteRead;
+      } else if (crmTypes == "inventoryRouteDetail") {
+        // 物流路线明细
+        return crmInventoryRouteDetailRead;
+      } else if (crmTypes == "purchasePriceDetail") {
+        // 采购价格单明细
+        return crmPurchasePriceDetailRead;
+      } else if (crmTypes == "purchasePriceSheet") {
+        // 采购价格单
+        return crmPurchasePriceSheetRead;
+      } else if (crmTypes == "route") {
+        // 工艺路线
+        return crmRouteRead;
+      } else if (crmTypes == "routeDetail") {
+        // 工艺路线明细
+        return crmRouteDetailRead;
+      } else if (crmTypes == "salePriceDetail") {
+        // 销售价格单明细
+        return crmSalePriceDetailRead;
+      } else if (crmTypes == "salePriceSheet") {
+        // 销售价格单
+        return crmSalePriceSheetRead;
+      } else if (crmTypes == "stdCostPriceDetail") {
+        // 标准成本价格明细
+        return crmStdCostPriceDetailRead;
+      } else if (crmTypes == "stdCostPriceSheet") {
+        // 标准成本价格单
+        return crmStdCostPriceSheetRead;
+      } else if (
+        crmTypes == "purchaseUomConversion" ||
+        crmTypes == "stockUomConversion" ||
+        crmTypes == "productionUomConversion" ||
+        crmTypes == "sellUomConversion"
+      ) {
+        // 采购计量单位转换等
+        return crmUomConversionRead;
+      }
+    },
+    /** 获取上传url */
+    getSubmiteUpdateRequest() {
+      if (this.crmType == "leads") {
+        return crmLeadsUpdate;
+      } else if (this.crmType == "dicts") {
+        return crmDictsUpdate;
+      } else if (this.crmType == "dictssub") {
+        return crmDictsItemUpdate;
+      } else if (this.crmType == "transaction") {
+        return crmTransactionUpdate;
+      } else if (this.crmType == "strategy") {
+        return crmStrategyUpdate;
+      } else if (this.crmType == "rule") {
+        return crmRuleUpdate;
+      } else if (this.crmType == "strategyRules") {
+        return crmStrategyRulesUpdate;
+      } else if (this.crmType == "verification") {
+        return crmVerificationUpdate;
+      } else if (this.crmType == "stage") {
+        return crmStageUpdate;
+      } else if (this.crmType == "customer") {
+        return crmCustomerUpdate;
+      } else if (this.crmType == "slgItem") {
+        return crmSlgItemUpdate;
+      } else if (this.crmType == "bom") {
+        return crmBomUpdate;
+      } else if (this.crmType == "uomGroup") {
+        //add-fdw
+        return crmUomGroupUpdate;
+      } else if (this.crmType == "uom") {
+        //add-fdw
+        return crmUomUpdate;
+      } else if (this.crmType == "interfaceCalendar") {
+        return crmInterfaceCalendarUpdate;
+      } else if (this.crmType == "verificationStages") {
+        return crmVerificationStagesUpdate;
+      } else if (this.crmType == "area") {
+        // 区域
+        return crmAreaUpdate;
+      } else if (this.crmType == "areaItem") {
+        // 区域-物品
+        return crmAreaItemUpdate;
+      } else if (this.crmType == "currency") {
+        // 货币
+        return crmCurrencyUpdate;
+      } else if (this.crmType == "currencyExchange") {
+        // 货币换算
+        return crmCurrencyExchangeUpdate;
+      } else if (this.crmType == "customerBom") {
+        // 客户物品产品结构
+        return crmCustomerBomUpdate;
+      } else if (this.crmType == "customerItem") {
+        // 客户物品
+        return crmCustomerItemUpdate;
+      } else if (this.crmType == "eqptType") {
+        // 器具类型
+        return crmEqptTypeUpdate;
+      } else if (this.crmType == "eqptTypeItem") {
+        // 器具类型-物品
+        return crmEqptTypeItemUpdate;
+      } else if (this.crmType == "item") {
+        // 物品
+        return crmItemUpdate;
+      } else if (this.crmType == "itemTransTypeInventoryRoute") {
+        // 物品-事务类型-物流路线分配
+        return crmItemTransTypeInventoryRouteUpdate;
+      } else if (this.crmType == "itemTransTypeOpStrategy") {
+        // 物品-事务类型-工序-策略分配
+        return crmItemTransTypeOpStrategyUpdate;
+      } else if (this.crmType == "loc") {
+        // 库位
+        return crmLocUpdate;
+      } else if (this.crmType == "machine") {
+        // 机器
+        return crmMachineUpdate;
+      } else if (this.crmType == "param") {
+        // 参数
+        return crmParamUpdate;
+      } else if (this.crmType == "port") {
+        // 收货口
+        return crmPortUpdate;
+      } else if (this.crmType == "prodLine") {
+        // 生产线
+        return crmProdLineUpdate;
+      } else if (this.crmType == "prodLineItem") {
+        // 生产线-物品
+        return crmProdLineItemUpdate;
+      } else if (this.crmType == "project") {
+        // 项目
+        return crmProjectUpdate;
+      } else if (this.crmType == "shift") {
+        // 班次
+        return crmShiftUpdate;
+      } else if (this.crmType == "slg") {
+        // 库位组
+        return crmSlgUpdate;
+      } else if (this.crmType == "supplier") {
+        // 供应商
+        return crmSupplierUpdate;
+      } else if (this.crmType == "supplierItem") {
+        // 供应商物品
+        return crmSupplierItemUpdate;
+      } else if (this.crmType == "team") {
+        // 班组
+        return crmTeamUpdate;
+      } else if (this.crmType == "uomConversion") {
+        // 计量单位转换
+        return crmUomConversionUpdate;
+      } else if (this.crmType == "wlg") {
+        // 工作组
+        return crmWlgUpdate;
+      } else if (this.crmType == "wlgItem") {
+        // 工作组-物品
+        return crmWlgItemUpdate;
+      } else if (this.crmType == "workCalendar") {
+        // 工作日历
+        return crmWorkCalendarUpdate;
+      } else if (this.crmType == "workCenter") {
+        // 工作中心
+        return crmWorkCenterUpdate;
+      } else if (this.crmType == "inventoryRoute") {
+        // 物流路线
+        return crmInventoryRouteUpdate;
+      } else if (this.crmType == "inventoryRouteDetail") {
+        // 物流路线明细
+        return crmInventoryRouteDetailUpdate;
+      } else if (this.crmType == "purchasePriceDetail") {
+        // 采购价格单明细
+        return crmPurchasePriceDetailUpdate;
+      } else if (this.crmType == "purchasePriceSheet") {
+        // 采购价格单
+        return crmPurchasePriceSheetUpdate;
+      } else if (this.crmType == "route") {
+        // 工艺路线
+        return crmRouteUpdate;
+      } else if (this.crmType == "routeDetail") {
+        // 工艺路线明细
+        return crmRouteDetailUpdate;
+      } else if (this.crmType == "salePriceDetail") {
+        // 销售价格单明细
+        return crmSalePriceDetailUpdate;
+      } else if (this.crmType == "salePriceSheet") {
+        // 销售价格单
+        return crmSalePriceSheetUpdate;
+      } else if (this.crmType == "stdCostPriceDetail") {
+        // 标准成本价格明细
+        return crmStdCostPriceDetailUpdate;
+      } else if (this.crmType == "stdCostPriceSheet") {
+        // 标准成本价格单
+        return crmStdCostPriceSheetUpdate;
+      }
+    },
+    /** 获取创建方法 */
+    getSubmiteRequest() {
+      if (this.crmType == "leads") {
+        return crmLeadsSave;
+      } else if (this.crmType == "dicts") {
+        return crmDictsSave;
+      } else if (this.crmType == "dictssub") {
+        return crmDictsItemAdd;
+      } else if (this.crmType == "transaction") {
+        return crmTransactionSave;
+      } else if (this.crmType == "strategy") {
+        return crmStrategySave;
+      } else if (this.crmType == "rule") {
+        return crmRuleSave;
+      } else if (this.crmType == "strategyRules") {
+        return crmStrategyRulesSave;
+      } else if (this.crmType == "verification") {
+        return crmVerificationSave;
+      } else if (this.crmType == "stage") {
+        return crmStageSave;
+      } else if (this.crmType == "customer") {
+        return crmCustomerSave;
+      } else if (this.crmType == "slgItem") {
+        return crmSlgItemSave;
+      } else if (this.crmType == "bom") {
+        //add-引入bom
+        return crmBomSave;
+      } else if (this.crmType == "uomGroup") {
+        //add-引入uomgroup
+        return crmUomGroupSave;
+      } else if (this.crmType == "uom") {
+        //add-引入uomgroup
+        return crmUomSave;
+      } else if (this.crmType == "interfaceCalendar") {
+        return crmInterfaceCalendarSave;
+      } else if (this.crmType == "verificationStages") {
+        return crmVerificationStagesSave;
+      } else if (this.crmType == "area") {
+        // 区域
+        return crmAreaSave;
+      } else if (this.crmType == "areaItem") {
+        // 区域-物品
+        return crmAreaItemSave;
+      } else if (this.crmType == "currency") {
+        // 货币
+        return crmCurrencySave;
+      } else if (this.crmType == "currencyExchange") {
+        // 货币换算
+        return crmCurrencyExchangeSave;
+      } else if (this.crmType == "customerBom") {
+        // 客户物品产品结构
+        return crmCustomerBomSave;
+      } else if (this.crmType == "customerItem") {
+        // 客户物品
+        return crmCustomerItemSave;
+      } else if (this.crmType == "eqptType") {
+        // 器具类型
+        return crmEqptTypeSave;
+      } else if (this.crmType == "eqptTypeItem") {
+        // 器具类型-物品
+        return crmEqptTypeItemSave;
+      } else if (this.crmType == "item") {
+        // 物品
+        return crmItemSave;
+      } else if (this.crmType == "itemTransTypeInventoryRoute") {
+        // 物品-事务类型-物流路线分配
+        return crmItemTransTypeInventoryRouteSave;
+      } else if (this.crmType == "itemTransTypeOpStrategy") {
+        // 物品-事务类型-工序-策略分配
+        return crmItemTransTypeOpStrategySave;
+      } else if (this.crmType == "loc") {
+        // 库位
+        return crmLocSave;
+      } else if (this.crmType == "machine") {
+        // 机器
+        return crmMachineSave;
+      } else if (this.crmType == "param") {
+        // 参数
+        return crmParamSave;
+      } else if (this.crmType == "port") {
+        // 收货口
+        return crmPortSave;
+      } else if (this.crmType == "prodLine") {
+        // 生产线
+        return crmProdLineSave;
+      } else if (this.crmType == "prodLineItem") {
+        // 生产线-物品
+        return crmProdLineItemSave;
+      } else if (this.crmType == "project") {
+        // 项目
+        return crmProjectSave;
+      } else if (this.crmType == "shift") {
+        // 班次
+        return crmShiftSave;
+      } else if (this.crmType == "slg") {
+        // 库位组
+        return crmSlgSave;
+      } else if (this.crmType == "supplier") {
+        // 供应商
+        return crmSupplierSave;
+      } else if (this.crmType == "supplierItem") {
+        // 供应商物品
+        return crmSupplierItemSave;
+      } else if (this.crmType == "team") {
+        // 班组
+        return crmTeamSave;
+      } else if (this.crmType == "uomConversion") {
+        // 计量单位转换
+        return crmUomConversionSave;
+      } else if (this.crmType == "wlg") {
+        // 工作组
+        return crmWlgSave;
+      } else if (this.crmType == "wlgItem") {
+        // 工作组-物品
+        return crmWlgItemSave;
+      } else if (this.crmType == "workCalendar") {
+        // 工作日历
+        return crmWorkCalendarSave;
+      } else if (this.crmType == "workCenter") {
+        // 工作中心
+        return crmWorkCenterSave;
+      } else if (this.crmType == "inventoryRoute") {
+        // 物流路线
+        return crmInventoryRouteSave;
+      } else if (this.crmType == "inventoryRouteDetail") {
+        // 物流路线明细
+        return crmInventoryRouteDetailAdd;
+      } else if (this.crmType == "purchasePriceSheet") {
+        // 采购价格单
+        return crmPurchasePriceSheetSave;
+      } else if (this.crmType == "purchasePriceDetail") {
+        // 采购价格单明细
+        return crmPurchasePriceDetailAdd;
+      } else if (this.crmType == "route") {
+        // 工艺路线
+        return crmRouteSave;
+      } else if (this.crmType == "routeDetail") {
+        // 工艺路线明细
+        return crmRouteDetailAdd;
+      } else if (this.crmType == "salePriceSheet") {
+        // 销售价格单
+        return crmSalePriceSheetSave;
+      } else if (this.crmType == "salePriceDetail") {
+        // 销售价格单明细
+        return crmSalePriceDetailAdd;
+      } else if (this.crmType == "stdCostPriceSheet") {
+        // 标准成本价格单
+        return crmStdCostPriceSheetSave;
+      } else if (this.crmType == "stdCostPriceDetail") {
+        // 标准成本价格明细
+        return crmStdCostPriceDetailAdd;
+      }
+    },
+    /** 拼接上传传输 */
+    getSubmiteParams(array) {
+      console.log(array)
+      var params = { entity: {}, field: [] };
+      for (let index = 0; index < array.length; index++) {
+        const element = array[index];
+
+        if (element.data.fieldType == 1) {
+          params.entity[element.key] = this.getRealParams(element);
+          //params.entity[element.key] = this.getRealParams(element) || ''
+        } else {
+          //枚举列表的fieldType==0
+          element.data.value = this.getRealParams(element);
+          params.field.push(element.data);
+        }
+      }
+      return params.entity;
+    },
+    /** 获取其他参数 nxt */
+    getOtherParams(params) {
+      console.log("this.crmType : " + this.crmType);
+      //新增
+      if (this.action.type != "update") {
+        // if (this.crmType == "dicts") {
+        //   params["DictionaryItems"] = this.subtableData;
+        // } else 
+        //增加组织ID参数
+        if (
+          this.crmType === "area" ||
+          this.crmType === "team" ||
+          this.crmType === "port" ||
+          this.crmType === "project" ||
+          this.crmType === "wlg" ||
+          this.crmType === "param" ||
+          this.crmType === "stdCostPriceSheet" ||
+          this.crmType === "inventoryRoute" ||
+          this.crmType === "purchasePriceSheet" ||
+          this.crmType === "route" ||
+          this.crmType === "salePriceSheet" ||
+          this.crmType === "stdCostPriceDetail" ||
+          this.crmType === "inventoryRouteDetail" ||
+          this.crmType === "purchasePriceDetail" ||
+          this.crmType === "routeDetail" ||
+          this.crmType === "salePriceDetail" ||
+          this.crmType == "areaItem" ||
+          this.crmType == "customer" ||
+          this.crmType == "customerBom" ||
+          this.crmType == "customerItem" ||
+          this.crmType == "eqptTypeItem" ||
+          this.crmType == "item" ||
+          this.crmType == "itemTransTypeInventoryRoute" ||
+          this.crmType == "itemTransTypeOpStrategy" ||
+          this.crmType == "loc" ||
+          this.crmType == "machine" ||
+          this.crmType == "prodLineItem" ||
+          this.crmType == "slg" ||
+          this.crmType == "supplier" ||
+          this.crmType == "supplierItem" ||
+          this.crmType == "wlgItem" ||
+          this.crmType == "workCenter" ||
+          this.crmType == "bom" ||
+          this.crmType == "prodLine" ||
+          this.crmType == "slgItem"||
+          this.crmType == "interfaceCalendar"||
+          this.crmType == "workCalendar"||
+          this.crmType == "shift"
+        ) {
+          //获取当前登录用户的组织ID
+          console.log('Lockr.get("currentorgID")' + Lockr.get("currentorgID"));
+          params["OrgID"] = Lockr.get("currentorgID");
+
+        }
+      } //修改
+      else {
+        params["Id"] = this.action.subid;
+        //子表修改时要有Id
+
+        if (this.crmType == "dictssub") {
+          params["ItemName"] = this.crmData["ItemName"];
+        } else if (this.crmType === "inventoryRouteDetail") {
+          params["AreaID"] = this.crmData["AreaID"];
+          params["TaskType"] = this.crmData["TaskType"];
+        } else if (this.crmType === "purchasePriceDetail") {
+          params["ItemID"] = this.crmData["ItemID"];
+          params["BeginTime"] = this.crmData["BeginTime"];
+        } else if (this.crmType === "stdCostPriceDetail") {
+          params["ItemID"] = this.crmData["ItemID"];
+          params["BeginTime"] = this.crmData["BeginTime"];
+        } else if (this.crmType === "routeDetail") {
+          params["ItemID"] = this.crmData["ItemID"];
+          params["OperateProcess"] = this.crmData["OperateProcess"];
+        } else if (this.crmType === "salePriceDetail") {
+          params["ItemID"] = this.crmData["ItemID"];
+          params["BeginTime"] = this.crmData["BeginTime"];
+        }
+      }
+    },
+
+    // 获取控件值
+    getRealParams(element) {
+      if (element.key == "OrgID") {
+        return Lockr.get("currentorgID");
+      }
+      //关联表
+      else if (element.key.endsWith("ID") && element.data.formType !== "text") {
+        if (element.value && element.value.length) {
+          return element.value[0].Id;
+        } else {
+          return null;
+        }
+      } else if (element.data.formType == "select") {
+        //element.data.value的值应该从element.data.Setting中取
+        if (element.value == "是") {
+          element.value = true;
+        } else if (element.value == "否") {
+          element.value = false;
+        }
+      } else if (element.data.formType == "switch") {
+        //如果不设置defaultValue element.value为""
+        if (element.value == true || element.value === "" || element.value === null) {
+          element.value = true;
+        } else if (element.value == false) {
+          element.value = false;
+        }
+      } else if(element.data.formType == "int" || element.data.formType == "number" || element.data.formType == "number2" || 
+                element.data.formType == "number4" || element.data.formType == "moneynumber" || 
+                element.data.formType == "mobile" || element.data.formType == "email" || element.data.formType == "rate" )
+      {
+        if(element.value === "" || element.value === null )     
+        {
+          element.value =0;
+          //element.value =element.data.isNull===1? 0:null;
+        }
+      }else if(element.data.formType == "datetime")
+      {
+        if(element.value === "" || element.value === null)     
+        {
+          element.value = this.getNowDate();
+        }
+      }
+      return element.value;
+    },
+    hidenView() {
+      this.$emit("hiden-view");
+    },
+    // 根据类型获取标题展示名称
+    getTitle() {
+      let type=this.crmTypes[this.crmType];
+      if(type===undefined)
+      { 
+        return ''
+      }
+      else
+      {
+        let name= type.name
+        if(this.action.type == "create" || this.action.type == "save")
+        {
+          return '新增'+name;
+        }
+        else if(this.action.type == "update")
+        {
+          return '编辑'+name;
+
+        }
+        else if(this.action.type == "detail")
+        {
+          return name+'详细信息';
+        }   
+      }   
+    },
+    // 获取左边padding
+    getPaddingLeft(item, index) {
+      if (item.showblock && item.showblock == true) {
+        return "0";
+      }
+      return item.styleIndex % 2 == 0 ? "0" : "25px";
+    },
+    // 获取左边padding
+    getPaddingRight(item, index) {
+      if (item.showblock && item.showblock == true) {
+        return "0";
+      }
+      return item.styleIndex % 2 == 0 ? "25px" : "0";
+    },
+    // 上传之前的格式设置
+    beforeAvatarUpload(file) {
+      const isJPG =
+        file.type === "image/png" ||
+        file.type === "image/gif" ||
+        file.type === "image/jpg" ||
+        file.type === "image/jpeg";
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isJPG) {
+        this.$message.error("上传头像图片只能是 JPG,PNG,GIF,JPEG 格式!");
+      }
+      if (!isLt2M) {
+        this.$message.error("上传头像图片大小不能超过 2MB!");
+      }
+      this.multfileImg = file;
+      return isJPG && isLt2M;
+    },
+    httpRequest(data) {
+      let _this = this;
+      let rd = new FileReader(); // 创建文件读取对象
+      let file = data.file;
+      rd.readAsDataURL(file); // 文件读取装换为base64类型
+      rd.onloadend = function (e) {
+        _this.dialogImageUrl = this.result; // this指向当前方法onloadend的作用域
+      };
+    },
+    // 上传文件个数超过定义的数量
+    handleExceed(files, fileList) {
+      //this.$message.warning(`当前限制选择 1 个文件`)
+    },
+
+    getNowDate() {
+      var nowDate = new Date();
+      var date = {
+        year: nowDate.getFullYear(),
+        month: nowDate.getMonth() + 1,
+        day: nowDate.getDate()
+        // hour: nowDate.getHours(),
+        // minute: nowDate.getMinutes(),
+        // second: nowDate.getSeconds(),
+      };
+
+      var year = date.year;
+      var month = date.month >= 10 ? date.month : "0" + date.month;
+      var date = date.day >= 10 ? date.day : "0" + date.day;
+      // var hour = date.hour >=10 ? date.hour: '0' +date.hour;
+      // var minute = date.minute >=10 ? date.minute: '0' +date.minute;
+      // var second = date.second >=10 ? date.second: '0' +date.second;
+
+      // var systemDate =date.year + "-" + month + "-" + date +' ' + hour + ':' + minute + ':' + second;
+
+      var systemDate = year + "-" + month + "-" + date + " 00:00:00";
+      return systemDate;
+    },
+
+    //2021年1月15日前代码
+    // 获取自定义字段
+    getField_Old() {
+      console.log("");
+      console.log("");
+      this.loading = true;
+      console.log("----- 获取自定义字段 data -----");
+      console.log(data);
+      console.log("this.crmType : " + this.crmType);
+      const filedList = data[this.crmType].data;
+      console.log("----- filedList -----");
+      console.log(filedList);
+      const filedListEdit = dataupdate[this.crmType].data;
+
+      // 获取自定义字段的更新时间
+      var params = {
+        label: crmTypeModel[this.crmType],
+      };
+      // 进行编辑操作
+      if (this.action.type == "update") {
+        console.log("----- 进行编辑操作 -----");
+        console.log("this.action.type : " + this.action.type);
+        params.id = this.action.id;
+        params.subid = this.action.subid;
+        let crmRequest = this.getReadRequest();
+        console.log(crmRequest);
+        crmRequest(params.id, params.subid)
+          .then((res) => {
+            console.log("----- 循环字段开始 -----");
+            filedListEdit.map((item) => {
+              //获取JSON的KEY和value
+              Object.keys(res).forEach((key) => {
+                if (
+                  key == item.fieldName &&
+                  key.includes("ID") &&
+                  item.formType != "text"
+                ) {
+                  console.log("----- 字段特殊判断 : 显示字段不是Name的 -----");
+                  // 字段特殊判断
+                  // if(item.formType == 'item'){
+                  //   console.log('----- 字段特殊处理 : item-----')
+                  //   crmItemRead(res[key]).then(resinner => {
+                  //     let _json = {};
+                  //     _json["Name"] = resinner.Code;
+                  //     _json['Id'] = res[key]
+                  //     var _array = [_json]
+                  //     item.value = _array
+                  //   })
+                  // } else {
+                  console.log("----- 准备获取对应列表接口 -----");
+                  let ReadRequest = this.getReadRequest(item.formType);
+                  console.log(ReadRequest);
+                  if (ReadRequest == undefined || ReadRequest == "") {
+                    console.log(
+                      "------ 没有找到 " +
+                        item.formType +
+                        " 的 crmXXXXRead -----"
+                    );
+                  } else {
+                    ReadRequest(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                  //}
+                } else if (
+                  key !== "OrgID" &&
+                  key !== "ItemID" &&
+                  key !== "SlgID" &&
+                  key !== "UomID" &&
+                  key !== "UomGroupID" &&
+                  key !== "BasicUomID" &&
+                  key !== "PurchaseUomConversionID" &&
+                  key !== "StockUomConversionID" &&
+                  key !== "ProductionUomConversionID" &&
+                  key !== "SellUomConversionID" &&
+                  key !== "ProjectID" &&
+                  key !== "InventoryRouteID" &&
+                  key !== "AllocationID"
+                ) {
+                  if (key == item.fieldName) {
+                    item.value = res[key];
+                    //  if(item.value==true){
+                    //    item.value='是'
+                    //  }else if(item.value==false){
+                    //    item.value='否'
+                    //  }
+                  }
+                } else if (key === "OrgID") {
+                  if (key == item.fieldName) {
+                    crmOrgRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["branchName"] = resinner.name;
+                      _json[key] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "ItemID") {
+                  if (key == item.fieldName) {
+                    console.log("ItemID" + res[key]);
+                    crmItemRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "SlgID") {
+                  if (key == item.fieldName) {
+                    console.log("SlgID" + res[key]);
+                    crmSlgRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "UomID") {
+                  if (key == item.fieldName) {
+                    console.log("UomID" + res[key]);
+                    crmUomRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "UomGroupID") {
+                  if (key == item.fieldName) {
+                    console.log("UomGroupID" + res[key]);
+                    crmUomGroupRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "BasicUomID") {
+                  if (key == item.fieldName) {
+                    console.log("BasicUomID" + res[key]);
+                    crmUomGroupRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "PurchaseUomConversionID") {
+                  if (key == item.fieldName) {
+                    crmUomConversionRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "StockUomConversionID") {
+                  if (key == item.fieldName) {
+                    crmUomConversionRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "ProductionUomConversionID") {
+                  if (key == item.fieldName) {
+                    crmUomConversionRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "SellUomConversionID") {
+                  if (key == item.fieldName) {
+                    crmUomConversionRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "ProjectID") {
+                  if (key == item.fieldName) {
+                    crmProjectRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "InventoryRouteID") {
+                  if (key == item.fieldName) {
+                    crmInventoryRouteRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                } else if (key === "AllocationID") {
+                  if (key == item.fieldName) {
+                    crmInventoryRouteRead(res[key]).then((resinner) => {
+                      let _json = {};
+                      _json["Name"] = resinner.Name;
+                      _json["Id"] = res[key];
+                      var _array = [_json];
+                      item.value = _array;
+                    });
+                  }
+                }
+              });
+            });
+            console.log("----- 循环字段结束 -----");
+            this.loading = false;
+
+            setTimeout((item) => {
+              this.getcrmRulesAndModel(filedListEdit);
+            }, 500);
+          })
+          .catch(() => {
+            this.loading = false;
+          });
+      } else {
+        console.log("----- 添加 -----");
+        this.getcrmRulesAndModel(filedList);
+      }
+      this.loading = false;
+    },
+
+    getRealParams_Old(element) {
+      if (
+        element.key == "customer_id" ||
+        element.key == "contacts_id" ||
+        element.key == "business_id" ||
+        element.key == "leads_id" ||
+        element.key == "contract_id"
+      ) {
+        if (element.value && element.value.length) {
+          const key = element.key.replace("_id", "Id");
+          return element.value[0][key];
+        } else {
+          return "";
+        }
+      } else if (element.key == "OrgID") {
+        return Lockr.get("currentorgID");
+        // if (element.value && element.value.length) {
+        //   //return element.value[0].OrgID
+        //   return Lockr.get("currentorgID")
+        // } else {
+        //   return ''
+        // }
+      } else if (
+        element.key == "UomID" ||
+        element.key == "SlgID" ||
+        element.key == "ItemID" ||
+        element.key == "RuleID" ||
+        element.key == "StrategyID" ||
+        element.key == "UomGroupID" ||
+        element.key == "BasicUomID" ||
+        element.key == "PurchaseUomConversionID" ||
+        element.key == "StockUomConversionID" ||
+        element.key == "ProductionUomConversionID" ||
+        element.key == "SellUomConversionID" ||
+        element.key == "ProjectID" ||
+        element.key == "InventoryRouteID" ||
+        element.key == "VerificationID" ||
+        element.key == "StageID" ||
+        element.key.includes("ID") ||
+        element.key.includes("Id")
+      ) {
+        if (element.value && element.value.length) {
+          return element.value[0].Id;
+        } else {
+          return "";
+        }
+      } else if (element.data.formType == "select") {
+        if (element.value == "是") {
+          element.value = true;
+        } else if (element.value == "否") {
+          element.value = false;
+        }
+      } else if (element.data.formType == "switch") {
+        //如果不设置defaultValue element.value为""
+        if (element.value === "" || element.value == true) {
+          element.value = true;
+        } else if (element.value == false) {
+          element.value = false;
+        }
+      } else if (
+        element.data.formType == "user" ||
+        element.data.formType == "structure"
+      ) {
+        return element.value
+          .map(function (item, index, array) {
+            return element.data.formType == "user" ? item.userId : item.id;
+          })
+          .join(",");
+      } else if (element.data.formType == "file") {
+        if (element.value && element.value.length > 0) {
+          return element.value[0].batchId;
+        }
+        return "";
+      } else if (element.key == "category_id") {
+        if (element.value && element.value.length > 0) {
+          return element.value[element.value.length - 1];
+        }
+        return "";
+      } else if (element.data.formType == "checkbox") {
+        if (element.value && element.value.length > 0) {
+          return element.value.join(",");
+        }
+        return "";
+      }
+      // //将bool转成string类型
+      // switch(element.value){
+      //   case true:
+      //     element.value = 'true'
+      //     break;
+      //   case false:
+      //     element.value = 'false'
+      //     break;
+      // }
+      return element.value;
+    },
+    // 根据自定义字段获取自定义字段规则
+    getcrmRulesAndModel_Old(list) {
+      console.log("----- 根据自定义字段获取自定义字段规则 -----");
+      let showStyleIndex = -1;
+      for (let index = 0; index < list.length; index++) {
+        const item = list[index];
+        showStyleIndex += 1;
+        /**
+         * 规则数据
+         */
+        this.crmRules[item.fieldName] = this.getItemRulesArrayFromItem(item);
+
+        console.log("----- this.crmRules[item.fieldName] -----");
+        console.log(this.crmRules[item.fieldName]);
+        /**
+         * 表单数据
+         */
+        if (
+          // crm相关信息特殊处理
+         
+          item.formType == "contacts" ||
+          item.formType == "customer" ||
+          item.formType == "contract" ||
+          item.formType == "business" ||
+          item.formType == "receivables_plan" ||
+          item.formType == "rule" ||
+          item.formType == "org" ||
+          item.formType == "slg" ||
+          item.formType == "item" ||
+          item.formType == "uom" ||
+          item.formType == "uomGroup" ||
+          item.formType == "interfaceCalendar" ||
+          item.formType == "verificationStages" ||
+          item.formType == "verification" ||
+          item.formType == "stage" ||
+          item.formType == "area" ||
+          item.formType == "areaItem" ||
+          item.formType == "currency" ||
+          item.formType == "currencyExchange" ||
+          item.formType == "customerBom" ||
+          item.formType == "customerItem" ||
+          item.formType == "eqptType" ||
+          item.formType == "eqptTypeItem" ||
+          item.formType == "itemTransTypeInventoryRoute" ||
+          item.formType == "itemTransTypeOpStrategy" ||
+          item.formType == "loc" ||
+          item.formType == "machine" ||
+          item.formType == "param" ||
+          item.formType == "port" ||
+          item.formType == "prodLine" ||
+          item.formType == "prodLineItem" ||
+          item.formType == "project" ||
+          item.formType == "shift" ||
+          item.formType == "slg" ||
+          item.formType == "supplier" ||
+          item.formType == "supplierItem" ||
+          item.formType == "team" ||
+          item.formType == "uomConversion" ||
+          item.formType == "wlg" ||
+          item.formType == "wlgItem" ||
+          item.formType == "workCalendar" ||
+          item.formType == "workCenter" ||
+          item.formType == "dicts" ||
+          item.formType == "inventoryRoute" ||
+          item.formType == "stdCostPriceSheet" ||
+          item.formType == "purchasePriceSheet" ||
+          item.formType == "route" ||
+          item.formType == "salePriceSheet"
+        ) {
+          var params = {};
+          params["key"] = item.fieldName;
+          params["data"] = item;
+
+          // 获取 value relative 信息
+          this.getParamsValueAndRelativeInfo(params, item, list);
+          params["disabled"] = this.getItemDisabledFromItem(item);
+          params["styleIndex"] = showStyleIndex;
+          console.log("---------->" + JSON.stringify(params));
+          this.crmForm.crmFields.push(params);
+        } else {
+          var params = {};
+          if (
+            item.formType == "user" ||
+            item.formType == "structure" ||
+            item.formType == "file" ||
+            item.formType == "category" ||
+            item.formType == "customer" ||
+            item.formType == "business" ||
+            item.formType == "contract"
+          ) {
+            //if (this.action.type == 'update'&& item.value)
+            if (this.action.type == "update") {
+              params["value"] = item.value ? objDeepCopy(item.value) : [];
+            } else {
+              params["value"] = item.defaultValue
+                ? objDeepCopy(item.defaultValue)
+                : [];
+            }
+          } else {
+            if (this.action.type == "update") {
+              params["value"] = item.value; // 编辑的值 在value∂ç字段
+            } else {
+              //params['value'] = item.defaultValue || ''
+            }
+          }
+          params["key"] = item.fieldName;
+          params["data"] = item;
+          params["disabled"] = false; // 是否可交互
+          params["styleIndex"] = showStyleIndex;
+          this.crmForm.crmFields.push(params);
+        }
+      }
+    },
+    /**
+     * 获取关联项的值 和 关联信息
+     */
+    getParamsValueAndRelativeInfo(params, item, list) {
+      if (this.action.type == "relative") {
+        const relativeData = this.action.data[item.formType];
+        if (item.formType == "receivables_plan") {
+          params["value"] = "";
+        } else {
+          params["value"] = relativeData ? [relativeData] : [];
+        }
+      } else {
+        if (item.formType == "receivables_plan") {
+          params["value"] = item.value || "";
+        } else {
+          params["value"] = item.value || [];
+        }
+      }
+    },
+    /**
+     * 获取相关联item
+     */
+    getItemRelatveInfo(item, list, fromType) {
+      let crmItem = null;
+      if (this.action.type == "relative") {
+        crmItem = this.action.data[fromType];
+      } else {
+        const crmObj = list.find((listItem) => {
+          return listItem.formType === fromType;
+        });
+        if (crmObj && crmObj.value && crmObj.value.length > 0) {
+          crmItem = crmObj.value[0];
+        }
+      }
+      return crmItem;
+    },
+    /**
+     * 获取关联项是否可操作
+     */
+    getItemDisabledFromItem(item) {
+      // 相关添加
+      if (this.action.type == "relative") {
+        const relativeDisInfos = {
+          business: {
+            customer: { customer: true },
+            contacts: { customer: true },
+          },
+          contacts: {
+            customer: { customer: true },
+            business: { customer: true },
+          },
+          contract: {
+            customer: { customer: true },
+            business: { customer: true, business: true },
+          },
+          receivables_plan: {
+            contract: { customer: true, contract: true },
+            customer: { customer: true },
+          },
+          receivables: {
+            contract: { customer: true, contract: true },
+            customer: { customer: true },
+          },
+        };
+        // 添加类型
+        const crmTypeDisInfos = relativeDisInfos[this.crmType];
+        if (crmTypeDisInfos) {
+          // 在哪个类型下添加
+          const relativeTypeDisInfos = crmTypeDisInfos[this.action.crmType];
+          if (relativeTypeDisInfos) {
+            // 包含的字段值
+            return relativeTypeDisInfos[item.formType] || false;
+          }
+        }
+        return false;
+      } else if (this.action.type != "update") {
+        // 新建
+        if (this.crmType === "contract" && item.formType === "business") {
+          return true;
+          // 回款下 新建 合同 和 回款计划 默认不能操作
+        } else if (this.crmType === "receivables") {
+          if (item.formType === "contract") {
+            return true;
+          } else if (item.formType === "receivables_plan") {
+            return true;
+          }
+        }
+      }
+      return false;
+    },
+    /**
+     * item 当行数据源
+     */
+    getItemRulesArrayFromItem(item) {
+      var tempList = [];
+      // 验证必填
+      if (item.isNull == 1) {
+
+        if(item.formType!=='switch')
+          {
+            tempList.push({
+              required: true,
+              message: item.name + "不能为空",
+              trigger: ["blur"]
+              // trigger: ["blur", "change"],
+            });
+          }
+         
+      }
+
+      if(item.formType==='text') //增加长度校验
+      {     
+        tempList.push({
+          min:0,
+          max:36,
+          message: "长度在1到36个字符",
+          trigger: ["blur", "change"],
+        });
+      }
+       
+
+  
+      // // 验证唯一
+      // if (item.isUnique == 1) {
+      //   var validateUnique = (rule, value, callback) => {
+      //     if ((isArray(value) && value.length == 0) || !value) {
+      //       callback();
+      //     } else {
+      //       var validatesParams = {};
+      //       validatesParams.fieldId = item.fieldId;
+      //       if (isArray(value)) {
+      //         let postValue = "";
+      //         if (value.length > 0) {
+      //           if (
+      //             rule.item.formType == "user" ||
+      //             rule.item.formType == "structure"
+      //           ) {
+      //             postValue = value
+      //               .map((valueItem) => {
+      //                 return rule.item.formType == "user"
+      //                   ? valueItem.userId
+      //                   : valueItem.id;
+      //               })
+      //               .join(",");
+      //           } else if (rule.item.fieldName == "categoryId") {
+      //             if (value && value.length) {
+      //               postValue = value[value.length - 1];
+      //             } else {
+      //               postValue = "";
+      //             }
+      //           } else if (rule.item.formType == "checkbox") {
+      //             postValue = value.join(",");
+      //           }
+      //         }
+      //         validatesParams.value = postValue;
+      //       } else {
+      //         validatesParams.value = value;
+      //       }
+      //       if (this.action.type == "update") {
+      //         validatesParams.batchId = this.action.batchId;
+      //       }
+      //       //filedValidates(validatesParams)
+      //       //   .then(res => {
+      //       callback();
+      //       // })
+      //       // .catch(error => {
+      //       //   callback(new Error(error.msg ? error.msg : '验证出错'))
+      //       // })
+      //     }
+      //   };
+      //   tempList.push({
+      //     validator: validateUnique,
+      //     item: item,
+      //     trigger:
+      //       item.formType == "checkbox" || item.formType == "select"
+      //         ? ["change"]
+      //         : ["blur"],
+      //   });
+      // }
+      // 其他字符
+      let validItem={item:item,trigger: ["blur"] };
+      if (item.formType == "int") {
+        var validateInt = (rule, value, callback) => {
+          if (!value || value == "" || regexIsInt(value)) {
+            callback();
+          } else {
+            callback(new Error("整数类型长度必须是小于12位的数字"));
+          }
+        };
+        validItem.validator= validateInt;
+        tempList.push(validItem);
+      }
+      else if (item.formType == "number") {
+        var validateNumber = (rule, value, callback) => {
+          if ( value == "" || regexIsNumber(value)) {
+            callback();
+          } else {
+            callback(new Error("数字的整数部及小数部分须是整数"));
+          }
+        };
+        validItem.validator= validateNumber;
+        tempList.push(validItem);
+      } 
+      else if (item.formType == "number2") {
+        var validateCRMNumber2 = (rule, value, callback) => {
+          if (value == "" || regexIsCRMNumber2(value)) {
+            callback();
+          } else {
+            callback(new Error("数字的整数部分须少于12位，小数部分须少于2位"));
+          }
+        };
+        validItem.validator= validateCRMNumber2;
+      } else if (item.formType == "number4") {
+        var validateCRMNumber4 = (rule, value, callback) => {
+          if (value == "" || regexIsCRMNumber4(value)) {
+            callback();
+          } else {
+            callback(new Error("数字的整数部分须少于12位，小数部分须少于4位"));
+          }
+        };
+        validItem.validator= validateCRMNumber4;
+        tempList.push(validItem);
+      } 
+      else if (item.formType == "moneynumber") {
+        var validateCRMMoneyNumber = (rule, value, callback) => {
+          if (value == "" || regexIsCRMMoneyNumber(value)) {
+            callback();
+          } else {
+            callback(new Error("货币的整数部分须少于10位，小数部分须少于4位"));
+          }
+        };
+        validItem.validator= validateCRMMoneyNumber;
+        tempList.push(validItem);
+      } else if (item.formType == "mobile") {
+        var validateCRMMobile = (rule, value, callback) => {
+          if (value == "" || regexIsCRMMobile(value)) {
+            callback();
+          } else {
+            callback(new Error("手机格式有误"));
+          }
+        };
+        validItem.validator= validateCRMMobile;
+        tempList.push(validItem);
+      } else if (item.formType == "email") {
+        var validateCRMEmail = (rule, value, callback) => {
+          if (value == "" || regexIsCRMEmail(value)) {
+            callback();
+          } else {
+            callback(new Error("邮箱格式有误"));
+          }
+        };
+       validItem.validator= validateCRMEmail;
+       tempList.push(validItem);
+      }
+      else if (item.formType == "rate") {
+        var validateCRMRate = (rule, value, callback) => {
+          if (value == "" || regexIsCRMRate(value)) {
+            callback();
+          } else {
+             callback(new Error("税率/百分比应小于1，小数部分须少于6位"));
+          }
+        };
+       validItem.validator= validateCRMRate;
+       tempList.push(validItem);
+      }
+
+      //获取其他校验规则
+      let otherRules= this.getOtherRulesArrayFromItem(item);
+      if(otherRules.length>0)
+      { 
+        otherRules.forEach(item=>tempList.push(item));
+      }
+      return tempList;
+    },
+    /**
+     * item 其他校验规则  getItemRulesArrayFromItem
+     */
+    getOtherRulesArrayFromItem(item)
+    {
+      var tempList = [];
+      if(this.crmType==='interfaceCalendar')
+      { 
+        let InterfaceCalendarRules=this.getInterfaceCalendarRules(item);
+   
+        if(InterfaceCalendarRules.length>0){
+            InterfaceCalendarRules.forEach(rule => {
+            (tempList.push(rule));
+          });
+        }
+      }
+
+      
+      // if(this.crmType==='strategyRules')
+      // { 
+      //   let strategyRules=this.getStrategyrules(item,list);
+      //   strategyRules.forEach(item=>tempList.push(item));
+      // }
+
+      return tempList;
+    },
+    getProductParams(params, element) {
+      if (element.value) {
+        params["product"] = element.value.product ? element.value.product : [];
+        params.entity["totalPrice"] = element.value.totalPrice
+          ? element.value.totalPrice
+          : 0;
+        params.entity["discountRate"] = element.value.discountRate
+          ? element.value.discountRate
+          : 0;
+      } else {
+        params["product"] = [];
+        params.entity["totalPrice"] = "";
+        params.entity["discountRate"] = "";
+      }
+    },
+    // 获取客户位置参数
+    getCustomerAddressParams(params, element) {
+      params["address"] = element.value.address
+        ? element.value.address.join(",")
+        : "";
+      params["detailAddress"] = element.value.detailAddress;
+      params["location"] = element.value.location;
+      params["lng"] = element.value.lng;
+      params["lat"] = element.value.lat;
+    },
+    getStrategyrules(item)
+    {
+      let list=this.crmForm.crmFields
+      var tempList = [];
+      let validItem={item:item,trigger: ["blur"] };
+      if(item.fieldName==='EffectiveTime')
+      {
+        var validateEffectiveTime = (rule, value, callback) => {
+          const ExpireTimeItem = list.find((listItem) => {
+            return listItem.key === 'ExpireTime'; });
+
+          const ExpireTimeValue=ExpireTimeItem.value;
+
+          if(ExpireTimeValue!=null && value>= ExpireTimeValue )
+          {
+            callback(new Error("生效时间不能大于等于失效时间"));
+          } else {
+
+            //this.$refs.crmForm.validateField("crmFields." + ExpireTimeItem.styleIndex + ".value");
+            callback();
+          }
+        }
+        validItem.validator= validateEffectiveTime;
+        tempList.push(validItem);
+      }
+      else if(item.fieldName==='ExpireTime')
+      {
+        var validateExpireTime = (rule, value, callback) => {
+          const EffectiveItem = list.find((listItem) => {
+            return listItem.key === 'EffectiveTime'; }).value;
+            
+          const EffectiveValue =EffectiveItem.value;
+
+          if(EffectiveValue!=null && EffectiveValue>= value )
+          {
+            callback(new Error("失效时间时间不能小于等于生效时间"));
+          } else {
+            //this.$refs.crmForm.validateField("EffectiveItem." + ExpireTimeItem.styleIndex + ".value");
+            callback();
+          }
+        }
+        validItem.validator= validateExpireTime;
+        tempList.push(validItem);
+      }
+      return tempList;
+    },
+    getInterfaceCalendarRules(item)
+    {
+      var tempList = [];
+      let validItem={item:item,trigger: ["blur"] };
+      if(item.fieldName==='Year') //
+      {
+        var validateYear = (rule, value, callback) => {
+          if ( value>=2000 && value<=3000) {
+            callback();
+          } else {
+            callback(new Error("年份应该在2000-3000之间"));
+          }
+        };
+        validItem.validator= validateYear;
+        tempList.push(validItem);
+      }
+      else if(item.fieldName==='Month') //
+      {
+        var validateEffectiveTime = (rule, value, callback) => {
+           if ( value >=1 && value<=12) {
+            callback();
+          } else {
+            callback(new Error("月份应该在1-12之间"));
+          }
+        }
+        validItem.validator= validateEffectiveTime;
+        tempList.push(validItem);
+      }
+      return tempList;
+    }
+  },
+};
+</script>
+<style lang="scss" scoped>
+.crm-create-container {
+  position: relative;
+  height: 100%;
+}
+
+.crm-create-flex {
+  position: relative;
+  overflow-x: hidden;
+  overflow-y: auto;
+  flex: 1;
+}
+
+.crm-create-header {
+  height: 40px;
+  margin-bottom: 20px;
+  padding: 0 10px;
+  flex-shrink: 0;
+  .close {
+    display: block;
+    width: 40px;
+    height: 40px;
+    margin-right: -10px;
+    padding: 10px;
+    cursor: pointer;
+  }
+}
+
+.crm-create-body {
+  // flex: 1;
+  overflow-x: hidden;
+  // overflow-y: scroll;
+  border-right: 1px;
+  min-height: 350px;
+  max-height: 550px;
+  overflow-y: auto;
+  padding: 20px;
+}
+
+/** 将其改变为flex布局 */
+.crm-create-box {
+  display: flex;
+  flex-wrap: wrap;
+  padding: 0 10px;
+}
+
+.crm-create-item {
+  flex: 0 0 50%;
+  flex-shrink: 0;
+  // overflow: hidden;
+  padding-bottom: 10px;
+}
+
+// 占用一整行
+.crm-create-block-item {
+  flex: 0 0 100%;
+  flex-shrink: 0;
+  padding-bottom: 10px;
+}
+
+.el-form-item /deep/ .el-form-item__label {
+  line-height: normal;
+  font-size: 13px;
+  color: #333333;
+  position: relative;
+  padding-left: 8px;
+  padding-bottom: 0;
+}
+
+.el-form /deep/ .el-form-item {
+  margin-bottom: 0px;
+}
+
+.el-form /deep/ .el-form-item.is-required .el-form-item__label:before {
+  content: "*";
+  color: #f56c6c;
+  margin-right: 4px;
+  position: absolute;
+  left: 0;
+  top: 5px;
+}
+
+.handle-bar {
+  position: relative;
+  .handle-button {
+    float: right;
+    margin-top: 5px;
+    margin-right: 20px;
+  }
+}
+
+.el-button + .el-button {
+  margin-left: 0;
+}
+
+// 审核信息 里的审核类型
+.examine-type {
+  font-size: 12px;
+  color: white;
+  background-color: #fd715a;
+  padding: 0 8px;
+  margin-left: 5px;
+  height: 16px;
+  line-height: 16px;
+  border-radius: 8px;
+  transform: scale(0.8, 0.8);
+}
+
+.avatar-uploader {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 178px;
+  height: 178px;
+  line-height: 178px;
+  text-align: center;
+}
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/CRMDetailHead.vue b/vue/src/views/pg-fis/components/CRMDetailHead.vue
new file mode 100644
index 00000000..70c4b905
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMDetailHead.vue
@@ -0,0 +1,337 @@
+<template>
+  <div style="position: relative;">
+    <flexbox class="t-section">
+      <img
+        :src="crmIcon"
+        class="t-img" >
+      <div class="t-name">{{ name }}</div>
+      <el-button
+        class="head-handle-button"
+        type="primary"
+        @click.native="handleTypeClick('edit')">编辑</el-button>
+<!--      <img-->
+<!--        class="t-close"-->
+<!--        src="@/assets/img/task_close.png"-->
+<!--        @click="hideView" >-->
+    </flexbox>
+    <flexbox
+      class="h-section"
+      align="stretch">
+      <flexbox-item
+        v-for="(item, index) in headDetails"
+        :key="index"
+        class="h-item"
+        span="200">
+        <div class="h-title">{{ item.name }}</div>
+        <div class="h-value text-one-line">{{ item.value}}</div>
+      </flexbox-item>
+    </flexbox>
+    <slot/>
+  </div>
+</template>
+<script type="text/javascript">
+import tableFields from "../../../../static/tableField";
+
+export default {
+  name: 'CRMDetailHead',
+  components: {
+    // TransferHandle,
+    // AllocHandle,
+    // DealStatusHandle
+  },
+  props: {
+    /** 模块ID */
+    id: [String, Number],
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    },
+    // 辅助 使用
+    isSeas: {
+      type: Boolean,
+      default: false
+    },
+    /** 详细信息 */
+    detail: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      moreTypes: [], // 更多操作
+      fieldInfoList: [],
+      headDetails: {
+      type: Array,
+      default: () => {
+        return []
+      }
+     }
+    }
+  },
+  computed: {
+    // ...mapGetters(['crm', 'CRMConfig']),
+    crmIcon() {
+      if (this.crmType === 'transaction') {
+        return require('@/assets/img/customer_detail.png')
+      } else if (this.crmType === 'leads') {
+        return require('@/assets/img/clue_detail.png')
+      } else if (this.crmType === 'strategy') {
+        return require('@/assets/img/business_detail.png')
+      } else if (this.crmType === 'rule') {
+        return require('@/assets/img/contacts_detail.png')
+      } else if (this.crmType === 'customer') {
+        return require('@/assets/img/contract_detail.png')
+      } else if (this.crmType === 'slgItem') {
+        return require('@/assets/img/money_detail.png')
+      } else if (this.crmType === 'dicts') {
+        return require('@/assets/img/product_detail.png')
+      } else if (this.crmType === 'bom') {
+        return require('@/assets/img/product_detail.png')
+      } else if (this.crmType === 'uomGroup') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'uom') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'area') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'areaItem') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'currency') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'currencyExchange') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'customerBom') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'customerItem') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'eqptType') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'eqptTypeItem') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'item') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'itemTransTypeInventoryRoute') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'itemTransTypeOpStrategy') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'loc') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'machine') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'param') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'port') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'prodLine') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'prodLineItem') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'project') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'shift') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'slg') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'supplier') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'supplierItem') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'team') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'uomConversion') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'wlg') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'wlgItem') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'workCalendar') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'workCenter') {
+        return require('@/assets/img/product_detail.png')
+      } else if (this.crmType === 'inventoryRoute') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'inventoryRouteDetail') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'purchasePriceDetail') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'purchasePriceSheet') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'route') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'routeDetail') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'salePriceDetail') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'salePriceSheet') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'stdCostPriceDetail') {
+        return require('@/assets/img/product_detail.png')
+      }else if (this.crmType === 'stdCostPriceSheet') {
+        return require('@/assets/img/product_detail.png')
+      }else {
+        return require('@/assets/img/product_detail.png')
+      }
+      return ''
+    },
+    name() {
+      return this.detail.name
+    },
+    showEdit() {
+      return this.crm[this.crmType].update
+    },
+  },
+  watch: {
+    detail:function(val)
+    {
+     this. GetBaseInfoValue(val);
+    }
+  },
+  mounted() {
+    //this.moreTypes = this.getSelectionHandleItemsInfo()
+  },
+  methods: {
+    GetBaseInfoValue(res)
+    {
+      this.headDetails=[];
+      this.list=[]
+      let filedList = tableFields[this.crmType].data;
+      let resKeys= Object.keys(res);
+      filedList.map((item) => {
+      let key= resKeys.find(r=>{return r == item.fieldName && r!='Description'}); //不显示描述
+      if(key!=null)
+      {
+         let resValue=this.valueConverter(res[key],item);
+            let filedJSON={ 
+                "formType": key.includes('TIME')?"datetime":"text",
+                "name":item.name,
+                "value":resValue,
+                "data":item
+              }
+            this.headDetails.push(filedJSON);
+      }
+    });
+      
+
+    //  Object.keys(res).forEach((key)=>{
+    //       if (key == item.fieldName && key!='Description') //不显示描述
+    //       {
+    //         let resValue=this.valueConverter(res[key],item);
+    //         let filedJSON={ 
+    //             "formType": key.includes('TIME')?"datetime":"text",
+    //             "name":item.name,
+    //             "value":resValue,
+    //             "data":item
+    //           }
+    //         this.headDetails.push(filedJSON);
+    //       }
+    //     });
+    //   });
+    },
+
+    valueConverter(value,item) {
+  
+      if(item.formType==='switch')
+      {
+        if(value===true)
+        {
+          return '是'
+        }
+        else if(value===false)
+        {
+          return '否'
+        }
+        else
+        {
+          return ''
+        }
+      }
+      else if(item.formType==='select')
+      {
+        //取select的值
+        return value
+      }
+      else
+      {
+        return value
+      }
+    },
+
+    /** 更多操作 */
+    handleTypeClick(type) {
+      if (type == 'edit') {
+        // 编辑
+        this.$emit('handle', { type: 'edit' })
+      } 
+    },
+    hideView() {
+      this.$emit('close')
+    },
+    // 子组件 回调的 结果
+    handleCallBack(data) {
+      this.$emit('handle', { type: data.type })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.t-section {
+  position: relative;
+  padding: 10px 17px;
+  min-height: 60px;
+  .t-img {
+    display: block;
+    width: 35px;
+    height: 35px;
+    margin-right: 10px;
+  }
+  .t-name {
+    font-size: 14px;
+    color: #333333;
+    flex: 1;
+  }
+  .t-more {
+    border: 1px solid #dcdfe6;
+    font-size: 12px;
+    color: #606266;
+    padding: 0 10px 0 12px;
+    border-radius: 2px;
+    font-weight: 500;
+    height: 25px;
+    cursor: pointer;
+  }
+  .t-close {
+    display: block;
+    width: 40px;
+    height: 40px;
+    margin-left: 20px;
+    padding: 10px;
+    cursor: pointer;
+  }
+}
+
+.h-section {
+  position: relative;
+  padding: 8px 17px 15px 17px;
+  min-height: 58px;
+  overflow-x: auto;
+  .h-item {
+    .h-title {
+      font-size: 12px;
+      color: #777;
+    }
+    .h-value {
+      min-height: 14px;
+      margin-top: 8px;
+      font-size: 13px;
+      color: #333333;
+    }
+  }
+}
+.head-handle-button {
+  padding: 5px 15px;
+  margin-right: 10px;
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/CRMExport-old.vue b/vue/src/views/pg-fis/components/CRMExport-old.vue
new file mode 100644
index 00000000..4d5039cf
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMExport-old.vue
@@ -0,0 +1,327 @@
+<template>
+  <el-dialog
+    :visible.sync="showDialog"
+    :title="'导出'+crmTypeName"
+    :append-to-body="true"
+    :close-on-click-modal="false"
+    :before-close="beforeClose"
+    :close-on-press-escape="false"
+    width="550px"
+    @close="closeView"
+  >
+    <div class="dialog-body">
+      <p
+        v-if="error"
+        class="error"
+        v-text="error" />
+      <p
+        v-if="done"
+        class="done">
+        <i class="el-icon-success"/>
+        导出已完成
+      </p>
+      <p
+        v-else-if="cancel"
+        class="cancel">
+        <i class="el-icon-warning"/>
+        导出已取消
+      </p>
+      <div v-else>
+        <i class="el-icon-loading" />
+        导出中...
+        {{ progress }}
+      </div>
+    </div>
+    <span slot="footer" class="dialog-footer" />
+  </el-dialog>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+// import {
+//   crmCustomerExcelExport,
+//   crmCustomerExcelAllExport,
+//   crmCustomerPoolExcelExportAPI
+// } from '@/api/customermanagement/customer'
+// import { crmLeadsExcelExport, crmLeadsExcelAllExport } from '@/api/customermanagement/clue'
+// import { crmContactsExcelExport, crmContactsExcelAllExport } from '@/api/customermanagement/contacts'
+// import { crmProductExcelExport, crmProductExcelAllExport } from '@/api/customermanagement/product'
+// import { crmBusinessExcelExport, crmBusinessExcelAllExport } from '@/api/customermanagement/business'
+// import { crmContractExcelExport, crmContractExcelAllExport } from '@/api/customermanagement/contract'
+// import { crmReceivablesExcelExport, crmReceivablesExcelAllExport } from '@/api/customermanagement/money'
+
+export default {
+  name: 'CRMExport', // 文件导出
+  components: {},
+
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    },
+    // CRM类型
+    crmType: {
+      type: String,
+      default: ''
+    },
+    /** 是公海 */
+    isSeas: {
+      type: Boolean,
+      default: false
+    },
+    // 搜索条件
+    search: {
+      type: String,
+      default: ''
+    },
+    // 场景
+    scene_id: {
+      type: [Number, String],
+      default: ''
+    },
+    // 高级搜索
+    filterObj: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    exportParams: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      showDialog: false,
+      progress: '',
+      error: '',
+      // 导出已完成
+      done: false,
+      // 取消导出
+      cancel: false,
+      // 队列标识
+      exportQueueIndex: '',
+      // 临时数据
+      tempData: {
+        temp_file: ''
+      },
+      // 排序
+      sortData: {}
+    }
+  },
+  computed: {
+    ...mapGetters(['userInfo']),
+    crmTypeName() {
+      return (
+        {
+          customer: '客户',
+          leads: '线索',
+          contacts: '联系人',
+          product: '产品'
+        }[this.crmType] || ''
+      )
+    }
+  },
+  watch: {
+    show(val) {
+      this.showDialog = val
+      if (val) {
+        this.cancel = false
+        this.exportInfos()
+        window.onbeforeunload = (event) => {
+          this.exportInfos({
+            page: -1,
+            temp_file: this.tempData.temp_file
+          })
+          return event
+        }
+      } else {
+        window.onbeforeunload = null
+      }
+    }
+  },
+  mounted() {
+    this.$bus.off('getSortData')
+    this.$bus.on('getSortData', (sortData) => {
+      this.sortData = sortData
+    })
+  },
+  methods: {
+    // 关闭操作
+    closeView() {
+      this.error = ''
+      this.done = false
+      this.exportQueueIndex = ''
+      this.progress = ''
+      this.$emit('close')
+    },
+    // 点叉
+    beforeClose(done) {
+      if (this.error || this.done) {
+        done()
+        return
+      }
+      this.$confirm('此操作将终止导出, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.cancel = true
+          done()
+        })
+        .catch(() => {
+        })
+    },
+    // 导出操作
+    exportInfos(data = {}) {
+      var params = {
+        export_queue_index: this.exportQueueIndex,
+        search: this.search,
+        ...this.exportParams,
+        ...this.sortData,
+        ...data
+      }
+      if (this.scene_id) {
+        params.scene_id = this.scene_id
+      }
+      for (var key in this.filterObj) {
+        params[key] = this.filterObj[key]
+      }
+
+      let exportAll = 'All'
+      if (params['ids']) {
+        exportAll = ''
+      }
+
+      let request
+      // 公海的请求
+      if (this.isSeas) {
+        request = crmCustomerPoolExcelExportAPI
+      } else {
+        request = {
+          customer: crmCustomerExcelExport,
+          customerAll: crmCustomerExcelAllExport,
+          leads: crmLeadsExcelExport,
+          leadsAll: crmLeadsExcelAllExport,
+          contacts: crmContactsExcelExport,
+          contactsAll: crmContactsExcelAllExport,
+          product: crmProductExcelExport,
+          productAll: crmProductExcelAllExport,
+          business: crmBusinessExcelExport,
+          businessAll: crmBusinessExcelAllExport,
+          contract: crmContractExcelExport,
+          contractAll: crmContractExcelAllExport,
+          receivables: crmReceivablesExcelExport,
+          receivablesAll: crmReceivablesExcelAllExport
+        }[this.crmType + exportAll]
+      }
+      request(params)
+        .then(res => {
+          if (res.data.type.indexOf('json') !== -1) {
+            var blob = new Blob([res.data], {
+              type: 'application/json'
+            })
+            var reader = new FileReader()
+            reader.readAsText(blob, 'utf-8')
+            reader.onload = () => {
+              var temp = JSON.parse(reader.result)
+              this.tempData = temp.data
+              if (temp.error) {
+                this.error = temp.error
+                return
+              }
+              this.exportQueueIndex = temp.data.export_queue_index
+              if (this.cancel) {
+                if (temp.data.page !== -1) {
+                  this.exportInfos({
+                    page: -1,
+                    temp_file: temp.data.temp_file
+                  })
+                }
+              } else if (temp.data.page === -2) {
+                setTimeout(() => {
+                  this.exportInfos({
+                    page: 1,
+                    temp_file: temp.data.temp_file
+                  })
+                }, 1000)
+              } else if (temp.data.page > 0) {
+                this.exportInfos({
+                  page: temp.data.page,
+                  temp_file: temp.data.temp_file
+                })
+                this.progress = String(temp.data.done) + ' / ' + String(temp.data.total)
+              }
+            }
+          } else {
+            this.exportQueueIndex = ''
+            this.done = true
+            var blob = new Blob([res.data], {
+              type: 'application/vnd.ms-excel;charset=utf-8'
+            })
+            var downloadElement = document.createElement('a')
+            var href = window.URL.createObjectURL(blob) // 创建下载的链接
+            downloadElement.href = href
+            downloadElement.download =
+              decodeURI(
+                res.headers['content-disposition'].split('filename=')[1]
+              ) || '' // 下载后文件名
+            document.body.appendChild(downloadElement)
+            downloadElement.click() // 点击下载
+            document.body.removeChild(downloadElement) // 下载完成移除元素
+            window.URL.revokeObjectURL(href) // 释放掉blob对象
+          }
+        })
+        .catch(() => {
+        })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+.dialog-body {
+  height: 150px;
+  text-align: center;
+  padding-top: 40px;
+  color: #659DED;
+  .el-icon-loading {
+    margin-bottom: 10px;
+    display: block;
+  }
+  p.error {
+    color: #E6A23C;
+  }
+  p.done {
+    color: #67C23A;
+    .el-icon-success {
+      font-size: 30px;
+      display: block;
+    }
+  }
+}
+
+.cancel {
+  color: #E6A23C;
+  .el-icon-warning {
+    font-size: 30px;
+    display: block;
+  }
+}
+
+.el-dialog__wrapper {
+  /deep/ .el-icon-loading {
+    font-size: 30px;
+  }
+
+  /deep/ .el-loading-text {
+    font-size: 18px;
+    margin-top: 10px;
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/CRMExport.vue b/vue/src/views/pg-fis/components/CRMExport.vue
new file mode 100644
index 00000000..16b4076f
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMExport.vue
@@ -0,0 +1,257 @@
+<template>
+  <el-dialog
+    :visible.sync="showDialog"
+    :title="'导出'+crmTypeName"
+    :append-to-body="true"
+    :close-on-click-modal="false"
+    :before-close="beforeClose"
+    :close-on-press-escape="false"
+    width="550px"
+    @close="closeView"
+  >
+    <div class="dialog-body">
+      <p
+        v-if="error"
+        class="error"
+        v-text="error" />
+      <p
+        v-if="done"
+        class="done">
+        <i class="el-icon-success"/>
+        导出已完成
+      </p>
+      <p
+        v-else-if="cancel"
+        class="cancel">
+        <i class="el-icon-warning"/>
+        导出已取消
+      </p>
+      <div v-else>
+        <i class="el-icon-loading" />
+        导出中...
+        {{ progress }}
+      </div>
+    </div>
+    <span slot="footer" class="dialog-footer" />
+  </el-dialog>
+</template>
+
+<script>
+import { winUomGroupExcelAllExport } from '@/api/uomGroup/uomGroup'
+import { downloadFile } from '@/utils/crmindex.js'
+
+
+
+export default {
+  name: 'CRMExport', // 文件导出 
+  components: {},
+
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    },
+    // CRM类型
+    crmType: {
+      type: String,
+      default: ''
+    },
+    /** 是公海 */
+    isSeas: {
+      type: Boolean,
+      default: false
+    },
+    // 搜索条件
+    search: {
+      type: String,
+      default: ''
+    },
+    // 高级搜索
+    filterObj: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    exportParams: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      showDialog: false,
+      progress: '',
+      error: '',
+      // 导出已完成
+      done: false,
+      // 取消导出
+      cancel: false,
+      // 队列标识
+      exportQueueIndex: '',
+      // 临时数据
+      tempData: {
+        temp_file: ''
+      },
+      // 排序
+      sortData: {}
+    }
+  },
+  computed: {
+    crmTypeName() {
+      return (
+        {
+          uomGroup: '计量单位组'
+        }[this.crmType] || ''
+      )
+    }
+  },
+  watch: {
+    show(val) {
+      this.showDialog = val
+      if (val) {
+        this.cancel = false
+        this.exportInfos()
+        window.onbeforeunload = (event) => {
+          this.exportInfos({
+            page: -1,
+            temp_file: this.tempData.temp_file
+          })
+          return event
+        }
+      } else {
+        window.onbeforeunload = null
+      }
+    }
+  },
+  mounted() {
+    this.$bus.off('getSortData')
+    this.$bus.on('getSortData', (sortData) => {
+      this.sortData = sortData
+    })
+  },
+  methods: {
+    // 关闭操作
+    closeView() {
+      this.error = ''
+      this.done = false
+      this.exportQueueIndex = ''
+      this.progress = ''
+      this.$emit('close')
+    },
+    // 点叉
+    beforeClose(done) {
+      if (this.error || this.done) {
+        done()
+        return
+      }
+      this.$confirm('此操作将终止导出, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.cancel = true
+          done()
+        })
+        .catch(() => {
+        })
+    },
+    // 导出操作
+    exportInfos(data = {}) {
+      // var params = {
+      //   export_queue_index: this.exportQueueIndex,
+      //   search: this.search,
+      //   ...this.exportParams,
+      //   ...this.sortData,
+      //   ...data
+      // }
+      var params = { 
+        //有组织ID传入
+      }
+      // for (var key in this.filterObj) {
+      //   params[key] = this.filterObj[key]
+      // }
+
+      let exportAll = 'All'
+      if (params['ids']) {
+        exportAll = ''
+      }
+
+      // let request = {
+      //     uomGroup: crmReceivablesExcelAllExport
+      //   }[this.crmType + exportAll]
+      let request = {
+          uomGroup: winUomGroupExcelAllExport
+        }[this.crmType]
+      request(params)
+        .then(res => {
+          var downExportExcelName=res;//获取生成到服务器上的导出excel文件名称
+          this.$axios
+          .BolbGets('/api/basedataservice/exceltemplate/downloadExcelFiles/' + downExportExcelName)
+          .then((response) => {
+            downloadFile(response, this.crmTypeName+'导出数据.xlsx')
+            this.error = ''
+            this.done = false
+            this.exportQueueIndex = ''
+            this.progress = ''
+            this.$emit('close')
+            this.$notify({
+              title: '成功',
+              message: '数据导出成功！',
+              type: 'success',
+              duration: 2000
+            })
+          })
+        })
+        .catch(() => {
+        })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+.dialog-body {
+  height: 150px;
+  text-align: center;
+  padding-top: 40px;
+  color: #659DED;
+  .el-icon-loading {
+    margin-bottom: 10px;
+    display: block;
+  }
+  p.error {
+    color: #E6A23C;
+  }
+  p.done {
+    color: #67C23A;
+    .el-icon-success {
+      font-size: 30px;
+      display: block;
+    }
+  }
+}
+
+.cancel {
+  color: #E6A23C;
+  .el-icon-warning {
+    font-size: 30px;
+    display: block;
+  }
+}
+
+.el-dialog__wrapper {
+  /deep/ .el-icon-loading {
+    font-size: 30px;
+  }
+
+  /deep/ .el-loading-text {
+    font-size: 18px;
+    margin-top: 10px;
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/CRMImport-old.vue b/vue/src/views/pg-fis/components/CRMImport-old.vue
new file mode 100644
index 00000000..bcc4d040
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMImport-old.vue
@@ -0,0 +1,668 @@
+<template>
+  <el-dialog
+    :visible="show"
+    :title="'导入'+crmTypeName"
+    :append-to-body="true"
+    :close-on-click-modal="false"
+    width="600px"
+    @close="closeView">
+    <div class="dialog-body">
+      <!-- <el-steps
+        :active="stepsActive"
+        simple>
+        <el-step
+          v-for="(item, index) in stepList"
+          :key="index"
+          :title="item.title"
+          :icon="item.icon"
+          :status="item.status" />
+      </el-steps> -->
+
+      <div v-if="stepsActive == 1" class="step-section">
+        <div class="sections">
+          <div class="sections__title">一、请按照数据模板的格式准备要导入的数据。<span
+            class="download"
+            @click="download">点击下载《{{ crmTypeName }}导入模板》</span></div>
+          <div class="sections__tips">导入文件请勿超过2MB（约10,000条数据）</div>
+        </div>
+        <div class="sections">
+          <div class="sections__title">二、请选择数据重复时的处理方式（查重规则：【{{ fieldUniqueInfo }}】）</div>
+          <div class="sections__tips">查重规则为：添加{{ crmTypeName }}时所需填写的所有唯一字段，当前设置唯一字段为：{{ fieldUniqueInfo }}</div>
+          <div class="content">
+            <el-select
+              v-model="config"
+              placeholder="请选择">
+              <el-option
+                v-for="(item, index) in [{name: '覆盖系统原有数据',value: 1},{name: '跳过',value: 2}]"
+                :key="index"
+                :label="item.name"
+                :value="item.value"/>
+            </el-select>
+          </div>
+        </div>
+        <div class="sections">
+          <div class="sections__title">三、请选择需要导入的文件</div>
+          <div class="content">
+            <flexbox class="file-select">
+              <el-input
+                v-model="file.name"
+                :disabled="true"/>
+              <el-button
+                type="primary"
+                @click="selectFile">选择文件</el-button>
+            </flexbox>
+          </div>
+        </div>
+        <div class="sections">
+          <div class="sections__title">四、请选择负责人（{{ crmType == 'customer' ? '如不选择，导入的客户将进入公海' : '必选' }}）</div>
+          <div class="content">
+            <div class="user-cell">
+              <xh-user-cell
+                :value="user"
+                @value-change="userSelect"/>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div
+        v-loading="loading"
+        v-else-if="stepsActive == 2"
+        element-loading-text="数据导入中"
+        element-loading-spinner="el-icon-loading"
+        class="step-section" />
+
+      <div
+        v-loading="loading"
+        v-else-if="stepsActive == 3"
+        class="step-section">
+        <div class="result-info">
+          <i class="wk wk-success result-info__icon" />
+          <p class="result-info__des">数据导入完成</p>
+          <p class="result-info__detail">导入总数据<span class="result-info__detail--all">{{ resultData.totalSize }}</span>条，导入成功<span class="result-info__detail--suc">{{ resultData.totalSize - resultData.errSize }}</span>条，导入失败<span class="result-info__detail--err">{{ resultData.errSize }}</span>条</p>
+          <el-button
+            v-if="resultData && resultData.errSize > 0"
+            class="result-info__btn--err"
+            type="text"
+            @click="downloadErrData">下载错误数据</el-button>
+        </div>
+      </div>
+
+      <input
+        id="importInputFile"
+        type="file"
+        accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
+        @change="uploadFile">
+    </div>
+    <span
+      slot="footer"
+      class="dialog-footer">
+      <el-popover
+        v-model="historyPopoverShow"
+        placement="top"
+        width="800"
+        popper-class="no-padding-popover"
+        trigger="click">
+        <!-- <c-r-m-import-history
+          :show="historyPopoverShow"
+          :crm-type="crmType"
+          @close="historyPopoverShow = false" />
+        <el-button
+          slot="reference"
+          class="history-btn"
+          type="text">查看历史导入记录</el-button> -->
+      </el-popover>
+
+
+
+      <el-button
+        :class="{ 'is-hidden': !showCancel }"
+        @click="closeView">取消</el-button>
+      <el-button
+        v-if="sureTitle"
+        type="primary"
+        @click="sureClick">{{ sureTitle }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+// import {
+//   crmQueryImportNumAPI,
+//   crmQueryImportInfoAPI,
+//   crmDownImportErrorAPI,
+//   filedGetField
+// } from '@/api/customermanagement/common'
+// import {
+//   crmCustomerExcelImport,
+//   crmCustomerDownloadExcelAPI
+// } from '@/api/customermanagement/customer'
+// import {
+//   crmLeadsExcelImport,
+//   crmLeadsDownloadExcelAPI
+// } from '@/api/customermanagement/clue'
+// import {
+//   crmContactsExcelImport,
+//   crmContactsDownloadExcelAPI
+// } from '@/api/customermanagement/contacts'
+// import {
+//   crmProductExcelImport,
+//   crmProductDownloadExcelAPI
+// } from '@/api/customermanagement/product'
+
+import { XhUserCell } from '@/components/CreateCom'
+// import CRMImportHistory from './CRMImportHistory'
+
+import { mapGetters } from 'vuex'
+import crmTypeModel from '@/views/ux/model/crmTypeModel'
+import { downloadExcelWithResData } from '@/utils/index'
+
+export default {
+  name: 'CRMImport', // 文件导入
+  components: {
+    XhUserCell
+  },
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    },
+    // CRM类型
+    crmType: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      fieldList: [],
+      config: 1, // 	1 覆盖，2跳过
+      file: { name: '' },
+      user: [],
+
+      stepsActive: 1,
+      stepList: [
+        {
+          icon: 'wk wk-upload',
+          title: '上传文件',
+          status: 'wait'
+        },
+        {
+          icon: 'wk wk-data-import',
+          title: '导入数据',
+          status: 'wait'
+        },
+        {
+          icon: 'wk wk-success',
+          title: '导入完成',
+          status: 'wait'
+        }
+      ],
+      resultData: null,
+      processData: {
+        count: 0,
+        status: ''
+      },
+      messageId: null,
+      intervalTimer: null,
+
+      historyPopoverShow: false
+    }
+  },
+  computed: {
+    ...mapGetters(['userInfo']),
+
+    crmTypeName() {
+      return (
+        {
+          customer: '客户',
+          leads: '线索',
+          contacts: '联系人',
+          product: '产品'
+        }[this.crmType] || ''
+      )
+    },
+
+    sureTitle() {
+      return {
+        1: '立即导入',
+        2: '最小化',
+        3: '确定'
+      }[this.stepsActive]
+    },
+
+    showCancel() {
+      return this.stepsActive != 2
+    },
+
+    fieldUniqueInfo() {
+      const uniqueList = this.fieldList.filter(item => {
+        return item.isUnique == 1
+      })
+
+      return uniqueList.map(item => {
+        return item.name
+      }).join('/') || '无'
+    }
+  },
+  watch: {
+    show: function(val) {
+      if (val) {
+        if (this.stepsActive == 1) {
+          if (this.userInfo) {
+            this.user = [this.userInfo]
+          }
+        }
+
+        this.getField()
+      } else {
+        if (this.stepsActive == 3) {
+          this.resetData()
+        }
+
+        this.fieldList = []
+      }
+    },
+
+    stepsActive() {
+      this.$emit('status', {
+        1: 'wait',
+        2: 'process',
+        3: 'finish'
+      }[this.stepsActive])
+    }
+
+    // file() {
+    //   this.getFirstStepStatus()
+    // },
+
+    // user() {
+    //   this.getFirstStepStatus()
+    // }
+
+  },
+  mounted() {
+  },
+  methods: {
+    sureClick() {
+      if (this.stepsActive == 1) {
+        if (this.stepList[0].status == 'finish') {
+          this.stepList[1].status = 'process'
+          this.stepsActive = 2
+          this.firstUpdateFile(res => {
+            this.messageId = res.data
+            this.secondQueryNum()
+            this.intervalTimer = setInterval(() => {
+              if (this.processData.status == 'end') {
+                clearInterval(this.intervalTimer)
+                this.intervalTimer = null
+                this.thirdQueryResult()
+              } else {
+                this.secondQueryNum()
+              }
+            }, 2000)
+          })
+        } else {
+          if (!this.file.name) {
+            this.$message.error('请选择导入文件')
+          } else if (
+            this.crmType != 'customer' &&
+            (!this.user || this.user.length == 0)
+          ) {
+            this.$message.error('请选择负责人')
+          }
+        }
+      } else {
+        this.closeView()
+      }
+    },
+
+
+    /**
+     * 第一步上传
+     */
+    firstUpdateFile(result) {
+      var params = {}
+      params.repeatHandling = this.config
+      params.file = this.file
+      params.ownerUserId = this.user.length > 0 ? this.user[0].userId : ''
+      var request = {
+        customer: crmCustomerExcelImport,
+        leads: crmLeadsExcelImport,
+        contacts: crmContactsExcelImport,
+        product: crmProductExcelImport
+      }[this.crmType]
+      this.loading = true
+      request(params)
+        .then(res => {
+          if (result) {
+            result(res)
+          }
+        })
+        .catch(() => {
+          if (result) {
+            result(false)
+          }
+          this.loading = false
+        })
+    },
+
+    /**
+     * 第二步查询数量
+     */
+    secondQueryNum() {
+      crmQueryImportNumAPI({ messageId: this.messageId })
+        .then(res => {
+          if (res.data === null) {
+            this.processData.status = 'end'
+          } else {
+            this.processData.status = ''
+            this.processData.count = res.data
+          }
+        })
+        .catch(() => {
+          // this.processData.status = 'err'
+        })
+    },
+
+    /**
+     * 第三部 查询结果
+     */
+    thirdQueryResult() {
+      crmQueryImportInfoAPI({ messageId: this.messageId })
+        .then(res => {
+          this.loading = false
+          this.stepList[1].status = 'finish'
+          this.stepsActive = 3
+          this.$emit('status', 'finish')
+          if (res) {
+            this.resultData = res
+            if (res.errSize > 0) {
+              this.stepList[2].status = 'error'
+            } else {
+              this.stepList[2].status = 'finish'
+            }
+          }
+        })
+        .catch(() => {})
+    },
+
+    /**
+     * 下载错误模板
+     */
+    downloadErrData() {
+      this.loading = true
+      crmDownImportErrorAPI({ messageId: this.messageId })
+        .then(res => {
+          downloadExcelWithResData(res)
+          this.loading = false
+        })
+        .catch(() => {
+          this.loading = false
+        })
+    },
+
+    // 下载模板操作
+    download() {
+      const request = {
+        customer: crmCustomerDownloadExcelAPI,
+        leads: crmLeadsDownloadExcelAPI,
+        contacts: crmContactsDownloadExcelAPI,
+        product: crmProductDownloadExcelAPI
+      }[this.crmType]
+      request()
+        .then(res => {
+          var blob = new Blob([res.data], {
+            type: 'application/vnd.ms-excel;charset=utf-8'
+          })
+          var downloadElement = document.createElement('a')
+          var href = window.URL.createObjectURL(blob) // 创建下载的链接
+          downloadElement.href = href
+          downloadElement.download =
+            decodeURI(
+              res.headers['content-disposition'].split('filename=')[1]
+            ) || '' // 下载后文件名
+          document.body.appendChild(downloadElement)
+          downloadElement.click() // 点击下载
+          document.body.removeChild(downloadElement) // 下载完成移除元素
+          window.URL.revokeObjectURL(href) // 释放掉blob对象
+        })
+        .catch(() => {})
+    },
+    // 选择文件
+    selectFile() {
+      document.getElementById('importInputFile').click()
+    },
+    /** 图片选择出发 */
+    uploadFile(event) {
+      var files = event.target.files
+      const file = files[0]
+      this.file = file
+      event.target.value = ''
+
+      // 阶段一状态
+      this.getFirstStepStatus()
+    },
+    // 用户选择
+    userSelect(data) {
+      if (data.value && data.value.length > 0) {
+        this.user = data.value
+      } else {
+        this.user = []
+      }
+
+      // 阶段一状态
+      this.getFirstStepStatus()
+    },
+
+    getFirstStepStatus() {
+      // 阶段一状态
+      const hasFile = this.file && this.file.size
+      const hasUser = this.user && this.user.length > 0
+
+      if (this.crmType === 'customer') {
+        this.stepList[0].status = hasFile ? 'finish' : 'wait'
+      } else {
+        this.stepList[0].status = hasFile && hasUser ? 'finish' : 'wait'
+      }
+    },
+
+    // 关闭操作
+    closeView() {
+      this.$emit('update:show', false)
+      this.$emit('close', this.stepsActive == 3 ? 'finish' : '')
+    },
+
+    /**
+     * 重置页面数据
+     */
+    resetData() {
+      this.config = 1
+      this.file = { name: '' }
+      this.user = []
+
+      this.stepsActive = 1
+      this.stepList = [
+        {
+          icon: 'wk wk-upload',
+          title: '上传文件',
+          status: 'wait'
+        },
+        {
+          icon: 'wk wk-data-import',
+          title: '导入数据',
+          status: 'wait'
+        },
+        {
+          icon: 'wk wk-success',
+          title: '导入完成',
+          status: 'wait'
+        }
+      ]
+      this.resultData = null
+      this.processData = {
+        count: 0,
+        status: ''
+      }
+      this.messageId = null
+    },
+
+    /**
+     * 获取验证字段
+     */
+    getField() {
+      var params = {
+        label: crmTypeModel[this.crmType]
+      }
+
+      filedGetField(params)
+        .then(res => {
+          this.fieldList = res.data
+        })
+        .catch(() => {
+        })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.el-steps {
+  margin-bottom: 15px;
+
+  /deep/ .el-step__title {
+    font-size: 14px;
+  }
+
+  /deep/ .el-step.is-simple .el-step__arrow::before,
+  /deep/ .el-step.is-simple .el-step__arrow::after {
+    height: 10px;
+    width: 2px;
+  }
+
+  /deep/ .el-step.is-simple .el-step__arrow::after {
+    transform: rotate(45deg) translateY(3px);
+  }
+  /deep/ .el-step.is-simple .el-step__arrow::before {
+    transform: rotate(-45deg) translateY(-2px);
+  }
+}
+
+.step-section {
+  min-height: 300px;
+
+  /deep/ .el-loading-spinner {
+    top: 45%;
+    .el-icon-loading {
+      font-size: 40px;
+      color: #999;
+    }
+
+    .el-loading-text {
+      color: #333;
+    }
+  }
+}
+
+.sections {
+  font-size: 14px;
+  color: #333;
+
+  &__title {
+    font-weight: 600;
+  }
+
+  &__tips {
+    padding-left: 30px;
+    margin: 8px 0 15px;
+    color: #999;
+    font-size: 12px;
+    line-height: 1.4;
+  }
+
+  .download {
+    cursor: pointer;
+    color: #2362FB;
+  }
+
+}
+
+.sections__tips + .content {
+  padding-top: 0;
+}
+
+.content {
+  padding: 10px 10px 10px 30px;
+  .el-select {
+    width: 400px;
+  }
+  .user-cell {
+    width: 400px;
+  }
+}
+
+#importInputFile {
+  display: none;
+}
+
+.file-select {
+  .el-input {
+    width: 400px;
+  }
+  button {
+    margin-left: 20px;
+  }
+}
+
+.is-hidden {
+  visibility: hidden;
+}
+
+.history-btn {
+  float: left;
+  margin-left: 15px;
+}
+
+
+// 结果信息
+.result-info {
+  text-align: center;
+  padding-top: 80px;
+
+  &__icon {
+    font-size: 40px;
+    color: #3E84E9;
+  }
+
+  &__des {
+    margin-top: 15px;
+    color: #333;
+    font-size: 14px;
+  }
+
+  &__detail {
+    margin-top: 15px;
+    font-size: 12px;
+    color: #666;
+    &--all {
+      color: #333;
+      font-weight: 600;
+    }
+
+    &--suc {
+      color: #3E84E9;
+      font-weight: 600;
+    }
+
+    &--err {
+      color: #f94e4e;
+      font-weight: 600;
+    }
+  }
+
+  &__btn--err {
+    margin-top: 10px;
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/CRMImport.vue b/vue/src/views/pg-fis/components/CRMImport.vue
new file mode 100644
index 00000000..0ccf73ac
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMImport.vue
@@ -0,0 +1,591 @@
+<template>
+  <el-dialog
+    :visible="show"
+    :title="'导入'+crmTypeName"
+    :append-to-body="true"
+    :close-on-click-modal="false"
+    width="600px" 
+    @close="closeView">
+   <div class="dialog-body">
+      <div v-if="stepsActive == 1" class="step-section">
+       
+         <div class="sections">
+          <div class="sections__title" v-loading="loading">
+            一、初始生成模板：
+            <span class="download" @click="createTemplate">点击生成《{{ crmTypeName }}导入模板》</span>
+           <div class="sections__tips">通过值映射，可保持生成的模板最新，例如自动生成下拉列表项！</div>
+          </div>
+        </div>
+        <div class="sections">
+          <div class="sections__title">
+            二、请按照数据模板的格式准备要导入的数据。
+            <span class="download" @click="download">点击下载《{{ crmTypeName }}导入模板》</span>
+          </div>
+          <div class="sections__tips">1、模板名称可以进行修改，但不要删除模板中设置的字段！</div>
+          <div class="sections__tips" style="margin-top:-10px;">2、必填项列头会标红标*！</div>
+           <div class="sections__tips" style="margin-top:-10px;">3、导入文件请勿超过2MB！且只能上传Excel，但不支持“.xls”文件，即不支持Excel97-2003!</div>
+        </div>
+        <div class="sections">
+          <div class="sections__title">三、请选择需要导入的文件</div>
+          <div class="content">
+            <flexbox class="file-select">
+               <el-upload
+                  ref="upload"
+                    class="avatar-uploader"
+                    drag
+                    action="#"
+                    :http-request="httpRequestfiles"
+                    :headers="httpHeader"
+                    :file-list="fileuploadList"
+                    :before-upload="beforeAvatarUpload"
+                    :before-remove="beforeRemove"
+                    :on-remove="handleRemove"
+                    multiple
+                    :limit="1">
+                    <i class="el-icon-upload" ></i>
+                      <div class="el-upload__text">
+                          将文件拖到此处，或
+                          <em>点击上传</em>
+                      </div>
+              </el-upload>
+            </flexbox>
+          </div>
+        </div>
+       
+      </div>
+
+      <div
+        v-loading="loading"
+        v-else-if="stepsActive == 2"
+        element-loading-text="数据导入中,请耐心等待..."
+        element-loading-spinner="el-icon-loading"
+        class="step-section"
+      />
+
+        <div
+        v-loading="loading"
+        v-else-if="stepsActive == 3"
+        class="step-section">
+        <div class="result-info">
+        <el-card style="height:300px;margin-top:-20px" shadow="always">
+          <i class="wk wk-success result-info__icon" />
+          <p class="result-info__des">数据导入结果：</p>
+          <!-- <p class="result-info__detail">导入总数据<span class="result-info__detail--all">{{ this.resultData.totalSize }}</span>条，导入成功<span class="result-info__detail--suc">{{ this.resultData.totalSize - this.resultData.errSize }}</span>条，导入失败<span class="result-info__detail--err">{{ this.resultData.errSize }}</span>条</p> -->
+          <p class="result-info__detail">导入总数据<span class="result-info__detail--all">{{ this.resultData.totalSize }}</span>条，导入成功<span class="result-info__detail--suc">{{ this.resultData.succeessSize }}</span>条，导入失败<span class="result-info__detail--err">{{ this.resultData.errSize }}</span>条</p>
+          <el-button
+            v-if="this.resultData && this.resultData.errSize > 0"
+            class="result-info__btn--err"
+            type="text"
+            @click="downloadErrData">下载错误数据</el-button>
+          </el-card>
+        </div>
+      </div>
+
+      <div
+        v-loading="loading"
+        v-else-if="stepsActive ==4"
+        class="step-section">
+        <div class="result-info">
+          <el-card style="height:300px" shadow="always">
+          <i class="wk wk-success result-info__icon" />
+          <p class="result-info__des">数据导入结果：</p>
+          <!-- <p class="result-info__detail">导入总数据<span class="result-info__detail--all">{{ this.resultData.totalSize }}</span>条，导入成功<span class="result-info__detail--suc">{{ this.resultData.totalSize - this.resultData.errSize }}</span>条，导入失败<span class="result-info__detail--err">{{ this.resultData.errSize }}</span>条</p> -->
+          <p class="result-info__detail">导入总数据<span class="result-info__detail--all">{{ this.resultData.totalSize }}</span>条，导入成功<span class="result-info__detail--suc">{{ this.resultData.succeessSize }}</span>条，当前失败<span class="result-info__detail--err">{{ this.resultData.errSize }}</span>条</p>
+           <p class="result-info__detail--err" >数据错误信息：</p>
+          <p class="result-info__detail">{{this.resultData.errMessage}}</p>
+           </el-card>
+        </div>      
+      </div>
+     
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-popover
+        v-model="historyPopoverShow"
+        placement="top"
+        width="800"
+        popper-class="no-padding-popover"
+        trigger="click"
+      >
+        
+      </el-popover>
+
+      <!-- <el-button  @click="closeView">取消</el-button> -->
+      <el-button
+        :class="{ 'is-hidden': !showCancel }"
+        @click="closeView">取消</el-button>
+       <el-button
+        v-if="sureTitle"
+        type="primary"
+        @click="sureClick">{{ sureTitle }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+
+import {downloadFile} from '@/utils/crmindex.js'
+import { getToken } from '@/utils/auth' // get token from cookie
+//业务--生成模板接口
+import { winUomGroupExcelImportTemplate,winUomGroupExcelImport} from '@/api/uomGroup/uomGroup'
+
+
+
+export default {
+  name: "CRMImport", // 文件导入
+  props: {
+    show: {
+      type: Boolean,
+      default: false,
+    },
+    // CRM类型
+    crmType: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      fieldList: [],
+      config: 1, // 	1 覆盖，2跳过
+      //file: { name: "" },
+      user: [],
+
+      stepsActive: 1,
+      stepList: [
+        {
+          icon: "wk wk-upload",
+          title: "上传文件",
+          status: "wait",
+        },
+        {
+          icon: "wk wk-data-import",
+          title: "导入数据",
+          status: "wait",
+        },
+        {
+          icon: "wk wk-success",
+          title: "导入完成",
+          status: "wait",
+        },
+      ],
+      //resultData: null,
+      resultData:{
+        totalSize:0,
+        errSize:0,
+        errTemplate:"",
+        errMessage:""
+      },
+      processData: {
+        count: 0,
+        status: "",
+      },
+      messageId: null,
+      intervalTimer: null,
+      fileuploadList:[],
+      isLt2M:"",
+      isFileType:"",
+      historyPopoverShow: false,
+    };
+  },
+   computed: {
+    sureTitle() {
+      return {
+        1: '立即导入',
+        2: '最小化',
+        3: '确定'
+      }[this.stepsActive]
+    },
+    showCancel() {
+      return this.stepsActive != 2
+    },
+    crmTypeName() {//根据传入的crmType进行翻译
+      return (
+        {
+          uomGroup: "计量单位组",
+        }[this.crmType] || ""
+      );
+    },
+    getImportTemplate() {//模板名称
+      return (
+        {
+          uomGroup: '计量单位组信息导入模板.xlsx',
+        }[this.crmType] || ""
+      );
+    },
+     httpHeader() {
+      return {
+        'Authorization':'Bearer ' + getToken()
+      }
+    }
+  },
+  watch: {
+    show: function (val) {
+       if (val) {
+        this.stepsActive = 1
+      } else {
+        if (this.stepsActive == 3) {
+          //以下是重置数据
+          this.stepsActive = 1
+          this.stepList = [
+            {
+              icon: 'wk wk-upload',
+              title: '上传文件',
+              status: 'wait'
+            },
+            {
+              icon: 'wk wk-data-import',
+              title: '导入数据',
+              status: 'wait'
+            },
+            {
+              icon: 'wk wk-success',
+              title: '导入完成',
+              status: 'wait'
+            }
+          ]
+          this.resultData = null
+        }
+      }
+    },
+
+    stepsActive() {
+      this.$emit(
+        "status",
+        {
+          1: "wait",
+          2: "process",
+          3: "finish",
+        }[this.stepsActive]
+      );
+    },
+  },
+  mounted() {},
+  methods: {
+    handleImportExcelClick() {//父组件中，初始化此子组件时调用
+      this.fileuploadList = [];
+      //this.$refs.upload.clearFiles();
+    },
+    httpRequestfiles(data) {
+      let _this = this;
+      let rd = new FileReader(); // 创建文件读取对象
+      let file = data.file;
+      this.fileuploadList.push(file);
+      rd.readAsDataURL(file); // 文件读取装换为base64类型
+    },
+     beforeAvatarUpload(file) {
+      var FileExt = file.name.replace(/.+\./, "");       
+        if (['xlsx'].indexOf(FileExt.toLowerCase()) === -1){            
+            this.$message({ 
+                type: 'warning', 
+                message: '只支持xlsx类型文件！' 
+            });   
+            this.isFileType="0"             
+            return false;       
+        } 
+        else{
+            this.isFileType="1"
+        } 
+      this.isLt2M = file.size / 1024 / 1024 < 2?'1':'0'; 
+      if (this.isLt2M==="0") {
+        this.$message.error("上传文件大小不能超过 2MB!");
+      }
+      return this.isLt2M==='1'?true: false;
+    },
+    beforeRemove(file, fileList) {
+        if (this.isLt2M==="1" && this.isFileType==="1") {
+         return this.$confirm(`确定移除 ${ file.name }？`);
+        }
+    },
+    handleRemove(file, fileList) {//附件列表删除操作
+      const index=this.fileuploadList.indexOf(file.originFileObj)
+      const newFileList=this.fileuploadList.slice()
+      newFileList.splice(index,1)
+      this.fileuploadList = newFileList;
+    },
+    //执行按钮
+    sureClick() {
+      if (this.fileuploadList===[] || JSON.stringify(this.fileuploadList) === "[]") {
+        this.$message.error("请选择导入文件");
+        return false;
+      }
+      if (this.stepsActive == 1) {
+        if (this.stepList[0].status == "wait") {
+           this.stepsActive = 2;
+           this.loading = true; 
+           setTimeout(() => {
+             this.saveTemplateData();
+            }, 2000)
+           if( this.stepList[1].status == 'finish')
+           {
+
+           }
+        } else {
+          if (this.fileuploadList === "[]") {
+            this.$message.error("请选择导入文件");
+          } 
+        }
+      } else {
+        this.closeView();
+      }
+    },
+    
+    saveTemplateData() {//保存项目、合同管理、客户等信息的共用方法
+      //--上传附件，批量或拖拽
+      if (JSON.stringify(this.fileuploadList) != "[]") {
+        let fd = new FormData();
+        const{fileuploadList}=this;
+        fileuploadList.forEach(file=>{
+            fd.append("files", file); // 添加文件
+        })
+        console.log("fd:"+JSON.stringify(fd))
+        var request = {
+            uomGroup: winUomGroupExcelImport
+        }[this.crmType]
+         request(fd)
+            .then((res) => {//此处，导出模板上设置的错误
+              this.loading = false;
+              this.resultData = res;
+              if(res.errSize>0 && res.errMessage==="RowErrors"){//上传有错误数据 && res.errMessage.length <= 0
+                this.stepList[0].status = 'wait';
+                this.resultData.errSize=res.errSize;//错误数据个数
+                this.resultData.errTemplate=res.errTemplate;//指定错误模板名称，作为参数，用于错误模板下载
+                this.stepsActive = 3;
+              }
+              else{
+                if(res.errMessage.length > 0 && res.errMessage !="SccessData"){//此处，是判断数据库中是否匹配
+                  this.stepsActive = 4;
+                }
+                else {
+                  this.stepList[1].status = 'finish'
+                  this.resultData.totalSize=res.totalSize;//返回导入成功的数据总数
+                  if (this.isLt2M==="1" 
+                    && this.isFileType==="1"
+                    && res.errMessage ==="SccessData"
+                    && res.totalSize>0) {
+                    this.$notify({
+                      title: "成功",
+                      message: "数据导入成功！",
+                      type: "success",
+                      duration: 2000,
+                    });
+                  }
+                  this.stepsActive = 3;
+                }
+              }
+              this.$emit("save-success", {
+                type: this.crmType
+              });
+              this.$emit('status', 'finish');
+            })
+            .catch(() => {this.loading = false;});
+          } else {
+            this.loading = false;
+            this.$message({
+                message: "未上传任何附件，请查检！",
+                type: "warning",
+              });
+            }
+    },
+
+     /**
+     * 下载错误模板数据等（统一接口） 
+     */
+    downloadErrData() {
+      var fileName=this.getImportTemplate;
+      this.$axios
+        .BolbGets("/api/basedataservice/exceltemplate/downloadExcelFiles/" + this.resultData.errTemplate)
+        .then((response) => {
+            downloadFile(response,fileName);
+       });
+    },
+    /**
+     * 生成模板，引入相关业务接口 
+     */
+    createTemplate(){
+    var request = {
+        uomGroup: winUomGroupExcelImportTemplate
+      }[this.crmType]
+      //this.loading = true
+      request()
+        .then(res => {
+            result(res)
+            this.loading = false
+            this.$notify({
+                    title: "成功",
+                    message: "模板生成成功！",
+                    type: "success",
+                    duration: 2000,
+                });
+        })
+        .catch(() => {
+          this.loading = false
+        })
+    },
+    // 下载模板操作)(统一接口)
+    download() {
+       var fileName=this.getImportTemplate;
+       this.loading = true
+       this.$axios
+        .BolbGets("/api/basedataservice/exceltemplate/downloadExcelTemplate/" + fileName)
+        .then((response) => {
+          downloadFile(response,fileName);
+          this.loading = false
+      })
+      .catch(() => {
+          this.loading = false
+        });
+    },
+    // 关闭操作
+    closeView() {
+      this.$emit("update:show", false);
+      this.$emit("close", this.stepsActive == 3 ? "finish" : "");
+    }
+
+  },
+};
+</script>
+<style scoped lang="scss">
+@import '@/styles/xr-theme.scss';
+.el-steps {
+  margin-bottom: 15px;
+
+  /deep/ .el-step__title {
+    font-size: 14px;
+  }
+
+  /deep/ .el-step.is-simple .el-step__arrow::before,
+  /deep/ .el-step.is-simple .el-step__arrow::after {
+    height: 10px;
+    width: 2px;
+  }
+
+  /deep/ .el-step.is-simple .el-step__arrow::after {
+    transform: rotate(45deg) translateY(3px);
+  }
+  /deep/ .el-step.is-simple .el-step__arrow::before {
+    transform: rotate(-45deg) translateY(-2px);
+  }
+}
+
+.step-section {
+  min-height: 300px;
+
+  /deep/ .el-loading-spinner {
+    top: 45%;
+    .el-icon-loading {
+      font-size: 40px;
+      color: #999;
+    }
+
+    .el-loading-text {
+      color: #333;
+    }
+  }
+}
+
+.sections {
+  font-size: 14px;
+  color: #333;
+
+  &__title {
+    font-weight: 600;
+  }
+
+  &__tips {
+    padding-left: 30px;
+    margin: 8px 0 15px;
+    color: #999;
+    font-size: 12px;
+    line-height: 1.4;
+  }
+
+  .download {
+    cursor: pointer;
+    color: #2362fb;
+  }
+}
+
+.sections__tips + .content {
+  padding-top: 0;
+  
+}
+
+.content {
+  padding: 10px 10px 10px 30px;
+  .el-select {
+    width: 400px;
+  }
+  .user-cell {
+    width: 400px;
+  }
+}
+
+#importInputFile {
+  display: none;
+}
+
+.file-select {
+  .el-input {
+    width: 400px;
+  }
+  button {
+    margin-left: 20px;
+  }
+}
+
+.is-hidden {
+  visibility: hidden;
+}
+
+.history-btn {
+  float: left;
+  margin-left: 15px;
+}
+
+// 结果信息
+.result-info {
+  text-align: center;
+  padding-top: 50px;
+
+  &__icon {
+    font-size: 40px;
+    color: $xr-color-primary;
+  }
+
+  &__des {
+    margin-top: -15px;
+    color: #333;
+    font-size: 30px;
+  }
+
+  &__detail {
+    margin-top: 35px;
+    font-size: 20px;
+    color: #666;
+    &--all {
+      color: #333;
+      font-weight: 600;
+    }
+
+    &--suc {
+      color: $xr-color-primary;
+      font-weight: 600;
+    }
+
+    &--err {
+      margin-top: 25px;
+      color: #f94e4e;
+      font-weight: 600;
+    }
+  }
+
+  &__btn--err {
+    margin-top: 10px;
+    font-size: 20px;
+  }
+}
+</style>
+
+
+
diff --git a/vue/src/views/pg-fis/components/CRMListHead.vue b/vue/src/views/pg-fis/components/CRMListHead.vue
new file mode 100644
index 00000000..9e103975
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMListHead.vue
@@ -0,0 +1,266 @@
+<template>
+  <div class="c-container">
+    <div class="title">{{ title }}</div>
+    <!-- <el-input
+      :placeholder="placeholder"
+      v-model="inputContent"
+      class="sc-container"
+      @input="inputChange"
+      @keyup.enter.native="searchInput" v-show="showSearch">
+      <el-button
+        slot="append"
+        icon="el-icon-search"
+        @click.native="searchInput"/>
+    </el-input> -->
+    <div class="right-container">
+      <el-button
+        size="small"
+        type="primary"
+        @click="createClick">{{ createTitle }}</el-button>
+      <el-dropdown
+        v-if="moreTypes.length > 0"
+        trigger="click"
+        @command="handleTypeDrop">
+        <flexbox class="right-more-item">
+          <div>更多</div>
+          <i
+            class="el-icon-arrow-down el-icon--right"
+            style="color:#777;"/>
+        </flexbox>
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item
+            v-for="(item, index) in moreTypes"
+            :key="index"
+            :command="item.type">{{ item.name }}</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+    </div>
+    <c-r-m-create-view
+      v-if="isCreate"
+      :crm-type="createCRMType"
+      :action="createActionInfo"
+      @save-success="createSaveSuccess"
+      @hiden-view="hideView"
+      width='700px'
+    />
+    <c-r-m-import
+      :show="showCRMImport"
+      :crm-type="crmType"
+      @save-success="createSaveSuccess"
+      @close="showCRMImport=false"/>
+    <c-r-m-export
+      :show="showCRMExport"
+      :crm-type="crmType"
+      :search="search"
+      :scene_id="scene_id"
+      :filter-obj="filterObj"
+      :export-params="exportParams"
+      @close="showCRMExport=false"/>
+  </div>
+</template>
+
+<script type="text/javascript">
+import { mapGetters } from 'vuex'
+import CRMCreateView from './CRMCreateView'
+import CRMImport from './CRMImport'
+import CRMExport from './CRMExport'
+import crmTypes from "../../../../static/crmTypes";
+
+export default {
+  name: 'CRMListHead', // 客户管理下 重要提醒 回款计划提醒
+  components: {
+    CRMCreateView,
+    CRMImport,
+    CRMExport
+  },
+  props: {
+    showSearch:{
+      type: Boolean,
+      default: true
+    },
+
+    // CRM类型
+    crmType: {
+      type: String,
+      default: ''
+    },
+    search: String,
+    scene_id: {
+      type: [Number, String],
+      default: ''
+    },
+    filterObj: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+    title: {
+      type: String,
+      default: ''
+    },
+    placeholder: {
+      type: String,
+      default: '请输入内容'
+    },
+    createTitle: {
+      type: String,
+      default: ''
+    },
+    inputContent: '',
+    /** 更多操作 */
+    moreTypes: [],
+    // 创建的相关信息
+    createActionInfo: { type: 'create' },
+    createCRMType: '',
+    isCreate: false, // 是创建
+    // 导入
+    showCRMImport: false,
+    // 导出
+    showCRMExport: false,
+    // 导出选中参数
+    exportParams: {}
+    }
+  },
+  computed: {
+    // ...mapGetters(['crm']),
+    // canSave() {
+    //   if (this.isSeas) {
+    //     return false
+    //   }
+    //   return this.crm[this.crmType].save
+    // }
+  },
+  mounted() {
+    // 线索和客户判断更多操作
+    
+    this.getTitle();
+    if (!this.isSeas) {
+      //if (this.crm[this.crmType].excelimport) {
+        this.moreTypes.push({ type: 'enter', name: '导入' })
+      //}
+      //if (this.crm[this.crmType].excelexport) {
+        this.moreTypes.push({ type: 'out', name: '导出全部' })
+     // }
+    } else {
+      // 客户池的导出关键字不同
+      //if (this.crm.pool.excelexport) {
+        this.moreTypes.push({ type: 'out', name: '导出全部' })
+     // }
+    }
+  },
+  methods: {
+    getTitle() {
+      let type=crmTypes[this.crmType];
+      if(type===undefined)
+      { 
+        this.title=this.crmType+'管理';
+        this.createTitle='新增'+this.crmType;
+      }
+      else
+      {
+        this.title= type.name+'管理'
+        this.createTitle='新增'+type.name;
+      }   
+    },
+
+    handleTypeDrop(command, params = {}) {
+      if (command == 'out') {
+        let paramsData = {}
+        if (params.__export) {
+          paramsData = params
+          delete paramsData.__export
+        } else {
+          paramsData = {}
+        }
+        this.exportParams = paramsData
+        this.showCRMExport = true
+      } else if (command == 'enter') {
+        this.showCRMImport = true
+      }
+    },
+    createClick() {
+
+      this.createCRMType = this.crmType
+      this.createActionInfo = { type: 'save' }
+      this.isCreate = !this.isCreate
+    },
+    inputChange() {
+      this.$emit('update:search', this.inputContent)
+    },
+    // 进行搜索操作
+    searchInput() {
+      this.$emit('on-search', this.inputContent)
+    },
+    // 创建数据页面 保存成功
+    createSaveSuccess(data) {
+      if (data && data.saveAndCreate) {
+        if (data.type == 'customer') {
+          this.createCRMType = 'contacts'
+          this.createActionInfo = {
+            type: 'relative',
+            crmType: 'customer',
+            data: {}
+          }
+          this.createActionInfo.data['customer'] = data.data
+          this.isCreate = true
+        }
+      } else {
+        // 回到保存成功
+        this.$emit('on-handle', { type: 'save-success' })
+      }
+    },
+    hideView() {
+      this.isCreate = false
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.c-container {
+  height: 60px;
+  position: relative;
+  z-index: 100;
+  .title {
+    float: left;
+    padding: 0 20px;
+    font-size: 18px;
+    line-height: 60px;
+  }
+  .sc-container {
+    width: 300px;
+    margin: -18px 0 0 -150px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+  }
+
+  .right-container {
+    margin-right: -10px;
+    float: right;
+    margin: 12px 20px 0 0;
+    position: relative;
+    .right-item {
+      float: left;
+      margin-right: 10px;
+      padding: 8px 10px;
+      font-size: 13px;
+      border-radius: 2px;
+    }
+
+    .right-more-item {
+      cursor: pointer;
+      border: 1px solid #dcdfe6;
+      background-color: white;
+      font-size: 13px;
+      color: #777;
+      padding: 0 12px;
+      border-radius: 2px;
+      height: 31px;
+    }
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/CRMTableHead.vue b/vue/src/views/pg-fis/components/CRMTableHead.vue
new file mode 100644
index 00000000..3ff145da
--- /dev/null
+++ b/vue/src/views/pg-fis/components/CRMTableHead.vue
@@ -0,0 +1,399 @@
+<template>
+  <div>
+    <flexbox v-show="selectionList.length == 0" class="th-container">
+      <!-- <div v-if="!isSeas">场景：</div>
+      <div @click="getAllClick" class="condition_title">
+        {{ sceneData.name || getDefaultSceneName() }}
+      </div> -->
+      <img
+        :style="{ 'margin-left': isSeas ? 0 : '30px' }"
+        class="c-filtrate"
+        src="@/assets/img/c_filtrate.png"
+        @click="showFilterClick"
+      />
+      <div class="condition_title" @click="showFilterClick">高级筛选</div>
+      <filter-form
+        :field-list="fieldList"
+        :dialog-visible.sync="showFilter"
+        :obj="filterObj"
+        :crm-type="crmType"
+        :is-seas="isSeas"
+        @filter="handleFilter"
+      />
+    </flexbox>
+
+    <scene-set
+      :dialog-visible.sync="showSceneSet"
+      :crm-type="crmType"
+      @save-success="updateSceneList"
+    />
+    <scene-create
+      :field-list="fieldList"
+      :crm-type="crmType"
+      :dialog-visible.sync="showSceneCreate"
+      :obj="sceneFilterObj"
+      @saveSuccess="updateSceneList"
+    />
+  </div>
+</template>
+
+<script type="text/javascript">
+import { mapGetters } from "vuex";
+import crmTypeModel from "@/views/ux/model/crmTypeModel";
+//获取表格列
+import {
+  filterIndexfields,
+  // crmSceneSave
+} from "@/api/ux/common";
+
+import filterForm from "./filterForm";
+import filterContent from "./filterForm/filterContent";
+import SceneSet from "./sceneForm/SceneSet"; // 场景设置
+import SceneCreate from "./sceneForm/SceneCreate";
+import data from "../../../../static/tableFieldForSearch";
+import crmtypes from "../../../../static/crmTypes";
+
+export default {
+  name: "CRMTableHead", // 客户管理下 重要提醒 回款计划提醒
+  components: {
+    filterForm,
+    filterContent,
+    SceneCreate,
+    SceneSet,
+  },
+  props: {
+    title: {
+      type: String,
+      default: "",
+    },
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: "",
+    },
+    // 辅助 使用 公海没有场景
+    isSeas: {
+      type: Boolean,
+      default: false,
+    },
+    //父ID,主要用于批量删除
+    parentID: {
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      sceneTypes: [
+        { type: "enter", name: "我负责的" },
+        { type: "out", name: "我" },
+      ],
+      sceneType: null,
+      showScene: false, // 场景操作
+      showFilter: false, // 控制筛选框
+      fieldList: [],
+      filterObj: { form: [] }, // 筛选确定数据
+
+      sceneData: { id: "", bydata: "", name: "" },
+      showSceneSet: false, // 展示场景设置
+      showSceneCreate: false, // 展示场景添加
+      sceneFilterObj: { form: [] }, // 筛选确定数据
+
+      /** 勾选操作数据 */
+      selectionList: [],
+      transferDialogShow: false,
+      teamsDialogShow: false, // 团队操作提示框
+      teamsTitle: "", // 团队操作标题名
+      allocDialogShow: false, // 公海分配操作提示框
+      dealStatusShow: false, // 成交状态修改框
+      crmTypes: {},
+    };
+  },
+  computed: {},
+  watch: {},
+  mounted() {},
+  methods: {
+    /** 发布 时候的类型选择 */
+    handleTypeDrop(command) {
+      this.sceneType = command;
+    },
+    /** 搜索全部 */
+    getAllClick() {
+      //清空搜索条件
+      this.filterObj = { form: [] };
+      this.$emit("filter", null);
+    },
+    /** 展示高级筛选 */
+    showFilterClick() {
+      this.getFilterFieldInfo();
+    },
+    // 获取高级筛选字段数据
+    getFilterFieldInfo() {
+      this.fieldList = data[this.crmType].data;
+      this.showFilter = true;
+    },
+    handleFilter(form) {
+      this.showFilter = false;
+      if (form === null) {
+        this.$emit("filter", null);
+      } else {
+        this.filterObj = form;
+        this.showFilter = false;
+        if (form.saveChecked) {
+          crmSceneSave({
+            type: crmTypeModel[this.crmType],
+            isDefault: form.saveDefault ? 1 : 0,
+            name: form.saveName,
+            data: JSON.stringify(form.obj),
+          })
+            .then((res) => {
+              this.updateSceneList();
+            })
+            .catch(() => {});
+        }
+        this.$emit("filter", form.obj);
+        //this.$emit('filter', form.form)
+      }
+    },
+    //清空条件
+    handleClearField() {
+      this.filterObj = data.obj;
+    },
+    // 场景操作
+    /** 选择了场景 */
+    sceneSelect(data) {
+      this.sceneData = data;
+      this.$emit("scene", data);
+    },
+    sceneHandle(data) {
+      if (data.type == "set") {
+        this.showSceneSet = true;
+      } else if (data.type == "add") {
+        filterIndexfields({
+          label: crmTypeModel[this.crmType],
+        })
+          .then((res) => {
+            this.fieldList = res.data;
+            this.showSceneCreate = true;
+          })
+          .catch(() => {});
+      }
+    },
+    /**  创建保存成功 */
+    updateSceneList() {
+      this.$refs.sceneList.getSceneList();
+    },
+    /** 勾选后的表头操作 */
+    headSelectionChange(array) {
+      this.selectionList = array;
+    },
+    /** 操作 */
+    selectionBarClick(type) {
+      var message = "";
+      if (type == "export") {
+        message = "确定要导出这些数据嘛?";
+      } else if (type == "delete") {
+        message = "确定要删除这些数据嘛?";
+      }
+      this.$confirm(message, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.confirmHandle(type);
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消操作",
+          });
+        });
+    },
+
+    confirmHandle(type) {
+      if (type === "export") {
+        this.handleExport();
+      }
+    },
+    handleExport() {
+      const params = {};
+      params["ids"] = this.selectionList
+        .map((item) => {
+          return item[this.crmType + "Id"];
+        })
+        .join(",");
+      params.__export = true;
+      this.$emit("exportData", params);
+    },
+
+    deleteItemsCallBack() {
+      this.$message({
+        type: "success",
+        message: "删除成功",
+      });
+      this.$emit("handle", { type: "delete" });
+    },
+    /** 获取展示items */
+    getSelectionHandleItemsInfo() {
+      const handleInfos = {
+        export: {
+          name: "导出选中",
+          type: "export",
+          icon: require("@/assets/img/selection_export.png"),
+        },
+        delete: {
+          name: "批量删除",
+          type: "delete",
+          icon: require("@/assets/img/selection_delete.png"),
+        },
+      };
+
+      return this.forSelectionHandleItems(handleInfos, ["export", "delete"]);
+    },
+    forSelectionHandleItems(handleInfos, array) {
+      var tempsHandles = [];
+      for (let index = 0; index < array.length; index++) {
+        tempsHandles.push(handleInfos[array[index]]);
+      }
+      return tempsHandles;
+    },
+    // 判断是否展示
+    whetherTypeShowByPermision: function (type) {
+      if (type == "transfer") {
+        return this.sceneData.bydata == "transform"
+          ? false
+          : this.crm[this.crmType].transfer;
+      } else if (type == "transform") {
+        return this.sceneData.bydata == "transform"
+          ? false
+          : this.crm[this.crmType].transform;
+      } else if (type == "export") {
+        if (this.isSeas) {
+          return this.crm.pool.excelexport;
+        }
+        return this.crm[this.crmType].excelexport;
+      } else if (type == "delete") {
+        return this.crm[this.crmType].delete;
+      } else if (type == "put_seas") {
+        // 放入公海(客户)
+        return this.crm[this.crmType].putinpool;
+      } else if (type == "lock" || type == "unlock") {
+        // 锁定解锁(客户)
+        return (
+          this.crm[this.crmType].lock && this.CRMConfig.customerConfig == 1
+        );
+      } else if (type == "add_user" || type == "delete_user") {
+        // 添加 移除团队成员
+        return this.crm[this.crmType].teamsave;
+      } else if (type == "alloc") {
+        // 分配(公海)
+        return this.crm.pool.distribute;
+      } else if (type == "get") {
+        // 领取(公海)
+        return this.crm.pool.receive;
+      } else if (type == "start") {
+        // 上架 下架(产品)
+        for (let index = 0; index < this.selectionList.length; index++) {
+          const element = this.selectionList[index];
+          if (element.是否上下架 == "上架") {
+            return false;
+          }
+        }
+        return this.crm[this.crmType].status;
+      } else if (type == "disable") {
+        // 上架 下架(产品)
+        for (let index = 0; index < this.selectionList.length; index++) {
+          const element = this.selectionList[index];
+          if (element.是否上下架 == "下架") {
+            return false;
+          }
+        }
+        return this.crm[this.crmType].status;
+      } else if (type == "deal_status") {
+        // 客户状态修改
+        return this.crm[this.crmType].dealStatus;
+      }
+      return true;
+    },
+    // 子组件 回调的 结果
+    handleCallBack(data) {
+      this.$emit("handle", { type: data.type });
+    },
+    // 获取默认场景名字
+    getDefaultSceneName() {
+      //add-场景
+      this.crmTypes = crmtypes;
+      let type = this.crmTypes[this.crmType];
+      if (type === undefined) {
+        return "全部" + this.crmType;
+      } else {
+        return "全部" + type.name;
+      }
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+@import "../../../styles/xr-theme";
+.th-container {
+  font-size: 13px;
+  height: 50px;
+  padding: 0 20px;
+}
+/** 场景和筛选 */
+.condition_title {
+  cursor: pointer;
+}
+.condition_title:hover {
+  color: $xr-color-primary;
+}
+
+.m-arrow {
+  margin: 0 8px;
+}
+.c-filtrate {
+  margin: 0 10px 0 30px;
+  width: 12px;
+}
+
+/** 勾选操作 */
+.selection-bar {
+  font-size: 12px;
+  height: 50px;
+  padding: 0 20px;
+  color: #777;
+
+  .selected—title {
+    flex-shrink: 0;
+    padding-right: 20px;
+    border-right: 1px solid $--table-border-color;
+    .selected—count {
+      color: $xr-color-primary;
+    }
+  }
+}
+
+.selection-items-box {
+  overflow-x: auto;
+  overflow-y: hidden;
+  .selection-item {
+    width: auto;
+    padding: 15px;
+    flex-shrink: 0;
+    .selection-item-icon {
+      display: block;
+      margin-right: 5px;
+      width: 15px;
+      height: 15px;
+    }
+    .selection-item-name {
+      cursor: pointer;
+      color: #777;
+    }
+    .selection-item-name:hover {
+      color: $xr-color-primary;
+    }
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/MixAdd.vue b/vue/src/views/pg-fis/components/MixAdd.vue
new file mode 100644
index 00000000..6083d3c4
--- /dev/null
+++ b/vue/src/views/pg-fis/components/MixAdd.vue
@@ -0,0 +1,601 @@
+<template>
+  <div class="mix-container">
+    <div class="i-cont">
+      <el-input
+        ref="textarea"
+        v-model="content"
+        :autosize="inputAutosize"
+        type="textarea"
+        clearable
+        resize="none"
+        placeholder="请输入内容"
+        @focus="inputFocus"/>
+    </div>
+    <section
+      v-if="imgFiles.length > 0"
+      class="img-cont">
+      <flexbox wrap="wrap">
+        <div
+          v-for="(item, index) in imgFiles"
+          :key="index"
+          :style="{ 'background-image': 'url('+item.url+')' }"
+          class="img-item"
+          @mouseover="mouseImgOver(item, index)"
+          @mouseleave="mouseImgLeave(item, index)">
+          <div
+            v-if="item.showDelete"
+            class="img-delete"
+            @click="deleteImgOrFile('image', item, index)">×</div>
+        </div>
+        <div class="img-item-add">
+          <input
+            type="file"
+            class="img-item-iput"
+            accept="image/*"
+            multiple
+            @change="uploadFile">
+        </div>
+      </flexbox>
+      <div
+        class="img-bar"
+        @click="deleteAllImg">全部删除</div>
+    </section>
+    <section
+      v-if="files.length > 0"
+      class="file-cont">
+      <flexbox class="f-header">
+        <img
+          class="f-logo"
+          src="@/assets/img/send_file.png">
+        <div class="f-name">附件</div>
+      </flexbox>
+      <div class="f-body">
+        <flexbox
+          v-for="(item, index) in files"
+          :key="index"
+          class="f-item">
+          <img
+            :src="item.icon"
+            class="f-img">
+          <div class="f-name">{{ item.name+'('+item.size+')' }}</div>
+          <div
+            class="close-button"
+            @click="deleteImgOrFile('file', item, index)">×</div>
+        </flexbox>
+      </div>
+      <div
+        class="img-bar"
+        @click="files=[]">全部删除</div>
+    </section>
+    <section
+      v-if="business.length > 0"
+      class="c-cont">
+      <flexbox class="c-header">
+        <img
+          class="c-logo"
+          src="@/assets/img/send_business.png">
+        <div class="c-name">商机</div>
+      </flexbox>
+      <div class="c-body">
+        <flexbox wrap="wrap">
+          <flexbox
+            v-for="(item, index) in business"
+            :key="index"
+            class="c-item">
+            <div class="c-item-name">{{ item.businessName }}</div>
+            <div
+              class="c-item-close"
+              @click="business.splice(index, 1)">×</div>
+          </flexbox>
+        </flexbox>
+      </div>
+    </section>
+    <section
+      v-if="contacts.length > 0"
+      class="c-cont">
+      <flexbox class="c-header">
+        <img
+          class="c-logo"
+          src="@/assets/img/send_contacts.png">
+        <div class="c-name">联系人</div>
+      </flexbox>
+      <div class="c-body">
+        <flexbox wrap="wrap">
+          <flexbox
+            v-for="(item, index) in contacts"
+            :key="index"
+            class="c-item">
+            <div class="c-item-name">{{ item.name }}</div>
+            <div
+              class="c-item-close"
+              @click="contacts.splice(index, 1)">×</div>
+          </flexbox>
+        </flexbox>
+      </div>
+    </section>
+    <flexbox class="bar-cont">
+      <template v-for="(item, index) in barItems">
+        <flexbox
+          v-if="item.type=='img'||item.type=='file'"
+          :key="index"
+          class="bar-item"
+          @click.native="barClick(item)">
+          <input
+            :accept="item.data"
+            type="file"
+            class="bar-input"
+            multiple
+            @change="uploadFile">
+          <img
+            :src="item.img"
+            class="bar-img">
+          <div class="bar-title">{{ item.title }}</div>
+        </flexbox>
+        <el-popover
+          v-else
+          :key="index"
+          v-model="item.show"
+          placement="bottom"
+          width="700"
+          popper-class="no-padding-popover"
+          trigger="click">
+<!--          <crm-relative-->
+<!--            ref="crmrelative"-->
+<!--            :show="item.show"-->
+<!--            :radio="false"-->
+<!--            :action="{ type: 'condition', data: { moduleType: crmType, customerId: id } }"-->
+<!--            :selected-data="item.type == 'business' ? { 'business': business } : { 'contacts': contacts }"-->
+<!--            :crm-type="item.type"-->
+<!--            @close="item.show=false"-->
+<!--            @changeCheckout="checkRelativeInfos"/>-->
+          <flexbox
+            slot="reference"
+            class="bar-item"
+            @click.native="barClick(item)">
+            <img
+              :src="item.img"
+              class="bar-img">
+            <div class="bar-title">{{ item.title }}</div>
+          </flexbox>
+        </el-popover>
+      </template>
+    </flexbox>
+  </div>
+</template>
+
+<script>
+// import { fileSize, getFileTypeIcon } from '@/utils/index'
+// import { crmFileSave, crmFileDelete } from '@/api/common'
+// import CrmRelative from '@/components/CreateCom/CrmRelative'
+
+export default {
+  /** 跟进记录 下的 添加 有添加框的都需要*/
+  name: 'MixAdd',
+  components: {
+    // CrmRelative
+  },
+  props: {
+    /** 展示相关商机关联 */
+    showRelativeBusiness: {
+      type: Boolean,
+      default: false
+    },
+    /** 展示相关商机关联 */
+    showRelativeContacts: {
+      type: Boolean,
+      default: false
+    },
+    /** 模块ID */
+    id: [String, Number],
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      /** 输入法 */
+      content: '',
+      inputAutosize: { minRows: 1, maxRows: 6 }, // 默认1 聚焦是 变成3
+      /** 快捷添加 */
+      barItems: [
+        {
+          img: require('@/assets/img/send_img.png'),
+          title: '图片',
+          type: 'img',
+          data: 'image/*'
+        },
+        {
+          img: require('@/assets/img/send_file.png'),
+          title: '附件',
+          type: 'file',
+          data: '*.*'
+        }
+      ],
+      /** 图片信息 */
+      imgFiles: [],
+      /** 图片信息 */
+      files: [],
+      /** 关联商机信息 */
+      business: [],
+      /** 关联联系人信息 */
+      contacts: [],
+      /** 展示关联弹窗 */
+      showRelativeType: '',
+      batchId: '' // 批次ID
+    }
+  },
+  computed: {},
+  mounted() {
+    /** 控制展示关联商机 和 联系人 */
+    if (this.showRelativeBusiness) {
+      this.barItems.push({
+        img: require('@/assets/img/send_business.png'),
+        title: '关联商机',
+        type: 'business',
+        show: false
+      })
+    }
+
+    if (this.showRelativeContacts) {
+      this.barItems.push({
+        img: require('@/assets/img/send_contacts.png'),
+        title: '关联联系人',
+        type: 'contacts',
+        show: false
+      })
+    }
+    /** 父组件通知子组件提交数据 */
+    /** 将拼接好的数据回调父组件 this.$refs.child.$emit('submit-info');  调用*/
+    this.$on('submit-info', function() {
+      this.$emit('mixadd-info', {
+        content: this.content,
+        files: this.files,
+        images: this.imgFiles,
+        business: this.business,
+        contacts: this.contacts,
+        batchId: this.batchId
+      })
+    })
+  },
+
+  beforeDestroy() {
+    this.$off('submit-info')
+  },
+  methods: {
+    resetInfo() {
+      /** 输入法 */
+      this.content = ''
+      /** 图片信息 */
+      this.imgFiles = []
+      /** 图片信息 */
+      this.files = []
+      /** 关联商机信息 */
+      this.business = []
+      /** 关联联系人信息 */
+      this.contacts = []
+      /** 展示关联弹窗 */
+      this.showRelativeType = ''
+      this.batchId = ''
+    },
+    /** 快捷添加按钮 */
+    checkRelativeInfos(data) {
+      if (this.showRelativeType == 'business') {
+        this.business = data.data
+      } else if (this.showRelativeType == 'contacts') {
+        this.contacts = data.data
+      }
+    },
+    barClick(item) {
+      this.showRelativeType = item.type
+      if (item.type == 'business') {
+        item.show = true
+      } else if (item.type == 'contacts') {
+        item.show = true
+      }
+    },
+    /** 图片选择出发 */
+    uploadFile(event) {
+      var files = event.target.files
+      if (files.length) {
+        for (let index = 0; index < files.length; index++) {
+          const file = files[index]
+          if (
+            file.type.indexOf('image') == -1 &&
+            this.showRelativeType == 'img'
+          ) {
+            this.$message.error('请上传正确的文件类型')
+            return
+          }
+        }
+
+        var type = event.target.accept == 'image/*' ? 'img' : 'file'
+        var firstFile = files[0]
+        this.sendFileRequest(firstFile, type, () => {
+          for (let index = 1; index < files.length; index++) {
+            const file = files[index]
+            this.sendFileRequest(file, type)
+          }
+          event.target.value = ''
+        })
+      }
+    },
+    // 发送请求
+    sendFileRequest(file, type, result) {
+      var params = { file: file, type: type }
+      if (this.batchId) {
+        params.batchId = this.batchId
+      }
+      crmFileSave(params)
+        .then(res => {
+          if (this.batchId == '') {
+            this.batchId = res.batchId
+          }
+          res.size = fileSize(file.size)
+          if (type == 'img') {
+            this.imgFiles.push(res)
+          } else {
+            res['icon'] = getFileTypeIcon(file)
+            this.files.push(res)
+          }
+          if (result) {
+            result()
+          }
+        })
+        .catch(() => {})
+    },
+    /** 删除全部图片 */
+    deleteAllImg() {
+      this.imgFiles = []
+    },
+    deleteImgOrFile(type, item, index) {
+      crmFileDelete({
+        id: item.fileId
+      })
+        .then(res => {
+          if (type == 'image') {
+            this.imgFiles.splice(index, 1)
+          } else {
+            this.files.splice(index, 1)
+          }
+          this.$message.success('操作成功')
+        })
+        .catch(() => {})
+    },
+    /** 鼠标移入和移除 图片区域 */
+    mouseImgOver(item, index) {
+      item.showDelete = true
+      this.$set(this.imgFiles, index, item)
+    },
+    mouseImgLeave(item, index) {
+      item.showDelete = false
+      this.$set(this.imgFiles, index, item)
+    },
+    inputFocus() {
+      this.inputAutosize = { minRows: 3, maxRows: 6 }
+      this.$nextTick(() => {
+        this.$refs.textarea.resizeTextarea()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.mix-container {
+  position: relative;
+  border: 1px solid #e6e6e6;
+  border-radius: 3px;
+  .i-cont {
+    padding: 8px 10px;
+  }
+}
+
+.i-cont /deep/ .el-textarea__inner {
+  border: none;
+  padding: 0;
+}
+/** 图片  */
+.img-cont {
+  padding: 0 10px;
+  margin-bottom: 15px;
+  .img-item {
+    width: 98px;
+    height: 98px;
+    border: 1px solid #ccc;
+    display: inline-block;
+    margin: 0 4px 4px 0;
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+    position: relative;
+    .img-delete {
+      position: absolute;
+      cursor: pointer;
+      top: 0;
+      right: 0;
+      width: 20px;
+      height: 20px;
+      line-height: 20px;
+      text-align: center;
+      font-size: 17px;
+      background-color: #666;
+      color: white;
+    }
+  }
+  .img-item-add {
+    width: 98px;
+    height: 98px;
+    line-height: 98px;
+    font-size: 60px;
+    color: #ccc;
+    text-align: center;
+    margin: 0 4px 4px 0;
+    cursor: pointer;
+    display: inline-block;
+    border-width: 1px;
+    border-style: dashed;
+    border-color: #ddd;
+    position: relative;
+    font-weight: 100;
+    .img-item-iput {
+      position: absolute;
+      top: 0;
+      right: 0;
+      height: 98px;
+      width: 98px;
+      opacity: 0;
+      cursor: pointer;
+    }
+  }
+  .img-item-add:before {
+    width: 2px;
+    height: 39.5px;
+    content: ' ';
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    background-color: #2888e4;
+  }
+  .img-item-add:after {
+    width: 39.5px;
+    height: 2px;
+    content: ' ';
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    background-color: #2888e4;
+  }
+  .img-bar {
+    color: #5a8ae2;
+    font-size: 12px;
+    padding: 5px 0;
+    cursor: pointer;
+  }
+}
+/** 附件  */
+.file-cont {
+  padding: 0 10px;
+  margin: 0 10px 15px;
+  border: 1px dashed #dfdfdf;
+  .f-header {
+    padding: 8px 0 15px;
+    .f-logo {
+      position: block;
+      width: 15px;
+      height: 15px;
+      margin-right: 8px;
+    }
+    .f-name {
+      color: #777;
+      font-size: 12px;
+    }
+  }
+
+  .f-body {
+    .f-item {
+      padding: 3px 0;
+      height: 25px;
+      .f-img {
+        position: block;
+        width: 15px;
+        height: 15px;
+        margin-right: 8px;
+      }
+      .f-name {
+        color: #666;
+        font-size: 12px;
+      }
+    }
+  }
+
+  .img-bar {
+    color: #5a8ae2;
+    font-size: 12px;
+    padding: 5px 0;
+  }
+}
+/** CRM  */
+.c-cont {
+  padding: 0 10px;
+  margin: 0 10px 15px;
+  border: 1px dashed #dfdfdf;
+  .c-header {
+    padding: 8px 0 15px;
+    .c-logo {
+      position: block;
+      width: 15px;
+      height: 15px;
+      margin-right: 8px;
+    }
+    .c-name {
+      color: #777;
+      font-size: 12px;
+    }
+  }
+
+  .c-body {
+    margin-bottom: 10px;
+    .c-item {
+      height: 24px;
+      border-radius: 12px;
+      padding: 0 8px;
+      margin: 0 5px 5px 0;
+      background-color: #3487e2;
+      color: white;
+      width: auto;
+      .c-item-name {
+        font-size: 12px;
+      }
+      .c-item-close {
+        padding-left: 5px;
+        font-size: 17px;
+      }
+    }
+  }
+}
+/** 底部bar  */
+.bar-cont {
+  background-color: #f9f9f9;
+  padding: 8px 15px;
+  .bar-item {
+    width: auto;
+    padding-right: 20px;
+    position: relative;
+    cursor: pointer;
+    .bar-input {
+      position: absolute;
+      top: 0;
+      right: 0;
+      height: 15px;
+      width: 68px;
+      opacity: 0;
+      font-size: 0;
+      cursor: pointer;
+    }
+    .bar-img {
+      display: block;
+      width: 15px;
+      height: 15px;
+      margin-right: 8px;
+    }
+    .bar-title {
+      color: #777;
+      font-size: 12px;
+    }
+  }
+}
+/** 关闭按钮  */
+.close-button {
+  width: 30px;
+  line-height: 16px;
+  cursor: pointer;
+  color: #ccc;
+  height: 16px;
+  font-size: 17px;
+  text-align: center;
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/RelativeFiles.vue b/vue/src/views/pg-fis/components/RelativeFiles.vue
new file mode 100644
index 00000000..be963624
--- /dev/null
+++ b/vue/src/views/pg-fis/components/RelativeFiles.vue
@@ -0,0 +1,1228 @@
+<template>
+  <div class="f-container">
+    <flexbox
+      direction="column"
+      align="stretch"
+      class="d-container">
+       <div class="crm-create-flex">
+      <!--表单渲染-->
+      <el-dialog
+        :visible.sync="dialogFormVisible"
+        :close-on-click-modal="false"
+        width="580px"
+        append-to-body>
+        <div class="crm-create-body" v-if="stepsActive == 1">
+          <el-form
+            ref="form"
+            :inline="true"
+            size="small"
+            label-width="80px">
+            <el-row>
+              <el-col :md="4" :xs="24">
+                <el-form-item label="上传附件" />
+              </el-col>
+              <el-col :md="20" :xs="24">
+                <el-form-item>
+                  <el-upload
+                    ref="upload"
+                    class="avatar-uploader"
+                    drag
+                    action="#"
+                    :http-request="httpRequestfiles"
+                    :on-change="handleChangefiles"
+                    :headers="httpHeader"
+                    :file-list="fileuploadList"
+                    :before-upload="beforeAvatarUpload"
+                    :before-remove="beforeRemove"
+                    :on-remove="handleRemove"
+                     multiple
+                    :limit="5"
+                    :on-exceed="handleExceedfiles" >
+                    <i class="el-icon-upload" ></i>
+                    <div class="el-upload__text">
+                      将文件拖到此处，或
+                      <em>点击上传</em>
+                    </div>
+                  </el-upload>
+                </el-form-item>
+                <el-form-item>
+                   <div style="margin: 10px;margin-top: 1px;" >
+                  <span style="color: #ccc;font-size:13px;">说明：单个附件大小不能超过2M，单次最多一起上传5个，请上传后缀名为jpg、png、gif、jpeg、txt、pdf、doc、docx、xlsx、zip或rar的附件！!</span>
+                </div>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+        <div
+        v-loading="formLoading"
+        v-else-if="stepsActive == 2"
+        element-loading-text="数据上传中,请耐心等待..."
+        element-loading-spinner="el-icon-loading"
+        class="step-section"
+      />
+        <div slot="footer" class="dialog-footer">
+          <el-button
+          v-if="stepsActive == 1"
+          type="text"
+          @click="dialogFormVisible = false">取消</el-button>
+           <!-- <el-button  type="primary" @click="LoadSave">确认</el-button> -->
+           <el-button
+            v-if="sureTitle"
+            type="primary"
+            @click="sureClick">{{ sureTitle }}</el-button>
+
+        </div>
+      </el-dialog>
+    </div>
+
+      <div class="tabs">
+              <el-row >
+                <div style="margin: 10px;margin-top: 1px;" >
+                  <el-button
+                    class="filter-item"
+                    size="mini"
+                    type="primary"
+                    icon="el-icon-plus"
+                    @click="handleCreate()"
+                  >上传附件</el-button>
+                </div>
+              </el-row>
+                 <el-row >
+                <div style="margin: 10px;margin-top: 1px;" >
+                  <span style="color: #ccc;font-size:13px;">说明：单个附件大小不能超过2M,单次最多一起上传5个，请上传后缀名为jpg、png、gif、jpeg、txt、pdf、doc、docx、xlsx、zip或rar的附件!</span>
+                </div>
+              </el-row>
+              <el-row >
+              <el-card  shadow="always" >
+              <!-- <div style="margin-top: -25px;" >  -->
+                <div  v-loading="listLoading"
+                  element-loading-text="数据加载中,请耐心等待..."
+                  element-loading-spinner="el-icon-loading"
+                  class="step-section">
+                <flexbox
+                  :gutter="0"
+                  wrap="wrap"
+                  style="padding: 10px 8px 0;">
+                  <flexbox-item
+                    v-for="(item, index) in fileList"
+                    :span="0.5"
+                    :key="index"
+                    class="b-cell">
+                   <flexbox
+                      v-if="item.fileType === 'png'"
+                      align="stretch"
+                      class="b-cell-b">
+                      <div class="b-cell-name">PNG文件</div>
+                      <div class="b-cell-value">
+                        <flexbox  class="f-item">
+                          <img
+                            class="f-img"
+                            src="@/assets/img/relevance_file.png" >
+                           <div class="f-name">{{  item | getfilesize1 }}<span style="color: #ccc;">{{ item | getfilesize2}}</span></div>
+                           <img
+                                 src="@/assets/img/chakan.png"
+                                @click="handleFile('preview', item, index)" />
+                          <img
+                                 src="@/assets/img/xiazai.png"
+                                @click="handleImgFile(item, index)" />
+                          <img
+                                src="@/assets/img/shanchu.png"
+                                @click="handleFile('delete', item, index)" />
+                        </flexbox>
+                      </div>
+                    </flexbox>
+                    <flexbox
+                      v-else-if="item.fileType === 'jpg'"
+                      align="stretch"
+                      class="b-cell-b">
+                      <div class="b-cell-name">JPG文件</div>
+                      <div class="b-cell-value">
+                        <flexbox  class="f-item">
+                          <img
+                            class="f-img"
+                            src="@/assets/img/relevance_file.png" >
+                          <div class="f-name">{{  item | getfilesize1 }}<span style="color: #ccc;">{{ item | getfilesize2}}</span></div>
+                          <img
+                                 src="@/assets/img/chakan.png"
+                                @click="handleFile('preview', item, index)" />
+                          <img
+                                 src="@/assets/img/xiazai.png"
+                                @click="handleImgFile(item, index)" />
+                          <img
+                                src="@/assets/img/shanchu.png"
+                                @click="handleFile('delete', item, index)" />
+                        </flexbox>
+                      </div>
+                    </flexbox>
+                     <flexbox
+                      v-else-if="item.fileType === 'gif'"
+                      align="stretch"
+                      class="b-cell-b">
+                      <div class="b-cell-name">GIF文件</div>
+                      <div class="b-cell-value">
+                        <flexbox  class="f-item">
+                          <img
+                            class="f-img"
+                            src="@/assets/img/relevance_file.png" >
+                          <div class="f-name">{{  item | getfilesize1 }}<span style="color: #ccc;">{{ item | getfilesize2}}</span></div>
+                          <img
+                                 src="@/assets/img/chakan.png"
+                                @click="handleFile('preview', item, index)" />
+                          <img
+                                 src="@/assets/img/xiazai.png"
+                                @click="handleImgFile(item, index)" />
+                          <img
+                                src="@/assets/img/shanchu.png"
+                                @click="handleFile('delete', item, index)" />
+                        </flexbox>
+                      </div>
+                    </flexbox>
+                     <flexbox
+                      v-else-if="item.fileType === 'jpeg'"
+                      align="stretch"
+                      class="b-cell-b">
+                      <div class="b-cell-name">JPEG文件</div>
+                      <div class="b-cell-value">
+                        <flexbox  class="f-item">
+                          <img
+                            class="f-img"
+                            src="@/assets/img/relevance_file.png" >
+                          <div class="f-name">{{  item | getfilesize1 }}<span style="color: #ccc;">{{ item | getfilesize2}}</span></div>
+                          <img
+                                 src="@/assets/img/chakan.png"
+                                @click="handleFile('preview', item, index)" />
+                          <img
+                                 src="@/assets/img/xiazai.png"
+                                @click="handleImgFile(item, index)" />
+                          <img
+                                src="@/assets/img/shanchu.png"
+                                @click="handleFile('delete', item, index)" />
+                        </flexbox>
+                      </div>
+                    </flexbox>
+                    <flexbox
+                      v-else
+                      align="stretch"
+                      class="b-cell-b">
+                      <div class="b-cell-name">{{item.fileType}}文件</div>
+                      <div class="b-cell-value">
+                        <flexbox  class="f-item">
+                          <img
+                            class="f-img"
+                            src="@/assets/img/relevance_file.png" >
+                          <div class="f-name">{{  item | getfilesize1 }}<span style="color: #ccc;">{{ item | getfilesize2}}</span></div>
+                        <img
+                                 src="@/assets/img/xiazai.png"
+                                @click="handleFile('download',item, index)" />
+                          <img
+                                src="@/assets/img/shanchu.png"
+                                @click="handleFile('delete', item, index)" />
+                        </flexbox>
+                      </div>
+                    </flexbox>
+                  </flexbox-item>
+                </flexbox>
+
+                 <pagination
+                     v-show="totalFileCount>0"
+                     :total="totalFileCount"
+                     :page.sync="pageFiles"
+                     :limit.sync="listQuery.MaxResultCount"
+                      style="margin-top: -25px;margin-bottom:-18px;float:right;"
+                      @pagination="getFileList"
+                   />
+
+                    </div>
+                    </el-card>
+                </el-row>
+      </div>
+    </flexbox>
+  </div>
+</template>
+
+<script>
+import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
+import permission from "@/directive/permission/index.js";
+import {downloadImage, downloadFile, fileSize,downloadFileHttpRequest,getFileTypeIcon} from '@/utils/crmindex.js'
+import { getToken } from '@/utils/auth' // get token from cookie
+
+
+export default {
+  name: "project",
+  components: { Pagination},
+  directives: { permission },
+  props: {
+    /** 模块ID：客户模块、项目模块、合同模块 */
+    modid: [String, Number]
+  },
+  filters: {
+    getfilesize1(file) {
+      const name = file.fileName && file.fileName.length > 5 ? (file.fileName.substring(0, 5) + '...') : file.fileName
+      return name
+    },
+    getfilesize2(file) {
+      return '(' + fileSize(file.fileLength) + ')'
+    }
+  },
+  data() {
+    return {
+      elementLoadingText: "正在加载...",
+      value:"0",
+      newsList: [],
+      paginationLog: {
+        total: 0,
+        page: 1,
+        pageSize: 10,
+      },
+      form: {},
+      list: null,
+      fileList:[],
+      fileuploadList:[],
+      fileFormData: null, // 将要上传的formdata数据
+      customerList:[],
+      totalCount: 0,
+      dialogFormVisible: false,
+      totalFileCount: 0,
+      listLoading: false,
+      formLoading: false,
+      propsCustomerId:"",
+      listQuery: {
+        CustomerId: "",
+        Sorting: "",
+        SkipCount: 0,
+        MaxResultCount: 10
+      },
+      page: 1,
+      pageFiles: 1,
+      pageImg: 1,
+      multipleSelection: [],
+      customerInfo:{
+        customerID:"",
+        code:"",
+        name:"",
+        fullname:"",
+        remark:""
+      },
+      isLt2M:"",
+      isFileType:"",
+      stepsActive: 1,
+      tableHeight: document.documentElement.clientHeight -350
+    };
+  },
+  watch: {
+       modid: {
+          handler(newVal) {
+          if(newVal=="" || newVal=="undefined")
+          {
+            this.fileList =[];
+          }
+          else{
+            this.getFileList()
+          }
+      },
+      immediate: true
+    }
+  },
+
+  mounted() {
+     var self = this
+    /** 控制table的高度 */
+    window.onresize = function() {
+      var offsetHei = document.documentElement.clientHeight
+      self.tableHeight = offsetHei - 350
+    }
+   },
+  computed: {
+     sureTitle() {
+      return {
+        1: '立即上传',
+        2: '上传中...'
+      }[this.stepsActive]
+    },
+     httpHeader() {//文件上传时，带token认证信息，提高安全性
+      return {
+        'Authorization':'Bearer ' + getToken()
+      }
+    }
+  },
+  created() {
+     this.fileuploadList=[];
+     this.fileFormData = new FormData();
+
+  },
+  methods: {
+    handleCreate() {
+      this.stepsActive = 1;
+      this.fileuploadList=[];
+      this.dialogFormVisible = true;
+      this.$refs.upload.clearFiles();
+    },
+    getFileList() {//附件列表
+      this.listLoading = true;
+      this.listQuery.SkipCount = (this.pageFiles - 1) * 10;
+      this.listQuery.CustomerId=this.modid;
+      this.$axios.gets("/api/abpvnext_master/uploadfile/allofcustomers", this.listQuery).then(response => {
+        this.fileList =[];
+        this.fileList = response.items;
+        this.totalFileCount = response.totalCount;
+        this.listLoading = false;
+        // setTimeout(() => {
+        //     //大数据量加载时
+        //     this.listLoading = false;
+        //   }, 1000);
+      });
+    },
+    httpRequestfiles(data) {
+     // this.fileuploadList=[]
+      let _this = this;
+      let rd = new FileReader(); // 创建文件读取对象
+      let file = data.file;
+      this.fileuploadList.push(file);
+      //this.fileFormData.append("files", file);
+      rd.readAsDataURL(file); // 文件读取装换为base64类型
+    },
+     handleChangefiles(file, fileList) {//上传时解发
+    //   this.fileuploadList=[]
+    //   this.fileuploadList = fileList;
+    },
+    // 上传之前的格式设置
+    beforeAvatarUpload(file) {
+      var FileExt = file.name.replace(/.+\./, "");
+        if (['jpg','png','png','jpeg','txt','zip', 'rar','pdf','docx','doc','xlsx','xls'].indexOf(FileExt.toLowerCase()) === -1){
+            this.$message({
+                type: 'warning',
+                message: '请上传后缀名为jpg、png、gif、jpeg、txt、pdf、doc、docx、xlsx、xls、zip或rar的附件！'
+            });
+            this.isFileType="0"
+            return false;
+        }
+        else{
+            this.isFileType="1"
+        }
+      this.isLt2M = file.size / 1024 / 1024 < 2?'1':'0';
+      if (this.isLt2M==="0") {
+        this.$message.error("上传文件大小不能超过 2MB!");
+      }
+      return this.isLt2M==='1'?true: false;
+    },
+    beforeRemove(file, fileList) {
+        if (this.isLt2M==="1" && this.isFileType==="1") {
+         return this.$confirm(`确定移除 ${ file.name }？`);
+        }
+      },
+    handleRemove(file, fileList) {//附件列表删除操作
+      const index=this.fileuploadList.indexOf(file.originFileObj)
+      const newFileList=this.fileuploadList.slice()
+      newFileList.splice(index,1)
+      this.fileuploadList = newFileList;
+    },
+    handleExceedfiles(files, fileList) {
+      this.$message.warning(
+        `当前限制选择 5 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
+          files.length + fileList.length
+        } 个文件`
+      );
+    },
+    showCancel() {
+      return this.stepsActive != 2
+    },
+    sureClick(){
+        if (this.fileuploadList===[] || JSON.stringify(this.fileuploadList) === "[]") {
+           this.$message.error("请选择上传文件");
+        return false;
+      }
+      if (this.stepsActive == 1) {
+        this.stepsActive = 2;
+        this.formLoading = true;
+        setTimeout(() => {
+             this.save();
+        }, 2000)
+      }
+    },
+     save() {
+      //this.formLoading = true;
+      //--上传附件，批量或拖拽
+      if (JSON.stringify(this.fileuploadList) != "[]") {
+          let fd = new FormData();
+        //   var outfd = this.fileFormData.getAll("files");
+        //   alert("outfd"+outfd)
+        //   for (let i = 0; i < outfd.length; i++) {
+        //     fd.append("files", outfd[i]); // 添加文件
+        //   }
+        const{fileuploadList}=this;
+        fileuploadList.forEach(file=>{
+            fd.append("files", file); // 添加文件
+        })
+          fd.append("customerId",this.modid);//模块ID
+          this.$axios
+            .posts(
+              "/api/abpvnext_master/getblobfile/UploadFilesPost",
+                fd
+              )
+            .then((response) => {
+             this.formLoading = false;
+              this.getFileList();
+              if (this.isLt2M==="1" && this.isFileType==="1") {
+                    this.$notify({
+                    title: "成功",
+                    message: "附件上传成功！",
+                    type: "success",
+                    duration: 2000,
+                });
+              }
+
+            })
+            .catch(() => {this.formLoading = false;});
+          } else {
+            this.formLoading = false;
+            this.$message({
+                message: "未上传任何附件，请查检！",
+                type: "warning",
+              });
+            }
+            //-end-上传附件完成
+
+          this.dialogFormVisible = false;
+    },
+    /**
+     * 附件查看
+     */
+    handleFile(type, item, index) {
+      if (type === 'preview') {
+          var down_fileName=item.fileName+"."+item.fileType;//下载时附件名
+          var previewList =[]
+          previewList.push({
+              url: item.fileUrl,
+              id:item.id,
+              fileType:item.fileType,
+              name:down_fileName
+            })
+          this.$bus.emit('preview-image-bus', {
+            index: 0,
+            data: previewList
+          })
+      } else if (type === 'download') {
+          var param_fileName=item.id+"."+item.fileType;//传入的参数（后端接口接收）
+          var down_fileName=item.fileName+"."+item.fileType || '文件';//下载时附件名
+          this.$axios
+            .BolbGets("/api/abpvnext_master/getblobfile/download/" + param_fileName)
+            .then((response) => {
+                //方法一(插件下载)
+                downloadFile(response,down_fileName);
+                //方法二（a标签下载）
+                //  var blob = new Blob([response], {
+                //    type: 'application/octet-stream'
+                // })
+                // if (window.navigator.msSaveBlob) {  // IE 10+以及IE内核的浏览器
+                //   try {
+                //     window.navigator.msSaveOrOpenBlob(blob,down_fileName );
+                //   } catch (e) {
+                //     console.log(e)
+                //   }
+                // } else {//chrome/firefox浏览器
+                //   //alert("chrome/firefox浏览器")
+                //   let url = window.URL.createObjectURL(blob)
+                //   let link = document.createElement('a')
+                //   link.style.display = 'none'
+                //   link.href = url
+                //   link.setAttribute('download', down_fileName)// 文件名
+                //   document.body.appendChild(link)
+                //   link.click()
+                //   document.body.removeChild(link) // 下载完成移除元素
+                //   window.URL.revokeObjectURL(url) // 释放掉blob对象
+                // }
+          });
+      }
+      else if(type === 'delete'){
+        var params = [];
+        let myalert=""//声明变量，其变量必须在此声明后使用
+        params.push(item.id);
+        myalert=item.fileName
+      this.$confirm("是否删除" + myalert + "?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          this.$axios.posts("/api/abpvnext_master/uploadfile/DeleteFile",params).then(response => {
+            this.$notify({
+              title: "成功",
+              message: "删除成功",
+              type: "success",
+              duration: 2000
+            });
+            this.getFileList();
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除"
+          });
+        });
+      }
+    },
+    // 下载图片
+    handleImgFile(item,index) {
+        var param_fileName=item.id+"."+item.fileType;//传入的参数（后端接口接收）
+        var down_fileName=item.fileName+"."+item.fileType;//下载时附件名
+        this.$axios
+            .BolbGets("/api/abpvnext_master/getblobfile/downloadImg/" + param_fileName)
+            .then((response) => {
+                downloadFile(response,down_fileName);
+        });
+    },
+    getStatusStyle(status) {
+      if (status == 0) {
+        return {
+          'border-color': '#E6A23C',
+          'background-color': '#FDF6EC',
+          'color': '#E6A23C'
+        }
+      } else if (status == 1) {
+        return {
+          'border-color': '#409EFF',
+          'background-color': '#ECF5FF',
+          'color': '#409EFF'
+        }
+      } else if (status == 3) {
+        return {
+          'border-color': '#67C23A',
+          'background-color': '#F0F9EB',
+          'color': '#67C23A'
+        }
+      } else if (status == 2) {
+        return {
+          'border-color': '#F56C6B',
+          'background-color': '#FEF0F0',
+          'color': '#F56C6B'
+        }
+      } else if (status == 4) {
+        return {
+          'background-color': '#E4E7ED'
+        }
+      }
+    },
+    getHTStatusStyle(status) {
+      if (status == 0) {//新增
+        return {
+          'border-color': '#E6A23C',
+          'background-color': '#FDF6EC',
+          'color': '#E6A23C'
+        }
+      }else if (status == 1 || status == 2) {//审核中
+         return {
+          'border-color': '#409EFF',
+          'background-color': '#ECF5FF',
+          'color': '#409EFF'
+
+        }
+      }else if (status == 3 || status == 6) {//已签定和完成
+        return {
+          'border-color': '#67C23A',
+          'background-color': '#F0F9EB',
+          'color': '#67C23A'
+        }
+      } else if (status == 4) {
+        return {
+          'border-color': '#E9E9EB',
+          'background-color': '#F4F4F5',
+          'color': '#909399'
+        }
+       } else if (status == 5) {//执行
+        return {
+          'border-color': '#F56C6B',
+          'background-color': '#FEF0F0',
+          'color': '#F56C6B'
+        }
+      } else if (status == 7) {//中止
+        return {
+          'border-color': '#E9E9EB',
+          'background-color': '#F4F4F5',
+          'color': '#909399'
+        }
+
+      }
+    },
+    handleFilter() {
+      this.page = 1;
+      this.pageFiles=1;
+      this.pageImg=1;
+      this.getFileList();
+    },
+    resetQuery() {},
+    sortChange(data) {
+      const { prop, order } = data;
+      if (!prop || !order) {
+        this.handleFilter();
+        return;
+      }
+      this.listQuery.Sorting = prop + " " + order;
+      this.handleFilter();
+    },
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.clearSelection();
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+    handleCollapseChange(val) {
+
+    },
+    handleLogChange(val) {
+      this.value = val;
+      this.paginationLog.total = 0;
+      this.paginationLog.page = 1;
+      this.paginationLog.pageSize = 2;
+      //this.fetchData();
+    },
+    handleSizeChange(val) {
+      this.paginationLog.pageSize = val;
+      this.fetchData();
+    },
+    handleCurrentChange(val) {
+      this.paginationLog.page = val;
+      this.fetchData();
+    }
+  }
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.is-hidden {
+  visibility: hidden;
+}
+.opts {
+  padding: 6px 0;
+  display: -webkit-flex;
+  display: flex;
+  align-items: center;
+}
+.el-timeline {
+      margin-top: 20px;
+
+      &-item {
+        padding-bottom: 1px;
+      }
+  }
+.el-drawer{
+    overflow: scroll
+    }
+.box{
+  height: 100%;//如高度等于网页高度
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+ }
+
+ .goods-list-container {
+  .goods-list-card-body {
+    position: relative;
+    text-align: center;
+    vertical-align:middle;
+    cursor: pointer;
+
+    .goods-list-tag-group {
+      position: absolute;
+      top: 10px;
+      right: 5px;
+      z-index: 9;
+    }
+
+    .goods-list-image-group {
+      height: 80px;
+      overflow: hidden;
+
+      .goods-list-image {
+        width: 80px;
+        height: 80px;
+        transition: all ease-in-out 0.3s;
+
+        &:hover {
+          transform: scale(1.1);
+        }
+      }
+    }
+
+    .goods-list-title {
+      margin: 8px 0;
+      font-size: 14px;
+      font-weight: bold;
+    }
+
+    .goods-list-description {
+      font-size: 14px;
+      color: #808695;
+    }
+
+    .goods-list-price {
+      margin: 8px 0;
+      font-size: 14px;
+      color: #ff6700;
+      s {
+        color: #c5c8ce;
+      }
+    }
+  }
+
+
+}
+</style>
+
+<style>
+.clearfix:before,
+  .clearfix:after {
+    display: table;
+    content: "";
+  }
+  .clearfix:after {
+    clear: both
+  }
+  .el-col {
+    border-radius: 2px;
+  }
+  .bg-purple-dark {
+    background: #99a9bf;
+  }
+  .bg-purple {
+    background: #d3dce6;
+  }
+  .bg-purple-light {
+    background: hsl(221, 31%, 14%);
+  }
+  .grid-content {
+    border-radius: 2px;
+    min-height: 30px;
+  }
+  .status_button {
+  padding: 1px 6px;
+  border: 1px solid #e6e6e6;
+  border-radius: 4px;
+  display: inline-block;
+  font-size: 12px;
+  margin: 0 auto;
+}
+</style>
+
+
+<style type="text/css">
+*{margin: 0;padding: 0;}
+.div11{
+width:150px;
+height: 100px;
+display: table-cell;
+vertical-align: middle;
+text-align: center;
+border:1px solid #000;
+}
+.img11 {
+width: 50px;
+height: 50px;
+}
+</style>
+
+
+
+<style lang="scss" scoped>
+//客户相关详情 头部类似布局
+.el-tabs /deep/ .el-tabs__nav-wrap::after {
+  display: none !important;
+}
+
+.el-tabs /deep/ .el-tabs__header {
+  background-color: #F5F6F9;
+  padding: 0 17px;
+  margin: 0 0 15px !important;
+}
+
+.el-tabs /deep/ .el-tabs__item {
+  font-size: 13px !important;
+  height: 40px !important;
+  line-height: 40px !important;
+}
+
+.d-container {
+  position: relative;
+  height: 100%;
+}
+
+/** 让element 查询到的标签 */
+.t-loading-content {
+  position: relative;
+  overflow-y: scroll;
+  flex: 1;
+}
+
+/** 审核信息 */
+.examine-info {
+  padding: 0 17px 17px 17px;
+
+  .examine-info-border {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    padding: 17px;
+  }
+}
+.t-section {
+  position: relative;
+  padding: 10px 17px;
+  min-height: 60px;
+  .t-img {
+    display: block;
+    width: 45px;
+    height: 45px;
+    margin-right: 10px;
+  }
+  .t-name {
+    font-size: 14px;
+    color: #333333;
+    flex: 1;
+  }
+  .t-more {
+    border: 1px solid #dcdfe6;
+    font-size: 12px;
+    color: #606266;
+    padding: 0 10px 0 12px;
+    border-radius: 2px;
+    font-weight: 500;
+    height: 25px;
+    cursor: pointer;
+  }
+  .t-close {
+    display: block;
+    width: 40px;
+    height: 40px;
+    margin-left: 20px;
+    padding: 10px;
+    cursor: pointer;
+  }
+}
+
+.h-section {
+  position: relative;
+  padding: 8px 17px 15px 17px;
+  min-height: 58px;
+  .h-item {
+    .h-title {
+      font-size: 12px;
+      color: #777;
+    }
+    .h-value {
+      min-height: 14px;
+      margin-top: 8px;
+      font-size: 13px;
+      color: #333333;
+    }
+  }
+}
+.head-handle-button {
+  padding: 5px 15px;
+  margin-right: 10px;
+}
+</style>
+
+<style scoped>
+
+.business-list {
+  margin-bottom: 15px;
+}
+.business-label {
+  display: inline-block;
+  width: 100px;
+}
+.business-des {
+  display: inline-block;
+  color: #999;
+  font-size: 12px;
+  width: 60px;
+}
+.business-setting-content {
+  border: 1px solid #e6e6e6;
+  margin-top: 10px;
+}
+.business-setting-table-header {
+  background: #f5f5f5;
+}
+.business-setting-table,
+.business-setting-table-header {
+  display: flex;
+  text-align: center;
+  height: 50px;
+  line-height: 50px;
+}
+.business-setting-table-body {
+  height: 250px;
+  overflow-y: auto;
+}
+.business-setting-table > span,
+.business-setting-table-header > span,
+.business-setting-table > .el-input {
+  flex: 1;
+}
+.business-setting-table > span > .el-input {
+  width: 70%;
+}
+.business-setting-table > .icon-span > .el-input {
+  width: 50%;
+}
+.business-setting-table > span .el-icon-circle-plus {
+  color: #3e84e9;
+  width: 20px;
+  height: 20px;
+  cursor: pointer;
+}
+.business-setting-table > span .el-icon-remove {
+  color: #ff6767;
+  width: 20px;
+  height: 20px;
+  cursor: pointer;
+}
+.business-setting-table:nth-child(2n + 1) {
+  background: #f7f8fa;
+}
+.icon-box {
+  width: 50px;
+  display: inline-block;
+  text-align: left;
+  margin-left: 10px;
+}
+
+
+</style>
+
+<style lang="scss" scoped>
+@import '../styles/file.scss';
+
+.step-section {
+  min-height: 300px;
+
+  /deep/ .el-loading-spinner {
+    top: 45%;
+    .el-icon-loading {
+      font-size: 40px;
+      color: #999;
+    }
+
+    .el-loading-text {
+      color: #333;
+    }
+  }
+}
+.busi-line {
+  position: absolute;
+  bottom: 0;
+  left: 17px;
+  right: 17px;
+  height: 1px;
+  background-color: #e6e6e6;
+}
+
+.busi-state {
+  position: relative;
+  padding-left: 20px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  a {
+    flex-shrink: 0;
+  }
+}
+
+.busi-state-item {
+  padding: 10px 30px;
+  margin: 5px 0;
+  height: 38px;
+  position: relative;
+  margin-right: 5px;
+  border-top: 2px solid #ebebeb;
+  border-bottom: 2px solid #ebebeb;
+  .state-circle {
+    width: 38px;
+    height: 38px;
+    border-radius: 19px;
+    background-color: white;
+    transform: rotate(45deg);
+    position: absolute;
+    z-index: -1;
+  }
+  .state-arrow {
+    width: 38px;
+    height: 38px;
+    transform: scale(0.707) rotate(45deg);
+    border-top: 2px solid #ebebeb;
+    border-right: 2px solid #ebebeb;
+    background-color: white;
+    position: absolute;
+  }
+}
+
+.state-undo {
+  border-top: 2px solid #ebebeb;
+  border-bottom: 2px solid #ebebeb;
+  background-color: white;
+  color: #666;
+  .state-circle {
+    border-color: #ebebeb;
+    background-color: white;
+  }
+  .state-arrow {
+    border-color: #ebebeb;
+    background-color: white;
+  }
+}
+
+.state-doing {
+  border-top: 2px solid #34cecf;
+  border-bottom: 2px solid #34cecf;
+  background-color: white;
+  color: #34cecf;
+  .circle-left {
+    border-color: #34cecf;
+    background-color: white;
+  }
+  .circle-right {
+    border-color: #34cecf;
+    background-color: white;
+  }
+  .arrow-left {
+    border-color: #34cecf;
+    background-color: white;
+  }
+  .arrow-right {
+    border-color: #34cecf;
+    background-color: white;
+  }
+}
+
+.state-suc {
+  border-top: 2px solid #34cecf;
+  border-bottom: 2px solid #34cecf;
+  background-color: #34cecf;
+  color: white;
+  .circle-left {
+    border-color: #a07988;
+    background-color: #34cecf;
+  }
+  .circle-right {
+    border-color: #34cecf;
+    background-color: #34cecf;
+  }
+  .arrow-left {
+    border-color: #34cecf;
+    background-color: white;
+  }
+  .arrow-right {
+    border-color: #34cecf;
+    background-color: #34cecf;
+  }
+}
+
+.state-fail {
+  border-top: 2px solid #ff6767;
+  border-bottom: 2px solid #ff6767;
+  background-color: #ff6767;
+  color: white;
+  .circle-left {
+    border-color: #ff6767;
+    background-color: #ff6767;
+  }
+  .circle-right {
+    border-color: #ff6767;
+    background-color: #ff6767;
+  }
+  .arrow-left {
+    border-color: #ff6767;
+    background-color: white;
+  }
+  .arrow-right {
+    border-color: #ff6767;
+    background-color: #ff6767;
+  }
+}
+
+.state-invalid {
+  border-top: 2px solid #ebebeb;
+  border-bottom: 2px solid #ebebeb;
+  background-color: #ebebeb;
+  color: #666;
+  .state-circle {
+    border-color: #ebebeb;
+    background-color: #ebebeb;
+  }
+  .state-arrow {
+    border-color: #ebebeb;
+    background-color: #ebebeb;
+  }
+
+  .circle-left {
+    border-color: #ebebeb;
+    background-color: #ebebeb;
+  }
+  .circle-right {
+    border-color: #ebebeb;
+    background-color: #ebebeb;
+  }
+  .arrow-left {
+    border-color: #ebebeb;
+    background-color: white;
+  }
+  .arrow-right {
+    border-color: #ebebeb;
+    background-color: #807676;
+  }
+}
+
+.arrow-right {
+  z-index: 1;
+  top: -2px;
+  right: -19px;
+}
+.arrow-left {
+  top: -2px;
+  left: -18px;
+}
+.circle-right {
+  border-top: 2px solid #ebebeb;
+  border-right: 2px solid #ebebeb;
+  z-index: 1;
+  top: -2px;
+  right: -15.5px;
+}
+.circle-left {
+  border-left: 2px solid #ebebeb;
+  border-bottom: 2px solid #ebebeb;
+  top: -2px;
+  left: -17px;
+}
+
+/** 状态操作布局 */
+.state-handel-cont {
+  font-size: 13px;
+  color: #333;
+  .state-handel-item {
+    padding: 10px 0;
+    cursor: pointer;
+    .state-handel-item-img {
+      width: 16px;
+      height: 16px;
+      border-radius: 8px;
+      margin-right: 8px;
+      flex-shrink: 0;
+      display: block;
+    }
+    .state-handel-item-name {
+      flex: 1;
+    }
+    .state-handel-item-value {
+      flex-shrink: 0;
+    }
+  }
+  .state-handel-item:hover {
+    background-color: #f7f8fa;
+  }
+}
+</style>
+
+
diff --git a/vue/src/views/pg-fis/components/Sections.vue b/vue/src/views/pg-fis/components/Sections.vue
new file mode 100644
index 00000000..8a7dc21f
--- /dev/null
+++ b/vue/src/views/pg-fis/components/Sections.vue
@@ -0,0 +1,144 @@
+<template>
+  <div class="section">
+    <div
+      v-if="title && title.length > 0"
+      class="section-header">
+      <div
+        :style="{ 'border-left-color': mColor }"
+        class="section-mark"/>
+      <div class="section-title">{{ title }}</div>
+      <flexbox
+        v-if="showF"
+        class="f-container">
+        <div
+          v-for="(item, index) in fItems"
+          :key="index"
+          :class="{ 'f-item-select':fIndex==item.type }"
+          class="f-item"
+          @click="fClick(item)">{{ item.title }}</div>
+      </flexbox>
+    </div>
+    <div
+      :style="{ 'height': contentHeight }"
+      class="content">
+      <div
+        v-if="showNoData"
+        class="no-data-container">
+        <img
+          class="no-data"
+          src="@/assets/img/no_data.png" >
+        <div class="no-data-name">暂无数据</div>
+      </div>
+      <slot/>
+    </div>
+  </div>
+</template>
+<script type="text/javascript">
+export default {
+  name: 'Sections',
+  components: {},
+  props: {
+    title: {
+      type: String,
+      default: ''
+    },
+    mColor: {
+      type: String,
+      default: '#FF6767'
+    },
+    /** 内容区域固定高度 */
+    contentHeight: {
+      type: String,
+      default: '327px'
+    },
+    /** 展示客户工作台  重要提醒 时间筛选 */
+    showF: {
+      type: Boolean,
+      default: false
+    },
+    fItems: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    },
+    /** 展示无数据 */
+    showNoData: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      fIndex: -1
+    }
+  },
+  computed: {},
+  mounted() {},
+  methods: {
+    fClick(item) {
+      this.fIndex = item.type
+      this.$emit('f-click', 'val')
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.section {
+  position: relative;
+  background-color: white;
+  margin-top: 8px;
+}
+.section:first-child {
+  margin-top: 0;
+}
+
+.section-mark {
+  border-left-width: 3px;
+  border-left-style: solid;
+  height: 10px;
+}
+
+.section-header {
+  display: flex;
+  align-items: center;
+  padding: 5px 15px;
+}
+.section-title {
+  font-size: 13px;
+  color: #333;
+  margin-left: 8px;
+  flex-shrink: 0;
+}
+
+.f-container {
+  width: auto;
+  margin-left: 40px;
+  .f-item {
+    padding: 2px 4px;
+    font-size: 12px;
+    margin-right: 10px;
+    color: #666;
+  }
+  .f-item-select {
+    border-radius: 2px;
+    background-color: #ff6767;
+    color: white;
+  }
+}
+
+.content {
+  overflow: auto;
+  .no-data-container {
+    text-align: center;
+    .no-data {
+      margin-top: 30px;
+    }
+    .no-data-name {
+      font-size: 12px;
+      margin-top: 8px;
+      color: #666;
+    }
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/filterForm/filterContent.vue b/vue/src/views/pg-fis/components/filterForm/filterContent.vue
new file mode 100644
index 00000000..4fb37590
--- /dev/null
+++ b/vue/src/views/pg-fis/components/filterForm/filterContent.vue
@@ -0,0 +1,177 @@
+<template>
+  <div class="wrapper">
+    <ul class="list">
+      <li
+        v-for="(item, index) in showObj.form"
+        :key="index"
+        class="list-item">
+        <span v-if="item.formType == 'date'">{{ item.name +'&nbsp;“' + item.value[0] + '-' + item.value[1] + '”' }}</span>
+        <span v-else-if="item.formType === 'datetime'">{{ item.name +'&nbsp;“' + item.value[0] + '-' + item.value[1] + '”' }}</span>
+        <!-- <span v-else-if="item.formType === 'business_type'">{{ item.name +'&nbsp;“' + getTypesName(item) + getStatusName(item) + '”' }}</span>
+        <span v-else-if="item.formType === 'map_address'">{{ `${item.name} ${item.address.state} ${item.address.city} ${item.address.area}` }}</span>
+        <span v-else-if="item.formType === 'checkStatus'">{{ item.name +'&nbsp;“' + optionsNames[item.condition]+ '”'+'&nbsp;'+ getCheckName(item) }}</span>
+        <span v-else-if="item.formType === 'user'">{{ item.name +'&nbsp;' + optionsNames[item.condition] + '“' + item.value[0].realname + '”' }}</span>
+        <span v-else-if="item.formType === 'category' && item.value.length > 0">{{ item.name +'&nbsp;“' + item.valueContent + '”' }}</span> -->
+        <span v-else-if="item.formType === 'select' && item.value.length > 0">{{ item.name + '&nbsp;' + optionsNames[item.condition] + '“' + getSelectName(item) + '”' }}</span>
+        <span v-else-if="item.formType === 'switch'">{{ item.name + '&nbsp;' + optionsNames[item.condition] + '“' + getSwitchName(item) + '”' }}</span>
+        <span v-else-if="item.formType != 'text' && item.fieldName.endsWith('ID')">{{ item.name + '&nbsp;' + optionsNames[item.condition] + '“' + getRelativeName(item) + '”' }}</span>
+        <span v-else>{{ item.name + '&nbsp;' + optionsNames[item.condition] + '“' + item.value + '”' }}</span>
+        <i
+          class="el-icon-close icon"
+          @click="handleDelete(item, index)"/>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'FilterContent',
+  props: {
+    obj: {
+      type: Object,
+      required: true,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      // 获取条件名称
+      optionsNames: {
+        is: '等于',
+        isNot: '不等于',
+        contains: '包含',
+        notContains: '不包含',
+        startWith: '开始于',
+        endWith: '结束于',
+        isNull: '为空',
+        isNotNull: '不为空',
+        eq: '等于',
+        neq: '不等于',
+        gt: '大于',
+        egt: '大于等于',
+        lt: '小于',
+        elt: '小于等于'
+      },
+      // 展示信息
+      showObj: {}
+    }
+  },
+  computed: {},
+  watch: {
+    obj: function(val) {
+      this.showObj = val
+    }
+  },
+  mounted() {
+    this.showObj = this.obj
+  },
+  methods: {
+    /**
+     * 删除高级筛选条件
+     * @param index
+     */
+    handleDelete(item, index) {
+      this.$delete(this.showObj.obj, item.fieldName)
+      this.showObj.form.splice(index, 1)
+      this.$emit('delete', { item: item, index: index, obj: this.showObj })
+    },
+    // 商机组展示名称
+    getTypesName(data) {
+      if (data.typeId) {
+        const obj = data.typeOption.find(item => {
+          return item.typeId === data.typeId
+        })
+        return obj.name || ''
+      }
+      return ''
+    },
+    getCheckName(data) {
+      let value = ''
+      data.setting.forEach(item => {
+        if (item.value === data.value) {
+          value = item.name
+          return
+        }
+      })
+      return value
+    },
+    // 商机阶段展示名称
+    getStatusName(data) {
+      if (data.statusId) {
+        const obj = data.statusOption.find(item => {
+          return item.statusId === data.statusId
+        })
+        if (obj.name) {
+          return '-' + obj.name
+        }
+        return ''
+      }
+      return ''
+    },
+    getSelectName(data) {
+      let value = ''
+      data.setting.forEach(item => {
+        if (item.split(",")[1] === data.value) {
+          value = item.split(",")[0]
+          return
+        }
+      })
+      return value
+    },
+    getSwitchName(data) {
+       return  data.value===false? '否':'是';
+    } ,
+    getRelativeName(data)
+    {
+        return data.displadValue;
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@mixin left() {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+@mixin center() {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.wrapper {
+  width: 100%;
+  min-height: 50px;
+  background: white;
+  border-top: 1px solid #e1e1e1;
+  font-size: 13px;
+  overflow-x: scroll;
+  color: #aaa;
+  @include left;
+  .list {
+    width: 100%;
+    padding: 0 20px;
+    margin-bottom: 10px;
+    flex-shrink: 0;
+    @include left;
+    .list-item {
+      height: 30px;
+      padding: 0 10px;
+      margin: 10px 15px 0 0;
+      border: 1px solid #e1e1e1;
+      border-radius: 3px;
+      flex-shrink: 0;
+      @include center;
+      .icon {
+        margin-left: 20px;
+        cursor: pointer;
+      }
+    }
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/filterForm/index.vue b/vue/src/views/pg-fis/components/filterForm/index.vue
new file mode 100644
index 00000000..692d056c
--- /dev/null
+++ b/vue/src/views/pg-fis/components/filterForm/index.vue
@@ -0,0 +1,757 @@
+<template>
+  <el-dialog
+    v-dialogDrag
+    :visible.sync="visible"
+    :close-on-click-modal="false"
+    title="高级筛选"
+    width="900px"
+    :append-to-body="true"
+    @close="handleCancel"
+  >
+    <div style="margin-bottom: 10px">筛选条件</div>
+    <el-form id="filter-container" class="filter-container">
+      <el-form-item>
+        <template v-for="(formItem, index) in form">
+          <el-row :key="index">
+            <el-col :span="8">
+              <el-select
+                v-model="formItem.fieldName"
+                placeholder="请选择要筛选的字段名"
+                @change="fieldChange(formItem)"
+              >
+                <el-option
+                  v-for="item in fieldList"
+                  :key="item.fieldName"
+                  :label="item.name"
+                  :value="item.fieldName"
+                />
+              </el-select>
+            </el-col>
+
+            <el-col v-if="showCalCondition(formItem.formType)" :span="1"
+              >&nbsp;</el-col
+            >
+            <el-col v-if="showCalCondition(formItem.formType)" :span="4">
+              <el-select
+                v-model="formItem.condition"
+                placeholder="请选择筛选方法"
+                @change="actionChange(formItem)"
+              >
+                <el-option
+                  v-for="item in calConditionOptions(
+                    formItem.formType,
+                    formItem
+                  )"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-col>
+
+            <!-- 商机组 -->
+            <el-col v-if="formItem.formType == 'business_type'" :span="1"
+              >&nbsp;</el-col
+            >
+            <el-col v-if="formItem.formType == 'business_type'" :span="4">
+              <el-select
+                v-model="formItem.typeId"
+                placeholder="请选择"
+                @change="typeOptionsChange(formItem)"
+              >
+                <el-option
+                  v-for="item in formItem.typeOption"
+                  :key="item.typeId"
+                  :label="item.name"
+                  :value="item.typeId"
+                />
+              </el-select>
+            </el-col>
+
+            <el-col :span="1">&nbsp;</el-col>
+            <el-col
+              :span="
+                formItem.formType === 'datetime' ||
+                formItem.formType === 'date' ||
+                formItem.formType === 'map_address'
+                  ? 13
+                  : 8
+              "
+            >
+              <el-switch
+                v-if="formItem.formType === 'switch'"
+                v-model="formItem.value"
+                :value="formItem.value"
+              >
+              </el-switch>
+              <el-select
+                v-else-if="formItem.formType === 'select'"
+                clearable
+                v-model="formItem.value"
+                placeholder="请选择筛选条件"
+              >
+                <el-option
+                  v-for="item in formItem.setting"
+                  :key="item.split(',')[1]"
+                  :label="item.split(',')[0]"
+                  :value="item.split(',')[1]"
+                />
+              </el-select>
+              <el-select
+                v-else-if="formItem.formType === 'checkStatus'"
+                v-model="formItem.value"
+                placeholder="请选择筛选条件"
+              >
+                <el-option
+                  v-for="item in formItem.setting"
+                  :key="item.value"
+                  :label="item.name"
+                  :value="item.value"
+                />
+              </el-select>
+              <el-date-picker
+                v-else-if="
+                  formItem.formType === 'date' ||
+                  formItem.formType === 'datetime'
+                "
+                v-model="formItem.value"
+                :value-format="
+                  formItem.formType === 'date'
+                    ? 'yyyy-MM-dd'
+                    : 'yyyy-MM-dd HH:mm:ss'
+                "
+                :type="
+                  formItem.formType === 'date' ? 'daterange' : 'datetimerange'
+                "
+                style="padding: 0px 10px"
+                range-separator="-"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              />
+              <el-select
+                v-else-if="formItem.formType === 'business_type'"
+                v-model="formItem.statusId"
+                placeholder="请选择"
+              >
+                <el-option
+                  v-for="item in formItem.statusOption"
+                  :key="item.statusId"
+                  :label="item.name"
+                  :value="item.statusId"
+                />
+              </el-select>
+
+              <crm-relative-cell
+                ref="CrmRelativeCell"
+                v-else-if="
+                  formItem.formType != 'text' &&
+                  formItem.fieldName.endsWith('ID')
+                "
+                :item="formItem"
+                :relation="{ type: formItem.formType }"
+                :radio="false"
+                :disabled="formItem.disabled"
+                @value-change="valueChange"
+              />
+
+              <el-input
+                v-else
+                v-model="formItem.value"
+                placeholder="请输入筛选条件"
+              />
+
+              <!-- <el-input
+                v-else-if="formItem.formType === 'text'"
+                v-model="formItem.value"
+                placeholder="请输入筛选条件"/> -->
+              <!-- <xh-user-cell
+                v-else-if="formItem.formType === 'user'"
+                :item="formItem"
+                :info-params="{m	:'crm',c: crmType,a: 'index' }"
+                @value-change="arrayValueChange"/>
+              <xh-prouct-cate
+                v-else-if="formItem.formType === 'category'"
+                :item="formItem"
+                @value-change="arrayValueChange"/>
+              <v-distpicker
+                v-else-if="formItem.formType === 'map_address'"
+                :province="formItem.address.state"
+                :city="formItem.address.city"
+                :area="formItem.address.area"
+                @province="selectProvince($event,formItem)"
+                @city="selectCity($event,formItem)"
+                @area="selectArea($event,formItem)"/> -->
+            </el-col>
+            <el-col :span="1" class="delete">
+              <i
+                class="el-icon-error delete-btn"
+                @click="handleDelete(index)"
+              />
+            </el-col>
+          </el-row>
+        </template>
+      </el-form-item>
+    </el-form>
+    <p v-show="showErrors" class="el-icon-warning warning-info">
+      <span class="desc">筛选条件中有重复项！</span>
+    </p>
+    <el-button type="text" @click="handleAdd">+ 添加筛选条件</el-button>
+    <!-- <div
+      v-if="!isSeas"
+      class="save">
+      <el-checkbox v-model="saveChecked">保存为场景</el-checkbox>
+      <el-input
+        v-show="saveChecked"
+        v-model.trim="saveName"
+        :maxlength="10"
+        class="name"
+        placeholder="请输入场景名称，最多10个字符"/>
+      <div
+        v-show="saveChecked"
+        class="save-setting">
+        <el-checkbox v-model="saveDefault">设置为默认</el-checkbox>
+      </div>
+    </div> -->
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="handleConfirm">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { objDeepCopy } from "@/utils";
+import { CrmRelativeCell } from "@/components/CreateCom";
+// import { XhUserCell, XhProuctCate } from '@/components/CreateCom'
+// import VDistpicker from 'v-distpicker'
+/**
+ * fieldList: 高级筛选的字段
+ *     type:  date || datetime || select || 其他 input
+ */
+export default {
+  name: "Index",
+  components: {
+    "crm-relative-cell": CrmRelativeCell,
+    // XhUserCell,
+    // XhProuctCate,
+    // VDistpicker
+  },
+  props: {
+    dialogVisible: {
+      type: Boolean,
+      required: true,
+      default: false,
+    },
+    fieldList: {
+      type: Array,
+      required: true,
+      default: () => {
+        return [];
+      },
+    },
+    obj: {
+      type: Object,
+      required: true,
+      default: () => {
+        return {};
+      },
+    },
+    /** 获取客户管理下列表权限内的员工列表 针对 usersList */
+    crmType: {
+      type: String,
+      default: "",
+    },
+    // 辅助 使用 公海没有场景
+    isSeas: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      form: [],
+      visible: false,
+      showErrors: false,
+      saveChecked: false, // 展示场景
+      saveDefault: false, // 设置为默认场景
+      saveName: null, // 场景名称
+    };
+  },
+  watch: {
+    dialogVisible: {
+      handler(val) {
+        if (val) {
+          this.form = objDeepCopy(this.obj.form);
+          if (this.form.length == 0) {
+            this.form.push({
+              fieldName: "",
+              name: "",
+              formType: "text",
+              condition: "is",
+              action: 0,
+              value: "",
+              displadValue: "",
+              typeOption: [],
+              statusOption: [],
+              typeId: "",
+              statusId: "",
+              address: {
+                state: "",
+                city: "",
+                area: "",
+              },
+            });
+          }
+          this.saveChecked = false;
+          this.saveDefault = false;
+          this.saveName = null;
+        }
+        this.visible = this.dialogVisible;
+      },
+      deep: true,
+      immediate: true,
+    },
+
+    form() {
+      this.$nextTick(() => {
+        var container = document.getElementById("filter-container");
+        container.scrollTop = container.scrollHeight;
+      });
+    },
+  },
+  methods: {
+    /**
+     * 位置更改
+     */
+    selectProvince(data, formItem) {
+      formItem.address.state = data.value;
+    },
+    selectCity(data, formItem) {
+      formItem.address.city = data.value;
+    },
+    selectArea(data, formItem) {
+      formItem.address.area = data.value;
+    },
+
+    /**
+     * 商机组状态
+     */
+    typeOptionsChange(formItem) {
+      if (formItem.typeId) {
+        const obj = formItem.typeOption.find((item) => {
+          return item.typeId === formItem.typeId;
+        });
+        formItem.statusOption = obj.statusList || [];
+      } else {
+        formItem.statusOption = [];
+      }
+      formItem.statusId = "";
+    },
+    /**
+     * 用户创建人
+     * 产品类别
+     */
+    arrayValueChange(data) {
+      if (data.value.length > 0) {
+        data.item.value = data.value;
+        data.item.valueContent = data.valueContent;
+      } else {
+        data.item.value = [];
+      }
+    },
+
+    /**
+     * 是否展示条件
+     */
+    showCalCondition(formType) {
+      if (
+        formType == "date" ||
+        formType == "datetime" ||
+        formType == "business_type" ||
+        formType == "category" ||
+        formType == "map_address"
+      ) {
+        return false;
+      }
+      return true;
+    },
+    /** 条件数据源 */
+    calConditionOptions(formType, item) {
+      //bool 或者 枚举类型
+      if (
+        formType == "select" ||
+        formType == "switch" ||
+        formType == "checkbox"
+        // ||formType == 'user' ||
+        // formType == 'checkStatus'
+      ) {
+        return [
+          { action: 0, value: "is", label: "等于", disabled: false },
+          { action: 1, value: "isNot", label: "不等于", disabled: false },
+        ];
+      }
+      //字符串类型
+      else if (
+        formType == "module" ||
+        formType == "text" ||
+        formType == "textarea"
+      ) {
+        return [
+          { action: 0, value: "is", label: "等于", disabled: false },
+          { action: 1, value: "isNot", label: "不等于", disabled: false },
+          { value: "contains", label: "包含", disabled: false },
+          { value: "notContains", label: "不包含", disabled: false },
+        ];
+      }
+      //数值类型
+      else if (formType == "floatnumber" || formType == "number") {
+        return [
+          { value: "is", label: "等于", disabled: false },
+          { value: "isNot", label: "不等于", disabled: false },
+          // { value: 'contains', label: '包含', disabled: false },
+          // { value: 'notContains', label: '不包含', disabled: false },
+          // { value: 'isNull', label: '为空', disabled: false },
+          // { value: 'isNotNull', label: '不为空', disabled: false },
+          { value: "gt", label: "大于", disabled: false },
+          { value: "egt", label: "大于等于", disabled: false },
+          { value: "lt", label: "小于", disabled: false },
+          { value: "elt", label: "小于等于", disabled: false },
+        ];
+      } else if (formType == "datetime") {
+        return [
+          { value: "startWith", label: "开始于", disabled: false },
+          { value: "endWith", label: "结束于", disabled: false },
+        ];
+      }
+      // else if (formType == 'category') {
+      //   return [
+      //     { value: 'is', label: '等于', disabled: false },
+      //     { value: 'isnot', label: '不等于', disabled: false },
+      //     { value: 'contains', label: '包含', disabled: false },
+      //     { value: 'not_contain', label: '不包含', disabled: false }
+      //   ]
+      // }
+      else {
+        //默认查询条件
+        return [
+          { value: "is", label: "等于", disabled: false },
+          { value: "isNot", label: "不等于", disabled: false },
+          // { value: 'contains', label: '包含', disabled: false },
+          // { value: 'notContains', label: '不包含', disabled: false },
+          // { value: 'startWith', label: '开始于', disabled: false },
+          // { value: 'endWith', label: '结束于', disabled: false },
+          // { value: 'isNull', label: '为空', disabled: false },
+          // { value: 'isNotNull', label: '不为空', disabled: false },
+          // { value: 'gt', label: '大于', disabled: false },
+          // { value: 'egt', label: '大于等于', disabled: false },
+          // { value: 'lt', label: '小于', disabled: false },
+          // { value: 'elt', label: '小于等于', disabled: false }
+        ];
+      }
+    },
+    /**
+     * 当前选择的字段名改变，判断是否有重复
+     * @param formItem
+     */
+    fieldChange(formItem) {
+      const obj = this.fieldList.find((item) => {
+        return item.fieldName === formItem.fieldName;
+      });
+      if (obj) {
+        formItem.formType = obj.formType;
+        formItem.name = obj.name;
+        if (formItem.formType === "date" || formItem.formType === "datetime") {
+          formItem.value = [];
+        } else if (formItem.formType == "select") {
+          formItem.setting = obj.setting || [];
+          formItem.value = "";
+        }
+        //关联表
+        else if (
+          formItem.formType != "text" &&
+          formItem.fieldName.endsWith("ID")
+        ) {
+          //清空内容
+          formItem.value = "";
+        }
+      }
+
+      const arr = this.form.filter((item) => {
+        return item.fieldName === formItem.fieldName;
+      });
+      if (arr.length > 1) this.showErrors = true;
+      else this.showErrors = false;
+    },
+    actionChange(formItem) {
+      switch (formItem.condition) {
+        case "is": // 等于
+          formItem.action = 0;
+          break;
+        case "isNot": // 不等于
+          formItem.action = 1;
+          break;
+        case "gt": //大于
+          formItem.action = 2;
+          break;
+        case "lt": //小于
+          formItem.action = 3;
+          break;
+        case ("egt", "startWith"): //大于等于
+          formItem.action = 4;
+          break;
+        case ("elt", "endWith"): //小于等于
+          formItem.action = 5;
+          break;
+        case "contains": // 类似于
+          formItem.action = 6;
+          break;
+        case "notContains": //不类似于
+          formItem.action = 7;
+          break;
+        default:
+          return 0;
+      }
+    },
+    valueChange(data) {
+      var type = data.type;
+      var formItem = this.form.find((item) => {
+        return item.formType === type;
+      });
+      if (
+        formItem != null &&
+        data.value[0] != null &&
+        data.value[0]["Id"] != null
+      ) {
+        formItem.value = data.value[0]["Id"];
+        formItem.displadValue = data.value[0]["Name"];
+      }
+    },
+    /**
+     * 取消选择
+     */
+    handleCancel() {
+      this.$emit("update:dialogVisible", false);
+    },
+    /**
+     * 确定选择
+     */
+    handleConfirm() {
+      if (this.showErrors) {
+        this.$message.error("筛选条件中有重复项！");
+        return;
+      }
+      if (this.saveChecked) {
+        if (!this.saveName || this.saveName === "") {
+          this.$message.error("场景名称不能为空！");
+          return;
+        }
+      }
+      for (let i = 0; i < this.form.length; i++) {
+        const o = this.form[i];
+        if (!o.fieldName || o.fieldName === "") {
+          this.$emit("filter", null);
+          return;
+        } else {
+          if (o.formType == "date" || o.formType == "datetime") {
+            if (!o.value || o.value.length === 0) {
+              this.$message.error("请选择筛选条件的值！");
+              return;
+            }
+          } else if (o.formType == "text") {
+            if (!o.value && o.value !== 0) {
+              this.$message.error("请输入筛选条件的值！");
+              return;
+            }
+          }
+          //关联表
+          else if (o.formType != "text" && o.fieldName.endsWith("ID")) {
+            if (!o.value && o.value !== 0) {
+              this.$message.error("请选择筛选条件的值！");
+              return;
+            }
+          }
+        }
+      }
+
+      let items = [];
+      this.form.forEach((o) => {
+        let obj = {};
+        if (o.formType == "text") {
+          obj = {
+            condition: o.condition,
+            action: o.action,
+            value: o.value,
+            formType: o.formType,
+            fieldName: o.fieldName,
+          };
+        } else if (o.formType == "datetime" || o.formType == "date") {
+          obj = {
+            condition: o.condition,
+            action: o.action,
+            start: o.value[0],
+            end: o.value[1],
+            formType: o.formType,
+            fieldName: o.fieldName,
+          };
+        } else if (o.formType == "select") {
+          obj = {
+            condition: o.condition,
+            action: o.action,
+            value: o.value,
+            formType: o.formType,
+            fieldName: o.fieldName,
+          };
+        } else if (o.formType == "switch") {
+          let value = o.value === false ? "false" : "true"; //o.value默认等于''
+          obj = {
+            condition: o.condition,
+            action: o.action,
+            value: value,
+            formType: o.formType,
+            fieldName: o.fieldName,
+          };
+        }
+        //关联表
+        else {
+          obj = {
+            condition: o.condition,
+            action: o.action,
+            value: o.value,
+            formType: o.formType,
+            fieldName: o.fieldName,
+            displadValue: o.displadValue,
+          };
+        }
+        items.push(obj);
+      });
+      const data = {
+        obj: items,
+        form: this.form,
+        saveChecked: this.saveChecked,
+        saveDefault: this.saveDefault,
+        saveName: this.saveName,
+      };
+      data.obj = items;
+      this.$emit("filter", data);
+    },
+    /**
+     * 添加筛选条件
+     */
+    handleAdd() {
+      this.form.push(
+        {
+          fieldName: "",
+          formType: "text",
+          condition: "is",
+          action: 0,
+          value: "",
+          displadValue: "",
+          formType: "",
+          setting: [],
+          typeOption: [],
+          statusOption: [],
+          typeId: "",
+          statusId: "",
+          data: [],
+        }
+      );
+    },
+    /**
+     * 删除筛选条件
+     * @param index
+     */
+    handleDelete(index) {
+      this.$confirm("您确定要删除这一条数据吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.form.splice(index, 1);
+          this.form.forEach((itemForm) => {
+            //用于判断是否有重复项
+            //this.fieldChange(item);
+            const arr = this.form.filter((item) => {
+              return item.fieldName === itemForm.fieldName;
+            });
+            if (arr.length > 1) this.showErrors = true;
+            else this.showErrors = false;
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+/deep/ .el-dialog__body {
+  padding: 10px 20px;
+}
+
+/deep/ .el-form-item__label {
+  width: 100%;
+  text-align: left;
+}
+.filter-container {
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.save {
+  margin-top: 10px;
+  .name {
+    width: 300px;
+    margin-left: 10px;
+    /deep/ .el-input__inner {
+      height: 32px;
+    }
+  }
+  .save-setting {
+    margin-top: 20px;
+  }
+}
+
+.el-form-item {
+  margin-bottom: 0;
+}
+
+.el-row {
+  margin-bottom: 20px;
+  .delete-btn {
+    margin-left: 15px;
+    color: #bbb;
+    cursor: pointer;
+  }
+  .el-select,
+  .el-date-editor {
+    width: 100%;
+  }
+}
+
+.warning-info {
+  width: 100%;
+  font-size: 14px;
+  color: #f56c6c;
+  margin-top: 10px;
+  .desc {
+    padding-left: 8px;
+  }
+}
+
+.distpicker-address-wrapper /deep/ select {
+  border-radius: 2px;
+  font-size: 13px;
+  height: 34px;
+  -webkit-appearance: none;
+  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAWCAYAAAAW5GZjAAAMHmlDQ1BEaXNwbGF5AABIx62Xd1RTyRrA55YkJCS0QASkhN4E6VV6jVSpgo2QBBJKDAlBxI4uKrgWVCxYkVUR21oAWWzYlUWw90URFGVdLNhAeZME0NXz/njnvDln7v3lm2++lrlzZgBQjWGLRNmoGgA5wjxxbGgAc2JyCpP0BBCBGiADXaDK5khE/jExEQC24fe/2/tbAJG9r9vKbIH/ralzeRIOAEgM5DSuhJMD+QgAuCtHJM4DgNAD5SYz8kSQiTBKoCmGAUI2lXGGgt1lnKbgCLlOfGwg5FQAlKhstjgDABVZXMx8Tga0o7IMsr2QKxBCboTsw+GzuZAHII/JyZkOWdUSsmXad3Yy/mUzbcQmm50xwopc5E0pSCARZbNngv93y8mWDvswgZ3KF4fFynKW1S1reriMqZAvCtOioiFrQL4h4Mr1ZdzFl4YlDOl/5EgCYc0AAwCUymUHhUPWg2wszI6KGJL7pAtCWJBh7dF4QR4rXjEX5Yqnxw7ZRwt4kuC4YWaL5b5kOiXSrAT/IZtb+DzWsM2GQn58kiJOtDVfkBgFWQXyA0lWXPiQzotCfmDUsI5YGiuLGf7nGEgXh8QqdDDTHMlwXpgnX8CKGuKIPH58mGIuNpXDlsemDTmTJ5kYMRwnlxcUrMgLK+IJE4bix8pEeQGxQ/pVouyYIX2skZcdKpMbQ26R5McNz+3Ng4tNkS8ORHkx8YrYcM1M9vgYRQy4NYgAgSAIMIEU9jQwHWQCQUtPXQ/8pRgJAWwgBhmAB2yHJMMzkuQjQviMA4Xgb0g8IBmZFyAf5YF8KP8yIlU8bUG6fDRfPiMLdEHOAeEgG/6WymcJR7wlgqdQIvjJOwfGmg27bOwnGVN1WEYMJgYRw4ghRCtcF/fBvfAI+PSD3RF3xz2G4/qmT+gitBGeEG4S2gl3pwmKxD9EzgSRoB3GGDKUXdr32eHm0KoLHoB7Q/vQNs7AdYEt7gw9+eO+0LcLlH4fq3Qk42+1HLJFtiej5FFkP7LljxGoWKu4jFiRVer7WijiShupVuDIyI95BH5XPy58h/+oiS3BDmMXsNPYJawRqwNM7CRWjzVjx2U8sjaeytfGsLdYeTxZ0I7gJ3/sIZ+yqknsa+y77QeGxkAeryBP9rEEThfNFAsy+HlMf7hb85gsIcduDNPR3gHuorK9X7G1vGXI93SEcfmbLPcUAB4lUJjxTcaGe9CxLgDo77/JTN7AZb8SgOOtHKk4XyHDZQ8CoABV+KXoAAO4d1nCjByBK/ACfiAYjAfRIB4kg6mwzny4TsVgBpgNFoBiUApWgrVgI9gKdoDdYB84BOpAIzgNzoMroBXcBPfhWukEL0EveA/6EQQhITSEjugghogZYoM4Iu6IDxKMRCCxSDKSimQgQkSKzEYWIqVIGbIR2Y5UI78jx5DTyCWkDbmLPEa6kTfIZxRDqagmqo+ao2NRd9QfDUfj0SloBpqLFqKL0OXoerQS3YvWoqfRK+hNtB19ifZhAFPGGJgRZou5Y4FYNJaCpWNibC5WgpVjldh+rAH+09exdqwH+4QTcTrOxG3heg3DE3AOnovPxZfhG/HdeC1+Fr+OP8Z78a8EGkGPYEPwJLAIEwkZhBmEYkI5YSfhKOEc/HY6Ce+JRCKDaEF0g99eMjGTOIu4jLiZeIB4ithG7CD2kUgkHZINyZsUTWKT8kjFpA2kvaSTpGukTtJHJWUlQyVHpRClFCWhUpFSudIepRNK15SeKfWT1chmZE9yNJlLnkleQa4iN5CvkjvJ/RR1igXFmxJPyaQsoKyn7KecozygvFVWVjZW9lCeoCxQnq+8Xvmg8kXlx8qfqBpUa2ogdTJVSl1O3UU9Rb1LfUuj0cxpfrQUWh5tOa2adob2iPZRha5ip8JS4arMU6lQqVW5pvJKlaxqpuqvOlW1ULVc9bDqVdUeNbKauVqgGlttrlqF2jG122p96nR1B/Vo9Rz1Zep71C+pP9cgaZhrBGtwNRZp7NA4o9FBx+gm9EA6h76QXkU/R+/UJGpaaLI0MzVLNfdptmj2amloOWslahVoVWgd12pnYAxzBouRzVjBOMS4xfg8Sn+U/yjeqKWj9o+6NuqD9mhtP22edon2Ae2b2p91mDrBOlk6q3TqdB7q4rrWuhN0Z+hu0T2n2zNac7TXaM7oktGHRt/TQ/Ws9WL1Zunt0GvW69M30A/VF+lv0D+j32PAMPAzyDRYY3DCoNuQbuhjKDBcY3jS8AVTi+nPzGauZ55l9hrpGYUZSY22G7UY9RtbGCcYFxkfMH5oQjFxN0k3WWPSZNJramgaaTrbtMb0nhnZzN2Mb7bO7ILZB3ML8yTzxeZ15s8ttC1YFoUWNRYPLGmWvpa5lpWWN6yIVu5WWVabrVqtUWsXa751hfVVG9TG1UZgs9mmbQxhjMcY4ZjKMbdtqbb+tvm2NbaP7Rh2EXZFdnV2r8aajk0Zu2rshbFf7V3ss+2r7O87aDiMdyhyaHB442jtyHGscLzhRHMKcZrnVO/02tnGmee8xfmOC90l0mWxS5PLF1c3V7HrftduN1O3VLdNbrfdNd1j3Je5X/QgeAR4zPNo9Pjk6eqZ53nI8x8vW68srz1ez8dZjOONqxrX4W3szfbe7t3uw/RJ9dnm0+5r5Mv2rfR94mfix/Xb6ffM38o/03+v/6sA+wBxwNGAD4GegXMCTwVhQaFBJUEtwRrBCcEbgx+FGIdkhNSE9Ia6hM4KPRVGCAsPWxV2m6XP4rCqWb3j3cbPGX82nBoeF74x/EmEdYQ4oiESjRwfuTryQZRZlDCqLhpEs6JXRz+MsYjJjfljAnFCzISKCV2xDrGzYy/E0eOmxe2Jex8fEL8i/n6CZYI0oSlRNXFyYnXih6SgpLKk9oljJ86ZeCVZN1mQXJ9CSklM2ZnSNyl40tpJnZNdJhdPvjXFYkrBlEtTdadmTz0+TXUae9rhVEJqUuqe1AF2NLuS3ZfGStuU1ssJ5KzjvOT6cddwu3nevDLes3Tv9LL05xneGaszuvm+/HJ+jyBQsFHwOjMsc2vmh6zorF1Zg9lJ2QdylHJSc44JNYRZwrPTDaYXTG8T2YiKRe25nrlrc3vF4eKdEkQyRVKfpwkP2c1SS+kv0sf5PvkV+R9nJM44XKBeICxonmk9c+nMZ4Uhhb/NwmdxZjXNNpq9YPbjOf5zts9F5qbNbZpnMm/RvM75ofN3L6AsyFrwZ5F9UVnRu4VJCxsW6S+av6jjl9BfaopVisXFtxd7Ld66BF8iWNKy1GnphqVfS7gll0vtS8tLB5Zxll3+1eHX9b8OLk9f3rLCdcWWlcSVwpW3Vvmu2l2mXlZY1rE6cnXtGuaakjXv1k5be6ncuXzrOso66br29RHr6zeYbli5YWAjf+PNioCKA5v0Ni3d9GEzd/O1LX5b9m/V31q69fM2wbY720O311aaV5bvIO7I39FVlVh14Tf336p36u4s3flll3BX++7Y3Wer3aqr9+jtWVGD1khruvdO3tu6L2hf/X7b/dsPMA6UHgQHpQdf/J76+61D4YeaDrsf3n/E7Mimo/SjJbVI7cza3jp+XXt9cn3bsfHHmhq8Go7+YffHrkajxorjWsdXnKCcWHRi8GThyb5TolM9pzNOdzRNa7p/ZuKZG2cnnG05F37u4vmQ82cu+F84edH7YuMlz0vHLrtfrrvieqW22aX56J8ufx5tcW2pvep2tb7Vo7WhbVzbiWu+105fD7p+/gbrxpWbUTfbbiXcunN78u32O9w7z+9m3319L/9e//35DwgPSh6qPSx/pPeo8i+rvw60u7Yffxz0uPlJ3JP7HZyOl08lTwc6F3XRusqfGT6rfu74vLE7pLv1xaQXnS9FL/t7iv9W/3vTK8tXR/7x+6e5d2Jv52vx68E3y97qvN31zvldU19M36P3Oe/7P5R81Pm4+5P7pwufkz4/658xQBpY/8XqS8PX8K8PBnMGB0VsMVt+FMBgR9PTAXizCwBaMjw7tAJAmaS4m8kborhPygn8N1bc3+TNFYBdfgAkzAcgAp5RtsBuBpkK37IjeLwfQJ2cRvpQk6Q7OSpsUeGNhfBxcPCtPgCkBgC+iAcH+zcPDn6pgsHeBeBUruJOKGuyO+g2Oxm1dr766W72H1oCcSjh6sMlAAAACXBIWXMAABYlAAAWJQFJUiTwAAAF9mlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDAgNzkuMTYwNDUxLCAyMDE3LzA1LzA2LTAxOjA4OjIxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOCAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMTgtMDctMjdUMDc6NTY6NDctMDc6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDE4LTA3LTI3VDA3OjU5OjA4LTA3OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDE4LTA3LTI3VDA3OjU5OjA4LTA3OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgcGhvdG9zaG9wOklDQ1Byb2ZpbGU9IkRpc3BsYXkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OWVmMTg3ZTUtMWVmNy00NzlhLWE1Y2QtMmVkMTE5NjQ2Y2ZmIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6MTRmNTk5YTMtYTc1Zi05NDQxLTk3ZDQtMmY3OTNjNWQ3NTI3IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6M2FmYmY3ZWYtNWFiOS00MTk4LWFjODUtNzY2NzE2NDk2ODM1Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDozYWZiZjdlZi01YWI5LTQxOTgtYWM4NS03NjY3MTY0OTY4MzUiIHN0RXZ0OndoZW49IjIwMTgtMDctMjdUMDc6NTY6NDctMDc6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChNYWNpbnRvc2gpIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJzYXZlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo5ZWYxODdlNS0xZWY3LTQ3OWEtYTVjZC0yZWQxMTk2NDZjZmYiIHN0RXZ0OndoZW49IjIwMTgtMDctMjdUMDc6NTk6MDgtMDc6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE4IChNYWNpbnRvc2gpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pr46tjAAAACBSURBVCjPY/j//z8DOgaCVVjFsSgMB2IQIxuvYiBgBuJHUMXfgVgCn+I+qEIYXoxVMRBYoymEYX9sio/hUHz79+/fCMVAUIxDIQy3Q9UxyAPxPwKKQdgEHKZAfI4IvJ8BW+DjwoNFMUkeJCnoSIoUkqOb5IREUhIlOfGTlK0IZVgAkODRpD7i30MAAAAASUVORK5CYII=);
+  background-position: calc(100% - 4px) 50%;
+  background-repeat: no-repeat;
+  background-size: 5px 11px;
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/followLog/RecordLog.vue b/vue/src/views/pg-fis/components/followLog/RecordLog.vue
new file mode 100644
index 00000000..bb6e2c5b
--- /dev/null
+++ b/vue/src/views/pg-fis/components/followLog/RecordLog.vue
@@ -0,0 +1,156 @@
+<template>
+  <div v-loading="loading">
+    <div v-empty="list.length === 0">
+      <div class="log-items">
+        <follow-record-cell
+          v-for="(item, index) in list"
+          :item="item"
+          :index="index"
+          :crm-type="crmType"
+          :key="index"
+          @on-handle="cellHandle"/>
+        <div class="load">
+          <el-button
+            :loading="loadMoreLoading"
+            type="text">{{ loadMoreLoading ? '加载更多' : '没有更多了' }}</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import FollowRecordCell from './components/FollowRecordCell' // 跟进记录
+import { crmLeadsRecordIndex } from '@/api/ux/clue'
+// import { crmCustomerRecordIndex } from '@/api/customermanagement/customer'
+// import { crmContactsRecordIndex } from '@/api/customermanagement/contacts'
+// import { crmBusinessRecordIndex } from '@/api/customermanagement/business'
+// import { crmContractRecordIndex } from '@/api/customermanagement/contract'
+
+export default {
+  /** 线索管理 的 线索详情 的 跟进记录*/
+  name: 'RecordLog',
+  components: {
+    FollowRecordCell
+  },
+  props: {
+    /** 模块ID */
+    id: [String, Number],
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      loadMoreLoading: true,
+      isPost: false,
+      page: 1,
+      list: [] // 跟进记录列表
+    }
+  },
+  computed: {},
+  watch: {
+    id: function(val) {
+      this.refreshList()
+    }
+  },
+  mounted() {
+    this.$bus.on('follow-log-refresh', data => {
+      if (data.type == 'record-log') {
+        this.refreshList()
+      }
+    })
+
+    // 分批次加载
+    const dom = document.getElementById('follow-log-content')
+    dom.onscroll = () => {
+      const scrollOff = dom.scrollTop + dom.clientHeight - dom.scrollHeight
+      // 滚动条到底部的条件
+      if (Math.abs(scrollOff) < 10 && this.loadMoreLoading == true) {
+        if (!this.isPost) {
+          this.isPost = true
+          this.page++
+          this.getList()
+        } else {
+          this.loadMoreLoading = false
+        }
+      }
+    }
+
+   this.getList()
+  },
+  activated: function() {},
+  deactivated: function() {},
+
+  beforeDestroy() {
+    this.$bus.off('follow-log-refresh')
+  },
+  methods: {
+    getList() {
+      this.loading = true
+      const request = {
+        // customer: crmCustomerRecordIndex,
+        leads: crmLeadsRecordIndex,
+        // contacts: crmContactsRecordIndex,
+        // business: crmBusinessRecordIndex,
+        // contract: crmContractRecordIndex
+      }[this.crmType]
+      const params = {
+        page: this.page,
+        limit: 10
+      }
+      params[this.crmType + 'Id'] = this.id
+      request(params)
+        .then(res => {
+          this.list = this.list.concat(res.data)
+          if (res.data.length < 10) {
+            this.loadMoreLoading = false
+          } else {
+            this.loadMoreLoading = true
+          }
+          this.loading = false
+          this.isPost = false
+        })
+        .catch(() => {
+          this.isPost = false
+          this.loading = false
+        })
+    },
+    refreshList() {
+      this.page = 1
+      this.list = []
+      this.getList()
+    },
+    /**
+     * 行布局删除
+     */
+    cellHandle(data) {
+      if (data.type == 'delete') {
+        this.list.splice(data.data.index, 1)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.log-items {
+  min-height: 400px;
+  position: relative;
+}
+
+.load {
+  color: #999;
+  font-size: 13px;
+  margin: 0 auto 15px;
+  text-align: center;
+  .el-button,
+  .el-button:focus {
+    color: #ccc;
+    cursor: auto;
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/followLog/components/FollowRecordCell.vue b/vue/src/views/pg-fis/components/followLog/components/FollowRecordCell.vue
new file mode 100644
index 00000000..20b3ab08
--- /dev/null
+++ b/vue/src/views/pg-fis/components/followLog/components/FollowRecordCell.vue
@@ -0,0 +1,223 @@
+<template>
+  <div class="fl-c">
+    <flexbox class="fl-h">
+      <div
+        v-photo="{img: item.userImg, realname: item.realname}"
+        v-lazy:background-image="$options.filters.filterUserLazyImg(item.userImg)"
+        class="div-photo fl-h-img"/>
+      <div class="fl-h-b">
+        <div class="fl-h-name">{{ item.realname }}</div>
+        <div class="fl-h-time">{{ item.createTime }}</div>
+      </div>
+      <flexbox class="fl-h-mark">
+        <img
+          class="fl-h-mark-img"
+          src="@/assets/img/follow_record.png" >
+        <div class="fl-h-mark-name">跟进记录</div>
+      </flexbox>
+      <el-dropdown
+        trigger="click"
+        @command="handleCommand">
+        <i
+          style="color:#CDCDCD;margin-left: 8px;"
+          class="el-icon-arrow-down el-icon-more"/>
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item command="delete">删除</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+    </flexbox>
+    <div class="fl-b">
+      <div class="fl-b-content">{{ item.content }}</div>
+      <flexbox
+        v-if="item.img && item.img.length > 0"
+        class="fl-b-images"
+        wrap="wrap">
+        <div
+          v-lazy:background-image="file.filePath"
+          v-for="(file, index) in item.img"
+          :key="file.filePath"
+          class="fl-b-img-item"
+          @click="previewImg(item.img, index)"/>
+      </flexbox>
+      <div
+        v-if="item.file && item.file.length > 0"
+        class="fl-b-files">
+        <flexbox
+          v-for="(file, index) in item.file"
+          :key="index"
+          class="cell">
+          <img
+            class="cell-head"
+            src="@/assets/img/relevance_file.png" >
+          <div class="cell-body">{{ file.name }}<span style="color: #ccc;">（{{ file.size }}）</span></div>
+          <el-button
+            type="primary"
+            icon="el-icon-download"
+            @click="downloadFile(file)">下载</el-button>
+        </flexbox>
+      </div>
+      <div
+        v-if="item.category || item.nextTime"
+        class="follow">
+        <span
+          v-if="item.category"
+          class="follow-info">{{ item.category }}</span>
+        <span
+          v-if="item.nextTime"
+          class="follow-info">{{ item.nextTime }}</span>
+      </div>
+      <div
+        v-if="item.contactsList && item.contactsList.length > 0"
+        class="fl-b-other">
+        <div class="fl-b-other-name">关联联系人</div>
+        <div>
+          <flexbox
+            v-for="(item, index) in item.contactsList"
+            :key="index"
+            class="cell"
+            @click.native="checkRelationDetail('contacts', item.contactsId)">
+            <i
+              :style="{'opacity': index == 0 ? 1 : 0}"
+              class="wukong wukong-contacts cell-head crm-type"/>
+            <div
+              class="cell-body"
+              style="color: #6394E5;cursor: pointer;">{{ item.name }}</div>
+          </flexbox>
+        </div>
+      </div>
+      <div
+        v-if="item.businessList && item.businessList.length > 0"
+        class="fl-b-other">
+        <div class="fl-b-other-name">关联商机</div>
+        <div>
+          <flexbox
+            v-for="(item, index) in item.businessList"
+            :key="index"
+            class="cell"
+            @click.native="checkRelationDetail('business', item.businessId)">
+            <i
+              :style="{'opacity': index == 0 ? 1 : 0}"
+              class="wukong wukong-business cell-head crm-type"/>
+            <div
+              class="cell-body"
+              style="color: #6394E5;cursor: pointer;">{{ item.businessName }}</div>
+          </flexbox>
+        </div>
+      </div>
+      <slot/>
+    </div>
+<!--    <c-r-m-full-screen-detail-->
+<!--      :visible.sync="showFullDetail"-->
+<!--      :crm-type="relationCrmType"-->
+<!--      :id="relationID"/>-->
+  </div>
+</template>
+
+<script>
+// import { downloadFile } from '@/utils'
+// import { crmRecordDelete } from '@/api/customermanagement/common'
+
+export default {
+  /** 客户管理 的 客户详情 的 跟进记录cell*/
+  name: 'FollowRecordCell',
+  components: {
+    // CRMFullScreenDetail: () =>
+    //   import('@/views/customermanagement/components/CRMFullScreenDetail.vue')
+  },
+  props: {
+    item: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    },
+    index: [String, Number]
+  },
+  data() {
+    return {
+      showFullDetail: false, // 查看相关客户管理详情
+      relationID: '', // 相关ID参数
+      relationCrmType: '' // 相关类型
+    }
+  },
+  computed: {},
+  mounted() {},
+  methods: {
+    previewImg(list, index) {
+      this.$bus.emit('preview-image-bus', {
+        index: index,
+        data: list.map(function(item, index, array) {
+          item.url = item.filePath
+          return item
+        })
+      })
+    },
+    downloadFile(file) {
+      // downloadFile({ path: file.filePath, name: file.name })
+    },
+    /**
+     * 删除跟进记录
+     */
+    handleCommand(command) {
+      // this.$confirm('确定删除?', '提示', {
+      //   confirmButtonText: '确定',
+      //   cancelButtonText: '取消',
+      //   type: 'warning'
+      // })
+      //   .then(() => {
+      //     crmRecordDelete({
+      //       recordId: this.item.recordId
+      //     })
+      //       .then(res => {
+      //         this.$emit('on-handle', {
+      //           type: command,
+      //           data: { item: this.item, index: this.index }
+      //         })
+      //         this.$message.success('操作成功')
+      //       })
+      //       .catch(() => {})
+      //   })
+      //   .catch(() => {
+      //     this.$message({
+      //       type: 'info',
+      //       message: '已取消操作'
+      //     })
+      //   })
+    },
+    /**
+     * 查看相关客户管理详情
+     */
+    checkRelationDetail(type, id) {
+      this.relationID = id
+      this.relationCrmType = type
+      this.showFullDetail = true
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '../styles/followcell.scss';
+.follow {
+  .follow-info {
+    padding: 5px 10px;
+    background-color: #f5f7fa;
+    color: #999;
+    height: 40px;
+    line-height: 40px;
+    border-radius: 28px;
+    font-size: 12px;
+    margin-right: 10px;
+  }
+}
+
+.crm-type {
+  color: rgb(99, 148, 229);
+  font-size: 14px;
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/followLog/styles/followcell.scss b/vue/src/views/pg-fis/components/followLog/styles/followcell.scss
new file mode 100644
index 00000000..3645f72c
--- /dev/null
+++ b/vue/src/views/pg-fis/components/followLog/styles/followcell.scss
@@ -0,0 +1,174 @@
+/** 跟进记录相关的 日志 审批任务 日程 项目 公共css */
+.fl-c {
+  background-color: white;
+  padding: 10px 20px;
+  position: relative;
+}
+
+/** 头部布局 名字 头像 */
+.fl-h {
+  .fl-h-img {
+    display: block;
+    width: 34px;
+    height: 34px;
+    border-radius: 17px;
+    margin-right: 8px;
+  }
+
+  .fl-h-b {
+    flex: 1;
+
+    .fl-h-name {
+      font-size: 13px;
+      color: #333;
+    }
+
+    .fl-h-time {
+      font-size: 12px;
+      color: #999;
+      margin-top: 3px;
+    }
+  }
+}
+
+/** 头部 右侧 布局*/
+.fl-h-handle {
+  width: auto;
+
+  .fl-h-handle-name {
+    font-size: 13px;
+    color: #333;
+    margin-right: 6px;
+  }
+}
+
+.fl-h-mark {
+  width: auto;
+
+  .fl-h-mark-img {
+    display: block;
+    width: 20px;
+    height: 20px;
+    margin-right: 8px;
+  }
+
+  .fl-h-mark-name {
+    font-size: 13px;
+    color: #333;
+  }
+}
+
+/** 内容区域 */
+.fl-b {
+  margin: 20px 0 0 40px;
+
+  .fl-b-content {
+    font-size: 13px;
+    color: #333;
+    margin-bottom: 10px;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+    letter-spacing: 0.5px;
+    line-height: 18px;
+  }
+
+  .fl-b-images {
+    margin-top: 5px;
+    width: 310px;
+
+    .fl-b-img-item {
+      width: 98px;
+      height: 98px;
+      display: inline-block;
+      margin: 0 4px 4px 0;
+      background-size: contain;
+      background-repeat: no-repeat;
+      background-position: center;
+      position: relative;
+      cursor: pointer;
+    }
+  }
+
+  .fl-b-other {
+    margin: 8px 0;
+
+    .fl-b-other-name {
+      margin: 10px 0;
+      color: #666;
+      font-size: 13px;
+    }
+  }
+}
+
+.fl-c:before {
+  content: " ";
+  position: absolute;
+  top: 0;
+  right: 0;
+  height: 1px;
+  border-top: 1px solid #e5e5e5;
+  color: #e5e5e5;
+  -webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+  -webkit-transform: scaleY(0.5);
+  transform: scaleY(0.5);
+  left: 15px;
+  z-index: 2;
+}
+
+.fl-c:first-child:before {
+  display: none;
+}
+
+/** 附件 */
+.fl-b-files {
+  margin-top: 10px;
+}
+
+/** 关联附件 联系人 客户 行布局 */
+.cell {
+  padding: 8px;
+  background-color: #F5F7FA;
+  border-radius: 2px;
+  position: relative;
+
+  .cell-head {
+    display: block;
+    width: 15px;
+    height: 15px;
+    margin-right: 8px;
+  }
+
+  .cell-body {
+    flex: 1;
+    color: #333;
+    font-size: 12px;
+  }
+
+  .cell-foot {
+    display: block;
+    width: 20px;
+    padding: 0 4px;
+    margin-right: 8px;
+  }
+}
+
+.cell:before {
+  content: " ";
+  position: absolute;
+  top: 0;
+  right: 0;
+  height: 1px;
+  border-top: 1px solid #e5e5e5;
+  color: #e5e5e5;
+  -webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+  -webkit-transform: scaleY(0.5);
+  transform: scaleY(0.5);
+  left: 30px;
+  z-index: 2;
+}
+
+.cell:first-child:before {
+  display: none;
+}
diff --git a/vue/src/views/pg-fis/components/sceneForm/SceneCreate.vue b/vue/src/views/pg-fis/components/sceneForm/SceneCreate.vue
new file mode 100644
index 00000000..1b326600
--- /dev/null
+++ b/vue/src/views/pg-fis/components/sceneForm/SceneCreate.vue
@@ -0,0 +1,640 @@
+<template>
+  <el-dialog
+    :title="edit_id ? '编辑场景' : '新建场景'"
+    :visible.sync="visible"
+    :append-to-body="true"
+    width="800px"
+    @close="handleCancel">
+    <div class="scene-name-container">
+      <div class="scene-name">场景名称</div>
+      <el-input
+        v-model.trim="saveName"
+        :maxlength="10"
+        class="scene-input"
+        placeholder="请输入场景名称，最多10个字符"/>
+    </div>
+    <div class="scene-name">筛选条件</div>
+    <el-form
+      id="scene-filter-container"
+      class="filter-container">
+      <el-form-item>
+        <template v-for="(formItem, index) in form">
+          <el-row :key="index">
+            <el-col :span="8">
+              <el-select
+                v-model="formItem.fieldName"
+                placeholder="请选择要筛选的字段名"
+                @change="fieldChange(formItem)">
+                <el-option
+                  v-for="item in fieldList"
+                  :key="item.fieldName"
+                  :label="item.name"
+                  :value="item.fieldName"/>
+              </el-select>
+            </el-col>
+
+            <el-col
+              v-if="formItem.formType !== 'date' && formItem.formType !== 'datetime' && formItem.formType !== 'business_type'"
+              :span="1">&nbsp;</el-col>
+            <el-col
+              v-if="formItem.formType !== 'date' && formItem.formType !== 'datetime' && formItem.formType !== 'business_type'"
+              :span="4">
+              <el-select
+                v-model="formItem.condition"
+                placeholder="请选择范围">
+                <el-option
+                  v-for="item in calConditionOptions(formItem.formType, formItem)"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"/>
+              </el-select>
+            </el-col>
+
+            <!-- 商机组 -->
+            <el-col
+              v-if="formItem.formType == 'business_type'"
+              :span="1">&nbsp;</el-col>
+            <el-col
+              v-if="formItem.formType == 'business_type'"
+              :span="4">
+              <el-select
+                v-model="formItem.typeId"
+                placeholder="请选择"
+                @change="typeOptionsChange(formItem)">
+                <el-option
+                  v-for="item in formItem.typeOption"
+                  :key="item.typeId"
+                  :label="item.name"
+                  :value="item.typeId"/>
+              </el-select>
+            </el-col>
+
+            <el-col :span="1">&nbsp;</el-col>
+            <el-col :span="formItem.formType === 'datetime' || formItem.formType === 'date' ? 13 : 8">
+              <el-select
+                v-if="formItem.formType === 'select'"
+                v-model="formItem.value"
+                placeholder="请选择筛选条件">
+                <el-option
+                  v-for="item in formItem.setting"
+                  :key="item"
+                  :label="item"
+                  :value="item"/>
+              </el-select>
+              <el-select
+                v-else-if="formItem.formType === 'checkStatus'"
+                v-model="formItem.value"
+                placeholder="请选择筛选条件">
+                <el-option
+                  v-for="item in formItem.setting"
+                  :key="item.value"
+                  :label="item.name"
+                  :value="item.value"/>
+              </el-select>
+              <el-date-picker
+                v-else-if="formItem.formType === 'date' || formItem.formType === 'datetime'"
+                v-model="formItem.value"
+                :value-format="formItem.formType === 'date' ? 'yyyy-MM-dd' : 'yyyy-MM-dd HH:mm:ss'"
+                :type="formItem.formType === 'date' ? 'daterange' : 'datetimerange'"
+                style="padding: 0px 10px;"
+                range-separator="-"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"/>
+              <el-select
+                v-else-if="formItem.formType === 'business_type'"
+                v-model="formItem.statusId"
+                placeholder="请选择">
+                <el-option
+                  v-for="item in formItem.statusOption"
+                  :key="item.statusId"
+                  :label="item.name"
+                  :value="item.statusId"/>
+              </el-select>
+<!--              <xh-user-cell-->
+<!--                v-else-if="formItem.formType === 'user'"-->
+<!--                :item="formItem"-->
+<!--                :value="formItem.value"-->
+<!--                @value-change="userValueChange"/>-->
+              <el-input
+                v-else
+                v-model="formItem.value"
+                placeholder="请输入筛选条件"/>
+            </el-col>
+            <el-col
+              :span="1"
+              class="delete">
+              <i
+                class="el-icon-error delete-btn"
+                @click="handleDelete(index)"/>
+            </el-col>
+          </el-row>
+        </template>
+      </el-form-item>
+    </el-form>
+    <p
+      v-show="showErrors"
+      class="el-icon-warning warning-info">
+      <span class="desc">筛选条件中有重复项！</span>
+    </p>
+    <el-button
+      type="text"
+      @click="handleAdd">+ 添加筛选条件</el-button>
+    <div class="save">
+      <div class="save-setting">
+        <el-checkbox v-model="saveDefault">设置为默认</el-checkbox>
+      </div>
+    </div>
+    <div
+      slot="footer"
+      class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button
+        type="primary"
+        @click="handleConfirm">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+// import crmTypeModel from '@/views/ux/model/crmTypeModel'
+// import { crmSceneSave, crmSceneUpdate } from '@/api/customermanagement/common'
+import {
+  objDeepCopy
+} from '@/utils'
+// import { XhUserCell } from '@/components/CreateCom'
+
+/**
+ * fieldList: 高级筛选的字段
+ *     type:  date || datetime || select || 其他 input
+ */
+export default {
+  name: 'SceneCreate', // 新建场景
+  components: {
+    // XhUserCell
+  },
+  props: {
+    dialogVisible: {
+      type: Boolean,
+      required: true,
+      default: false
+    },
+    fieldList: {
+      type: Array,
+      required: true,
+      default: () => {
+        return []
+      }
+    },
+    obj: {
+      type: Object,
+      default: () => {
+        return {}
+      },
+      required: true
+    },
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    },
+    /** 名字和 默认 id 编辑的时候需要 */
+    name: {
+      type: String,
+      default: ''
+    },
+    isDefault: {
+      type: Boolean,
+      default: false
+    },
+    edit_id: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      form: [],
+      visible: false, // 控制展示
+      showErrors: false,
+      saveDefault: false, // 设置为默认场景
+      saveName: null // 场景名称
+    }
+  },
+  watch: {
+    dialogVisible: {
+      handler(val) {
+        if (val) {
+          // 处理编辑数据
+          if (this.edit_id) {
+            this.form = []
+            for (const field in this.obj.obj) {
+              const element = this.obj.obj[field]
+              const item = this.getItem()
+              item.fieldName = element.name
+              item.condition = element.condition
+              item.formType = element.formType
+              if (element.formType == 'date') {
+                item.value = [element.start_date, element.end_date]
+              } else if (element.formType == 'datetime') {
+                item.value = [element.start, element.end]
+              } else if (element.formType == 'business_type') {
+                item.typeId = element.typeId
+                item.statusId = element.statusId
+                item.typeOption = element.setting
+                if (element.typeId) {
+                  const obj = element.setting.find(typeItem => {
+                    return typeItem.typeId === element.typeId
+                  })
+                  if (obj) {
+                    item.statusOption = obj.statusList
+                  } else {
+                    item.statusOption = []
+                  }
+                }
+              } else if (element.formType == 'user') {
+                item.value = element.setting ? [element.setting] : []
+              } else {
+                item.setting = element.setting
+                item.value = element.value
+              }
+              this.form.push(item)
+            }
+          } else {
+            this.form = objDeepCopy(this.obj.form)
+            if (this.form.length == 0) {
+              this.form.push(this.getItem())
+            }
+          }
+
+          /** 只有编辑会牵扯到这两个字段赋值 */
+          if (this.name) {
+            this.saveName = this.name
+          } else {
+            this.saveName = ''
+          }
+          if (this.isDefault) {
+            this.saveDefault = this.isDefault
+          } else {
+            this.saveDefault = false
+          }
+        }
+        this.visible = this.dialogVisible
+      },
+      deep: true,
+      immediate: true
+    },
+
+    form() {
+      this.$nextTick(() => {
+        var container = document.getElementById('scene-filter-container')
+        container.scrollTop = container.scrollHeight
+      })
+    }
+  },
+  methods: {
+    getItem() {
+      return {
+        fieldName: '',
+        name: '',
+        formType: '',
+        condition: 'is',
+        value: '',
+        typeOption: [],
+        statusOption: [],
+        typeId: '',
+        statusId: ''
+      }
+    },
+    /**
+     * 商机组状态
+     */
+    typeOptionsChange(formItem) {
+      if (formItem.typeId) {
+        const obj = formItem.typeOption.find(item => {
+          return item.typeId === formItem.typeId
+        })
+        formItem.statusOption = obj.statusList || []
+      } else {
+        formItem.statusOption = []
+      }
+      formItem.statusId = ''
+    },
+    /**
+     * 用户创建人
+     */
+    userValueChange(data) {
+      if (data.value.length > 0) {
+        data.item.value = data.value
+      } else {
+        data.item.value = []
+      }
+    },
+    /** 条件数据源 */
+    calConditionOptions(formType, item) {
+      if (
+        formType == 'select' ||
+        formType == 'checkbox' ||
+        formType == 'user' ||
+        formType == 'checkStatus'
+      ) {
+        return [
+          { value: 'is', label: '等于', disabled: false },
+          { value: 'isNot', label: '不等于', disabled: false }
+        ]
+      } else if (
+        formType == 'module' ||
+        formType == 'text' ||
+        formType == 'textarea'
+      ) {
+        return [
+          { value: 'is', label: '等于', disabled: false },
+          { value: 'isNot', label: '不等于', disabled: false },
+          { value: 'contains', label: '包含', disabled: false },
+          { value: 'notContains', label: '不包含', disabled: false }
+        ]
+      } else if (formType == 'floatnumber' || formType == 'number') {
+        return [
+          { value: 'is', label: '等于', disabled: false },
+          { value: 'isNot', label: '不等于', disabled: false },
+          { value: 'contains', label: '包含', disabled: false },
+          { value: 'notContains', label: '不包含', disabled: false },
+          { value: 'isNull', label: '为空', disabled: false },
+          { value: 'isNotNull', label: '不为空', disabled: false },
+          { value: 'gt', label: '大于', disabled: false },
+          { value: 'egt', label: '大于等于', disabled: false },
+          { value: 'lt', label: '小于', disabled: false },
+          { value: 'elt', label: '小于等于', disabled: false }
+        ]
+      } else {
+        return [
+          { value: 'is', label: '等于', disabled: false },
+          { value: 'isNot', label: '不等于', disabled: false },
+          { value: 'contains', label: '包含', disabled: false },
+          { value: 'notContains', label: '不包含', disabled: false },
+          { value: 'startWith', label: '开始于', disabled: false },
+          { value: 'endWith', label: '结束于', disabled: false },
+          { value: 'isNull', label: '为空', disabled: false },
+          { value: 'isNotNull', label: '不为空', disabled: false },
+          { value: 'gt', label: '大于', disabled: false },
+          { value: 'egt', label: '大于等于', disabled: false },
+          { value: 'lt', label: '小于', disabled: false },
+          { value: 'elt', label: '小于等于', disabled: false }
+        ]
+      }
+    },
+    /**
+     * 当前选择的字段名改变，判断是否有重复
+     * @param formItem
+     */
+    fieldChange(formItem) {
+      const obj = this.fieldList.find(item => {
+        return item.fieldName === formItem.fieldName
+      })
+      if (obj) {
+        formItem.formType = obj.formType
+        formItem.name = obj.name
+        if (formItem.formType == 'business_type') {
+          formItem.typeOption = obj.setting
+          formItem.statusOption = []
+          formItem.typeId = ''
+          formItem.statusId = ''
+        } else if (
+          formItem.formType == 'select' ||
+          formItem.formType == 'checkStatus'
+        ) {
+          formItem.setting = obj.setting || []
+        } else if (
+          formItem.formType === 'date' ||
+          formItem.formType === 'datetime' ||
+          formItem.formType === 'user'
+        ) {
+          formItem.value = []
+        }
+      }
+
+      const arr = this.form.filter(item => {
+        return item.fieldName === formItem.fieldName
+      })
+      if (arr.length > 1) this.showErrors = true
+      else this.showErrors = false
+    },
+    /**
+     * 取消选择
+     */
+    handleCancel() {
+      this.visible = false
+      this.$emit('update:dialogVisible', false)
+    },
+    /**
+     * 确定选择
+     */
+    handleConfirm() {
+      if (this.showErrors) {
+        this.$message.error('筛选条件中有重复项！')
+        return
+      }
+      if (!this.saveName || this.saveName === '') {
+        this.$message.error('场景名称不能为空！')
+        return
+      }
+      for (let i = 0; i < this.form.length; i++) {
+        const o = this.form[i]
+        if (!o.fieldName || o.fieldName === '') {
+          this.$message.error('要筛选的字段名称不能为空！')
+          return
+        }
+
+        if (o.formType == 'business_type') {
+          if (!o.typeId && !o.statusId) {
+            this.$message.error('请输入筛选条件的值！')
+            return
+          }
+        } else if (
+          o.formType == 'date' ||
+          o.formType == 'datetime' ||
+          o.formType == 'user'
+        ) {
+          if (!o.value || o.value.length === 0) {
+            this.$message.error('请输入筛选条件的值！')
+            return
+          }
+        } else if (!o.value) {
+          this.$message.error('请输入筛选条件的值！')
+          return
+        }
+      }
+      const obj = {}
+      this.form.forEach(o => {
+        if (o.formType == 'datetime' || o.formType == 'date') {
+          obj[o.fieldName] = {
+            start: o.value[0],
+            end: o.value[1],
+            formType: o.formType,
+            name: o.fieldName
+          }
+        } else if (o.formType == 'business_type') {
+          obj[o.fieldName] = {
+            typeId: o.typeId,
+            statusId: o.statusId,
+            formType: o.formType,
+            name: o.fieldName
+          }
+        } else if (o.formType == 'user') {
+          obj[o.fieldName] = {
+            condition: o.condition,
+            value: o.value[0].userId,
+            formType: o.formType,
+            setting: o.value[0],
+            name: o.fieldName
+          }
+        } else {
+          obj[o.fieldName] = {
+            condition: o.condition,
+            value: o.value,
+            formType: o.formType,
+            name: o.fieldName
+          }
+        }
+      })
+      const data = {
+        obj: obj,
+        form: this.form,
+        saveDefault: this.saveDefault,
+        saveName: this.saveName
+      }
+      this.requestCreateScene(data)
+    },
+    // 创建场景
+    requestCreateScene(data) {
+      /** 编辑操作 */
+      if (this.edit_id) {
+        // crmSceneUpdate({
+        //   isDefault: data.saveDefault ? 1 : 0,
+        //   name: data.saveName,
+        //   sceneId: this.edit_id,
+        //   data: JSON.stringify(data.obj)
+        // })
+        //   .then(res => {
+        //     this.$message({
+        //       type: 'success',
+        //       message: '编辑成功'
+        //     })
+        //     // 新建成功
+        //     this.$emit('saveSuccess')
+        //     this.handleCancel()
+        //   })
+        //   .catch(() => {})
+      } else {
+        // crmSceneSave({
+        //   type: crmTypeModel[this.crmType],
+        //   isDefault: data.saveDefault ? 1 : 0,
+        //   name: data.saveName,
+        //   data: JSON.stringify(data.obj)
+        // })
+        //   .then(res => {
+        //     this.$message({
+        //       type: 'success',
+        //       message: '创建成功'
+        //     })
+        //     // 新建成功
+        //     this.$emit('saveSuccess')
+        //     this.handleCancel()
+        //   })
+        //   .catch(() => {})
+      }
+    },
+    /**
+     * 添加筛选条件
+     */
+    handleAdd() {
+      this.form.push(this.getItem())
+    },
+    /**
+     * 删除筛选条件
+     * @param index
+     */
+    handleDelete(index) {
+      this.$confirm('您确定要删除这一条数据吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.form.splice(index, 1)
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消删除'
+          })
+        })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  /deep/ .el-dialog__body {
+    padding: 10px 20px;
+  }
+
+  /deep/ .el-form-item__label {
+    width: 100%;
+    text-align: left;
+  }
+  .filter-container {
+    max-height: 200px;
+    overflow-y: auto;
+  }
+
+  .save {
+    margin-top: 10px;
+    .name {
+      width: 300px;
+      margin-left: 10px;
+      /deep/ .el-input__inner {
+        height: 32px;
+      }
+    }
+    .save-setting {
+      margin-top: 20px;
+    }
+  }
+
+  .el-form-item {
+    margin-bottom: 0;
+  }
+
+  .el-row {
+    margin-bottom: 20px;
+    .delete-btn {
+      margin-left: 15px;
+      color: #bbb;
+      cursor: pointer;
+    }
+    .el-select,
+    .el-date-editor {
+      width: 100%;
+    }
+  }
+
+  .warning-info {
+    width: 100%;
+    font-size: 14px;
+    color: #f56c6c;
+    margin-top: 10px;
+    .desc {
+      padding-left: 8px;
+    }
+  }
+
+  .scene-name-container {
+    padding-bottom: 15px;
+    .scene-input {
+      width: 300px;
+    }
+  }
+  .scene-name {
+    margin-bottom: 10px;
+  }
+</style>
diff --git a/vue/src/views/pg-fis/components/sceneForm/SceneList.vue b/vue/src/views/pg-fis/components/sceneForm/SceneList.vue
new file mode 100644
index 00000000..569143d1
--- /dev/null
+++ b/vue/src/views/pg-fis/components/sceneForm/SceneList.vue
@@ -0,0 +1,156 @@
+<template>
+  <div class="scene-container">
+    <div class="scene-list">
+      <div
+        v-for="(item, index) in sceneList"
+        :key="index"
+        :class="{'scene-list-item-select':item.sceneId == sceneSelectId}"
+        class="scene-list-item"
+        @click="selectScene(item, index)">
+        {{ item.name }}
+      </div>
+    </div>
+    <div>
+      <flexbox
+        class="handle-button"
+        @click.native="addScene">
+        <img
+          class="handle-button-icon"
+          src="@/assets/img/scene_add.png" >
+        <div class="handle-button-name">新建场景</div>
+      </flexbox>
+      <flexbox
+        class="handle-button"
+        @click.native="setScene">
+        <img
+          class="handle-button-icon"
+          src="@/assets/img/scene_set.png" >
+        <div class="handle-button-name">管理</div>
+      </flexbox>
+    </div>
+
+  </div>
+</template>
+
+<script type="text/javascript">
+// import crmTypeModel from '@/views/ux/model/crmTypeModel'
+import { mapGetters } from 'vuex'
+import { crmSceneIndex } from '@/api/ux/common'
+
+export default {
+  name: 'SceneList', // 客户管理下 重要提醒 回款计划提醒
+  components: {},
+  props: {
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      // 场景列表
+      sceneSelectId: -1,
+      sceneList: []
+    }
+  },
+  computed: {
+    // ...mapGetters(['crm'])
+  },
+  watch: {},
+  mounted() {
+      this.getSceneList()
+  },
+  methods: {
+    getSceneList() {
+      crmSceneIndex()
+        .then(res => {
+          const defaultScenes = res.data.filter(function(item, index) {
+            return item.isDefault === 1
+          })
+
+          if (defaultScenes && defaultScenes.length > 0) {
+            const defaultScene = defaultScenes[0]
+            this.sceneSelectId = defaultScene.sceneId
+            this.$emit('scene', {
+              id: defaultScene.sceneId,
+              name: defaultScene.name,
+              bydata: defaultScene.bydata || ''
+            })
+          } else {
+            this.sceneSelectId = ''
+            this.$emit('scene', { id: '', name: '', bydata: '' })
+          }
+
+          this.sceneList = res.data
+        })
+        .catch(() => {
+          this.$emit('scene', { id: '', name: '', bydata: '' })
+        })
+    },
+
+    // 选择场景、
+    selectScene(item, index) {
+      this.sceneSelectId = item.sceneId
+      this.$emit('scene', {
+        id: item.sceneId,
+        name: item.name,
+        bydata: item.bydata
+      })
+      this.$emit('hidden-scene')
+    },
+    // 添加场景
+    addScene() {
+      this.$emit('scene-handle', { type: 'add' })
+    },
+    // 设置场景
+    setScene() {
+      this.$emit('scene-handle', { type: 'set' })
+    }
+  }
+}
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+.scene-container {
+  position: relative;
+  width: 150px;
+}
+
+.scene-list {
+  max-height: 240px;
+  overflow-y: auto;
+  font-size: 12px;
+  .scene-list-item {
+    color: #333;
+    padding: 10px 15px;
+    cursor: pointer;
+    background-color: white;
+  }
+  .scene-list-item:hover {
+    background-color: #1682e6;
+    color:#f7f8fa;
+  }
+
+  .scene-list-item-select {
+    color: #f7f8fa;
+    background-color: #1682e6;
+  }
+}
+
+.handle-button {
+  padding: 10px 20px;
+  cursor: pointer;
+  .handle-button-icon {
+    display: block;
+    width: 15px;
+    height: 15px;
+    margin-right: 8px;
+  }
+  .handle-button-name {
+    font-size: 12px;
+  }
+}
+.handle-button:hover {
+  color: #3E84E9;
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/sceneForm/SceneSet.vue b/vue/src/views/pg-fis/components/sceneForm/SceneSet.vue
new file mode 100644
index 00000000..aea9a02a
--- /dev/null
+++ b/vue/src/views/pg-fis/components/sceneForm/SceneSet.vue
@@ -0,0 +1,648 @@
+<template>
+  <el-dialog
+    :visible.sync="visible"
+    :append-to-body="true"
+    title="场景管理"
+    width="700px"
+    @close="handleCancel">
+    <div class="scene-name">您可通过拖拽管理标签</div>
+    <flexbox class="scene-list">
+      <div class="scene-list-box">
+        <flexbox class="scene-list-head">
+          <el-checkbox
+            :indeterminate="isleftIndeterminate"
+            v-model="checkleftAll"
+            @change="handleleftCheckAllChange"/>
+          <div class="scene-list-head-name">显示的标签</div>
+          <div class="scene-list-head-detail">{{ leftCheckItems.length + '/' + checkedLeftData.length }}</div>
+        </flexbox>
+        <div class="scene-list-body">
+          <flexbox
+            v-for="(item, index) in checkedLeftData"
+            v-if="item.isSystem == 1"
+            :key="index"
+            class="list-item">
+            <div
+              :class="{'default-mark-active': item.sceneId == defaultId}"
+              class="default-mark"/>
+            <el-checkbox
+              v-model="item.check"
+              :disabled="true"
+              class="list-item-check"
+              @change="leftCheckItemChange"/>
+            <div class="list-item-name">{{ item.name }}</div>
+            <div class="list-item-handle">
+              <el-dropdown
+                trigger="click"
+                @command="defaultHandle">
+                <i
+                  class="el-icon-arrow-down"
+                  @click="itemHandle('default', item, index)"/>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item>设置为默认标签</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </div>
+          </flexbox>
+          <draggable
+            v-model="checkedLeftData"
+            :move="leftMove"
+            :options="{group: 'list',forceFallback:false, fallbackClass:'draggingStyle'}"
+            style="min-height: 100px;"
+            @end="leftMoveEnd">
+            <flexbox
+              v-for="(item, index) in checkedLeftData"
+              v-if="item.isSystem != 1"
+              :key="index"
+              class="list-item">
+              <div
+                :class="{'default-mark-active': item.sceneId == defaultId}"
+                class="default-mark"/>
+              <el-checkbox
+                v-model="item.check"
+                class="list-item-check"
+                @change="leftCheckItemChange"/>
+              <div class="list-item-name">{{ item.name }}</div>
+              <div class="list-item-handle">
+                <i
+                  class="el-icon-edit"
+                  @click="itemHandle('edit', item, index)"/>
+                <i
+                  class="el-icon-delete"
+                  @click="itemHandle('delete', item, index)"/>
+                <el-dropdown @command="defaultHandle">
+                  <i
+                    class="el-icon-arrow-down"
+                    @click="itemHandle('default', item, index)"/>
+                  <el-dropdown-menu slot="dropdown">
+                    <el-dropdown-item>设置为默认标签</el-dropdown-item>
+                  </el-dropdown-menu>
+                </el-dropdown>
+              </div>
+            </flexbox>
+          </draggable>
+
+        </div>
+      </div>
+      <div class="scene-middle-list">
+        <el-button
+          :class="{'scene-middle-button-select':rightCheckItems.length > 0}"
+          :disabled="rightCheckItems.length == 0"
+          class="scene-middle-left-button"
+          @click="changePositon('left')">
+          <i class="el-icon-arrow-left scene-middle-icon"/>
+        </el-button>
+        <el-button
+          :class="{'scene-middle-button-select':leftCheckItems.length > 0}"
+          :disabled="leftCheckItems.length == 0"
+          class="scene-middle-right-button"
+          @click="changePositon('right')">
+          <i class="el-icon-arrow-right scene-middle-icon"/>
+        </el-button>
+      </div>
+      <div class="scene-list-box">
+        <flexbox class="scene-list-head">
+          <el-checkbox
+            :indeterminate="isrightIndeterminate"
+            v-model="checkrightAll"
+            @change="handlerightCheckAllChange"/>
+          <div class="scene-list-head-name">隐藏的标签</div>
+          <div class="scene-list-head-detail">{{ rightCheckItems.length + '/' + checkedRightData.length }}</div>
+        </flexbox>
+        <div class="scene-list-body">
+          <draggable
+            v-model="checkedRightData"
+            :move="rightMove"
+            :options="{group: 'list',forceFallback:false, fallbackClass:'draggingStyle'}"
+            style="min-height: 100px;"
+            @end="rightMoveEnd">
+            <flexbox
+              v-for="(item, index) in checkedRightData"
+              :key="index"
+              class="list-item">
+              <el-checkbox
+                v-model="item.check"
+                style="margin-left:9px;"
+                class="list-item-check"
+                @change="rightCheckItemChange"/>
+              <div class="list-item-name">{{ item.name }}</div>
+            </flexbox>
+          </draggable>
+        </div>
+      </div>
+    </flexbox>
+    <div class="handle-bar">
+      <div
+        class="handle-bar-add"
+        @click="addAndEditScene('add',{})">+ 新建场景</div>
+      <div class="handle-bar-save">
+        <el-button @click.native="handleCancel">取消</el-button>
+        <el-button
+          type="primary"
+          @click.native="handleConfirm">保存</el-button>
+      </div>
+    </div>
+    <scene-create
+      :field-list="fieldList"
+      :crm-type="crmType"
+      :dialog-visible.sync="showCreateScene"
+      :obj="filterObj"
+      :name="filterName"
+      :edit_id="filterEditId"
+      :is-default="filterDefault"
+      @saveSuccess="getSceneList"/>
+  </el-dialog>
+</template>
+
+<script type="text/javascript">
+// import crmTypeModel from '@/views/ux/model/crmTypeModel'
+// import {
+//   crmSceneSetIndex,
+//   crmSceneSort,
+//   crmSceneDefaults,
+//   crmSceneDelete,
+//   filterIndexfields
+// } from '@/api/customermanagement/common'
+import draggable from 'vuedraggable'
+import SceneCreate from './SceneCreate' // 新建编辑场景
+
+export default {
+  name: 'SceneSet', // 场景 设置
+  components: {
+    draggable,
+    SceneCreate
+  },
+  props: {
+    dialogVisible: {
+      type: Boolean,
+      required: true,
+      default: false
+    },
+    /** 没有值就是全部类型 有值就是当个类型 */
+    crmType: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      defaultId: '', // 默认场景id
+      visible: false, // 控制展示
+      isleftIndeterminate: false, // 标注头部是多选框效果
+      checkleftAll: false, // 关联全选操作多选框
+
+      checkedLeftData: [], // 数据源
+      leftCheckItems: [], // 选择的数据源
+
+      isrightIndeterminate: false,
+      checkrightAll: false,
+
+      checkedRightData: [],
+      rightCheckItems: [],
+
+      moveItem: {}, // 移动中的item
+      handlDefaultItem: {}, // 设置默认的中间item
+
+      /** 添加 编辑 场景 */
+      showCreateScene: false, // 展示场景添加
+      fieldList: [],
+      filterObj: { form: [] }, // 筛选确定数据
+      filterName: '',
+      filterDefault: false,
+      filterEditId: '' // 编辑id
+    }
+  },
+  computed: {},
+  watch: {
+    dialogVisible: {
+      handler(val) {
+        this.visible = val
+        if (val) {
+          this.getSceneList()
+        }
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+  mounted() {},
+  methods: {
+    getSceneList() {
+      // crmSceneSetIndex({
+      //   type: crmTypeModel[this.crmType]
+      // })
+      //   .then(res => {
+      //     this.checkedLeftData = res.data.value.map(function(item, index) {
+      //       item.check = false
+      //       return item
+      //     })
+      //     this.checkedRightData = res.data.hide_value.map(function(
+      //       item,
+      //       index
+      //     ) {
+      //       item.check = false
+      //       return item
+      //     })
+      //     var defaultScene = this.checkedLeftData.filter(function(item, index) {
+      //       return item.isDefault == 1
+      //     })
+      //     // 如果有默认场景
+      //     if (defaultScene && defaultScene.length > 0) {
+      //       this.defaultId = defaultScene[0].sceneId
+      //     } else {
+      //       this.defaultId = ''
+      //     }
+      //   })
+      //   .catch(() => {})
+    },
+    /**
+     * 确定选择
+     */
+    handleConfirm() {
+      // 如果选择默认的 不包含在左侧列表 重置为没有默认
+      var self = this
+      var leftTemps = this.checkedLeftData.filter(function(item, index) {
+        return item.sceneId == self.defaultId
+      })
+      if (leftTemps.length == 0) {
+        this.defaultId = ''
+      }
+      // crmSceneSort({
+      //   type: crmTypeModel[this.crmType],
+      //   noHideIds: this.checkedLeftData
+      //     .map(function(item, index, array) {
+      //       return item.sceneId
+      //     })
+      //     .join(','),
+      //   hideIds: this.checkedRightData
+      //     .map(function(item, index, array) {
+      //       return item.sceneId
+      //     })
+      //     .join(',')
+      // })
+      //   .then(res => {
+      //     this.$message({
+      //       type: 'success',
+      //       message: '操作成功'
+      //     })
+      //     this.handleCancel()
+      //     this.$emit('save-success')
+      //   })
+      //   .catch(() => {})
+    },
+    /** 事项操作 */
+    itemHandle(type, item, index) {
+      if (type == 'edit') {
+        this.addAndEditScene('edit', item)
+      } else if (type == 'delete') {
+        this.$confirm('您确定要删除这一条数据吗?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        })
+          .then(() => {
+            crmSceneDelete({
+              sceneId: item.sceneId
+            })
+              .then(res => {
+                this.$message({
+                  type: 'success',
+                  message: '删除成功'
+                })
+                this.checkedLeftData.splice(index, 1)
+                this.leftCheckItemChange()
+                this.$emit('save-success')
+              })
+              .catch(() => {})
+          })
+          .catch(() => {
+            this.$message({
+              type: 'info',
+              message: '已取消删除'
+            })
+          })
+      } else if (type == 'default') {
+        this.handlDefaultItem = item
+      }
+    },
+    /** 操作默认 */
+    defaultHandle() {
+      crmSceneDefaults({
+        sceneId: this.handlDefaultItem.sceneId
+      })
+        .then(res => {
+          this.$message({
+            type: 'success',
+            message: '操作成功'
+          })
+          this.defaultId = this.handlDefaultItem.sceneId
+        })
+        .catch(() => {})
+    },
+    /** 添加编辑场景 */
+    addAndEditScene(type, data) {
+      // filterIndexfields({
+      //   label: crmTypeModel[this.crmType]
+      // })
+      //   .then(res => {
+      //     this.fieldList = res.data
+      //     if (type == 'edit') {
+      //       this.filterObj = { form: [], obj: data.data }
+      //       this.filterName = data.name
+      //       this.filterDefault = data.isDefault == 1
+      //       this.filterEditId = data.sceneId.toString()
+      //     } else {
+      //       this.filterObj = { form: [] }
+      //       this.filterEditId = ''
+      //       this.filterName = ''
+      //       this.filterDefault = false
+      //     }
+      //     this.showCreateScene = true
+      //   })
+      //   .catch(() => {})
+    },
+    /**
+     * 取消选择
+     */
+    handleCancel() {
+      this.visible = false
+      this.$emit('update:dialogVisible', false)
+    },
+    /** 拖拽操作 */
+    rightMoveEnd(evt) {
+      this.moveItem.check = false
+      this.leftCheckItemChange()
+      this.rightCheckItemChange()
+    },
+    rightMove(obj) {
+      this.moveItem = obj.draggedContext.element
+    },
+    leftMoveEnd(evt) {
+      this.moveItem.check = false
+      this.leftCheckItemChange()
+      this.rightCheckItemChange()
+    },
+    leftMove(obj) {
+      this.moveItem = obj.draggedContext.element
+    },
+    // 选择全部
+    handleleftCheckAllChange(value) {
+      if (value) {
+        this.isleftIndeterminate = false
+      }
+      this.checkedLeftData = this.checkedLeftData.filter(function(
+        item,
+        index,
+        array
+      ) {
+        item.check = value
+        return item
+      })
+      this.leftCheckItems = value ? this.checkedLeftData : []
+    },
+    leftCheckItemChange() {
+      this.leftCheckItems = this.checkedLeftData.filter(function(
+        item,
+        index,
+        array
+      ) {
+        return item.check == true
+      })
+      if (this.leftCheckItems.length > 0) {
+        if (this.leftCheckItems.length == this.checkedLeftData.length) {
+          this.checkleftAll = true
+          this.isleftIndeterminate = false
+        } else {
+          this.checkleftAll = false
+          this.isleftIndeterminate = true
+        }
+      } else {
+        this.checkleftAll = false
+        this.isleftIndeterminate = false
+      }
+    },
+    // 选择全部
+    handlerightCheckAllChange(value) {
+      if (value) {
+        this.isrightIndeterminate = false
+      }
+      this.checkedRightData = this.checkedRightData.filter(function(
+        item,
+        index,
+        array
+      ) {
+        item.check = value
+        return item
+      })
+      this.rightCheckItems = value ? this.checkedRightData : []
+    },
+    rightCheckItemChange() {
+      this.rightCheckItems = this.checkedRightData.filter(function(
+        item,
+        index,
+        array
+      ) {
+        return item.check == true
+      })
+      if (this.rightCheckItems.length > 0) {
+        if (this.rightCheckItems.length == this.checkedRightData.length) {
+          this.checkrightAll = true
+          this.isrightIndeterminate = false
+        } else {
+          this.checkrightAll = false
+          this.isrightIndeterminate = true
+        }
+      } else {
+        this.checkrightAll = false
+        this.isrightIndeterminate = false
+      }
+    },
+    // 按钮操作
+    changePositon(type) {
+      var self = this
+      // 从右往左
+      if (type == 'left') {
+        this.checkedRightData = this.checkedRightData.filter(function(
+          item,
+          index,
+          array
+        ) {
+          var remove = false
+          self.rightCheckItems.forEach(function(element, index) {
+            if (item.sceneId == element.sceneId) {
+              remove = true
+            }
+          })
+          return !remove
+        })
+
+        this.rightCheckItems.forEach(function(element, index) {
+          element.check = false
+          self.checkedLeftData.push(element)
+        })
+
+        this.rightCheckItems = []
+        this.isrightIndeterminate = false
+        this.checkrightAll = false
+
+        // 刷新左侧效果
+        this.leftCheckItemChange()
+        this.rightCheckItemChange()
+      } else {
+        this.checkedLeftData = this.checkedLeftData.filter(function(
+          item,
+          index,
+          array
+        ) {
+          var remove = false
+          self.leftCheckItems.forEach(function(element, index) {
+            if (item.sceneId == element.sceneId) {
+              remove = true
+            }
+          })
+          return !remove
+        })
+
+        this.leftCheckItems.forEach(function(element, index) {
+          element.check = false
+          self.checkedRightData.push(element)
+        })
+
+        this.leftCheckItems = []
+        this.isleftIndeterminate = false
+        this.checkleftAll = false
+
+        // 刷新右侧效果
+        this.leftCheckItemChange()
+        this.rightCheckItemChange()
+      }
+    }
+  }
+}
+</script>
+<style rel="stylesheet/scss" lang="scss" scoped>
+.scene-name {
+  font-size: 12px;
+  padding-bottom: 5px;
+  color: #aaa;
+}
+
+.default-mark {
+  width: 4px;
+  height: 4px;
+  border-radius: 2px;
+  margin-right: 5px;
+}
+.default-mark-active {
+  background-color:#3E84E9;
+}
+
+.scene-list {
+  .scene-list-box {
+    flex: 1;
+    border: 1px solid #3E84E9;
+    border-radius: 2px;
+    height: 300px;
+    position: relative;
+    padding: 15px;
+  }
+  .scene-middle-list {
+    width: 50px;
+    text-align: center;
+    button {
+      border: 1px solid #cccccc;
+      width: 34px;
+      height: 34px;
+      border-radius: 17px;
+      background-color: #f5f7fa;
+    }
+    .scene-middle-icon {
+      color: #cccccc;
+      font-size: 14px;
+    }
+    .scene-middle-left-button {
+    }
+    .scene-middle-right-button {
+      margin-top: 15px;
+      margin-left: 0;
+    }
+
+    .scene-middle-button-select {
+      border: 1px solid #3E84E9 !important;
+      background-color: #3E84E9 !important;
+      .scene-middle-icon {
+        color: white !important;
+      }
+    }
+  }
+  .scene-list-head {
+    padding-bottom: 15px;
+    padding-left: 9px;
+    border-bottom: 1px dashed #3E84E9;
+    font-size: 13px;
+    .scene-list-head-name {
+      color: #333;
+      flex: 1;
+      margin: 0 8px;
+    }
+
+    .scene-list-head-detail {
+      color: #aaa;
+    }
+  }
+  .scene-list-body {
+    padding: 5px 0;
+    height: 240px;
+    position: relative;
+    overflow-y: auto;
+  }
+
+  .list-item {
+    padding: 5px 0;
+    cursor: pointer;
+    .list-item-check {
+      margin-right: 8px;
+    }
+    .list-item-name {
+      font-size: 13px;
+      color: #333;
+      flex: 1;
+    }
+    .list-item-handle {
+      flex-shrink: 0;
+      display: none;
+      i {
+        color: #aaa;
+        font-size: 12px;
+        margin-right: 5px;
+      }
+      i:hover {
+        color: #3E84E9;
+      }
+    }
+  }
+
+  .list-item:hover {
+    .list-item-handle {
+      display: block;
+    }
+  }
+}
+
+.handle-bar {
+  font-size: 12px;
+  .handle-bar-add {
+    cursor: pointer;
+    color: #3e84e9;
+    padding: 20px 10px;
+  }
+  .handle-bar-save {
+    position: relative;
+    height: 30px;
+    button {
+      float: right;
+      margin-right: 10px;
+    }
+  }
+}
+</style>
diff --git a/vue/src/views/pg-fis/components/tableDetail/index.vue b/vue/src/views/pg-fis/components/tableDetail/index.vue
new file mode 100644
index 00000000..fef42597
--- /dev/null
+++ b/vue/src/views/pg-fis/components/tableDetail/index.vue
@@ -0,0 +1,73 @@
+<template>
+  <el-dialog
+    v-dialogDrag 
+    :visible.sync="visible"
+    :close-on-click-modal="false"
+    title="详细信息"
+    width="900px"
+    height="300px"
+    :append-to-body="true">  
+    <div
+      slot="footer"
+      class="dialog-footer">
+       <crm-base-info
+        :is="tabName"
+        :detail="data"
+        :id="id"
+        :crm-type="crmType">
+        </crm-base-info>
+      <el-button >取 消</el-button>
+      <el-button
+        type="primary"
+        >确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import CRMBaseInfo from '../CRMBaseInfo' // 基本信息
+ 
+export default {
+  name: 'Index',
+  components: {
+    CRMBaseInfo
+  },
+  props: {
+    dialogVisible: {
+    type: Boolean,
+    required: true,
+    default: false
+    },
+    detailData: {},    
+  },
+  data() {
+    return{
+        visible: false, 
+        data:{},
+        tabName:'',
+        id: [String, Number],
+    }
+  },
+   watch: {
+    dialogVisible: {
+      handler(val) {
+        if (val) {
+        
+        }
+        this.visible = this.dialogVisible
+      },
+    },
+    detailData:{
+        handler(val) {
+            this.data=this.detailData;
+        }
+    }
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="scss">
+ 
+</style>
diff --git a/vue/src/views/pg-fis/styles/crmdetail.scss b/vue/src/views/pg-fis/styles/crmdetail.scss
new file mode 100644
index 00000000..23885c79
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/crmdetail.scss
@@ -0,0 +1,39 @@
+//客户相关详情 头部类似布局
+.el-tabs /deep/ .el-tabs__nav-wrap::after {
+  display: none !important;
+}
+
+.el-tabs /deep/ .el-tabs__header {
+  background-color: #F5F6F9;
+  padding: 0 17px;
+  margin: 0 0 15px !important;
+}
+
+.el-tabs /deep/ .el-tabs__item {
+  font-size: 13px !important;
+  height: 40px !important;
+  line-height: 40px !important;
+}
+
+.d-container {
+  position: relative;
+  height: 100%;
+}
+
+/** 让element 查询到的标签 */
+.t-loading-content {
+  position: relative;
+  overflow-y: scroll;
+  flex: 1;
+}
+
+/** 审核信息 */
+.examine-info {
+  padding: 0 17px 17px 17px;
+
+  .examine-info-border {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    padding: 17px;
+  }
+}
diff --git a/vue/src/views/pg-fis/styles/crmtable.scss b/vue/src/views/pg-fis/styles/crmtable.scss
new file mode 100644
index 00000000..d0dd421f
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/crmtable.scss
@@ -0,0 +1,111 @@
+.cr-body-content {
+  margin: 2px ;
+  position: relative;
+  background-color: white;
+  overflow-x: auto;
+  //border-bottom: 1px solid $xr-border-line-color;
+}
+.el-table .cell {
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+.content-header {
+  position: relative;
+  padding: 10px 20px;
+  .search-container {
+    margin: 0 20px;
+    width: 200px;
+  }
+  .create-button {
+    position: absolute;
+    right: 10px;
+    top: 15px;
+  }
+}
+
+.right-container {
+  margin-right: -10px;
+  float: right;
+  margin: 2px;
+  position: relative;
+  .right-item {
+    float: left;
+    margin-right: 10px;
+    padding: 8px 10px;
+    font-size: 13px;
+    border-radius: 2px;
+  }
+
+  .right-more-item {
+    cursor: pointer;
+    border: 1px solid #dcdfe6;
+    background-color: white;
+    font-size: 13px;
+    color: #777;
+    padding: 0 12px;
+    border-radius: 2px;
+    height: 31px;
+  }
+}
+
+.el-input {
+  display: inline-block;
+  
+  width: 50%;
+
+  input {
+    background: transparent;
+    border: 0px;
+    -webkit-appearance: none;
+    border-radius: 0px;
+    padding: 12px;
+    height: 47px;
+    caret-color: #1a1818;
+
+    &:-webkit-autofill {
+      box-shadow: 0 0 0px 1000px #e5e5e5 inset !important;
+      -webkit-text-fill-color: #454545 !important;
+      color:#454545 !important;
+    }
+  }
+}
+
+//表尾 上一页按钮
+.table-footer {
+  padding: 1px 20px;
+}
+
+.el-table /deep/ thead th {
+  font-weight: 400;
+  font-size: 12px;
+}
+
+.el-table /deep/ tbody tr td {
+  font-size: 12px;
+}
+
+.el-table /deep/ thead .el-checkbox {
+  display: inline;
+}
+
+body .el-table th.gutter {
+  display: table-cell !important;
+}
+
+.el-table /deep/ .el-table__body-wrapper {
+  height: calc(100% - 58px) !important;
+}
+
+.el-dropdown-link {
+  cursor: pointer;
+  color: #409EFF;
+}
+.el-icon-arrow-down {
+  font-size: 12px;
+}
+.demonstration {
+  display: block;
+  color: #8492a6;
+  font-size: 14px;
+  margin-bottom: 20px;
+}
\ No newline at end of file
diff --git a/vue/src/views/pg-fis/styles/detailview.scss b/vue/src/views/pg-fis/styles/detailview.scss
new file mode 100644
index 00000000..c08cb019
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/detailview.scss
@@ -0,0 +1,9 @@
+
+  /** 客户管理详情页面的 css 侧滑进入的详情 */
+  .d-view {
+    position: fixed;
+    width: 60%;
+    top: 45px;
+    bottom: 0px;
+    right: 0px;
+  }
diff --git a/vue/src/views/pg-fis/styles/file.scss b/vue/src/views/pg-fis/styles/file.scss
new file mode 100644
index 00000000..a4539c9d
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/file.scss
@@ -0,0 +1,131 @@
+/** 附件  */
+.f-container {
+  padding: 0 17px;
+}
+.f-item {
+  padding: 3px 0;
+  height: 35px;
+  .f-img {
+    position: block;
+    width: 30px;
+    height: 30px;
+    padding: 0 1px;
+    margin-right: 8px;
+  }
+  .f-name {
+    color: #666;
+    font-size: 12px;
+    margin-right: 10px;
+  }
+}
+.xh-files-cont {
+    position: relative;
+    display: inline-block;
+    border-radius: 3px;
+    width: 100%;
+    border: 1px solid #ddd;
+    padding: 3.5px 5px;
+    margin: 3px;
+    line-height: 15px;
+  }
+
+  .xh-files-cont.is_disabled {
+    background-color: #f5f7fa;
+    border-color: #e4e7ed;
+    cursor: not-allowed;
+    .f-name {
+      background-color: #f0f4f8ea;
+      color: #c0c4cc;
+      cursor: not-allowed;
+    }
+  }
+
+  .xh-files-cont.is_valid:hover {
+    border-color: #c0c4cc;
+  }
+
+  .f-header {
+    cursor: pointer;
+    padding: 5px 0 5px;
+    .f-logo {
+      position: block;
+      width: 15px;
+      height: 15px;
+      margin-right: 8px;
+    }
+    .f-name {
+      color: #3e84e9;
+      font-size: 12px;
+    }
+  }
+  .f-header.is_disabled {
+    cursor: not-allowed;
+  }
+
+  .f-body {
+    .f-item {
+      padding: 3px 0;
+      height: 25px;
+      .f-img {
+        position: block;
+        width: 15px;
+        height: 15px;
+        padding: 0 1px;
+        margin-right: 8px;
+      }
+      .f-name {
+        color: #666;
+        font-size: 12px;
+      }
+      .close-button {
+        cursor: pointer;
+      }
+    }
+  }
+
+  .bar-iput {
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 0;
+    width: 0;
+    opacity: 0;
+  }
+
+  .b-cont {
+    position: relative;
+    padding: 0 50px 20px 20px;
+  }
+
+  .b-cells {
+    margin-top: 25px;
+  }
+
+  .b-cell {
+    padding: 0 10px;
+    .b-cell-b {
+      width: auto;
+      padding: 8px;
+      .b-cell-name {
+        width: 100px;
+        margin-top: 13px;
+        margin-right: -5px;
+        font-size: 13px;
+        flex-shrink: 0;
+        color: #777;
+      }
+      .b-cell-value {
+        font-size: 13px;
+        color: #333;
+        white-space: pre-wrap;
+        word-wrap: break-word;
+      }
+      .b-cell-foot {
+        flex-shrink: 0;
+        display: block;
+        width: 15px;
+        height: 15px;
+        margin-left: 8px;
+      }
+    }
+  }
diff --git a/vue/src/views/pg-fis/styles/followcell.scss b/vue/src/views/pg-fis/styles/followcell.scss
new file mode 100644
index 00000000..ddcfd42a
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/followcell.scss
@@ -0,0 +1,170 @@
+/** 跟进记录相关的 日志 审批任务 日程 项目 公共css */
+.fl-c {
+  background-color: white;
+  padding: 10px 20px;
+  position: relative;
+}
+
+/** 头部布局 名字 头像 */
+.fl-h {
+  .fl-h-img {
+    display: block;
+    width: 34px;
+    height: 34px;
+    border-radius: 17px;
+    margin-right: 8px;
+  }
+
+  .fl-h-b {
+    flex: 1;
+
+    .fl-h-name {
+      font-size: 13px;
+      color: #333;
+    }
+
+    .fl-h-time {
+      font-size: 12px;
+      color: #999;
+      margin-top: 3px;
+    }
+  }
+}
+
+/** 头部 右侧 布局*/
+.fl-h-handle {
+  width: auto;
+
+  .fl-h-handle-name {
+    font-size: 13px;
+    color: #333;
+    margin-right: 6px;
+  }
+}
+
+.fl-h-mark {
+  width: auto;
+
+  .fl-h-mark-img {
+    display: block;
+    width: 20px;
+    height: 20px;
+    margin-right: 8px;
+  }
+
+  .fl-h-mark-name {
+    font-size: 13px;
+    color: #333;
+  }
+}
+
+/** 内容区域 */
+.fl-b {
+  margin: 20px 0 0 40px;
+
+  .fl-b-content {
+    font-size: 13px;
+    color: #333;
+    margin-bottom: 10px;
+  }
+
+  .fl-b-images {
+    margin-top: 5px;
+    width: 310px;
+
+    .fl-b-img-item {
+      width: 98px;
+      height: 98px;
+      display: inline-block;
+      margin: 0 4px 4px 0;
+      background-size: contain;
+      background-repeat: no-repeat;
+      background-position: center;
+      position: relative;
+      cursor: pointer;
+    }
+  }
+
+  .fl-b-other {
+    margin: 8px 0;
+
+    .fl-b-other-name {
+      margin: 10px 0;
+      color: #666;
+      font-size: 13px;
+    }
+  }
+}
+
+.fl-c:before {
+  content: " ";
+  position: absolute;
+  top: 0;
+  right: 0;
+  height: 1px;
+  border-top: 1px solid #e5e5e5;
+  color: #e5e5e5;
+  -webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+  -webkit-transform: scaleY(0.5);
+  transform: scaleY(0.5);
+  left: 15px;
+  z-index: 2;
+}
+
+.fl-c:first-child:before {
+  display: none;
+}
+
+/** 附件 */
+.fl-b-files {
+  margin-top: 10px;
+}
+
+/** 关联附件 联系人 客户 行布局 */
+.cell {
+  padding: 8px;
+  background-color: #F5F7FA;
+  border-radius: 2px;
+  position: relative;
+
+  .cell-head {
+    display: block;
+    width: 15px;
+    height: 15px;
+    margin-right: 8px;
+  }
+
+  .cell-body {
+    flex: 1;
+    color: #333;
+    font-size: 12px;
+  }
+
+  .cell-foot {
+    display: block;
+    width: 20px;
+    padding: 0 4px;
+    margin-right: 8px;
+  }
+}
+
+.cell:before {
+  content: " ";
+  position: absolute;
+  top: 0;
+  right: 0;
+  height: 1px;
+  border-top: 1px solid #e5e5e5;
+  color: #e5e5e5;
+  -webkit-transform-origin: 0 0;
+  transform-origin: 0 0;
+  -webkit-transform: scaleY(0.5);
+  transform: scaleY(0.5);
+  left: 30px;
+  z-index: 2;
+}
+
+.cell:first-child:before {
+  display: none;
+}
diff --git a/vue/src/views/pg-fis/styles/followlog.scss b/vue/src/views/pg-fis/styles/followlog.scss
new file mode 100644
index 00000000..7fa5f031
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/followlog.scss
@@ -0,0 +1,86 @@
+// 跟进记录效果
+.f-container {
+  padding: 0 17px;
+}
+
+/** 发布行css  */
+.se-section {
+  position: relative;
+  margin: 5px 0;
+  height: 40px;
+  line-height: 40px;
+
+  .se-name {
+    font-size: 12px;
+    color: #333333;
+    margin-right: 5px;
+  }
+
+  .se-select {
+    border: 1px solid #dcdfe6;
+    font-size: 12px;
+    color: #606266;
+    padding: 0 8px;
+    border-radius: 2px;
+    font-weight: 500;
+    height: 25px;
+
+    .se-select-name {
+      margin-right: 20px;
+    }
+  }
+
+  .se-datepicker {
+    font-size: 12px;
+    width: 200px;
+    margin-right: 20px;
+  }
+
+  .se-send {
+    position: absolute;
+    right: 0;
+    padding: 5px 15px;
+  }
+}
+
+.el-date-editor /deep/ .el-input__inner {
+  height: 25px;
+  line-height: 25px;
+}
+
+.el-date-editor /deep/ .el-input__icon {
+  height: 25px;
+  line-height: 25px;
+}
+
+.el-checkbox /deep/ .el-checkbox__label {
+  font-size: 12px;
+  color: #333333;
+}
+
+.log-cont {
+  margin: 0px 0;
+  border: 1px solid #e6e6e6;
+  border-radius: 2px;
+
+  .log-tabs-item {
+    font-size: 13px;
+    padding: 8px 15px;
+    cursor: pointer;
+  }
+
+  .log-tabs-item:hover {
+    color: #F18C70 !important;
+  }
+
+  .log-tabs-line {
+    height: 10px;
+    background-color: #e6e6e6;
+    width: 2px;
+  }
+}
+
+.log-items {
+  min-height: 400px;
+  position: relative;
+}
diff --git a/vue/src/views/pg-fis/styles/relativecrm.scss b/vue/src/views/pg-fis/styles/relativecrm.scss
new file mode 100644
index 00000000..0d90ab64
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/relativecrm.scss
@@ -0,0 +1,29 @@
+/**客户下相关信息 table 效果 */
+.rc-cont {
+    position: relative;
+    padding: 0 20px 20px 20px;
+    .rc-head {
+        margin-bottom: 15px;
+        position: relative;
+        .rc-head-item {
+            font-size: 12px;
+            padding: 8px 5px;
+            border-radius: 2px;
+            margin-right: 20px;
+            margin-left: 0px;
+        }
+        .rc-head-item:first-child {
+            margin-right: 0;
+        }
+    }
+}
+
+.el-table /deep/ thead th{
+    background-color: #F5F5F5;
+    font-weight: 400;
+    font-size: 12px;
+}
+
+.el-table /deep/ tbody{
+    font-size: 13px;
+}
diff --git a/vue/src/views/pg-fis/styles/table.scss b/vue/src/views/pg-fis/styles/table.scss
new file mode 100644
index 00000000..4c513cbe
--- /dev/null
+++ b/vue/src/views/pg-fis/styles/table.scss
@@ -0,0 +1,129 @@
+@import './detailview.scss';
+
+.crm-container {
+  background-color: white;
+  border: 1px solid #E6E6E6;
+  border-radius: 2px;
+}
+
+/**
+  .el-table /deep/ thead th {
+    border-right: 1px solid #ebeef5;
+  }
+
+  .el-table /deep/ tbody tr td:nth-child(2){
+    border-right: 1px solid #ebeef5;
+  }
+
+  .b-bottom {
+    border-bottom: 1px solid #ebeef5;
+  }
+  */
+
+.el-table /deep/ thead th {
+  //background-color: #fafdff;
+  //font-weight: 400;
+  //border-color: #E6E6E6;
+  //color: #475059;
+    background-color: #61687a;
+    font-weight: 400;
+    border-color: #fff;
+    color: #fff;
+  font-size: 12px;
+}
+
+.table-set {
+  width: 15px;
+  margin-top: 5px;
+  cursor: pointer;
+}
+
+.table-head-name {
+  font-size: 14px;
+  color: #475059;
+  line-height: 23px;
+  padding: 0;
+}
+
+.el-table /deep/ thead .cell {
+  height: 23px;
+}
+
+.el-table /deep/ .el-table__row.current-row {
+  td:first-child::before {
+    content: ' ';
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    width: 2px;
+    background-color: #5383ED;
+  }
+}
+
+.el-table /deep/ tbody tr td {
+  border-top-color: transparent;
+  border-left-color: transparent;
+  border-right-color: transparent;
+  border-bottom-color: #E6E6E6;
+  font-size: 13px;
+}
+
+.el-table /deep/ tbody tr td:nth-child(2) {
+  border-right: 1px solid #E6E6E6;
+}
+
+.n-table--border {
+  border-color: #E6E6E6;
+  border-left-color: transparent;
+  border-right-color: transparent;
+}
+
+.n-table--border::after {
+  display: none;
+}
+
+.p-contianer {
+  position: relative;
+  background-color: white;
+  height: 44px;
+
+  .p-bar {
+    float: right;
+    margin: 5px 100px 0 0;
+    font-size: 14px !important;
+  }
+}
+
+// 列表状态
+.status_button {
+  padding: 1px 6px;
+  border: 1px solid #e6e6e6;
+  border-radius: 4px;
+  display: inline-block;
+  font-size: 12px;
+  margin: 0 auto;
+}
+
+.el-table /deep/ .sort-caret.ascending {
+  top: 0px;
+}
+.el-table /deep/ .sort-caret.descending{
+  bottom: 2px;
+}
+.el-table /deep/ .caret-wrapper {
+  height: 24px;
+}
+
+.el-table /deep/ .warning-row {
+  background: #e3ecf3;
+}
+.el-table /deep/ .success-row {
+  background: #f4f8fd;
+}
+.el-table /deep/ thead {
+   background: #61687a;
+}
+.el-table /deep/ th.gutter {
+  display: table-cell!important;
+}
diff --git a/vue/static/config.js b/vue/static/config.js
index 66121036..0be624dd 100644
--- a/vue/static/config.js
+++ b/vue/static/config.js
@@ -17,8 +17,8 @@ if (process.env.NODE_ENV === 'development') {
 			 public_port: '44378',
 			 backend_port: '44378', */
 			
-      //ip: 'http://192.168.0.203',
-      ip: 'http://149.223.116.5',
+      ip: 'http://192.168.0.203',
+      // ip: 'http://149.223.116.5',
       auth_port: '8066',
       public_port: '8092',
       backend_port: '8092'
@@ -50,8 +50,8 @@ if (process.env.NODE_ENV === 'development') {
   // 发布环境
   configJSON = {
     base: {
-      //ip: 'http://192.168.0.203',
-      ip: 'http://149.223.116.5',
+      ip: 'http://192.168.0.203',
+      //ip: 'http://149.223.116.5',
       //ip: 'http://114.116.225.148',
       //ip: 'http://10.123.148.162',
       auth_port: '8066',