centaline-data-driven 1.2.73 → 1.2.74

package/build/centaline/centaline.path.js

@@ -45,6 +45,7 @@ const paths = {
     "dynamicRepeat": "./src/centaline/dynamicRepeat/index.js",//重复控件
     "dynamicCompound": "./src/centaline/dynamicCompound/index.js",//复合控件
     "dynamicContact": "./src/centaline/dynamicContact/index.js",//联系人电话
+    "dynamicLayout": "./src/centaline/dynamicLayout/index.js",//Layout组件
   },
   "plugs": {
     "api": "./src/centaline/api/index.js",//调用API插件

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "centaline-data-driven",
-  "version": "1.2.73",
+  "version": "1.2.74",
   "description": "ccai",
   "author": "hjc <3226136347@qq.com>",
   "private": false,

package/src/SearchList.vue

@@ -4,14 +4,14 @@
 
     <!-- <ct-searchlist :searchConditionApi="'/PropertyRETList/getLayoutOfSearch'" :searchDataApi="'/PropertyRETList/getListOfSearchModel'" :searchCategoryApi="'/PropertyRETList/getLayoutOfSearchCategory'"></ct-searchlist> -->
     
-    <!-- <ct-searchlist :searchConditionApi="'/cache/getLayoutOfSearchForCache'" 
-    :searchDataApi="'/cache/getListOfSearchModelForCache'"></ct-searchlist> -->
+    <ct-searchlist :searchConditionApi="'/salemattersmanage/squareuploadlist/getLayoutOfSearch'" 
+    :searchDataApi="'/salemattersmanage/squareuploadlist/getList'"></ct-searchlist>
 
-    <ct-searchlist :searchConditionApi="'/PropertyRETList/getLayoutOfSearch'"
+    <!-- <ct-searchlist :searchConditionApi="'/PropertyRETList/getLayoutOfSearch'"
                    :searchDataApi="'/PropertyRETList/getListOfSearchModel'"
                    :searchCategoryApi="'/PropertyRETList/getLayoutOfSearchCategory'"
                     :searchStatsApi="'/exampleList/getListStats'"
-                   ></ct-searchlist>
+                   ></ct-searchlist> -->
 
     <!--<ct-searchlist :searchConditionApi="'/api/invoice-info/search-condition'" :searchDataApi="'/api/invoice-info/list'" :searchDataStatisticsApi="'api/ContractList/GetLayoutOfStatisticsTool'" :apiParam="para"></ct-searchlist>-->
     <!-- <ct-searchlist :searchConditionApi="'/PropertyStatusList/getLayoutOfSearch'" :searchDataApi="'/PropertyStatusList/getListOfSearchModel'"  :apiParam="para"></ct-searchlist> -->

package/src/centaline/dynamicDetail/src/dynamicPropertyDetailOFI.vue

@@ -787,8 +787,15 @@
           }
           .expand-f {
             line-height: 15px;
-            font-size: 18px;
+            font-size: 16px;
             font-weight: bold;
+            img{
+              width: 15px!important;
+              margin-left: 0!important;
+            }
+            span{
+              float:right;
+            }
           }
           .info-conten {
             display: flex;

package/src/centaline/dynamicDetail/src/dynamicPropertyDetailRET.vue

@@ -113,7 +113,7 @@
                       <div class="row-i"><span>{{model.fields1Dic.Price.label}}</span><span class="base-clolr expand-f" v-html="model.fields1Dic.Price.value"></span><span class="base-clolr">{{model.fields1Dic.Price.unitName}}</span>
                       <img src="../../../assets/jsq.png" class="img-jsq" alt="">
                       </div>
-                      <div class="row-i"><span>{{model.fields1Dic.PriceUnit.label}}</span><span class="base-clolr" v-html="model.fields1Dic.PriceUnit.value"></span><span class="base-clolr">{{model.fields1Dic.PriceUnit.unitName}}</span></div>
+                      <div class="row-i"><span>{{model.fields1Dic.PriceUnit.label}}</span><span class="base-clolr expand-f" v-html="model.fields1Dic.PriceUnit.value"></span><span class="base-clolr">{{model.fields1Dic.PriceUnit.unitName}}</span></div>
                       <div v-if="model.fields1Dic.PriceLine" class="row-i"><span>{{model.fields1Dic.PriceLine.label}}</span><div>{{model.fields1Dic.PriceLine.value}}{{model.fields1Dic.PriceLine.unitName}}</div></div></div>
                    <div class="info-row">
                       <div v-if="model.fields1Dic.PriceLine" class="row-i">
@@ -580,7 +580,7 @@
             let title=field.pageTitle==undefined ?field.label:field.pageTitle;
             submitData.actionType=field.actionType;
             var fun =self.$common.getDataDrivenOpts().handler[field.action];
-            fun(submitData,title,self.model);
+            fun(submitData,title,null);
           }
         }
 
@@ -812,8 +812,15 @@
           }
           .expand-f {
             line-height: 15px;
-            font-size: 18px;
+            font-size: 16px;
             font-weight: bold;
+            img{
+              width: 15px!important;
+              margin-left: 0!important;
+            }
+            span{
+              float:right;
+            }
           }
           .img-jsq{
             width: 14px;

package/src/centaline/dynamicDetail/src/dynamicPropertySimpleDetailRET.vue

@@ -13,7 +13,7 @@
         <div class="el-icon-close cursor" style="padding-top: 5px;" @click="closeSideHandler"></div>
       </div>
       <div style="padding-left: 20px;padding-right: 20px;">
-        <div style="margin-top: 18px;">
+        <div ref="title" style="margin-top: 18px;">
           <div style="font-weight: Bold;font-size: 16px;color: #333333;display: flex;">
             <span>{{model.fields1Dic.EstateName.value}}</span>
             <span>{{model.fields1Dic.BuildingName.value}}</span>
@@ -29,8 +29,8 @@
           </div>
           <div style="display: flex;flex-wrap: wrap;">
             <div v-for="(tag, index) in model.actionRouterLabel" :key="index" class="t-tag" style="margin-top: 7px;"
-            :style="{color:tag.textColor,backgroundColor:tag.bgColor,borderColor:tag.borderColor}">
-            {{tag.label}}
+                 :style="{color:tag.textColor,backgroundColor:tag.bgColor,borderColor:tag.borderColor}">
+              {{tag.label}}
             </div>
           </div>
         </div>
@@ -41,34 +41,48 @@
           </div>
           <div style="width: 33.33%;">
             <div style="margin-top: 13px;font-size: 12px;">{{model.fields1Dic.Price.label}}</div>
-            <div style="margin-top: 7px;font-size: 14px;font-weight: Bold;color: #EE6B6B;">{{model.fields1Dic.Price.value}}{{model.fields1Dic.Price.unitName}}</div>
+            <div style="margin-top: 7px;font-size: 14px;font-weight: Bold;color: #EE6B6B;"><span v-html="model.fields1Dic.Price.value"></span><span>{{model.fields1Dic.Price.unitName}}</span></div>
           </div>
           <div style="width: 33.33%;">
             <div style="margin-top: 13px;font-size: 12px;">{{model.fields1Dic.FloorName.label}}</div>
             <div style="margin-top: 7px;font-size: 14px;font-weight: Bold;color: #EE6B6B;">{{model.fields1Dic.FloorName.value}}</div>
           </div>
         </div>
-        <div ref="contact" id="contact" style="margin-top: 16px;" v-if="model.contactApiRouter!==null" >
+        <div ref="contact" id="contact" style="margin-top: 16px;" v-if="model.contactApiRouter!==null">
           <ct-contact :key="refreshKey" :apiRouter="model.contactApiRouter" :api="model.contactApiRouter.action" :apiParam="model.contactApiRouter.getSearchPara()"></ct-contact>
         </div>
         <div ref="routers" style="margin-top: 16px;display: flex;">
-          <component v-for="(router, index) in model.actionRoutersSimple.slice(0,showIndex>0?showIndex:model.actionRoutersSimple.length-1)" :key="index" 
-            :ref="'routers'+index"
-            v-if="!router.rightField || (model.fields1Dic[router.rightField] && model.fields1Dic[router.rightField].value == 1)"
-            :is="router.is" :vmodel="router" :api="model.optionApi" @click="fieldClickHandler(router)">
+          <component v-for="(router, index) in model.actionRoutersSimple.slice(0,showIndex>0?showIndex:model.actionRoutersSimple.length-1)" :key="index"
+                     :ref="'routers'+index"
+                     v-if="!router.rightField || (model.fields1Dic[router.rightField] && model.fields1Dic[router.rightField].value == 1)"
+                     :is="router.is" :vmodel="router" :api="model.optionApi" @click="fieldClickHandler(router)">
           </component>
-          <el-popover v-if="showIndex>0" ref="popover0" :append-to-table="option.appendId?option.appendId:''" 
-            class="Stats-popover" popper-class="el-popover1" :placement="option.placement?option.placement:'left'" 
-            :trigger="option.trigger?option.trigger:''">
+          <el-popover v-if="showIndex>0" ref="popover0" :append-to-table="option.appendId?option.appendId:''"
+                      class="Stats-popover" popper-class="el-popover1" :placement="option.placement?option.placement:'left'"
+                      :trigger="option.trigger?option.trigger:''">
             <div class="tab-list" style="border-bottom:none;display: flex;flex-direction: column;">
               <component v-for="(router, index) in model.actionRoutersSimple.slice(showIndex)" :key="index" style="margin-bottom: 10px;margin-left: 0px;"
-                v-if="!router.rightField || (model.fields1Dic[router.rightField] && model.fields1Dic[router.rightField].value == 1)"
-                :is="router.is" :vmodel="router" :api="model.optionApi" @click="fieldClickHandler(router)">
+                         v-if="!router.rightField || (model.fields1Dic[router.rightField] && model.fields1Dic[router.rightField].value == 1)"
+                         :is="router.is" :vmodel="router" :api="model.optionApi" @click="fieldClickHandler(router)">
               </component>
             </div>
             <span :slot="showIndex>0?'reference':''" class="more" style="margin-left: 10px;"></span>
           </el-popover>
         </div>
+        <div class="tablist-info base-box">
+          <div class="details-tabs-box">
+            <el-tabs :value="model.activeIndex1" @tab-click="handleSelect">
+              <el-tab-pane v-for="(col, index) in model.tags1" :key="col.appID"
+                           :index="index.toString()" :name="index.toString()">
+                <div slot="label" v-html="col.appName"></div>
+              </el-tab-pane>
+            </el-tabs>
+            <ct-searchlist v-if="model.searchConditionApiTags1" :key="'list'+listKey.toString()+refershKey"
+                           :apiParam="model.paramDataTags1" :flagFocus="false"
+                           :searchConditionApi="model.searchConditionApiTags1"
+                           :searchDataApi="model.searchDataApiTags1"></ct-searchlist>
+          </div>
+        </div>
       </div>
     </div>
 </template>
@@ -95,7 +109,8 @@
       return {
         refreshKey:0,
         topWidth:300,
-        showIndex:0,
+        showIndex: 0,
+        listKey: 0,
         option: {
           isHidden: true,//是否开启操作栏隐藏设置，默认开启
           showNum: 3,//如果isHidden为true时，个数大于3就会隐藏，默认是3
@@ -127,6 +142,7 @@
     methods: {
       load(data) {
         var self = this;
+        this.refershKey = this.refershKey + 1;
         this.model = data; 
         this.model.$vue = self;
         this.loadFields();
@@ -229,10 +245,10 @@
         let i=key.index;
         this.model.activeIndex1=i;
         if(this.model.tags1 && this.model.tags1[i]){
-          // this.model.searchlistKey=this.model.searchlistKey+1;
-          // this.model.searchConditionApiTags1=this.model.tags1[i].searchConditionApiUrl||'';
-          // this.model.searchDataApiTags1=this.model.tags1[i].searchDataApiUrl||'';
-          // this.model.paramDataTags1=this.model.tags1[i].paramData||'';
+          this.listKey = this.listKey + 1;
+          this.model.searchConditionApiTags1 = this.model.tags1[i].searchConditionApiUrl || '';
+          this.model.searchDataApiTags1 = this.model.tags1[i].searchDataApiUrl || '';
+          this.model.paramDataTags1 = this.model.tags1[i].paramData || '';
         }
       },      
       fieldClickHandler(field) {

package/src/centaline/dynamicLayout/index.js

@@ -0,0 +1,11 @@
+import dynamicLayout from './src/dynamicLayout'
+
+dynamicLayout.install = function (Vue) {
+  Vue.component(dynamicLayout.name, dynamicLayout);
+}
+
+if (typeof window !== 'undefined' && window.Vue) {
+  window.Vue.use(dynamicLayout);
+}
+
+export default dynamicLayout;

package/src/centaline/dynamicLayout/src/dynamicLayout.vue

@@ -0,0 +1,311 @@
+<template>
+    <div v-loading="loading" class="ct-Layout" v-if="Layout !== null && !loading">
+      <ct-layoutchildren  v-for="(item, index) in Layout.fields" :key="index":vmodel="item" :rowindex="index"  @click="rolRouterClickHandler"></ct-layoutchildren>
+    </div>
+</template>
+<script>
+  import dynamicElement from '../../mixins/dynamicElement'
+  import dynamicLayoutChildren from './dynamicLayoutChildren.vue';
+  import common from '../../common';
+  export default {
+    name: 'ct-layout',
+    mixins: [dynamicElement],
+    components: {
+      'ct-layoutchildren': dynamicLayoutChildren
+    },
+    props: {
+      api: String,
+      cellLayout: String,
+      vmodel: Object,
+      listData: Array,
+      apiParam: Object
+    },
+    data() {
+      return {
+        Layout:[]
+      };
+    },
+    created() {
+      this.init();
+    },
+    methods: {
+      init() {
+        var self = this;
+        //初始化
+        this.loading = true;
+        this.$nextTick(function () {
+          if (typeof self.api !== 'undefined') {
+            self.loaderObj.CellLayout(self.api, self.load, this.apiParam, self.failLoad);
+          }
+          else if (typeof self.vmodel !== 'undefined') {
+            self.load(self.vmodel);
+          }
+         
+        });
+        
+      },
+      failLoad() {
+        this.$emit('failLoad', this.model);
+      },
+      load(data) {
+        this.model = data;
+        if (data.rows.length > 0) {
+          var str = '<Layout orientation="vertical">';
+          for (var i = 0; i < data.rows.length; i++) {
+            str += data.cellLayout.replace(/\{\{(.+?)\}\}/g, (...args) => {
+              return this.getValue(data.rows[i], args[1])
+            });
+          }
+          str += '</Layout>';
+        }
+        var xmlDOM = this.loadXML(str);
+        this.Layout = this.xmlToJson(xmlDOM.childNodes[0]);
+        this.loading = false;
+        this.$emit('loaded', this.model);
+      },
+      getValue(data,val) {
+        return val.split('.').reduce((data, currentVal) => {
+          return data[currentVal]
+        }, data)
+      },
+      loadXML(xmlString) {
+        if (document.all) {
+          var xmlDom = new ActiveXObject("Microsoft.XMLDOM");
+          xmlDom.loadXML(xmlString)
+          return xmlDom
+        }
+        else {
+          return new DOMParser().parseFromString(xmlString, "text/xml");
+        }
+      },
+
+      xmlToJson(xml) {
+        // Create the return object
+        var obj = {};
+        var buffer = [];
+        if (xml.nodeType == 1) { // element
+          // do attributes
+          if (xml.attributes.length > 0) {
+            for (var j = 0; j < xml.attributes.length; j++) {
+              var attribute = xml.attributes.item(j);
+              obj[attribute.nodeName] = attribute.nodeValue;
+            }
+          }
+        }
+        if (xml.nodeName.toLowerCase() == "Layout".toLowerCase() || xml.nodeName.toLowerCase() == "StackLayout".toLowerCase()) {
+          obj["is"] = "ct-layoutchildren";
+        }
+        else if (xml.nodeName.toLowerCase() == "Label".toLowerCase()) {
+          obj["is"] = "ct-layoutlabel";
+        }
+        else if (xml.nodeName.toLowerCase() == "Line".toLowerCase()) {
+          obj["is"] = "ct-layoutline";
+        }
+        else if (xml.nodeName.toLowerCase() == "Image".toLowerCase()) {
+          obj["is"] = "ct-layoutimage";
+        }
+        obj["type"] = xml.nodeName;
+        // do children
+        if (xml.hasChildNodes()) {
+          for (var i = 0; i < xml.childNodes.length; i++) {
+            var item = xml.childNodes.item(i);
+            var nodeName = item.nodeName;
+            if (typeof (obj["fields"]) == "undefined") {
+              obj["fields"] = [];
+              obj["fields"].push(this.xmlToJson(item));
+            } else {
+              if (typeof (obj["fields"].push) == "undefined") {
+                var old = obj["fields"];
+                obj["fields"] = [];
+                obj["fields"].push(old);
+              }
+              obj["fields"].push(this.xmlToJson(item));
+            }
+          }
+        }
+        return obj;
+      },
+      rolRouterClickHandler(routerKey, rowindex) {
+        var self = this;
+        var submitData = {};
+        var rowData = self.model.rows[rowindex];
+        var actionRouter = [];
+        if (self.model.actionRouters) {
+          self.model.actionRouters.forEach((v) => {
+            var field = self.loaderObj.Router(v);
+            actionRouter.push(field);
+          });
+        }
+        let field = actionRouter.find(b => {
+          return b.id === routerKey;
+        });
+        field.submitListField.forEach((k) => {
+          submitData[k] = rowData[k];
+        });
+
+        let action = field.action;
+        if (field.actionField) {
+          action = rowData[field.actionField];
+        }
+        this.routerClickHandler(field, submitData, action);
+      },
+      routerClickHandler(field, submitData, action) {
+        let self = this;
+        action = action || field.action;
+       
+        var clickAcion = function () {
+          //若不是客户端方法，则直接访问接口
+          if (!field.isClientFuntion) {
+            // 外部框架tab页打开
+            if (field.isFormPageInTab || field.isSearchPageInTab) {
+              submitData = field.getActionPara(submitData).para;
+              if (field.pageStyle) {
+                submitData.pageStyle = field.pageStyle;
+              }
+              self.$common.getDataDrivenOpts().handler.openTab(action, submitData, field.pageTitle, self.model, field.dialogWidth);
+            }
+            else if (field.isBrowserNewTab) {// 浏览器打开
+              submitData = field.getActionPara(submitData).para;
+              let query = self.$common.objectToQueryStr(submitData);
+              window.open(action + query, "_blank");
+            }
+            else {
+              //self.operationLoading = true;
+
+              //Form
+              if (field.isOpenForm) {
+                var dialogOption = {
+                  title: field.pageTitle,
+                  pane: self.$common.getParentPane(self),
+                  content: [{
+                    component: field.navToNewPageName,
+                    attrs: {
+                      //source: data.content,
+                      api: action,
+                      apiParam: field.getActionPara(submitData).para,
+                      showTitle: false,
+                      width: field.dialogWidth + 'px',
+                      height: field.dialogHeight + 'px'
+                    },
+                    on: {
+                      submit(ev) {
+                        if (!field.flagFreshCurrentRow && !field.flagAddRowAfterAction) {
+                          self.model.doAction(ev);
+                        }
+                        self.$forceUpdate();
+                        self.$refs.footer.$forceUpdate();
+                        self.$common.closeDialog(dialogOption.dialog);
+                        self.updateCurrentRow(field, ev);
+                      },
+                      refreshParent() {
+                        self.getPage(1);
+                        self.$common.closeDialog(dialogOption.dialog);
+                      },
+                      closeDialog() {
+                        self.updateCurrentRow(field);
+                      }
+                    }
+                  }]
+                };
+                self.$common.openDialog(dialogOption);
+              }
+              //SearchList
+              else if (field.isOpenList) {
+                var dialogOption = {
+                  title: field.pageTitle,
+                  pane: self.$common.getParentPane(self),
+                  content: [{
+                    component: field.navToNewPageName,
+                    attrs: {
+                      searchConditionApi: field.actionForSearchLayout,
+                      searchDataApi: field.actionForSearch,
+                      apiParam: submitData,
+                      width: field.dialogWidth + 'px',
+                      height: field.dialogHeight + 'px'
+                    },
+                    on: {
+                      refreshParent() {
+                        self.getPage(1);
+                        self.$common.closeDialog(dialogOption.dialog);
+                      },
+                      closeDialog() {
+                        self.updateCurrentRow(field);
+                      }
+                    }
+                  }]
+                };
+                self.$common.openDialog(dialogOption);
+              }
+              //Tabs
+              else if (field.isOpenTabs) {
+                var dialogOption = {
+                  title: field.pageTitle,
+                  pane: self.$common.getParentPane(self),
+                  content: [{
+                    component: field.navToNewPageName,
+                    attrs: {
+                      searchConditionApi: field.actionForSearchLayout,
+                      searchDataApi: field.actionForSearch,
+                      apiParam: submitData,
+                      width: field.dialogWidth + 'px',
+                      height: field.dialogHeight + 'px'
+                    },
+                    on: {
+                    }
+                  }]
+                };
+                self.$common.openDialog(dialogOption);
+              }
+              else {
+                self.operationLoading = true;
+                field.doAction(submitData, (data) => {
+                  self.operationLoading = false;
+                  if (!field.flagFreshCurrentRow && !field.flagAddRowAfterAction) {
+                    self.model.doAction({ responseData: data });
+                  }
+                  self.$forceUpdate();
+                  self.$refs.footer.$forceUpdate();
+                  self.updateCurrentRow(field, data);
+                })
+              }
+            }
+          }
+          //执行客户端脚本
+          else {
+            // let parm={submitData:submitData,field:field}
+            // self.$common.excuteFunStr.call(self.model.scripts, field.action,parm);
+            let title = field.pageTitle == undefined ? field.label : field.pageTitle;
+            submitData.actionType = field.actionType;
+            var fun = self.$common.getDataDrivenOpts().handler[action];
+            fun(submitData, title, self.model);
+            // var fun = self.model.scripts.formData[action];
+            // fun(submitData,field);
+          }
+        }
+
+        if (field.alert) {
+          self.$common.confirm(field.alertMsg, field.alertCaption, {
+            confirmButtonText: field.alertOKButtonText,
+            cancelButtonText: field.alertCancelButtonText,
+            //type: 'warning'
+            center: field.alertCenter
+          }).then(() => {
+            clickAcion();
+          }).catch(() => {
+          });
+        }
+        else {
+          clickAcion();
+        }
+      },
+    },
+    mounted() {
+
+    }
+  }
+</script>
+<style>
+  .ct-Layout {
+    font-size: 12px;
+  }
+</style>

package/src/centaline/dynamicLayout/src/dynamicLayoutChildren.vue

@@ -0,0 +1,44 @@
+<template>
+  <el-container :direction="model.orientation" :style="model.styleObject">
+    <component v-for="(item, index) in model.fields" :key="index" :is="item.is" :vmodel="item" :rowindex="rowindex"  @click="clickHandler"></component>
+  </el-container>
+</template>
+<script>
+  import dynamicElement from '../../mixins/dynamicElement'
+  import dynamicLayoutLabel from './dynamicLayoutLabel.vue';
+  import dynamicLayoutLine from './dynamicLayoutLine.vue';
+  import dynamicLayoutImage from './dynamicLayoutImage.vue';
+  export default {
+    name: 'ct-layoutchildren',
+    mixins: [dynamicElement],
+    components: {
+      'ct-layoutlabel': dynamicLayoutLabel,
+      'ct-layoutline': dynamicLayoutLine,
+      'ct-layoutimage': dynamicLayoutImage
+    },
+    props: {
+      vmodel: Object,
+      rowindex: Number
+    },
+    data() {
+      return {
+
+      };
+    },
+    created() {
+      this.model = this.loaderObj.CellLayout(this.vmodel);
+     
+    },
+    methods: {
+      clickHandler(routerKey, rowindex) {
+        this.$emit('click', routerKey, rowindex);
+      }
+    },
+    mounted() {
+
+    }
+  }
+</script>
+<style>
+ 
+</style>

package/src/centaline/dynamicLayout/src/dynamicLayoutImage.vue

@@ -0,0 +1,39 @@
+<template>
+  <div v-if="model.routerKey" :style="model.styleObject">
+    <img class="ct-tablecurrencyImg ct-tablecurrencyItem" :src="model.value"  @click="clickHandler($event)" />
+  </div>
+  <div v-else :style="model.styleObject">
+    <el-image :src="model.value"
+              fit="fit"></el-image>
+  </div>
+</template>
+
+<script>
+  import dynamicElement from '../../mixins/dynamicElement'
+  export default {
+    name: 'ct-layoutimage',
+    mixins: [dynamicElement],
+    props: {
+      vmodel: Object,
+      rowindex: Number
+    },
+    data() {
+      return {
+      }
+    },
+    created() {
+      if (typeof this.vmodel !== 'undefined') {
+        this.model = this.loaderObj.CellLayout(this.vmodel);
+      }
+    },
+   
+    methods: {
+      clickHandler(ev) {
+        this.$emit('click', this.model.routerKey, this.rowindex);
+      }
+    },
+    computed: {
+     
+    }
+  }
+</script>

package/src/centaline/dynamicLayout/src/dynamicLayoutLabel.vue

@@ -0,0 +1,55 @@
+<template>
+  <div v-if="model.routerKey" :style="model.styleObject">
+    <a href="javascript:void(0);"  @click="clickHandler($event)" class="ct-tablecurrencyItem">
+      {{model.value}}
+    </a>
+  </div>
+  <div v-else :style="model.styleObject" v-html="model.value">
+  </div>
+</template>
+
+<script>
+  import dynamicElement from '../../mixins/dynamicElement'
+  export default {
+    name: 'ct-layoutlabel',
+    mixins: [dynamicElement],
+    props: {
+      vmodel: Object,
+      rowindex: Number
+    },
+    data() {
+      return {
+      }
+    },
+    created() {
+      this.model = this.loaderObj.CellLayout(this.vmodel);
+    },
+   
+    methods: {
+      clickHandler(ev) {
+        this.$emit('click', this.model.routerKey, this.rowindex);
+      }
+    },
+    computed: {
+     
+    }
+  }
+</script>
+<style>
+  .ct-tablecurrencyItem {
+    text-decoration: none;
+    padding-left: 0px;
+    padding-right: 4px;
+    cursor: pointer;
+    color: #388cd3;
+  }
+
+    .ct-tablecurrencyItem:hover {
+      color: #23527c;
+    }
+
+  .ct-tablecurrencyImg {
+    width: 24px;
+    margin-top: 2px;
+  }
+</style>