From 90427ad7b5e73aaee2eb376080547787d25dc2bb Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期五, 29 七月 2022 18:41:22 +0800
Subject: [PATCH] suanfa app mange

---
 src/views/AppManage/AppManage.vue              |  170 +++
 src/views/AppManage/AppEdit.vue                |  646 ++++++++++++++
 src/views/AlgrithmManage/BaseAlgorithmEdit.vue |  287 ++++++
 src/views/AlgrithmManage/PageAlgorithm.vue     |  301 ++++++
 src/router.ts                                  |   47 
 src/views/AlgrithmManage/PageAlgorithmEdit.vue |  925 +++++++++++++++++++++
 src/components/LeftNav.vue                     |   13 
 src/views/AlgrithmManage/BaseAlgorithm.vue     |  240 +++++
 8 files changed, 2,621 insertions(+), 8 deletions(-)

diff --git a/src/components/LeftNav.vue b/src/components/LeftNav.vue
index 3ca9adb..53a374c 100644
--- a/src/components/LeftNav.vue
+++ b/src/components/LeftNav.vue
@@ -65,14 +65,17 @@
           <span>绠＄悊鍛樻姤琛�</span>
         </template>
         <el-menu-item-group> </el-menu-item-group>
-      </el-submenu>
+      </el-submenu> -->
 
       <el-submenu index="5">
         <template slot="title">
           <i class="iconfont">&#xe654;</i>
           <span>绠楁硶绠＄悊</span>
         </template>
-        <el-menu-item-group> </el-menu-item-group>
+        <el-menu-item-group>
+          <el-menu-item index="/Layout/PageAlgorithm">搴旂敤绠楁硶</el-menu-item>
+          <el-menu-item index="/Layout/BaseAlgorithm">鍩虹绠楁硶</el-menu-item>
+        </el-menu-item-group>
       </el-submenu>
 
       <el-submenu index="6">
@@ -80,8 +83,10 @@
           <i class="iconfont">&#xe656;</i>
           <span>搴旂敤绠＄悊</span>
         </template>
-        <el-menu-item-group> </el-menu-item-group>
-      </el-submenu> -->
+        <el-menu-item-group>
+          <el-menu-item index="/Layout/AppManage">搴旂敤绠＄悊</el-menu-item>
+        </el-menu-item-group>
+      </el-submenu>
     </el-menu>
   </div>
 </template>
diff --git a/src/router.ts b/src/router.ts
index 85755be..b5ecf65 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -16,6 +16,12 @@
 import AddProduct from './views/operateManage/productManage/AddProduct.vue'
 import EquipmentList from './views/equipmentManage/equipmentList/index.vue'
 import EquipmentDetail from './views/equipmentManage/equipmentDetail/index.vue'
+import AppManage from './views/AppManage/AppManage.vue'
+import AppEdit from './views/AppManage/AppEdit.vue'
+import BaseAlgorithm from "./views/AlgrithmManage/BaseAlgorithm.vue";
+import PageAlgorithm from "./views/AlgrithmManage/PageAlgorithm.vue";
+import PageAlgorithmEdit from './views/AlgrithmManage/PageAlgorithmEdit.vue';
+import BaseAlgorithmEdit from './views/AlgrithmManage/BaseAlgorithmEdit.vue';
 
 import MobileLogin from "./views/MobileLogin.vue";
 import BindPhone from "./views/BindPhone.vue";
@@ -77,7 +83,7 @@
           name: "UserList",
           component: UserList
         },
-         {
+        {
           path: "UserDetail",
           name: "UserDetail",
           component: UserDetail
@@ -97,12 +103,12 @@
           name: "ModelList",
           component: ModelList
         },
-         {
+        {
           path: "AddModel",
           name: "AddModel",
           component: AddModel
         },
-         {
+        {
           path: "ProductList",
           name: "ProductList",
           component: ProductList
@@ -122,11 +128,44 @@
           name: "EquipmentList",
           component: EquipmentList
         },
-          {
+        {
           path: "EquipmentDetail",
           name: "EquipmentDetail",
           component: EquipmentDetail
         },
+        {
+          path: "AppManage",
+          name: "AppManage",
+          component: AppManage
+        },
+        {
+          path: "AppEdit/:appId",
+          name: "appEdit",
+          component: AppEdit,
+          props: true
+        },
+        {
+          path: "PageAlgorithm",
+          name: "PageAlgorithm",
+          component: PageAlgorithm,
+        },
+        {
+          path: "BaseAlgorithm",
+          name: "BaseAlgorithm",
+          component: BaseAlgorithm,
+        },
+        {
+          path: "PageAlgorithmEdit/:action/:id",
+          name: "PageAlgorithmEdit",
+          component: PageAlgorithmEdit,
+          props: true
+        },
+        {
+          path: "BaseAlgorithmEdit/:action/:id",
+          name: "BaseAlgorithmEdit",
+          component: BaseAlgorithmEdit,
+          props: true
+        },
       ]
     }
   ]
diff --git a/src/views/AlgrithmManage/BaseAlgorithm.vue b/src/views/AlgrithmManage/BaseAlgorithm.vue
new file mode 100644
index 0000000..622c461
--- /dev/null
+++ b/src/views/AlgrithmManage/BaseAlgorithm.vue
@@ -0,0 +1,240 @@
+<template>
+  <div class="right-main">
+    <div class="top-title">
+      <p>鍩虹绠楁硶鍒楄〃</p>
+    </div>
+
+    <div class="control-bar">
+      <div class="line-one">
+        <div class="right-fixed">
+          <el-button type="primary" size="small" @click="createBaseAlg"
+            >娣诲姞</el-button
+          >
+        </div>
+      </div>
+    </div>
+    <div class="table-area">
+      <el-table
+        id="multipleTable"
+        ref="multipleTable"
+        :data="baseSdkData"
+        tooltip-effect="dark"
+        :fit="true"
+      >
+        <!-- <el-table-column type="selection" width="30"></el-table-column> -->
+        <el-table-column label="搴忓彿" width="68">
+          <template slot-scope="scope">{{
+            scope.$index + 1 + (page - 1) * size
+          }}</template>
+        </el-table-column>
+        <el-table-column
+          prop="name"
+          label="鍩虹绠楁硶鍚嶇О"
+          min-width="200"
+          show-overflow-tooltip
+          sortable
+        >
+          <template slot-scope="scope">
+            <div v-if="isBaseAlgEdit && curEditIndex == scope.$index">
+              <el-input size="small" v-model="baseSdkItem.sdk_type"></el-input>
+            </div>
+            <div v-else>{{ scope.row.sdk_type }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column label="鏇存柊鏃堕棿" width="200">
+          <template slot-scope="scope">
+            <div>{{ getTime(scope.row.update_time) }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column
+          prop="version"
+          label="鏈�鏂扮増鏈彿"
+          width="200"
+          sortable
+        ></el-table-column>
+        <!-- <el-table-column
+          prop="source"
+          label="鍩虹绠楁硶缁勪欢"
+          min-width="130"
+          show-overflow-tooltip
+          sortable
+        >
+          <template slot-scope="scope">
+            <div v-if="isBaseAlgEdit && curEditIndex == scope.$index">
+              <file-uploader
+                single
+                uploadPlaceholder="涓婁紶绠楁硶缁勪欢"
+                url="/data/api-f/file/upload"
+                @complete="onFileUpload"
+                @file-added="onFileAdded"
+              />
+            </div>
+            <div v-else>{{scope.row.component_name}}</div>
+          </template>
+        </el-table-column>-->
+        <el-table-column label="鎿嶄綔" width="200">
+          <template slot-scope="scope">
+            <!-- <div v-if="isBaseAlgEdit && curEditIndex == scope.$index">
+              <span class="cursor-pointer" @click="cancle(scope.row)">鍙栨秷</span>
+              <span class="cursor-pointer" @click="saveRowSdk(scope.row)">淇濆瓨</span>
+            </div>-->
+            <div>
+              <span
+                class="cursor-pointer"
+                @click="editBaseAlg(scope.row, scope.$index)"
+                >缂栬緫</span
+              >
+              <span class="cursor-pointer" @click="delSdk(scope.row)"
+                >鍒犻櫎</span
+              >
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination
+          @current-change="refresh"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-sizes="[8, 10, 15, 20, 25]"
+          :page-size="size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import request from "@/api/index";
+// import { findAllBaseAlg, deleteBaseAlg } from "@/api/algorithm";
+import { getFilePath } from "@/api/utils";
+export default {
+  data() {
+    return {
+      size: 10,
+      page: 1,
+      total: 0,
+      baseSdkData: [],
+      baseSdkItem: {
+        sdk_type: "",
+        component_name: "",
+        component_path: "",
+      },
+      //baseSdkItem:{},
+      curEditRow: {},
+      isBaseAlgEdit: false,
+      curEditIndex: 0,
+    };
+  },
+  methods: {
+    newBaseSdk() {
+      return {
+        sdk_type: "",
+        component_name: "",
+        component_path: "",
+      };
+    },
+    async renderTableList() {
+      let data = await findAllBaseAlg({ page: this.page, size: this.size });
+      if (data.code == 200) {
+        this.total = data.data.total;
+        this.baseSdkData = data.data.list;
+      }
+    },
+    saveRowSdk(row) {
+      this.isBaseAlgEdit = false;
+      let params = {
+        id: this.baseSdkItem.id,
+        component_name: this.curEditRow.component_name,
+        component_path: this.curEditRow.component_path,
+        sdk_type: this.baseSdkItem.sdk_type,
+      };
+
+      saveBaseAlg(params)
+        .then((res) => {
+          this.$notify({
+            type: "success",
+            message: "淇濆瓨鎴愬姛!",
+            duration: 2500,
+            offset: 57,
+          });
+          this.renderTableList();
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+    cancle(row) {
+      if (!row.id) {
+        this.baseSdkData.splice(this.baseSdkData.length - 1, 1);
+        this.isBaseAlgEdit = false;
+        return;
+      }
+      this.isBaseAlgEdit = false;
+    },
+    editBaseAlg(row, index) {
+      this.$router.push({ path: `/Layout/BaseAlgorithmEdit/edit/${row.id}` });
+      // if (this.isBaseAlgEdit) return;
+      // this.isBaseAlgEdit = true;
+      // this.curEditIndex = index;
+      // this.baseSdkItem = JSON.parse(JSON.stringify(row));
+    },
+    delSdk(row) {
+      this.$confirm("纭畾鍒犻櫎璇ラ」鍚�?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+        center: true,
+      })
+        .then(() => {
+          deleteBaseAlg(row.id).then((res) => {
+            this.$message({
+              type: "success",
+              message: "鍒犻櫎鎴愬姛!",
+            });
+            this.renderTableList();
+          });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+    createBaseAlg() {
+      this.$router.push({ path: "/Layout/BaseAlgorithmEdit/create/alg" });
+      // if (this.isBaseAlgEdit) return;
+      // this.baseSdkItem = this.newBaseSdk();
+      // this.baseSdkData.push(this.baseSdkItem);
+      // this.isBaseAlgEdit = true;
+      // this.curEditIndex = this.baseSdkData.length - 1;
+    },
+
+    refresh(page) {
+      this.page = page;
+      this.renderTableList();
+    },
+    handleSizeChange(size) {
+      this.size = size;
+      this.renderTableList();
+    },
+
+    getTime(time) {
+      return (
+        time.substring(0, 4) +
+        "-" +
+        time.substring(4, 6) +
+        "-" +
+        time.substring(6, 8)
+      );
+    },
+
+    // rowClick(row, column, ev){
+    //   this.curEditRow = JSON.parse(JSON.stringify(row));
+    // }
+  },
+  mounted() {
+    this.renderTableList();
+  },
+};
+</script>
\ No newline at end of file
diff --git a/src/views/AlgrithmManage/BaseAlgorithmEdit.vue b/src/views/AlgrithmManage/BaseAlgorithmEdit.vue
new file mode 100644
index 0000000..a1ed510
--- /dev/null
+++ b/src/views/AlgrithmManage/BaseAlgorithmEdit.vue
@@ -0,0 +1,287 @@
+<template>
+  <div class="right-main">
+    <div class="bread-crumb">
+      <span class="prev-title">
+        <router-link to="/layout/BaseAlgorithm">鍩虹绠楁硶鍒楄〃</router-link>
+      </span>
+      <span class="devide"></span>
+      <span class="cur-title">{{ action == "create" ? "娣诲姞" : "缂栬緫" }}</span>
+    </div>
+    <div style="min-height: calc(100vh - 150px); background: #fff">
+      <el-form :model="algForm" ref="algForm" label-width="120px">
+        <div class="base-info info-block">
+          <div class="info-header">
+            <span class="title">鍩烘湰淇℃伅</span>
+          </div>
+          <div class="info-body">
+            <div class="left">
+              <el-form-item label="鍩虹绠楁硶鍚嶇О:" prop="sdk_name">
+                <!-- <el-input v-model="algForm.sdk_name" size="small"></el-input> -->
+                <i>{{ algForm.sdk_name }}</i>
+              </el-form-item>
+            </div>
+          </div>
+        </div>
+      </el-form>
+      <div class="base-info info-block">
+        <div class="info-header">
+          <span class="title">绠楁硶鐗堟湰</span>
+          <div class="toAdd" @click="toAddVersion">
+            <i class="el-icon-circle-plus-outline"></i>
+            <span>娣诲姞</span>
+          </div>
+        </div>
+        <div class="info-body">
+          <el-table :data="versionInfo" style="width: 100%" border>
+            <el-table-column
+              type="index"
+              width="50"
+              label="搴忓彿"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              prop="version_show"
+              width="200"
+              label="鐗堟湰鍙�"
+              align="center"
+            >
+              <template slot-scope="scope">
+                <div>
+                  <span>{{ scope.row.version_show }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="content"
+              width="500"
+              label="鐗堟湰鏇存柊鍐呭"
+              header-align="center"
+            >
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && curEditIndex == scope.$index">
+                  <el-input v-model="editData.content" size="mini"></el-input>
+                </div>
+                <div v-else>
+                  <span>{{ scope.row.content }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              width="240"
+              label="鏇存柊鏃堕棿"
+              align="center"
+              prop="updateTime"
+            ></el-table-column>
+            <el-table-column
+              prop="updateUserName"
+              width="150"
+              label="鏇存柊浜�"
+              align="center"
+            ></el-table-column>
+            <el-table-column width="330" label="闄勪欢" align="center">
+              <template slot-scope="scope">
+                <div
+                  v-if="
+                    isVersionEdit &&
+                    curEditIndex == scope.$index &&
+                    !scope.row.id
+                  "
+                >
+                  <file-uploader
+                    single
+                    uploadPlaceholder="涓婁紶绠楁硶鏂囦欢"
+                    url="/data/api-f/file/upload"
+                    @complete="onFileUpload"
+                    @file-added="onFileAdded"
+                  />
+                </div>
+                <div v-else>{{ scope.row.component_name }}</div>
+              </template>
+            </el-table-column>
+            <el-table-column label="鎿嶄綔" align="center" width="124">
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && curEditIndex == scope.$index">
+                  <span class="cursor-pointer" @click="cancel(scope.row)"
+                    >鍙栨秷</span
+                  >
+                  <span
+                    class="cursor-pointer"
+                    @click="saveRowVersion(scope.row)"
+                    >淇濆瓨</span
+                  >
+                </div>
+                <div class="operation" v-else>
+                  <i
+                    class="el-icon-edit"
+                    @click="edit(scope.row, scope.$index)"
+                  ></i>
+                  <i
+                    class="el-icon-remove-outline"
+                    @click="remove(scope.row)"
+                  ></i>
+                </div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import FileUploader from "@/components/subComponents/FileUpload/index";
+import { getFilePath } from "@/api/utils";
+// import {
+//   findBaseAlgVersions,
+//   saveBaseAlg,
+//   deleteVersion,
+// } from "@/api/algorithm";
+export default {
+  components: { FileUploader },
+  props: ["action", "id"],
+  data() {
+    return {
+      copy_id: this.id,
+      tableParams: {
+        page: 1,
+        sdkBaseId: this.id,
+        size: 10,
+      },
+      total: 0,
+      algForm: {
+        sdk_name: "",
+      },
+      editData: {},
+      versionInfo: [],
+      isVersionEdit: false,
+      curEditIndex: 0,
+      curEditRow: {},
+    };
+  },
+  mounted() {
+    if (this.action == "create") {
+      this.copy_id = "";
+    }
+    if (this.copy_id) {
+      this.getVersionList();
+    }
+  },
+  methods: {
+    async getVersionList() {
+      let res = await findBaseAlgVersions(this.tableParams);
+      this.versionInfo = res.data.list;
+      this.total = res.data.total;
+      this.algForm.sdk_name = res.data.list[0] && res.data.list[0].sdk_type;
+    },
+    newVersion() {
+      return {
+        version: "",
+        content: "",
+        updateTime: "",
+        person: "",
+        component_name: "",
+        component_path: "",
+      };
+    },
+    toAddVersion() {
+      if (this.isVersionEdit) return;
+      this.editData = this.newVersion();
+      this.versionInfo.push(this.editData);
+      this.isVersionEdit = true;
+      this.curEditIndex = this.versionInfo.length - 1;
+    },
+    edit(row, index) {
+      this.isVersionEdit = true;
+      this.curEditIndex = index;
+      this.editData = JSON.parse(JSON.stringify(row));
+    },
+    onFileAdded() {},
+    onFileUpload(param) {
+      this.curEditRow.component_name = param.filename;
+      getFilePath(param).then((res) => {
+        if (res.code == 200) {
+          this.curEditRow.component_path = res.data;
+        }
+      });
+    },
+    cancel(row) {
+      this.isVersionEdit = false;
+      if (!row.id) {
+        this.versionInfo.splice(this.versionInfo.length - 1, 1);
+      }
+    },
+    saveRowVersion(row) {
+      let params = {
+        component_name: row.id
+          ? row.component_name
+          : this.curEditRow.component_name,
+        component_path: row.id
+          ? row.component_name
+          : this.curEditRow.component_path,
+        content: this.editData.content,
+        id: row.id || "",
+        sdkBaseId: this.copy_id,
+      };
+      saveBaseAlg(params)
+        .then((res) => {
+          if (res.success) {
+            this.$notify({
+              type: "success",
+              message: "淇濆瓨鎴愬姛!",
+              duration: 2500,
+              offset: 57,
+            });
+            this.isVersionEdit = false;
+            this.getVersionList();
+          }
+        })
+        .catch((e) => {
+          if (e && e.status == 401) {
+            return;
+          }
+          this.$notify({
+            type: "error",
+            message: e.msg,
+            duration: 2500,
+            offset: 57,
+          });
+        });
+    },
+    async remove(row) {
+      if (this.versionInfo.length == 1) {
+        this.$confirm(
+          "璇疯皑鎱庢搷浣�,鍒犻櫎鍚庢鍩虹绠楁硶鎵�鍏宠仈鐨勫簲鐢ㄥ皢鏃犳硶浣跨敤, 鏄惁缁х画?",
+          "鎻愮ず",
+          {
+            confirmButtonText: "纭畾",
+            cancelButtonText: "鍙栨秷",
+          }
+        )
+          .then(async () => {
+            const res = await deleteVersion(row.id);
+            if (res && res.success) {
+              this.$notify({
+                type: "success",
+                message: "鍒犻櫎鎴愬姛",
+              });
+              this.getVersionList();
+            }
+          })
+          .catch(() => {});
+      } else {
+        const res = await deleteVersion(row.id);
+        if (res && res.success) {
+          this.$notify({
+            type: "success",
+            message: "鍒犻櫎鎴愬姛",
+          });
+          this.getVersionList();
+        }
+      }
+    },
+  },
+};
+</script>
+
+<style></style>
diff --git a/src/views/AlgrithmManage/PageAlgorithm.vue b/src/views/AlgrithmManage/PageAlgorithm.vue
new file mode 100644
index 0000000..cabc8dd
--- /dev/null
+++ b/src/views/AlgrithmManage/PageAlgorithm.vue
@@ -0,0 +1,301 @@
+<template>
+  <div class="right-main">
+    <div class="top-title">
+      <p>搴旂敤绠楁硶鍒楄〃</p>
+    </div>
+    <div class="control-bar">
+      <div class="line-one">
+        <div class="screening">
+          <label>鍩虹绠楁硶</label>
+          <el-select v-model="sdk_type" size="small" placeholder="璇烽�夋嫨">
+            <el-option
+              v-for="item in baseSdkList"
+              :key="item.id"
+              :label="item.sdk_type"
+              :value="item.sdk_type"
+              :title="item.sdk_type"
+            ></el-option>
+          </el-select>
+        </div>
+        <div class="screening">
+          <label>SO</label>
+          <el-select v-model="rule_so" size="small" placeholder="璇烽�夋嫨">
+            <el-option
+              v-for="(item, index) in soList"
+              :key="index"
+              :label="item"
+              :value="item"
+              :title="item"
+            ></el-option>
+          </el-select>
+        </div>
+        <div class="screening">
+          <label>绠楁硶鍚嶇О</label>
+          <el-input placeholder="璇疯緭鍏�" prefix-icon="el-icon-search" v-model="inputText" size="small"></el-input>
+        </div>
+        <div class="screening">
+          <el-button type="primary" class="btn-search" plain @click="renderTableList(1)" size="small">鎼滅储</el-button>
+          <el-button class="btn-reset" @click="clearSearch" size="small">閲嶇疆</el-button>
+        </div>
+        <div class="right-fixed">
+          <el-button class="cursor-pointer" type="primary" size="small" @click="createPageAlg">娣诲姞</el-button>
+        </div>
+      </div>
+    </div>
+    <div class="table-area">
+      <el-table
+        v-loading="tableLoading"
+        :data="pageAlgsData"
+        tooltip-effect="dark"
+        :fit="true"
+        :default-sort="{ prop: 'createTime', order: 'descending' }"
+      >
+        <!-- <el-table-column type="selection" width="30"></el-table-column> -->
+        <el-table-column label="搴忓彿" width="68">
+          <template slot-scope="scope">{{ scope.$index + 1 + (page - 1) * size }}</template>
+        </el-table-column>
+        <el-table-column prop="id" label="绠楁硶缂栧彿" min-width="160" sortable></el-table-column>
+        <el-table-column
+          prop="sdk_name"
+          label="搴旂敤绠楁硶鍚嶇О"
+          min-width="200"
+          show-overflow-tooltip
+          sortable
+        ></el-table-column>
+        <el-table-column
+          prop="sdk_type"
+          label="鍩虹绠楁硶鍚嶇О"
+          min-width="150"
+          show-overflow-tooltip
+          sortable
+        ></el-table-column>
+        <el-table-column prop="rule_so" label="SO鍚嶇О" min-width="130" show-overflow-tooltip sortable></el-table-column>
+        <el-table-column
+          prop="version"
+          label="鏈�鏂扮増鏈彿"
+          min-width="140"
+          show-overflow-tooltip
+          sortable
+        ></el-table-column>
+        <el-table-column label="鏈�鍚庢洿鏂版椂闂�" min-width="180" sortable>
+          <template slot-scope="scope">
+            <div>{{ scope.row.update_time || scope.row.create_time }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="鏇存柊浜�"
+          width="140"
+          prop="updateUserName"
+          show-overflow-tooltip
+          sortable
+        ></el-table-column>
+        <el-table-column label="鎿嶄綔" min-width="120">
+          <template slot-scope="scope">
+            <span class="cursor-pointer" @click="edit(scope.row)">缂栬緫</span>
+            <span class="cursor-pointer" @click="deletePageAlg(scope.row)">鍒犻櫎</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination
+          @current-change="refresh"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-sizes="[5, 10, 15, 20, 25]"
+          :page-size="size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+// import { findAllBaseAlg, getAllSO, getAllPageAlg, delPageAlg } from "@/api/algorithm"
+import request from "@/api/index"
+export default {
+  data() {
+    return {
+      baseSdkList: [],
+      soList: [],
+      tableHeight: window.innerHeight - 350,
+      sdk_type: "",
+      page: 1,
+      size: 10,
+      total: 0,
+      rule_so: "",
+      inputText: "",
+      pageAlgsData: [],
+      tableLoading: false
+    }
+  },
+  methods: {
+    renderTableList(v) {
+      this.tableLoading = true
+      getAllPageAlg({
+        inputText: this.inputText,
+        page: v === 1 ? 1 : this.page,
+        rule_so: this.rule_so,
+        sdk_type: this.sdk_type,
+        size: this.size
+      })
+        .then((res) => {
+          if (res.code == 200) {
+            this.pageAlgsData = res.data.list
+            this.total = res.data.total
+            this.tableLoading = false
+            if (res.data.total <= this.size) {
+              this.page = 1
+            }
+          }
+        })
+        .catch((e) => {
+          this.tableLoading = false
+          if (e && e.status == 401) {
+            return
+          }
+          this.$notify({
+            type: "error",
+            message: "鏁版嵁鑾峰彇澶辫触,璇风◢鍚庨噸璇�!",
+            duration: 2500,
+            offset: 57
+          })
+        })
+    },
+    getAllBaseSDK() {
+      findAllBaseAlg().then((res) => {
+        if (res.code == 200) {
+          this.baseSdkList = res.data.list
+        }
+      })
+    },
+    getSOList() {
+      getAllSO().then((res) => {
+        if (res.success) {
+          this.soList = res.data.list
+        }
+      })
+    },
+
+    refresh(page) {
+      this.page = page
+      this.renderTableList()
+    },
+    handleSizeChange(size) {
+      this.size = size
+      this.renderTableList()
+    },
+    edit(row) {
+      this.$router.push({ path: `/Layout/PageAlgorithmEdit/edit/${row.id}` })
+    },
+
+    deletePageAlg(row) {
+      this.$confirm("纭畾鍒犻櫎璇ラ」鍚�?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+        center: true
+      })
+        .then(() => {
+          delPageAlg(row.id).then((res) => {
+            if (res.code == 200) {
+              this.$message({
+                type: "success",
+                message: "鍒犻櫎鎴愬姛!"
+              })
+              this.renderTableList()
+            }
+          })
+        })
+        .catch((e) => {
+          console.log(e)
+        })
+    },
+    createPageAlg() {
+      this.$router.push({ path: "/Layout/PageAlgorithmEdit/create/alg" })
+    },
+    clearSearch() {
+      this.sdk_type = ""
+      this.inputText = ""
+      this.rule_so = ""
+      this.renderTableList()
+    }
+  },
+  mounted() {
+    this.getAllBaseSDK()
+    this.getSOList()
+    this.renderTableList()
+  }
+}
+</script>
+<style lang="scss">
+.manageOrder {
+  width: 100%;
+  height: 100%;
+  .orderTop {
+    width: calc(100% - 60px);
+    height: 30px;
+    background: #fff;
+    padding: 15px 30px;
+    p {
+      font-family: "PingFangSC-Regular";
+      text-align: left;
+      font-size: 18px;
+      line-height: 30px;
+      font-weight: 600;
+    }
+  }
+  .orderBody {
+    width: calc(100% - 40px);
+    height: calc(100% - 100px);
+    padding: 20px;
+    background: #f0f2f5;
+    .top {
+      background-image: linear-gradient(-180deg, #ffffff 13%, #e9ebf2 100%);
+      height: 76px;
+      width: 100%;
+      padding: 5px 22px;
+      box-sizing: border-box;
+      text-align: left;
+      // line-height: 55px;
+      white-space: nowrap;
+      overflow-x: auto;
+      overflow-y: hidden;
+      .p-label,
+      .p-task,
+      .p-level,
+      .p-date,
+      .p-input,
+      .p-clear {
+        display: inline-block;
+        padding-right: 10px;
+        box-sizing: border-box;
+        margin-top: 20px;
+        b:hover {
+          min-width: 100px;
+          color: #2249b4;
+        }
+        .el-input__inner {
+          border-radius: 3px;
+        }
+      }
+      .clear-searching {
+        cursor: pointer;
+        text-decoration: underline;
+        width: 40px;
+        font-size: 13px;
+        color: #3d68e1;
+      }
+    }
+    .orderList {
+      width: calc(100% - 30px);
+      height: calc(100% - 106px);
+      background: #fff;
+      padding: 15px;
+      border-radius: 5px;
+      // overflow-y: scroll
+    }
+  }
+}
+</style>
diff --git a/src/views/AlgrithmManage/PageAlgorithmEdit.vue b/src/views/AlgrithmManage/PageAlgorithmEdit.vue
new file mode 100644
index 0000000..3d583f2
--- /dev/null
+++ b/src/views/AlgrithmManage/PageAlgorithmEdit.vue
@@ -0,0 +1,925 @@
+<template>
+  <div class="right-main pageAlg">
+    <div class="bread-crumb">
+      <span class="prev-title">
+        <router-link to="/layout/PageAlgorithm">绠楁硶鍒楄〃</router-link>
+      </span>
+      <span class="devide"></span>
+      <span class="cur-title">{{ action == "create" ? "娣诲姞" : "缂栬緫" }}</span>
+    </div>
+
+    <div style="min-height: calc(100vh - 150px); background: #fff">
+      <el-form
+        :model="algForm"
+        ref="algForm"
+        :rules="rules"
+        label-width="120px"
+        v-loading="loading"
+      >
+        <div class="base-info info-block">
+          <div class="info-header">
+            <span class="title">鍩烘湰淇℃伅</span>
+          </div>
+          <div class="info-body">
+            <div class="left">
+              <el-form-item label="搴旂敤绠楁硶鍚嶇О" prop="sdk_name">
+                <el-input v-model="algForm.sdk_name" size="small"></el-input>
+              </el-form-item>
+              <el-form-item label="瀵瑰簲鍩虹绠楁硶" prop="sdk_type">
+                <el-select v-model="algForm.sdk_type" size="small">
+                  <el-option
+                    :label="item.sdk_type"
+                    :value="item.sdk_type"
+                    v-for="item in baseSdkList"
+                    :key="item.id"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="瀵瑰簲SO" prop="rule_so">
+                <el-input v-model="algForm.rule_so" size="small"></el-input>
+              </el-form-item>
+            </div>
+            <div class="right">
+              <el-form-item label="绠楁硶logo">
+                <el-upload
+                  class="avatar-uploader"
+                  drag
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :show-file-list="false"
+                  :http-request="uploadAlgLogo"
+                  :on-success="onSuccess"
+                  :before-upload="beforeUpload"
+                >
+                  <el-image
+                    v-if="algForm.iconBlob"
+                    :src="
+                      algForm.iconBlob.indexOf(',') > 0
+                        ? algForm.iconBlob
+                        : `data:image/png;base64,${algForm.iconBlob}`
+                    "
+                    style="width: 100%; height: 100%"
+                    fit="contain"
+                  ></el-image>
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <div class="el-upload__text">
+                    灏嗗浘鐗囨嫋鍒版澶�,鎴�
+                    <em>鐐瑰嚮涓婁紶</em>
+                  </div>
+                </el-upload>
+                <span class="second-icon-desc">鍏跺畠椋庢牸搴旂敤logo锛�</span>
+                <el-upload
+                  class="avatar-uploader"
+                  drag
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :show-file-list="false"
+                  :http-request="uploadAlgLogo2"
+                  :on-success="onSuccess"
+                  :before-upload="beforeUpload"
+                >
+                  <el-image
+                    v-if="algForm.iconBlob2"
+                    :src="
+                      algForm.iconBlob2.indexOf(',') > 0
+                        ? algForm.iconBlob2
+                        : `data:image/png;base64,${algForm.iconBlob2}`
+                    "
+                    style="width: 100%; height: 100%"
+                    fit="contain"
+                  ></el-image>
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <div class="el-upload__text">
+                    灏嗗浘鐗囨嫋鍒版澶�,鎴�
+                    <em>鐐瑰嚮涓婁紶</em>
+                  </div>
+                </el-upload>
+              </el-form-item>
+              <el-form-item label="鏄惁璺熻釜" prop="enTrack">
+                <el-switch v-model="algForm.enTrack" size="small"></el-switch>
+              </el-form-item>
+            </div>
+          </div>
+        </div>
+        <div class="base-info info-block">
+          <div class="info-header">
+            <span class="title">鍙傛暟璁剧疆</span>
+            <div class="toAdd" @click="toAddParam">
+              <i class="el-icon-circle-plus-outline"></i>
+              <span>娣诲姞</span>
+            </div>
+          </div>
+          <div class="info-body">
+            <el-table :data="algParams" border style="width: 100%">
+              <el-table-column
+                type="index"
+                width="50"
+                label="搴忓彿"
+                align="center"
+              ></el-table-column>
+              <el-table-column
+                prop="arg_type"
+                label="鐩爣/鏍囩"
+                width="110"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select v-model="scope.row.arg_type" size="mini">
+                      <el-option label="鐩爣" value="target"></el-option>
+                      <el-option label="鏍囩" value="label"></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="alias"
+                label="绠楁硶鍙傛暟"
+                width="140"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-input v-model="scope.row.alias" size="mini"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="name"
+                label="搴旂敤鍙傛暟鍚嶇О"
+                width="150"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-input v-model="scope.row.name" size="mini"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="operators"
+                label="绗﹀彿鍏崇郴"
+                width="200"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select
+                      v-model="scope.row.operators"
+                      size="mini"
+                      multiple
+                      collapse-tags
+                    >
+                      <el-option
+                        :label="item.name"
+                        :value="item"
+                        v-for="item in operatorList"
+                        :key="item.id"
+                      ></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="default_value"
+                label="鍙傛暟鍊�"
+                width="120"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-input
+                      v-model="scope.row.default_value"
+                      size="mini"
+                    ></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="unit"
+                label="鍗曚綅"
+                width="90"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-input v-model="scope.row.unit" size="mini"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="range"
+                label="鍙傛暟鍖洪棿"
+                width="100"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-input v-model="scope.row.range" size="mini"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="type"
+                label="鍊肩被鍨�"
+                width="110"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select v-model="scope.row.type" size="mini">
+                      <el-option label="鍊�" value="value"></el-option>
+                      <el-option label="琚�夐」" value="option"></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="isConfigurable"
+                label="鏄惁鍙厤缃�"
+                width="100"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select
+                      v-model="scope.row.config.isConfigurable"
+                      size="mini"
+                    >
+                      <el-option label="鏄�" :value="true"></el-option>
+                      <el-option label="鍚�" :value="false"></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="isMulti"
+                label="鏄惁澶氶��"
+                width="80"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select v-model="scope.row.config.isMulti" size="mini">
+                      <el-option label="鏄�" :value="true"></el-option>
+                      <el-option label="鍚�" :value="false"></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="isOptional"
+                label="鏄惁鍙�夐」"
+                width="100"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select
+                      v-model="scope.row.config.isOptional"
+                      size="mini"
+                    >
+                      <el-option label="鏄�" :value="true"></el-option>
+                      <el-option label="鍚�" :value="false"></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column
+                prop="isShow"
+                label="鏄惁鍙"
+                width="80"
+                align="center"
+              >
+                <template slot-scope="scope">
+                  <div>
+                    <el-select v-model="scope.row.config.isShow" size="mini">
+                      <el-option label="鏄�" :value="true"></el-option>
+                      <el-option label="鍚�" :value="false"></el-option>
+                    </el-select>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column label="鎿嶄綔" align="center">
+                <template slot-scope="scope">
+                  <div class="operation">
+                    <el-tooltip content="涓婄Щ涓�浣�">
+                      <i
+                        class="el-icon-top"
+                        @click="moveUp(scope.$index)"
+                        v-show="scope.$index != 0"
+                      ></i>
+                    </el-tooltip>
+                    <el-tooltip content="绉婚櫎璇ラ」閰嶇疆,椤讳繚瀛樿〃鍗曞悗鏂硅兘鐢熸晥">
+                      <i
+                        class="el-icon-remove-outline"
+                        @click="removeParam(scope.$index)"
+                      ></i>
+                    </el-tooltip>
+                  </div>
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+          <el-form-item size="large" class="form-end">
+            <el-button size="small" @click="backForm">鍙栨秷</el-button>
+            <el-button type="primary" size="small" @click="saveForm"
+              >淇濆瓨</el-button
+            >
+          </el-form-item>
+        </div>
+      </el-form>
+      <div class="base-info info-block">
+        <div class="info-header">
+          <span class="title">绠楁硶鐗堟湰</span>
+          <div class="toAdd" @click="toAddVersion">
+            <i class="el-icon-circle-plus-outline"></i>
+            <span>娣诲姞</span>
+          </div>
+        </div>
+        <div class="info-body">
+          <el-table :data="versionInfo" style="width: 100%" border>
+            <el-table-column
+              type="index"
+              width="50"
+              label="搴忓彿"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              prop="version"
+              width="150"
+              label="鐗堟湰鍙�"
+              align="center"
+            >
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && curEditIndex == scope.$index">
+                  <el-input v-model="editData.version" size="mini"></el-input>
+                </div>
+                <div v-else>
+                  <span>{{ scope.row.version }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="content"
+              width="500"
+              label="鐗堟湰鏇存柊鍐呭"
+              header-align="center"
+            >
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && curEditIndex == scope.$index">
+                  <el-input v-model="editData.content" size="mini"></el-input>
+                </div>
+                <div v-else>
+                  <span>{{ scope.row.content }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column width="290" label="鏇存柊鏃堕棿" align="center">
+              <template slot-scope="scope">
+                <div>{{ scope.row.update_time || scope.row.create_time }}</div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="updateUserName"
+              width="150"
+              label="鏇存柊浜�"
+              align="center"
+            ></el-table-column>
+            <el-table-column width="250" label="闄勪欢" align="center">
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && curEditIndex == scope.$index">
+                  <file-uploader
+                    single
+                    uploadPlaceholder="涓婁紶绠楁硶鏂囦欢"
+                    url="/data/api-f/file/upload"
+                    @complete="onFileUpload"
+                    @file-added="onFileAdded"
+                  />
+                </div>
+                <div v-else>{{ scope.row.component_name }}</div>
+              </template>
+            </el-table-column>
+            <el-table-column label="鎿嶄綔" align="center">
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && curEditIndex == scope.$index">
+                  <span class="cursor-pointer" @click="cancel(scope.row)"
+                    >鍙栨秷</span
+                  >
+                  <span
+                    class="cursor-pointer"
+                    @click="saveRowVersion(scope.row)"
+                    >淇濆瓨</span
+                  >
+                </div>
+                <div class="operation" v-else>
+                  <i
+                    class="el-icon-edit"
+                    @click="edit(scope.row, scope.$index)"
+                  ></i>
+                  <i
+                    class="el-icon-remove-outline"
+                    @click="remove(scope.row)"
+                  ></i>
+                </div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+// import {
+//   savePageAlg,
+//   findAllBaseAlg,
+//   savePageAlgVersion,
+//   delPageAlgVersion,
+//   showPageAlgDetail,
+// } from "@/api/algorithm";
+import { findDicByType } from "@/api/product";
+import { getFilePath } from "@/api/utils";
+import FileUploader from "@/components/subComponents/FileUpload/index";
+export default {
+  components: {
+    FileUploader,
+  },
+  props: ["action", "id"],
+  data() {
+    return {
+      copy_id: this.id,
+      loading: false,
+      algForm: {
+        sdk_name: "",
+        sdk_type: "", //鍩虹绠楁硶
+        iconBlob: "",
+        iconBlob2: "",
+        rule_so: "",
+        enTrack: true,
+      },
+      baseSdkList: [],
+      operatorList: [],
+      rules: {
+        sdk_name: [
+          { required: true, message: "璇疯緭鍏ョ畻娉曞悕绉�", trigger: "blur" },
+          { min: 1, max: 15, message: "闀垮害鍦�1鍒�15涓瓧绗�", trigger: "blur" },
+        ],
+        sdk_type: [
+          { required: true, message: "璇烽�夋嫨鍩虹绠楁硶", trigger: "change" },
+        ],
+        rule_so: [{ required: true, message: "璇疯緭鍏o", trigger: "blur" }],
+      },
+      algParams: [],
+      algParam: {
+        sort: 0,
+        arg_type: "target",
+        alias: "",
+        name: "",
+        operators: [],
+        range: "",
+        default_value: "",
+        unit: "",
+        type: "value",
+        config: {
+          isConfigurable: true,
+          isMulti: true,
+          isOptional: true,
+          isShow: true,
+        },
+      },
+      versionInfo: [],
+      versionParam: {
+        version: "",
+        content: "",
+        updateTime: "",
+        person: "",
+        component_name: "",
+        component_path: "",
+      },
+      editData: {},
+      curEditVersion: {},
+      isVersionEdit: false,
+      curEditIndex: 0,
+      curEditRow: {},
+    };
+  },
+  mounted() {
+    this.getAllBaseSDK();
+    this.getOperatorList();
+    if (this.action == "create") {
+      //this.id = ''
+      this.copy_id = "";
+    }
+    if (this.copy_id) {
+      this.getPageDetail();
+    }
+  },
+  methods: {
+    newVersion() {
+      return {
+        version: "",
+        content: "",
+        updateTime: "",
+        person: "",
+        component_name: "",
+        component_path: "",
+      };
+    },
+    backForm() {
+      //this.getPageDetail();
+      //this.$router.push('/layout/AppManage');
+      this.$router.go(-1);
+    },
+    getPageDetail() {
+      //鍥炴樉椤甸潰鍙傛暟
+      showPageAlgDetail({ id: this.copy_id }).then((res) => {
+        if (res.code == 200) {
+          this.algForm.enTrack = res.data.sdkInfo.enTrack;
+          this.algForm.iconBlob = res.data.sdkInfo.iconBlob;
+          this.algForm.iconBlob2 = res.data.sdkInfo.iconBlob2;
+          this.algForm.rule_so = res.data.sdkInfo.rule_so;
+          this.algForm.sdk_type = res.data.sdkInfo.sdk_type;
+          this.algForm.sdk_name = res.data.sdkInfo.sdk_name;
+          this.algParams = res.data.sdkInfo.argDef;
+          this.algParams.forEach((arg) => {
+            arg.operators = arg.operators.map((item) => {
+              return {
+                name: item.name,
+                value: item.operator,
+              };
+            });
+          });
+
+          this.versionInfo = res.data.versions;
+        }
+      });
+    },
+    getAllBaseSDK() {
+      findAllBaseAlg().then((res) => {
+        if (res.code == 200) {
+          this.baseSdkList = res.data.list;
+        }
+      });
+    },
+    getOperatorList() {
+      //this.operatorList
+      findDicByType({ type: "RULECOMPUTE" }).then((res) => {
+        if (res.code == 200) {
+          this.operatorList = res.data.dics;
+        }
+      });
+    },
+    toAddParam() {
+      let algTemp = JSON.parse(JSON.stringify(this.algParam));
+      algTemp.sort = this.algParams.length + 1;
+      this.algParams.push(algTemp);
+    },
+    toAddVersion() {
+      if (this.isVersionEdit) return;
+      //let versionTemp = JSON.parse(JSON.stringify(this.versionParam));
+      // let versionTemp = this.newVersion();
+      // this.versionInfo.push(versionTemp);
+      this.editData = this.newVersion();
+      this.versionInfo.push(this.editData);
+      this.isVersionEdit = true;
+      this.curEditIndex = this.versionInfo.length - 1;
+    },
+    beforeUpload() {},
+    uploadAlgLogo(params) {
+      let file = params.file;
+      let fileReader = new FileReader();
+      if (file) {
+        fileReader.readAsDataURL(file);
+      }
+      fileReader.onload = () => {
+        this.algForm.iconBlob = fileReader.result;
+      };
+    },
+    uploadAlgLogo2(params) {
+      let file = params.file;
+      let fileReader = new FileReader();
+      if (file) {
+        fileReader.readAsDataURL(file);
+      }
+      fileReader.onload = () => {
+        this.algForm.iconBlob2 = fileReader.result;
+      };
+    },
+    onSuccess() {},
+    moveUp(curIndex) {
+      let lastOne = JSON.parse(JSON.stringify(this.algParams[curIndex - 1]));
+      let curOne = JSON.parse(JSON.stringify(this.algParams[curIndex]));
+      //this.algParams.splice(curIndex,1,curIndex-1);
+      this.$set(this.algParams, curIndex, lastOne);
+      this.$set(this.algParams, curIndex - 1, curOne);
+      this.algParams[curIndex - 1].sort = curIndex;
+      this.algParams[curIndex].sort = curIndex + 1;
+    },
+    removeParam(index) {
+      // this.$notify({
+      //   type:'info',
+      //   message:'璇峰湪淇濆瓨鍚庢煡鐪嬫渶鏂板唴瀹�'
+      // });
+      this.algParams.splice(index, 1);
+    },
+    remove(row) {
+      this.$confirm("纭畾鍒犻櫎璇ラ」鍚�?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+        center: true,
+      })
+        .then(() => {
+          delPageAlgVersion(row.id).then((res) => {
+            if (res.code == 200) {
+              this.$message({
+                type: "success",
+                message: "鍒犻櫎鎴愬姛!",
+              });
+              this.getPageDetail();
+            }
+          });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+    cancel(row) {
+      this.isVersionEdit = false;
+      if (!row.id) {
+        this.versionInfo.splice(this.versionInfo.length - 1, 1);
+      }
+    },
+    // rowClick (row, column, ev) {
+    //   this.curEditRow = JSON.parse(JSON.stringify(row));
+    // },
+    saveForm() {
+      this.$refs["algForm"].validate((valid) => {
+        if (valid) {
+          //澶勭悊operators
+          this.algParams.forEach((param) => {
+            param.operators = param.operators.map((item) => {
+              return {
+                name: item.name,
+                operator: item.value,
+              };
+            });
+          });
+
+          let params = {
+            argDef: this.algParams,
+            enTrack: this.algForm.enTrack,
+            iconBlob: this.algForm.iconBlob,
+            iconBlob2: this.algForm.iconBlob2,
+            id: this.copy_id,
+            rule_so: this.algForm.rule_so,
+            sdk_name: this.algForm.sdk_name,
+            sdk_type: this.algForm.sdk_type,
+          };
+
+          let warning = "";
+
+          params.argDef.forEach((item) => {
+            if (
+              item.alias === "" ||
+              item.name === "" ||
+              item.operators.length === 0 ||
+              item.default_value === "" ||
+              item.unit === "" ||
+              item.range === ""
+            ) {
+              warning = "鍙傛暟淇℃伅涓嶅叏";
+            }
+          });
+
+          if (warning) {
+            this.$notify({
+              type: "warning",
+              message: "鍙傛暟淇℃伅涓嶅叏",
+            });
+            return;
+          }
+          this.loading = true;
+
+          savePageAlg(params)
+            .then((res) => {
+              this.$notify({
+                type: "success",
+                message: "淇濆瓨鎴愬姛!",
+                duration: 2500,
+                offset: 57,
+              });
+              //this.id = res.data.id;
+              this.copy_id = res.data.id;
+              this.getPageDetail();
+              this.loading = false;
+            })
+            .catch((e) => {
+              console.log(e);
+              if (e && e.status == 401) {
+                return;
+              }
+              if (e && e.data == "绠楁硶鍚嶇О涓嶅厑璁搁噸澶�") {
+                this.$notify({
+                  type: "error",
+                  message: "淇濆瓨澶辫触,绠楁硶鍚嶇О涓嶅厑璁搁噸澶�",
+                  duration: 2500,
+                  offset: 57,
+                });
+                this.loading = false;
+                return;
+              }
+              this.$notify({
+                type: "error",
+                message: "淇濆瓨澶辫触,璇风◢鍚庨噸璇�!",
+                duration: 2500,
+                offset: 57,
+              });
+              this.loading = false;
+            });
+        } else {
+          return false;
+        }
+      });
+    },
+    saveRowVersion(row) {
+      this.isVersionEdit = false;
+      let params = {
+        component_name: this.curEditRow.component_name,
+        component_path: this.curEditRow.component_path,
+        content: this.editData.content,
+        id: this.editData.id,
+        sdkId: this.copy_id,
+        create_by: this.editData.create_by,
+        create_time: this.editData.create_time,
+        update_by: this.editData.update_by,
+        update_time: this.editData.update_time,
+        version: this.editData.version,
+      };
+
+      savePageAlgVersion(params)
+        .then((res) => {
+          if (res.code == 200) {
+            this.$notify({
+              type: "success",
+              message: "淇濆瓨鎴愬姛!",
+              position: "bottom-right",
+              duration: 2500,
+            });
+            this.getPageDetail();
+          }
+        })
+        .catch((e) => {
+          this.$notify({
+            type: "error",
+            message: e.data,
+            position: "bottom-right",
+            duration: 2500,
+          });
+          this.getPageDetail();
+        });
+    },
+    edit(row, index) {
+      this.isVersionEdit = true;
+      this.curEditIndex = index;
+      this.editData = JSON.parse(JSON.stringify(row));
+    },
+    onFileUpload(params) {
+      this.curEditRow.component_name = params.filename;
+      getFilePath(params).then((res) => {
+        if (res.code == 200) {
+          this.curEditRow.component_path = res.data;
+        }
+      });
+    },
+    onFileAdded() {},
+  },
+};
+</script>
+<style lang="scss">
+.pageAlg {
+  height: 100%;
+  .el-switch.is-checked .el-switch__core {
+    border-color: #1a99ff;
+    background-color: #1a99ff;
+  }
+  .orderTop {
+    width: calc(100% - 60px);
+    height: 30px;
+    background: #fff;
+    padding: 15px 30px;
+    p {
+      font-family: "PingFangSC-Regular";
+      text-align: left;
+      font-size: 14px;
+      line-height: 30px;
+    }
+  }
+  .orderBody {
+    width: calc(100% - 40px);
+    //height: calc(100% - 100px);
+    padding: 20px;
+    background: #f0f2f5;
+  }
+}
+.info-block {
+  background: #fff;
+  padding: 20px;
+  .info-header {
+    border-bottom: 1px solid #eee;
+    display: flex;
+    padding: 10px 5px;
+    margin-bottom: 10px;
+    .title {
+      font-size: 15px;
+      font-weight: bold;
+      margin-right: 16px;
+    }
+  }
+  .info-body {
+    display: flex;
+    width: 100%;
+    margin-bottom: 20px;
+    .left,
+    .right {
+      width: 50%;
+      text-align: left;
+      .el-select {
+        width: 100%;
+      }
+      .el-upload {
+        width: 100px;
+        height: 100px;
+        line-height: 100px;
+      }
+    }
+    .el-table {
+      overflow: hidden;
+    }
+    .el-table th {
+      background: rgb(248, 248, 248);
+      color: rgb(34, 34, 34);
+    }
+    .operation {
+      font-size: 20px;
+      cursor: pointer;
+      .el-icon-top {
+        color: #409eff;
+        margin-right: 10px;
+      }
+      .el-icon-remove-outline {
+        color: red;
+      }
+      .el-icon-edit {
+        margin-right: 10px;
+      }
+    }
+  }
+  .form-end {
+    padding-top: 20px;
+  }
+}
+.toAdd {
+  font-size: 13px;
+  color: #1a99ff !important;
+  &:hover {
+    color: #45abfc !important;
+  }
+  &:focus {
+    color: #1789e5 !important;
+  }
+  cursor: pointer;
+  i {
+    font-size: 15px;
+    margin-right: 2px;
+  }
+}
+.avatar-uploader {
+  float: left;
+}
+.second-icon-desc {
+  float: left;
+  margin-left: 50px;
+}
+.avatar-uploader .el-upload {
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.avatar-uploader .el-upload-dragger {
+  width: 100px;
+  height: 100px;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+}
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+</style>
diff --git a/src/views/AppManage/AppEdit.vue b/src/views/AppManage/AppEdit.vue
new file mode 100644
index 0000000..0897adb
--- /dev/null
+++ b/src/views/AppManage/AppEdit.vue
@@ -0,0 +1,646 @@
+<template>
+  <div class="pageAlg right-main">
+    <div class="bread-crumb">
+      <span class="prev-title">
+        <router-link to="/layout/AppManage">搴旂敤鍒楄〃</router-link>
+      </span>
+      <span class="devide"></span>
+      <span class="cur-title"
+        >{{ appId == "create" ? "鍒涘缓" : "缂栬緫" }}搴旂敤</span
+      >
+    </div>
+    <div style="min-height: calc(100vh - 150px); background: #fff">
+      <el-form
+        :model="appForm"
+        ref="appForm"
+        :rules="rules"
+        label-width="120px"
+        v-loading="formLoading"
+      >
+        <div class="base-info info-block">
+          <div class="info-header">
+            <span class="title">鍩烘湰淇℃伅</span>
+          </div>
+          <div class="info-body">
+            <div class="left">
+              <el-form-item label="搴旂敤鍚嶇О" prop="name">
+                <el-input v-model="appForm.name" size="small"></el-input>
+              </el-form-item>
+              <el-form-item label="搴旂敤鍖呭悕" prop="package">
+                <el-input v-model="appForm.package" size="small"></el-input>
+              </el-form-item>
+              <el-form-item label="鍔犺浇鏂瑰紡" prop="type">
+                <el-select v-model="appForm.type" size="small">
+                  <el-option value="1" label="鍗曠嫭椤甸潰">鍗曠嫭椤甸潰</el-option>
+                  <el-option value="2" label="寮圭獥">寮圭獥</el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="搴旂敤璺緞" prop="url">
+                <el-input v-model="appForm.url" size="small"></el-input>
+              </el-form-item>
+              <el-form-item label="搴旂敤鏍囬" prop="title">
+                <el-input v-model="appForm.title" size="small"></el-input>
+              </el-form-item>
+              <el-form-item label="搴旂敤绫诲瀷" prop="isDefault">
+                <el-radio v-model="appForm.isDefault" :label="true"
+                  >榛樿搴旂敤</el-radio
+                >
+                <el-radio v-model="appForm.isDefault" :label="false"
+                  >鍙�夊簲鐢�</el-radio
+                >
+              </el-form-item>
+            </div>
+            <div class="right">
+              <el-form-item
+                label="搴旂敤logo"
+                prop="iconBlob"
+                style="margin-bottom: 16px"
+              >
+                <el-upload
+                  class="avatar-uploader"
+                  drag
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :show-file-list="false"
+                  :http-request="uploadAlgLogo"
+                  :on-success="onSuccess"
+                  :before-upload="beforeUpload"
+                >
+                  <el-image
+                    v-if="appForm.iconBlob"
+                    :src="
+                      appForm.iconBlob.indexOf(',') > 0
+                        ? appForm.iconBlob
+                        : `data:image/png;base64,${appForm.iconBlob}`
+                    "
+                    style="width: 100%; height: 100%"
+                    fit="contain"
+                  ></el-image>
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <div class="el-upload__text">
+                    灏嗗浘鐗囨嫋鍒版澶�,鎴�
+                    <em>鐐瑰嚮涓婁紶</em>
+                  </div>
+                </el-upload>
+                <span class="second-icon-desc">鍏跺畠椋庢牸搴旂敤logo锛�</span>
+                <el-upload
+                  class="avatar-uploader"
+                  drag
+                  action="https://jsonplaceholder.typicode.com/posts/"
+                  :show-file-list="false"
+                  :http-request="uploadAlgLogo2"
+                  :on-success="onSuccess"
+                  :before-upload="beforeUpload"
+                >
+                  <el-image
+                    v-if="appForm.iconBlob2"
+                    :src="
+                      appForm.iconBlob2.indexOf(',') > 0
+                        ? appForm.iconBlob2
+                        : `data:image/png;base64,${appForm.iconBlob2}`
+                    "
+                    style="width: 100%; height: 100%"
+                    fit="contain"
+                  ></el-image>
+                  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                  <div class="el-upload__text">
+                    灏嗗浘鐗囨嫋鍒版澶�,鎴�
+                    <em>鐐瑰嚮涓婁紶</em>
+                  </div>
+                </el-upload>
+              </el-form-item>
+              <el-form-item
+                label="榛樿瀹�"
+                prop="width"
+                v-if="appForm.type == '2'"
+              >
+                <el-input v-model.number="appForm.width" size="small">
+                  <template slot="append">px</template>
+                </el-input>
+              </el-form-item>
+              <el-form-item
+                label="榛樿楂�"
+                prop="height"
+                v-if="appForm.type == '2'"
+              >
+                <el-input v-model.number="appForm.height" size="small">
+                  <template slot="append">px</template>
+                </el-input>
+              </el-form-item>
+            </div>
+          </div>
+          <div class="form-end">
+            <el-button size="small" @click="goBack">鍙栨秷</el-button>
+            <el-button type="primary" size="small" @click="saveForm"
+              >淇濆瓨</el-button
+            >
+          </div>
+        </div>
+      </el-form>
+      <div class="base-info info-block">
+        <div class="info-header">
+          <span class="title">搴旂敤鐗堟湰</span>
+          <div class="toAdd" @click="toAddVersion">
+            <i class="el-icon-circle-plus-outline"></i>
+            <span>娣诲姞</span>
+          </div>
+        </div>
+        <div class="info-body">
+          <el-table :data="versionInfo" style="width: 100%" border>
+            <el-table-column
+              type="index"
+              width="50"
+              label="搴忓彿"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              prop="version_show"
+              width="260"
+              label="鐗堟湰鍙�"
+              align="center"
+            >
+              <template slot-scope="scope">
+                <div>
+                  <span>{{ scope.row.version_show }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="content"
+              width="500"
+              label="鐗堟湰鏇存柊鍐呭"
+              header-align="center"
+            >
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && scope.$index == curEditIndex">
+                  <el-input v-model="editData.content" size="mini"></el-input>
+                </div>
+                <div v-else>
+                  <span>{{ scope.row.content }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column
+              prop="updateTime"
+              width="290"
+              label="鏇存柊鏃堕棿"
+              align="center"
+            ></el-table-column>
+            <el-table-column
+              prop="updateUserName"
+              width="150"
+              label="鏇存柊浜�"
+              align="center"
+            ></el-table-column>
+            <el-table-column width="250" label="闄勪欢" align="center">
+              <template slot-scope="scope">
+                <div
+                  v-if="
+                    isVersionEdit &&
+                    scope.$index == curEditIndex &&
+                    !scope.row.id
+                  "
+                >
+                  <file-uploader
+                    single
+                    uploadPlaceholder="涓婁紶搴旂敤鏂囦欢"
+                    url="/data/api-f/file/upload"
+                    @complete="onFileUpload"
+                    @file-added="onFileAdded"
+                  />
+                </div>
+                <div v-else>{{ scope.row.component_name }}</div>
+              </template>
+            </el-table-column>
+            <el-table-column label="鎿嶄綔" align="center" width="100">
+              <template slot-scope="scope">
+                <div v-if="isVersionEdit && scope.$index == curEditIndex">
+                  <span class="cursor-pointer" @click="cancel(scope)"
+                    >鍙栨秷</span
+                  >
+                  <span
+                    class="cursor-pointer"
+                    @click="saveRowVersion(scope.row)"
+                    >淇濆瓨</span
+                  >
+                </div>
+                <div class="operation" v-else>
+                  <i class="el-icon-edit" @click="editAppVersion(scope)"></i>
+                  <i
+                    class="el-icon-remove-outline"
+                    @click="removeAppVersion(scope)"
+                  ></i>
+                </div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+// import {
+//   saveApp,
+//   showAppDetail,
+//   saveAppVersion,
+//   deleteAppVersion,
+// } from "@/api/app";
+import { getFilePath } from "@/api/utils";
+import FileUploader from "@/components/subComponents/FileUpload/index";
+export default {
+  components: {
+    FileUploader,
+  },
+  props: ["appId"],
+  data() {
+    return {
+      appForm: {
+        name: "",
+        package: "",
+        type: "",
+        url: "",
+        title: "",
+        iconBlob: "",
+        iconBlob2: "",
+        isDefault: false,
+      },
+      rules: {
+        name: [
+          { required: true, message: "璇疯緭鍏ュ簲鐢ㄥ悕绉�", trigger: "blur" },
+          { min: 1, max: 15, message: "闀垮害鍦�1鍒�15涓瓧绗�", trigger: "blur" },
+        ],
+        iconBlob: [
+          { required: true, message: "璇蜂笂浼犲簲鐢╨ogo", trigger: "blur" },
+        ],
+        package: [
+          { required: true, message: "璇疯緭鍏ュ簲鐢ㄥ寘鍚�", trigger: "blur" },
+          { min: 1, max: 50, message: "闀垮害鍦�1鍒�50涓瓧绗�", trigger: "blur" },
+        ],
+        type: [
+          { required: true, message: "璇烽�夋嫨搴旂敤鍔犺浇鏂瑰紡", trigger: "change" },
+        ],
+        title: [
+          { required: true, message: "璇疯緭鍏ュ簲鐢ㄦ爣棰�", trigger: "blur" },
+          { min: 1, max: 15, message: "闀垮害鍦�1鍒�15涓瓧绗�", trigger: "blur" },
+        ],
+        width: [
+          { required: true, message: "璇疯緭鍏ュ簲鐢ㄩ粯璁ゅ", trigger: "blur" },
+          {
+            type: "number",
+            message: "璇疯緭鍏�100鍒�1920涔嬮棿鐨勬暣鏁�",
+            trigger: "blur",
+          },
+          // { min: 100, message: '榛樿瀹戒笉鑳藉皬浜�100', trigger: 'blur' },
+          // { max: 1920, message: '榛樿瀹戒笉鑳藉ぇ浜�1920', trigger: 'blur' }
+        ],
+        height: [
+          { required: true, message: "璇疯緭鍏ュ簲鐢ㄩ粯璁ら珮", trigger: "blur" },
+          {
+            type: "number",
+            message: "璇疯緭鍏�100鍒�1200涔嬮棿鐨勬暣鏁�",
+            trigger: "blur",
+          },
+        ],
+      },
+      versionInfo: [],
+      editData: {},
+      isVersionEdit: false,
+      curEditIndex: 0,
+      curEditRow: {},
+      formLoading: false,
+      // lastComponent_name:'',
+      // lastComponent_path:''
+    };
+  },
+  mounted() {
+    if (this.appId != "create") {
+      this.showDetail();
+    }
+  },
+  methods: {
+    newAppVersion() {
+      return {
+        version: "",
+        content: "",
+        updateTime: "",
+        person: "",
+        component_name: "",
+        component_path: "",
+      };
+    },
+    toAddVersion() {
+      if (this.isVersionEdit) return;
+      this.editData = this.newAppVersion();
+      this.versionInfo.push(this.editData);
+      this.isVersionEdit = true;
+      this.curEditIndex = this.versionInfo.length - 1;
+    },
+    beforeUpload() {},
+    uploadAlgLogo(params) {
+      let file = params.file;
+      let fileReader = new FileReader();
+      if (file) {
+        fileReader.readAsDataURL(file);
+      }
+      fileReader.onload = () => {
+        this.appForm.iconBlob = fileReader.result.substring(
+          fileReader.result.indexOf(",") + 1
+        );
+      };
+    },
+    uploadAlgLogo2(params) {
+      let file = params.file;
+      let fileReader = new FileReader();
+      if (file) {
+        fileReader.readAsDataURL(file);
+      }
+      fileReader.onload = () => {
+        this.appForm.iconBlob2 = fileReader.result.substring(
+          fileReader.result.indexOf(",") + 1
+        );
+      };
+    },
+    onSuccess() {},
+    saveForm() {
+      this.$refs["appForm"].validate((valid) => {
+        if (valid) {
+          this.formLoading = true;
+          let params = {
+            iconBlob: this.appForm.iconBlob,
+            iconBlob2: this.appForm.iconBlob2,
+            id: this.appForm.id,
+            name: this.appForm.name,
+            package: this.appForm.package,
+            title: this.appForm.title,
+            type: this.appForm.type,
+            url: this.appForm.url,
+            width: this.appForm.width,
+            height: this.appForm.height,
+            isDefault: this.appForm.isDefault,
+          };
+          saveApp(params)
+            .then((res) => {
+              if (res.code == 200) {
+                this.$notify({
+                  type: "success",
+                  message: "淇濆瓨鎴愬姛!",
+                  duration: 2500,
+                  offset: 57,
+                });
+                this.formLoading = false;
+                this.appId = res.data.id;
+                this.showDetail();
+              }
+            })
+            .catch((e) => {
+              if (e && e.status == 401) {
+                return;
+              }
+              this.$notify({
+                type: "error",
+                message: "淇濆瓨澶辫触,璇风◢鍚庨噸璇�!",
+                duration: 2500,
+                offset: 57,
+              });
+              console.log(e);
+              this.formLoading = false;
+            });
+        } else {
+          return false;
+        }
+      });
+    },
+    showDetail() {
+      showAppDetail({ id: this.appId })
+        .then((res) => {
+          if (res.code == 200) {
+            this.appForm = res.data.appInfo;
+            this.versionInfo = res.data.versions;
+          }
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+    goBack() {
+      this.$router.go(-1);
+    },
+    removeAppVersion(scope) {
+      this.$confirm("纭畾鍒犻櫎璇ラ」鍚�?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+        center: true,
+      })
+        .then(() => {
+          deleteAppVersion({ id: scope.row.id }).then((res) => {
+            if (res.code == 200) {
+              this.$message({
+                type: "success",
+                message: "鍒犻櫎鎴愬姛!",
+              });
+              this.showDetail();
+            }
+          });
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+    // rowClick (row, column, ev) {
+    //   this.curEditRow = JSON.parse(JSON.stringify(row));
+    // },
+    saveRowVersion(row) {
+      let params = {
+        app_id: this.appId,
+        component_name: row.id
+          ? row.component_name
+          : this.curEditRow.component_name,
+        component_path: row.id
+          ? row.component_path
+          : this.curEditRow.component_path,
+        content: this.editData.content,
+        id: this.editData.id,
+        updateBy: this.editData.updateBy,
+        updateTime: this.editData.updateTime,
+        updateUserName: this.editData.updateUserName,
+        version: this.editData.version,
+      };
+
+      saveAppVersion(params)
+        .then((res) => {
+          if (res.code == 200) {
+            this.$notify({
+              type: "success",
+              message: "淇濆瓨鎴愬姛!",
+              position: "bottom-right",
+              duration: 2500,
+            });
+            this.isVersionEdit = false;
+            this.showDetail();
+          }
+        })
+        .catch((e) => {
+          if (e && e.status == 401) {
+            return;
+          }
+          this.$notify({
+            type: "error",
+            message: e.data,
+            position: "bottom-right",
+            duration: 2500,
+          });
+        });
+    },
+    cancel(scope) {
+      this.isVersionEdit = false;
+      if (!scope.row.id) {
+        this.versionInfo.splice(this.versionInfo.length - 1, 1);
+      }
+    },
+    editAppVersion(scope) {
+      this.isVersionEdit = true;
+      this.curEditIndex = scope.$index;
+      this.editData = JSON.parse(JSON.stringify(scope.row));
+    },
+    onFileUpload(params) {
+      this.curEditRow.component_name = params.filename;
+      getFilePath(params).then((res) => {
+        if (res.code == 200) {
+          this.curEditRow.component_path = res.data;
+        }
+      });
+    },
+    onFileAdded() {},
+  },
+};
+</script>
+<style lang="scss">
+.pageAlg {
+  height: 100%;
+
+  .orderTop {
+    width: calc(100% - 60px);
+    height: 30px;
+    background: #fff;
+    padding: 15px 30px;
+    p {
+      font-family: "PingFangSC-Regular";
+      text-align: left;
+      font-size: 14px;
+      line-height: 30px;
+    }
+  }
+  .orderBody {
+    width: calc(100% - 40px);
+    //height: calc(100% - 100px);
+    padding: 20px;
+    background: #f0f2f5;
+  }
+}
+.info-block {
+  background: #fff;
+  padding: 20px;
+  .info-header {
+    border-bottom: 1px solid #eee;
+    display: flex;
+    padding: 10px 5px;
+    margin-bottom: 10px;
+    .title {
+      font-size: 15px;
+      font-weight: bold;
+      margin-right: 16px;
+    }
+  }
+  .info-body {
+    display: flex;
+    width: 100%;
+    margin-bottom: 20px;
+    .left,
+    .right {
+      width: 50%;
+      text-align: left;
+      .el-input-group__append {
+        color: #999;
+      }
+      .el-select {
+        width: 100%;
+      }
+      .el-upload {
+        width: 100px;
+        height: 100px;
+        line-height: 100px;
+      }
+
+      .des {
+        position: absolute;
+        top: 110px;
+        left: 175px;
+        font-size: 12px;
+      }
+    }
+    .el-table {
+      overflow: hidden;
+    }
+    .el-table th {
+      background: rgb(248, 248, 248);
+      color: rgb(34, 34, 34);
+    }
+    .operation {
+      font-size: 20px;
+      cursor: pointer;
+      .el-icon-top {
+        color: #409eff;
+        margin-right: 10px;
+      }
+      .el-icon-remove-outline {
+        color: red;
+      }
+      .el-icon-edit {
+        margin-right: 10px;
+      }
+    }
+  }
+  .form-end {
+    padding-top: 20px;
+  }
+}
+.toAdd {
+  font-size: 13px;
+  color: #3d68e1;
+  cursor: pointer;
+  i {
+    font-size: 15px;
+    margin-right: 2px;
+  }
+}
+.avatar-uploader {
+  float: left;
+}
+.second-icon-desc {
+  float: left;
+  margin-left: 50px;
+}
+.avatar-uploader .el-upload {
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+.avatar-uploader .el-upload-dragger {
+  width: 100px;
+  height: 100px;
+}
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+}
+.avatar {
+  width: 178px;
+  height: 178px;
+  display: block;
+}
+</style>
diff --git a/src/views/AppManage/AppManage.vue b/src/views/AppManage/AppManage.vue
new file mode 100644
index 0000000..f0f0af7
--- /dev/null
+++ b/src/views/AppManage/AppManage.vue
@@ -0,0 +1,170 @@
+<template>
+  <div class="right-main">
+    <div class="top-title">
+      <p>搴旂敤鍒楄〃</p>
+    </div>
+
+    <div class="control-bar">
+      <div class="line-one">
+        <div class="screening">
+          <label>搴旂敤鍚嶇О</label>
+          <el-input v-model="inputText" placeholder="璇疯緭鍏�" prefix-icon="el-icon-search" size="small"></el-input>
+        </div>
+        <div class="screening">
+          <el-button plain class="btn-search" type="primary" size="small" @click="renderAppList(1)">鎼滅储</el-button>
+          <el-button class="btn-reset" @click="clearSearch" size="small">閲嶇疆</el-button>
+        </div>
+      </div>
+      <div class="right-fixed">
+        <el-button class="cursor-pointer" type="primary" @click="addApp" size="small">鍒涘缓搴旂敤</el-button>
+      </div>
+    </div>
+    <div class="table-area" ref="container">
+      <el-table
+        tooltip-effect="dark"
+        :data="dataList"
+        :fit="true"
+        :default-sort="{ prop: 'createTime', order: 'descending' }"
+      >
+        <!-- <el-table-column type="selection" width="30"></el-table-column> -->
+        <el-table-column label="搴忓彿" width="68">
+          <template slot-scope="scope">{{ scope.$index + 1 + (page - 1) * size }}</template>
+        </el-table-column>
+        <el-table-column prop="id" label="搴旂敤缂栧彿" sortable width="220"></el-table-column>
+        <el-table-column prop="isDefault" label="搴旂敤绫诲瀷" width="150">
+          <template slot-scope="scope">
+            <div>{{ scope.row.isDefault ? "榛樿搴旂敤" : "鍙�夊簲鐢�" }}</div>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" label="搴旂敤鍚嶇О" sortable min-width="200"></el-table-column>
+        <el-table-column prop="version" label="鏈�鏂扮増鏈彿" width="150" sortable></el-table-column>
+        <el-table-column
+          prop="updateTime"
+          label="鏈�鍚庢洿鏂版椂闂�"
+          width="240"
+          show-overflow-tooltip
+          sortable
+        ></el-table-column>
+        <el-table-column prop="updateUserName" label="鏇存柊浜�" width="130" sortable></el-table-column>
+        <el-table-column label="鎿嶄綔" width="120">
+          <template slot-scope="scope">
+            <span class="cursor-pointer" @click="editRow(scope.row.id)">缂栬緫</span>
+            <span class="cursor-pointer" @click="deleteRow(scope.row.id)">鍒犻櫎</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div>
+        <el-pagination
+          @current-change="refrash"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-size="size"
+          :page-sizes="[5, 10, 15, 20, 25]"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+        ></el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+// import { getAppList, deleteApp } from "@/api/app"
+export default {
+  data() {
+    return {
+      inputText: "",
+      page: 1,
+      size: 10,
+      total: 0,
+      dataList: [],
+      tableHeight: window.innerHeight - 400,
+      tableLoading: false
+    }
+  },
+  mounted() {
+    this.renderAppList()
+  },
+  methods: {
+    renderAppList(v) {
+      this.tableLoading = true
+      let params = {
+        inputText: this.inputText,
+        page: v === 1 ? 1 : this.page,
+        size: this.size
+      }
+      // getAppList(params)
+      //   .then((res) => {
+      //     if (res.code) {
+      //       this.dataList = res.data.list
+      //       this.total = res.data.total
+      //       this.tableLoading = false
+      //       if (res.data.total <= this.size) {
+      //         this.page = 1
+      //       }
+      //     }
+      //   })
+      //   .catch((e) => {
+      //     console.log(e)
+      //     this.tableLoading = false
+      //     if (e && e.status == 401) {
+      //       return
+      //     }
+      //     this.$notify({
+      //       type: "error",
+      //       message: "鏁版嵁鑾峰彇澶辫触,璇风◢鍚庨噸璇�!",
+      //       duration: 2500,
+      //       offset: 57
+      //     })
+      //   })
+    },
+    refrash(page) {
+      this.page = page
+      this.renderAppList()
+    },
+    clearSearch() {
+      this.inputText = ""
+      this.renderAppList()
+    },
+    handleSizeChange(size) {
+      this.size = size
+      this.renderAppList()
+    },
+    addApp() {
+      this.$router.push({ name: "appEdit", params: { appId: "create" } })
+    },
+    editRow(id) {
+      this.$router.push({ name: "appEdit", params: { appId: id } })
+    },
+    deleteRow(id) {
+      this.$confirm("纭畾鍒犻櫎璇ュ簲鐢ㄥ悧?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning",
+        center: true
+      })
+        .then(() => {
+          // deleteApp({ id }).then((res) => {
+          //   if (res.code == 200) {
+          //     this.$message({
+          //       type: "success",
+          //       message: "鍒犻櫎鎴愬姛!"
+          //     })
+          //     this.renderAppList()
+          //   }
+          // })
+        })
+        .catch((e) => {
+          console.log(e)
+        })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+// .el-message-box__status.el-icon-warning {
+//     left: 75px;
+//     font-size: 20px !important;
+// }
+</style>

--
Gitblit v1.8.0