diff --git a/src/assets/imgs/ic_newdata.png b/src/assets/imgs/ic_newdata.png
new file mode 100644
index 0000000000000000000000000000000000000000..147b4361f7787afb25ecbf007d1ef1e78af72e84
Binary files /dev/null and b/src/assets/imgs/ic_newdata.png differ
diff --git a/src/assets/imgs/ic_olddata.png b/src/assets/imgs/ic_olddata.png
new file mode 100644
index 0000000000000000000000000000000000000000..cfd5c72e2350189ddda4c0ef41ba61a88890df66
Binary files /dev/null and b/src/assets/imgs/ic_olddata.png differ
diff --git a/src/components/dialog-action.vue b/src/components/dialog-action.vue
index 648604911ede69a277c30b87c8e76478fcedc74a..f903f86a5ed64c4e7790fe051be1a35c278a8a6d 100644
--- a/src/components/dialog-action.vue
+++ b/src/components/dialog-action.vue
@@ -4,7 +4,7 @@
       :visible.sync="show"
       width="400px"
       top="25vh"
-      class="user-dialog"
+      :class="{'user-dialog':true,'out':confirmOptions.position}"
     >
       <span slot="title">
         <b class="iconLeft"></b>
@@ -85,6 +85,9 @@ export default {
 .el-dialog__body {
   padding: 49px 20px !important;
 }
+.out .el-dialog__body{
+  text-align: left;
+}
 </style>
 <style scoped>
 .group-dialog.el-dialog__wrapper {
diff --git a/src/components/infoList.vue b/src/components/infoList.vue
index 59412b32f1995da7014ecf41fa92bc832c5f92fa..e943ea626bd9366e75ae2a5a6f5fe152de681168 100644
--- a/src/components/infoList.vue
+++ b/src/components/infoList.vue
@@ -1,72 +1,81 @@
 <template>
   <div class="outlist">
-      <div v-for="(item,index) in list_arr" :key="index+1100" class="list">
-          <p :class="item.prop&&item.prop=='title'?'service_title':''"><span class="line" v-if="item.prop&&item.prop=='title'"></span> {{item.title}}</p>
-          <p v-if="!(item.prop&&item.prop=='title')">{{item.info}}  <span v-if="item.type&&item.type=='down'" class="filebtn">下载文件</span> </p>
-          <slot v-if="item.type&&item.type=='solt'" :name="item.solt_name"></slot>
-      </div>
+    <div v-for="(item, index) in list_arr" :key="index + 1100" class="list">
+      <p :class="item.prop && item.prop == 'title' ? 'service_title' : ''">
+        <span class="line" v-if="item.prop && item.prop == 'title'"></span>
+        {{ item.title }}
+      </p>
+      <p v-if="!(item.prop && item.prop == 'title')">
+        <span v-html="item.info" style="white-space:pre-wrap;"></span>
+        <span v-if="item.type && item.type == 'down'" class="filebtn"
+          >下载文件</span
+        >
+      </p>
+      <slot
+        v-if="item.type && item.type == 'solt'"
+        :name="item.solt_name"
+      ></slot>
+    </div>
   </div>
 </template>
 <script>
 export default {
   data() {
-    return {
-
-    }
+    return {};
+  },
+  props: ["list_arr"],
+  mounted() {
+    console.log(this.$solts);
   },
-  props:['list_arr'],
-  mounted(){
-      console.log(this.$solts);
-  }
 };
 </script>
 
 <style scoped>
-.list p{
-    line-height: 32px;
-    color: #8890a7;
+.list p {
+  line-height: 32px;
+  color: #8890a7;
 }
-.list{
-    margin-bottom: 20px;
+.list {
+  margin-bottom: 20px;
 }
-.list p:nth-of-type(2){
-    color: #242c43;
+.list p:nth-of-type(2) {
+  color: #242c43;
 }
-.outlist .list:nth-last-of-type(1){
-    margin: 0;
+.outlist .list:nth-last-of-type(1) {
+  margin: 0;
 }
-.service_title{
-    font-size: 16px;
-    font-weight: bold;
-    color: #58617a;
-    text-align: left;
-    height: 40px;
-    line-height: 40px;
-    margin-top: -10px;
-    margin-bottom: 20px;
-    margin-left: -10px;
+.service_title {
+  font-size: 16px;
+  font-weight: bold;
+  color: #58617a;
+  text-align: left;
+  height: 40px;
+  line-height: 40px;
+  margin-top: -10px;
+  margin-bottom: 20px;
+  margin-left: -10px;
 }
-.service_title span{
-    display: inline-block;
-    width: 4px;
-    height: 16px;
-    background-color: #515fe7;
-    border-radius: 2px;
-    float: left;
-    margin-top: 9px;
-    margin-right: 15px;
+.service_title span {
+  display: inline-block;
+  width: 4px;
+  height: 16px;
+  background-color: #515fe7;
+  border-radius: 2px;
+  float: left;
+  margin-top: 9px;
+  margin-right: 15px;
 }
-.filebtn{
-    width: 76px;
-    height: 32px;
-    line-height: 32px;
-    text-align: center;
-    color: #e6ebfe;
-	background-color: #515fe7;
-    border-radius: 8px;
-    display: inline-block;
-    font-size: 14px;
-    margin-left: 20px;
-    cursor: pointer;
+.filebtn {
+  width: 76px;
+  height: 32px;
+  line-height: 32px;
+  text-align: center;
+  color: #e6ebfe;
+  background-color: #515fe7;
+  border-radius: 8px;
+  display: inline-block;
+  font-size: 14px;
+  margin-left: 20px;
+  cursor: pointer;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/service-header.vue b/src/components/service-header.vue
index 5395adb21954c11b486681606f869b785396b78e..e7dd52ed315db643185571fa6ef5f6e15dae0942 100644
--- a/src/components/service-header.vue
+++ b/src/components/service-header.vue
@@ -1,105 +1,170 @@
 <template>
-    <div class="info_logo">
-            <div class="logo"></div>
-            <div class="info">
-                <p class="info_title"><span>{{data.name}}</span> <span class="info_fix" v-if="data.fixed">我要修改</span></p>
-                <div class="info_detail">
-                    <p>
-                        <label v-for="(item,index) in data.first" :key="index+2000">{{item.name}}: <span :style="item.color?{color:item.color}:{}">{{item.text}}</span> </label>
-                    </p>
-                    <p>
-                        <label v-for="(item,index) in data.second" :key="index+2500">{{item.name}}: 
-                            <a v-if="item.name.indexOf('地址')!==-1" style="color:#515fe7;text-decoration: none;" target="_blank"  :href="item.text">{{item.text}}</a>
-                            <span v-else>{{item.text}}</span> 
-                        </label>
-                    </p>
-                </div>
-            </div>
-          </div>
+  <div class="info_logo">
+    <div class="logo"></div>
+    <div class="info">
+      <p class="info_title">
+        <span>{{ data.name }}</span>
+        <span class="bs" v-if="data.yydetail" @click="subevent(0)">一键部署</span>
+        <span class="info_fix" v-if="data.yydetail" @click="subevent(1)">我要编辑</span>
+        <span class="right gap" v-if="data.yydetail">|</span>
+        <span class="right underline" v-if="data.yydetail" @click="subevent(2)" title="申请下线至开发者应用">申请下线</span>
+        <span class="right undersell" v-if="data.yydetail" @click="subevent(3)">申请下架</span>
+        <span class="info_fix" v-if="data.fixed">我要修改</span>
+      </p>
+      <div class="info_detail">
+        <p>
+          <label v-for="(item, index) in data.first" :key="index + 2000"
+            >{{ item.name }}:
+            <span :style="item.color ? { color: item.color } : {}">{{
+              item.text
+            }}</span>
+          </label>
+        </p>
+        <p>
+          <label v-for="(item, index) in data.second" :key="index + 2500"
+            >{{ item.name }}:
+            <a
+              v-if="item.name.indexOf('地址') !== -1"
+              style="color:#515fe7;text-decoration: none;"
+              target="_blank"
+              :href="item.text"
+              >{{ item.text }}</a
+            >
+            <span v-else>{{ item.text }}</span>
+          </label>
+        </p>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
 export default {
-    props:['data'],
-    components: {
-
-    },
-    data() {
-        return {
-
-        };
-    },
-    watch: {
-
-    },
-    computed: {
-
-    },
-    created() {
-
-    },
-    mounted() {
-
-    },
-    methods: {
-
-    },
+  props: ["data"],
+  components: {},
+  data() {
+    return {};
+  },
+  watch: {},
+  computed: {},
+  created() {},
+  mounted() {},
+  methods: {
+      subevent(val){
+          if(val == 0){
+              this.$emit('deploy')
+          }else if(val == 1){
+              this.$emit('editapp')
+          }else if(val == 2){
+              this.$emit('unline',0)
+          }else if(val == 3){
+              this.$emit('unsell',1)
+          }
+      }
+  },
 };
 </script>
 
 <style scoped>
-.info_logo{
-    overflow: hidden;
-    width: 100%;
-    margin-bottom: 15px;
+.info_logo {
+  overflow: hidden;
+  width: 100%;
+  margin-bottom: 15px;
 }
-.logo{
-    float: left;
-    width: 144px;
-	height: 144px;
-    background-color: #0f6ac7;
-    margin-right: 13px;
+.logo {
+  float: left;
+  width: 144px;
+  height: 144px;
+  background-color: #0f6ac7;
+  margin-right: 13px;
 }
-.info{
-    float: left;
-    width: calc(100% - 157px);
+.info {
+  float: left;
+  width: calc(100% - 157px);
 }
-.info_title{
-    font-size: 18px;
-	font-weight: bold;
-	color: #0d1847;
-    padding-left: 10px;
-    margin-bottom: 26px;
+.info_title {
+  font-size: 18px;
+  font-weight: bold;
+  color: #0d1847;
+  padding-left: 10px;
+  margin-bottom: 26px;
 }
-.info_fix{
-    display: inline-block;
+.info_fix {
+  display: inline-block;
+  width: 76px;
+  height: 32px;
+  background-color: #515fe7;
+  border-radius: 8px;
+  font-size: 14px;
+  font-weight: normal;
+  color: #e6ebfe;
+  line-height: 32px;
+  text-align: center;
+  cursor: pointer;
+  float: right;
+}
+.bs{
+  display: inline-block;
+  width: 76px;
+  height: 32px;
+  box-sizing: border-box;
+  line-height: 28px;
+  font-size: 14px;
+  cursor: pointer;
+  text-align: center;
+  font-weight: 400;
+  background-color: #d0d5e7;
+  border-radius: 8px;
+  border: solid 2px #a5afd6;
+  color: #0f2683;
+}
+.gap{
+    color: #b4c0f5;
+    margin: 0 10px;
+    line-height: 30px;
+}
+.underline{
     width: 76px;
 	height: 32px;
-	background-color: #515fe7;
+	background-color: #f6f7fb;
 	border-radius: 8px;
     font-size: 14px;
 	font-weight: normal;
-	color: #e6ebfe;
+	color: #0f2683;
     line-height: 32px;
-    text-align: center;
     cursor: pointer;
-    float: right;
+    text-align: center;
+    margin-left: 10px;
 }
-.info_detail{
-    width: 100%;
-	height: 96px;
-	background-color: #f6f7fb;
+.undersell{
+    width: 76px;
+	height: 32px;
+	background-color: #0f2683;
 	border-radius: 8px;
-    line-height: 40px;
-    padding: 8px 20px;
-    
+    font-size: 14px;
+	font-weight: normal;
+    color: #f8f9fd;
+    line-height: 32px;
+    cursor: pointer;
+    text-align: center;
 }
-.info_detail p{
-    color: #8890a7;
+.info_detail {
+  width: 100%;
+  height: 96px;
+  background-color: #f6f7fb;
+  border-radius: 8px;
+  line-height: 40px;
+  padding: 8px 20px;
 }
-.info_detail span{
-    color: #242c43;
-    font-weight: 600;
-    margin-right: 48px;
+.info_detail p {
+  color: #8890a7;
+}
+.info_detail span {
+  color: #242c43;
+  font-weight: 600;
+  margin-right: 48px;
+}
+.right{
+    float: right;
 }
 </style>
diff --git a/src/pages/app_detail.vue b/src/pages/app_detail.vue
new file mode 100644
index 0000000000000000000000000000000000000000..99b159bc8f6272e18428b1d3e47254c3c872d667
--- /dev/null
+++ b/src/pages/app_detail.vue
@@ -0,0 +1,424 @@
+<template>
+  <div class="detail_contain">
+    <p class="now_page_title">我的应用 / 应用仓库 / <span>应用详情</span></p>
+    <div class="info_contain">
+      <service-header
+        :data="service_header_arr"
+        @deploy="deploy"
+        @editapp="editapp"
+        @unline="unline"
+        @unsell="unsell"
+      ></service-header>
+      <div class="type_box">
+        <div class="type_title">
+          <div
+            v-for="(item, index) in service_arr[now_user]"
+            :key="index + 1000"
+            class="type_select"
+            @click="now_service = index"
+            :style="
+              now_service == index ? { borderBottom: '4px solid #f5ab4c' } : {}
+            "
+          >
+            {{ item }}
+          </div>
+        </div>
+        <div class="type_box_select">
+          <info-list
+            :list_arr="list_arr"
+            v-if="now_service == 0"
+          >
+            <div class="appcode" v-html="appcode" slot="app_code"></div>
+          </info-list>
+          
+          <div v-if="now_service == 1&&now_user == 0">
+              <p style="color:#8890a7;">镜像列表：</p>
+            <table-um
+                :headers="header_arr"
+                url="imagearr"
+                @actiondelete="actiondelete"
+                ></table-um>
+                <p>
+                    <span class="addimage" @click="addImage">新增镜像</span>
+                </p>
+                <div v-if="addImageFlag">
+                    <el-form ref="form" :rules="rules" :model="form" label-width="0px">
+                        <el-form-item prop="name">
+                            <p class="formname">镜像名称：</p>
+                            <el-input v-model="form.name"></el-input>
+                        </el-form-item>
+                        <el-form-item prop="taps">
+                            <p class="formname">镜像标签：</p>
+                            <el-input v-model="form.taps"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <p class="formname">上传镜像包：</p>
+                            <upload-file :multiple="false" :max="1" :drag="true" :list="imgList"  @getNewList="getNewList"></upload-file>
+                        </el-form-item>
+                    </el-form>
+                </div>
+                <div class="savebtn" v-if="addImageFlag">
+                    <el-button>保存</el-button>
+                    <el-button>取消</el-button>
+                </div>
+          </div>
+
+          <div v-if="now_service == 2&&now_user == 0">
+              <p style="color:#8890a7;">压缩包：</p>
+              <p><img src="../assets/imgs/ic_olddata.png" alt="">{{oldpag_name}} <span class="download">下载原压缩包</span> </p>
+              <p style="color:#8890a7;margin:20px 0;">上传新的压缩包：</p>
+              <div class="uploadtips">
+                  <p style="margin-left:-11px;"><i class="el-icon-warning-outline"></i>压缩包上传提示：</p>
+                  <p>1.必须包含以下文件：Chart.yaml，README.md，step.yaml，values.yaml，logo.png；</p>
+                  <p>2.上述文件必须按照上述名称进行命名；</p>
+                  <p>3.请将文件夹压缩为“.zip”、“.tgz”、“.tar.gz”格式，如：名称为redis-ha的文件夹压缩为redis-ha.zip。</p>
+              </div>
+                <upload-file :multiple="false" :max="1" :drag="true" :list="imgList1"  @getNewList="getNewList1"></upload-file>
+                <div class="savebtn">
+                    <el-button>保存</el-button>
+                    <el-button>取消</el-button>
+                </div>
+          </div>
+
+          <div v-if="(now_service == 3&&now_user == 0)||(now_service == 1&&now_user !== 0)">
+              <service-tab-comments url="sjfw"></service-tab-comments>
+          </div>
+          
+        </div>
+      </div>
+    </div>
+    <dialog-action
+      ref="myConfirm"
+      :confirmOptions="tipsOptions"
+    ></dialog-action>
+  </div>
+</template>
+
+<script>
+import infoList from "../components/infoList";
+import tableUm from "../components/table-um";
+import serviceHeader from "../components/service-header";
+import dialogAction from "@/components/dialog-action";
+import uploadFile from '@/components/upload_file'
+import serviceTabComments from '@/components/service-tab-comments'
+import { getRole } from "../utils/common";
+export default {
+  components: {
+    infoList,
+    tableUm,
+    serviceHeader,
+    dialogAction,
+    uploadFile,
+    serviceTabComments,
+  },
+  data() {
+    return {
+      now_user: 0, //0：普通用户，1：组织管理员，2：超级管理员
+      buy_style: 0,
+      oldpag_name:'镜像文件002.rar',
+      imgList: [],
+      imgList1: [],
+      form:{
+          name: '',
+          fileList:'',
+          taps:''
+      },
+      fileList:'',
+      rules:{
+          name:[
+              {required: true, message: '请输入镜像名称', trigger: 'blur'}
+          ],
+          taps:[
+              {required: true, message: '请输入镜像标签', trigger: 'blur'}
+          ],
+      },
+      tipsOptions: {
+        title:'',
+        message:"",
+        btnSubmitText: "",
+        btnCancelText: "",
+        position: "",
+      },
+      service_arr: [
+        ["基本信息", "镜像文件管理", "部署文件管理", "评分及评论"],
+        ["基本信息", "评分及评论"],
+        ["基本信息", "评分及评论"],
+      ],
+      service_header_arr: {
+        name: "",
+        first: [],
+        second: [],
+        yydetail: true,
+      },
+      now_service: 0,
+      header_arr: [
+        {
+          prop: "jxmc",
+          label: "镜像名称",
+          minWidth: "33.33%",
+          align: "center",
+        },
+        {
+          prop: "bbh",
+          label: "版本号",
+          minWidth: "33.33%",
+          align: "center",
+        },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          minWidth: "33.33%",
+          btnList: [
+            {
+              type: "actiondelete",
+              label: "删除",
+            },
+          ],
+        },
+      ],
+      
+      list_arr: [
+        {
+          title: "应用简介：",
+          info: "",
+        },
+        {
+          title: "功能简介：",
+          info: "",
+        },
+        {
+          title: "应用场景：",
+          info: "",
+        },
+        {
+          title: "应用参数：",
+          info: "",
+          type: "solt",
+          solt_name: "app_code",
+        },
+      ],
+      appcode: "",
+      addImageFlag:false
+    };
+  },
+  watch: {
+
+  },
+  created() {
+    this.now_user = this.$store.state.role;
+    getRole().then((data) => {
+      this.now_user = data;
+      this.$store.commit("rolefun", data);
+      this.getServiceInfo();
+      this.getServiceBaseInfo();
+    });
+  },
+  mounted() {},
+  methods: {
+      getNewList(val) {
+        console.log(val);
+        this.form.fileList = ""
+        this.form.fileList = url.map((v,k)=>{
+          return v.url
+        }).join(';')
+        console.log(this.form.fileList)
+      },
+      getNewList1(val) {
+        console.log(val);
+        this.fileList = ""
+        this.fileList = url.map((v,k)=>{
+          return v.url
+        }).join(';')
+        console.log(this.fileList)
+      },
+    addImage(){
+        this.addImageFlag = true
+    },
+    actiondelete(){
+        this.tipsOptions= {
+            title:'',
+            message:"",
+            btnSubmitText: "",
+            btnCancelText: "",
+            position: "",
+        }
+        this.tipsOptions.message="是否删除该数据"
+        this.tipsOptions.confirmSubmit = () => {
+            console.log("deleteItem - ");
+            this.$refs.myConfirm.hideModel();
+        };
+        this.$refs.myConfirm.showModel();
+    },
+    deploy(){
+        console.log('0000');
+    },
+    editapp(){
+        console.log('11111');
+    },
+    unline(val){
+        console.log(val);
+        this.tipsOptions= {
+            title:'',
+            message:"",
+            btnSubmitText: "",
+            btnCancelText: "",
+            position: "",
+        }
+        this.tipsOptions.message="该操作会将该应用从应用商店的平台应用区域下线至开发者应用区域，下线前需向超级管理员发送通知，超级管理员通过后此应用将下线至开发者应用区域。"
+        this.tipsOptions.btnSubmitText="发送通知"
+        this.tipsOptions.position="left"
+        this.tipsOptions.confirmSubmit = () => {
+            console.log("deleteItem - ");
+            this.$refs.myConfirm.hideModel();
+        };
+        this.$refs.myConfirm.showModel();
+    },
+    unsell(val){
+        console.log(val);
+        this.tipsOptions= {
+            title:'',
+            message:"",
+            btnSubmitText: "",
+            btnCancelText: "",
+            position: "",
+        }
+        this.tipsOptions.message="申请下架应用需要向组织管理员发送通知，组织管理员通过下架请求后该应用将从应用商店下架。"
+        this.tipsOptions.btnSubmitText="发送通知"
+        this.tipsOptions.confirmSubmit = () => {
+            console.log("deleteItem - ");
+            this.$refs.myConfirm.hideModel();
+        };
+        this.$refs.myConfirm.showModel();
+    },
+    getServiceInfo() {
+      this.$http
+        .get("/static/appdetail.json")
+        .then((response) => {
+          let data = response.data.data;
+          this.$set(this.service_header_arr, "name", data.appInfo.name);
+          this.$set(this.service_header_arr, "first", data.appInfo.first);
+          this.$set(this.service_header_arr, "second", data.appInfo.second);
+        })
+        .catch(function(response) {});
+    },
+    
+    getServiceBaseInfo() {
+      this.$http
+        .get("/static/appdetail.json")
+        .then((response) => {
+          let data = response.data.data;
+          this.$set(this.list_arr[0], "info", data.appbaseinfo.intorduce);
+          this.$set(this.list_arr[1], "info", data.appbaseinfo.action);
+          this.$set(this.list_arr[2], "info", data.appbaseinfo.use);
+          this.appcode = data.appbaseinfo.appcode;
+        })
+        .catch(function(response) {});
+    },
+    
+  },
+};
+</script>
+
+<style>
+.savebtn .el-button {
+  float: right;
+  margin-left: 20px;
+  letter-spacing: 2px;
+}
+.savebtn .el-button:nth-of-type(1) {
+  background-color: #0f2683;
+  color: #f8f9fd;
+}
+.savebtn .el-button:nth-of-type(2) {
+  background-color: #c3caf8;
+  color: #0f2683;
+}
+</style>
+<style scoped>
+.detail_contain {
+  width: 100%;
+  padding: 0 20px;
+  height: calc(100% - 55px);
+}
+.info_contain {
+  padding: 25px 20px;
+  background-color: #fff;
+  width: 100%;
+  box-shadow: 0px 3px 6px 0px #f4f7fc;
+  border-radius: 12px;
+  min-height: calc(100% - 20px);
+  margin-bottom: 20px;
+}
+.now_page_title {
+  margin: 15px 0;
+  color: #898d9e;
+}
+.now_page_title span {
+  color: #242c43;
+}
+.type_box {
+  width: 100%;
+}
+.type_title {
+  width: 100%;
+  height: 65px;
+  line-height: 65px;
+  border-bottom: 2px solid #f4f7fc;
+}
+.type_select {
+  float: left;
+  width: auto;
+  margin-right: 40px;
+  height: 65px;
+  cursor: pointer;
+}
+.type_box_select {
+  padding: 30px 10px 10px 10px;
+  width: 100%;
+}
+
+.savebtn {
+  margin-top: 50px;
+  overflow: hidden;
+}
+.appcode {
+  white-space: pre-wrap;
+  width: 100%;
+  background-color: #f8f9fd;
+  border-radius: 8px;
+  padding: 24px;
+  color: #58617a;
+}
+.addimage,.download{
+    display: inline-block;
+    color: #f8f9fd;
+    font-size: 16px;
+    width: 124px;
+    height: 44px;
+    line-height: 44px;
+    text-align: center;
+	background-color: #0f2683;
+    border-radius: 8px;
+    margin-top: 20px;
+    cursor: pointer;
+}
+.download{
+    background-color: #495feb;
+    margin-left: 10px;
+}
+.formname{
+    color: #8890a7;
+}
+.uploadtips{
+    width: 750px;
+	height: 141px;
+	background-color: #f8f9fd;
+    border-radius: 8px;
+    padding: 20px 40px;
+    color: #8890a7;
+    line-height: 22px;
+    margin-bottom: 20px;
+}
+
+</style>
diff --git a/src/pages/app_edit.vue b/src/pages/app_edit.vue
new file mode 100644
index 0000000000000000000000000000000000000000..bb88bbb85d6a34ce861df058034463ae200c22c1
--- /dev/null
+++ b/src/pages/app_edit.vue
@@ -0,0 +1,394 @@
+<template>
+  <div class="detail_contain">
+    <p class="now_page_title">
+      我的应用  /  应用仓库  /  应用详情  /  
+      <span>应用编辑</span>
+    </p>
+    <div class="info_contain">
+      <el-form ref="form" :rules="rules" :model="form" label-width="0px">
+        <el-form-item prop="name">
+          <p class="formname">应用名称：</p>
+          <el-input v-model="form.name"></el-input>
+        </el-form-item>
+        <el-form-item prop="vision">
+          <p class="formname">应用版本：</p>
+          <el-input v-model="form.vision"></el-input>
+        </el-form-item>
+        
+        <el-form-item prop="area">
+          <p class="formname">业务领域：</p>
+          <el-select v-model="form.area" placeholder="请选择">
+            <el-option
+              v-for="item in area_arr"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item prop="type">
+          <p class="formname">应用类型：</p>
+          <el-select v-model="form.type" placeholder="请选择">
+            <el-option
+              v-for="item in type_arr"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        
+        <el-form-item prop="fileList">
+          <p class="formname">应用封面：</p>
+          <upload-file
+            :multiple="false"
+            :max="1"
+            type="picture"
+            :readOnly="false"
+            fit="fill"
+            :list="imgList"
+            @getNewList="getNewList"
+            ref="servicepic"
+          ></upload-file>
+          <span class="removepic" @click="removepic">更换封面</span>
+        </el-form-item> 
+
+        <el-form-item
+        prop="origin"
+        :rules="[
+          { required: true, message: '请选择所属组织', trigger: 'change' },
+        ]"
+         >
+          <p class="formname">所属组织：</p>
+          <el-select v-model="form.origin" placeholder="请选择">
+            <el-option
+              v-for="item in origin_arr"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item prop="appdesc">
+          <p class="formname">应用简介：</p>
+          <el-input type="textarea" v-model="form.appdesc"></el-input>
+        </el-form-item>
+        
+        <el-form-item prop="actiondesc">
+          <p class="formname">功能简介：</p>
+          <el-input type="textarea" v-model="form.actiondesc"></el-input>
+        </el-form-item>
+
+        <el-form-item prop="example">
+          <p class="formname">应用场景示例：</p>
+          <el-input type="textarea" v-model="form.example"></el-input>
+        </el-form-item>
+        
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit('form')" class="right">保存</el-button>
+          <el-button class="right">取消</el-button>
+        </el-form-item>
+      </el-form>
+
+      
+    </div>
+  </div>
+</template>
+
+<script>
+import uploadFile from '../components/upload_file'
+import { getRole } from "../utils/common";
+export default {
+  props: {},
+  components: {
+    uploadFile
+  },
+  data() {
+    return {
+        form: {
+          name: '',
+          area:'',
+          origin:'',
+          vision:'',
+          type:'',
+          appdesc:'',
+          actiondesc:"",
+          example:'',
+          fileList:''
+        },
+        open:true,
+        open1:false,
+        open2:'true',
+        now_user: 2, //0：普通用户，1：组织管理员，2：超级管理员
+        imgList: [],   
+        area_arr:[
+          {
+            label:'应急领域',
+            value:0,
+          },
+          {
+            label:'公安领域',
+            value:1,
+          },
+          {
+            label:'交通领域',
+            value:2,
+          },
+          {
+            label:'全领域',
+            value:3,
+          }
+        ],
+        type_arr:[
+          {
+            label:'基础工具',
+            value:0,
+          },
+          {
+            label:'通用应用',
+            value:1,
+          },
+          {
+            label:'业务应用',
+            value:2,
+          },
+          {
+            label:'其他',
+            value:3,
+          }
+        ],
+        origin_arr:[],
+        rules:{
+          name:[
+            { required: true, message: '请输入应用名称', trigger: 'blur' },
+          ],
+          vision:[
+            { required: true, message: '请输入应用版本', trigger: 'blur' },
+          ],
+          appdesc:[
+            { required: true, message: '请输入应用版本', trigger: 'blur' },
+          ],
+          actiondesc:[
+            { required: true, message: '请输入应用版本', trigger: 'blur' },
+          ],
+          example:[
+            { required: true, message: '请输入应用版本', trigger: 'blur' },
+          ],
+          desc:[
+            { required: true, message: '请输入服务描述', trigger: 'blur' },
+            { max: 200, message: '长度小于200个字符', trigger: 'blur' }
+          ],
+          area:[
+            { required: true, message: '请选择业务领域', trigger: 'change' },
+          ],
+          type:[
+            { required: true, message: '请选择应用类型', trigger: 'change' },
+          ],
+          fileList:[
+              {required: true, message: '请上传图片', trigger: 'change'}
+          ]
+          
+        }
+    };
+  },
+  watch: {},
+  computed: {},
+  created() {
+    this.now_user = this.$store.state.role
+    getRole().then(data => {
+        this.now_user = data;
+        this.$store.commit('rolefun',data)
+        this.getOriginArr()
+    });
+  },
+  mounted() {},
+  methods: {
+    getOriginArr(){
+      this.$http
+            .get('/static/serviceedit.json')
+            .then(response => {
+                let data = response.data.data
+                this.origin_arr = data.origin_arr
+            })
+            .catch(function(response) {
+                
+            });
+    },
+    removepic(){
+      this.$refs.servicepic.handleRemove()
+    },
+      onSubmit(formName) {
+        console.log('submit!');
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
+            alert('submit!');
+          } else {
+            console.log('error submit!!');
+            return false;
+          }
+        });
+      },
+      getNewList(val) {
+        console.log(val);
+        this.form.fileList = ""
+        this.form.fileList = url.map((v,k)=>{
+          return v.url
+        }).join(';')
+        console.log(this.form.fileList)
+      }
+  }
+};
+</script>
+
+
+<style>
+.info_contain .el-input__inner{
+  background-color: #f7f8f9;
+  width: 1022px;
+}
+.info_contain .el-textarea__inner{
+  background-color: #f7f8f9;
+  width: 1022px;
+}
+.limitsd .timeslect .el-input__inner{
+  width: 150px;
+  border-radius: 0 8px 8px 0;
+  background-color: rgba(15, 38, 131, 1);
+  color: rgba(248, 249, 253, 1);
+  border: 0;
+}
+</style>
+
+<style scoped>
+.detail_contain {
+  width: 100%;
+  padding: 0 20px;
+  height: calc(100% - 55px);
+}
+.info_contain {
+  padding: 25px 20px;
+  background-color: #fff;
+  width: 100%;
+  box-shadow: 0px 3px 6px 0px #f4f7fc;
+  border-radius: 12px;
+  min-height: calc(100% - 20px);
+    margin-bottom: 20px;
+    position: relative;
+}
+.now_page_title {
+  margin: 15px 0;
+  color: #898d9e;
+}
+.now_page_title span {
+  color: #242c43;
+}
+.formname{
+  color: #58617a;
+}
+.right{
+  float: right;
+  margin-left: 20px;
+}
+.removepic{
+  display: inline-block;
+  margin-top: -40px;
+  float: left;
+  margin-left: 180px;
+  width: 76px;
+	height: 32px;
+	background-color: #495feb;
+  border-radius: 8px;
+  line-height: 32px;
+  text-align: center;
+  color: #e6ebfe;
+  cursor: pointer;
+}
+.edit_change{
+  width: 100%;
+  border-bottom: 2px solid #f4f7fc;
+  overflow: hidden;
+}
+.edit_change_box{
+  width: 163px;
+  height: 48px;
+  line-height: 48px;
+	background-color: #e3e5ef;
+  border-radius: 8px;
+  color: #8890a7;
+  text-align: center;
+  float: left;
+  margin-right: 20px;
+  font-weight: 600;
+  margin-bottom: 25px;
+  font-size: 16px;
+  cursor: pointer;
+}
+.edit_change_box img{
+  vertical-align: -3px;
+  margin-right: 5px;
+}
+.safe_title{
+    width: 100%;
+    height: 65px;
+    line-height: 65px;
+    border-bottom: 2px solid #f4f7fc;
+}
+.safe_select{
+    float: left;
+    width: auto;
+    margin-right: 40px;
+    height: 65px;
+    cursor: pointer;
+}
+.safe_box_select{
+    padding: 30px 10px 10px 10px;
+    width: 100%;
+    height: 100%;
+}
+.openbgc{
+  width: 56px;
+	height: 23px;
+  background-image: url('../assets/imgs/btn_on_hov.png');
+  background-size:contain;
+  cursor: pointer;
+}
+.formtitle{
+  color: #58617a;
+  margin: 15px 0;
+}
+
+.savebtn{
+  position: absolute;
+  right: 20px;
+  bottom:20px;
+  width: 278px;
+  overflow: hidden;
+}
+.btnsty{
+  width: 124px;
+	height: 44px;
+  line-height: 44px;
+	background-color: rgba(195, 202, 248, 0.5);
+	border-radius: 8px;
+  color: rgba(15, 38, 131, 1);
+  text-align: center;
+  float: left;
+  margin-right: 30px;
+  cursor: pointer;
+}
+.savebtn .btnsty:nth-last-of-type(1){
+  margin-right: 0px;
+  background-color: rgba(15, 38, 131, 1);
+  color: rgba(248, 249, 253, 1);
+}
+.limitsd{
+  position: relative;
+  width: 1022px;
+}
+.limitsd .timeslect{
+  position: absolute;
+  right: 0;
+}
+</style>
diff --git a/src/pages/approval_app_detail.vue b/src/pages/approval_app_detail.vue
new file mode 100644
index 0000000000000000000000000000000000000000..dc9c8c89aa8772696ad888684edd97afd0248821
--- /dev/null
+++ b/src/pages/approval_app_detail.vue
@@ -0,0 +1,347 @@
+<template>
+  <div class="detail_contain">
+    <p class="now_page_title">我的应用 / 应用仓库 / <span>应用详情</span></p>
+    <div class="info_contain">
+      <service-header
+        :data="service_header_arr"
+        @deploy="deploy"
+        @editapp="editapp"
+        @unline="unline"
+        @unsell="unsell"
+      ></service-header>
+      <div class="type_box">
+        <div class="type_title">
+          <div
+            v-for="(item, index) in service_arr[now_user]"
+            :key="index + 1000"
+            class="type_select"
+            @click="now_service = index"
+            :style="
+              now_service == index ? { borderBottom: '4px solid #f5ab4c' } : {}
+            "
+          >
+            {{ item }}
+          </div>
+        </div>
+        <div class="type_box_select">
+          <info-list :list_arr="list_arr" v-if="now_service == 0">
+            <div class="appcode" v-html="appcode" slot="app_code"></div>
+          </info-list>
+        </div>
+      </div>
+    </div>
+    <dialog-action
+      ref="myConfirm"
+      :confirmOptions="tipsOptions"
+    ></dialog-action>
+  </div>
+</template>
+
+<script>
+import infoList from "../components/infoList";
+import tableUm from "../components/table-um";
+import serviceHeader from "../components/service-header";
+import dialogAction from "@/components/dialog-action";
+import uploadFile from "@/components/upload_file";
+import { getRole } from "../utils/common";
+export default {
+  components: {
+    infoList,
+    tableUm,
+    serviceHeader,
+    dialogAction,
+    uploadFile,
+  },
+  data() {
+    return {
+      now_user: 0, //0：普通用户，1：组织管理员，2：超级管理员
+      buy_style: 0,
+      oldpag_name: "镜像文件002.rar",
+      imgList: [],
+      imgList1: [],
+      form: {
+        name: "",
+        fileList: "",
+        taps: "",
+      },
+      fileList: "",
+      rules: {
+        name: [{ required: true, message: "请输入镜像名称", trigger: "blur" }],
+        taps: [{ required: true, message: "请输入镜像标签", trigger: "blur" }],
+      },
+      tipsOptions: {
+        title: "",
+        message: "",
+        btnSubmitText: "",
+        btnCancelText: "",
+        position: "",
+      },
+      service_arr: [
+        ["基本信息", "运行状态"],
+        ["基本信息", "运行状态"],
+        ["基本信息", "运行状态","服务访问排名"],
+      ],
+      service_header_arr: {
+        name: "",
+        first: [],
+        second: [],
+        bsdetail: true,
+      },
+      now_service: 0,
+      header_arr: [
+        {
+          prop: "jxmc",
+          label: "镜像名称",
+          minWidth: "33.33%",
+          align: "center",
+        },
+        {
+          prop: "bbh",
+          label: "版本号",
+          minWidth: "33.33%",
+          align: "center",
+        },
+        {
+          label: "操作",
+          type: "Button",
+          align: "center",
+          minWidth: "33.33%",
+          btnList: [
+            {
+              type: "actiondelete",
+              label: "删除",
+            },
+          ],
+        },
+      ],
+
+      list_arr: [
+        {
+          title: "应用简介：",
+          info: "",
+        },
+        {
+          title: "功能简介：",
+          info: "",
+        },
+        {
+          title: "应用场景：",
+          info: "",
+        },
+        {
+          title: "应用参数：",
+          info: "",
+          type: "solt",
+          solt_name: "app_code",
+        },
+      ],
+      appcode: "",
+      addImageFlag: false,
+    };
+  },
+  watch: {},
+  created() {
+    this.now_user = this.$store.state.role;
+    getRole().then((data) => {
+      this.now_user = data;
+      this.$store.commit("rolefun", data);
+      this.getServiceInfo();
+      this.getServiceBaseInfo();
+    });
+  },
+  mounted() {},
+  methods: {
+    getNewList(val) {
+      console.log(val);
+      this.form.fileList = "";
+      this.form.fileList = url
+        .map((v, k) => {
+          return v.url;
+        })
+        .join(";");
+      console.log(this.form.fileList);
+    },
+    getNewList1(val) {
+      console.log(val);
+      this.fileList = "";
+      this.fileList = url
+        .map((v, k) => {
+          return v.url;
+        })
+        .join(";");
+      console.log(this.fileList);
+    },
+    addImage() {
+      this.addImageFlag = true;
+    },
+    actiondelete() {
+      this.tipsOptions = {
+        title: "",
+        message: "",
+        btnSubmitText: "",
+        btnCancelText: "",
+        position: "",
+      };
+      this.tipsOptions.message = "是否删除该数据";
+      this.tipsOptions.confirmSubmit = () => {
+        console.log("deleteItem - ");
+        this.$refs.myConfirm.hideModel();
+      };
+      this.$refs.myConfirm.showModel();
+    },
+    deploy() {
+      console.log("0000");
+    },
+    editapp() {
+      console.log("11111");
+    },
+    unline(val) {
+      console.log(val);
+      this.tipsOptions = {
+        title: "",
+        message: "",
+        btnSubmitText: "",
+        btnCancelText: "",
+        position: "",
+      };
+      this.tipsOptions.message =
+        "该操作会将该应用从应用商店的平台应用区域下线至开发者应用区域，下线前需向超级管理员发送通知，超级管理员通过后此应用将下线至开发者应用区域。";
+      this.tipsOptions.btnSubmitText = "发送通知";
+      this.tipsOptions.position = "left";
+      this.tipsOptions.confirmSubmit = () => {
+        console.log("deleteItem - ");
+        this.$refs.myConfirm.hideModel();
+      };
+      this.$refs.myConfirm.showModel();
+    },
+    unsell(val) {
+      console.log(val);
+      this.tipsOptions = {
+        title: "",
+        message: "",
+        btnSubmitText: "",
+        btnCancelText: "",
+        position: "",
+      };
+      this.tipsOptions.message =
+        "申请下架应用需要向组织管理员发送通知，组织管理员通过下架请求后该应用将从应用商店下架。";
+      this.tipsOptions.btnSubmitText = "发送通知";
+      this.tipsOptions.confirmSubmit = () => {
+        console.log("deleteItem - ");
+        this.$refs.myConfirm.hideModel();
+      };
+      this.$refs.myConfirm.showModel();
+    },
+    getServiceInfo() {
+      this.$http
+        .get("/static/appdetail.json")
+        .then((response) => {
+          let data = response.data.data;
+          this.$set(this.service_header_arr, "name", data.appInfo.name);
+          this.$set(this.service_header_arr, "first", data.appInfo.first);
+          this.$set(this.service_header_arr, "second", data.appInfo.second);
+        })
+        .catch(function(response) {});
+    },
+
+    getServiceBaseInfo() {
+      this.$http
+        .get("/static/appdetail.json")
+        .then((response) => {
+          let data = response.data.data;
+          this.$set(this.list_arr[0], "info", data.appbaseinfo.intorduce);
+          this.$set(this.list_arr[1], "info", data.appbaseinfo.action);
+          this.$set(this.list_arr[2], "info", data.appbaseinfo.use);
+          this.appcode = data.appbaseinfo.appcode;
+        })
+        .catch(function(response) {});
+    },
+  },
+};
+</script>
+
+<style>
+.savebtn .el-button {
+  float: right;
+  margin-left: 20px;
+  letter-spacing: 2px;
+}
+.savebtn .el-button:nth-of-type(1) {
+  background-color: #0f2683;
+  color: #f8f9fd;
+}
+.savebtn .el-button:nth-of-type(2) {
+  background-color: #c3caf8;
+  color: #0f2683;
+}
+</style>
+<style scoped>
+.detail_contain {
+  width: 100%;
+  padding: 0 20px;
+  height: calc(100% - 55px);
+}
+.info_contain {
+  padding: 25px 20px;
+  background-color: #fff;
+  width: 100%;
+  box-shadow: 0px 3px 6px 0px #f4f7fc;
+  border-radius: 12px;
+  min-height: calc(100% - 20px);
+  margin-bottom: 20px;
+}
+.now_page_title {
+  margin: 15px 0;
+  color: #898d9e;
+}
+.now_page_title span {
+  color: #242c43;
+}
+.type_box {
+  width: 100%;
+}
+.type_title {
+  width: 100%;
+  height: 65px;
+  line-height: 65px;
+  border-bottom: 2px solid #f4f7fc;
+}
+.type_select {
+  float: left;
+  width: auto;
+  margin-right: 40px;
+  height: 65px;
+  cursor: pointer;
+}
+.type_box_select {
+  padding: 30px 10px 10px 10px;
+  width: 100%;
+}
+
+.savebtn {
+  margin-top: 50px;
+  overflow: hidden;
+}
+.appcode {
+  white-space: pre-wrap;
+  width: 100%;
+  background-color: #f8f9fd;
+  border-radius: 8px;
+  padding: 24px;
+  color: #58617a;
+}
+.addimage {
+  display: inline-block;
+  color: #f8f9fd;
+  font-size: 16px;
+  width: 124px;
+  height: 44px;
+  line-height: 44px;
+  text-align: center;
+  background-color: #0f2683;
+  border-radius: 8px;
+  margin-top: 20px;
+  cursor: pointer;
+}
+
+</style>
diff --git a/src/pages/workPlace.vue b/src/pages/workPlace.vue
index dbff60abc893f623516268de29350253705290a1..e4d3990f23894cf32aa80b34b8d983ad85ded85a 100644
--- a/src/pages/workPlace.vue
+++ b/src/pages/workPlace.vue
@@ -201,6 +201,7 @@
         >
           {{now_user == 0?'我的应用':'平台应用'}}
           <img
+          @click="gotoyy"
             style="vertical-align:-9px;"
             src="../assets/imgs/home_btn_enter.png"
             alt
@@ -933,6 +934,9 @@ export default {
     });
   },
   methods: {
+    gotoyy(){
+      this.$router.push('/yygl/'+this.now_user)
+    },
     gotofw(){
       this.$router.push('/fwgl/'+this.now_user)
     },
diff --git a/src/router/index.js b/src/router/index.js
index 8706f8a8de9d22a4174fc475538581de154c179a..258391fa1a482ac870ab142bea844ab11d8230c1 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -81,6 +81,21 @@ export default new Router({
               name: "yyglList",
               component: () => import("@/pages/yyglList"),
             },
+            {
+              path: "/yygldetail/:level/0", // 应用仓库详情
+              name: "appdetail",
+              component: () => import("@/pages/app_detail"),
+            },
+            {
+              path: "/yygledit/:level/0", // 应用仓库编辑
+              name: "appedit",
+              component: () => import("@/pages/app_edit"),
+            },
+            {
+              path: "/yyglapprovaldetail/:level/1", // 应用仓库编辑
+              name: "approval_app_detail",
+              component: () => import("@/pages/approval_app_detail"),
+            },
           ],
         }, // 工作台 - 应用管理模块
         {
diff --git a/src/store/index.js b/src/store/index.js
index 83ded3e552e75c2aa9fef72e530fa94aaec56e97..cf5d245b27702a94568e9ec9f64cc5c1ac21bf2a 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -4,7 +4,7 @@ Vue.use(Vuex);
 
 const store = new Vuex.Store({
   state: {
-    role: 1, // 0：普通用户，1：组织管理员，2：超级管理员
+    role: 2, // 0：普通用户，1：组织管理员，2：超级管理员
     serviceShopMenu: "shopDataList", // 服务超市侧边栏
     fwglNav: [
       ["注册发布的服务", "申请的服务", "审批的服务", "云资源服务"], // 普通用户
diff --git a/static/appdetail.json b/static/appdetail.json
new file mode 100644
index 0000000000000000000000000000000000000000..65afa5c6378084435390c3a09f83a2e65cc314e4
--- /dev/null
+++ b/static/appdetail.json
@@ -0,0 +1,46 @@
+{
+    "data":{
+        "appInfo":{
+            "name":"Mapvideos",
+            "pic":"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1589794724576&di=d0bff81ff3bb08f3120b3eb2bac58024&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201511%2F21%2F20151121171107_zMZcy.thumb.700_0.jpeg",
+            "first": [
+                {
+                    "name": "在线状态",
+                    "text": "平台应用"
+                },
+                {
+                    "name": "应用类型",
+                    "text": "业务应用"
+                },
+                {
+                    "name": "业务领域",
+                    "text": "应急领域"
+                }
+            ],
+            "second": [
+                {
+                    "name": "申请类型",
+                    "text": "申请开发"
+                },
+                {
+                    "name": "申请开发次数",
+                    "text": "41次"
+                },
+                {
+                    "name": "申请部署次数",
+                    "text": "41次"
+                },
+                {
+                    "name":"创建时间",
+                    "text":"2019-11-28"
+                }
+            ]
+        },
+        "appbaseinfo":{
+            "intorduce":"本应用将视频设备的空间位置信息精准匹配至地图上，通过点击地图上的视频设备能够实现在设备真实位置对视频进行调用，包括实时视频流数据的调用和对视频设备的操作，包括实时视频流数据的调用和对视频设备的操作，",
+            "action":"<p>1、在地图上查找视频设备\n 2、在地图上定位视频设备位置；\n3、调用多路视频的实时视频数据；\n4、操作球机视频设备</p>",
+            "use":"本应用将视频设备的空间位置信息精准匹配至地图上，通过点击地图上的视频设备能够实现在设备真实位置对视频进行调用，包括实时视频流数据的调用和对视频设备的操作，包括实时视频流数据的调用和对视频设备的操作，",
+            "appcode":"<p>repository: 'hub.wodcloud.com/apaas/apaas-mapvideos'\ntag: '1.0.0'\n\nhost: 'mapvideo.wodcloud.local'</p>"
+        }
+    }
+}
\ No newline at end of file
diff --git a/static/data.json b/static/data.json
index 878ecab4081896a7976e49899a01139aba346deb..ca971b710d01c531315f88c8c73680dd55f150c3 100644
--- a/static/data.json
+++ b/static/data.json
@@ -535,6 +535,13 @@
       }
       
     ],
+    "imagearr":[
+      {
+        "id":1,
+        "jxmc":"五五五五呜呜呜",
+        "bbh":"1.0.2"
+      }
+    ],
     "fhcstx": [
       {
         "id": 1,