lshcomment 1.0.0

package/src/components/approval-record/approval-record.vue

@@ -0,0 +1,155 @@
+<template>
+	<div>
+		<div class="table-scrollable approval">
+		  	<!-- <b-table striped hover bordered :items="list" :fields="field" show-empty empty-text="暂无数据">
+		  		<template slot="nodeStatus" slot-scope="data">
+		  				{{getText(data.item)}}
+		  		</template>
+		  		<template slot="operatorName" slot-scope="data">
+		  			{{data.item.postName}}  -  {{data.item.operatorName}}
+		  		</template>
+				<template slot="remark" slot-scope="data">
+					<div style="width:200px">
+						<el-tooltip class="item" effect="dark" placement="top-start">
+							<div slot="content">{{ data.item.remark}}</div>
+						</el-tooltip> 
+						{{ data.item.remark &&  data.item.remark.substring(0,10) + '...'}}
+					</div>
+		  		</template>
+		  	</b-table> -->
+			<el-table :data="list" style="width: 100%" border tooltip-effect="dark"> 
+				<el-table-column prop="createTimeStr" label="审批时间"></el-table-column>
+				<el-table-column prop="operatorName" label="审批人">
+					<template slot-scope="scope">
+						{{scope.row.postName}}  -  {{scope.row.operatorName}}
+					</template>
+				</el-table-column>
+				<el-table-column prop="nodeStatus" label="审批结果">
+					<template  slot-scope="scope">
+		  				{{getText(scope.row)}}
+		  			</template>
+				</el-table-column>
+				<el-table-column prop="remark" label="反馈意见" show-overflow-tooltip width="400"></el-table-column>
+			</el-table>
+	  	</div>
+	</div>
+</template>
+
+<script>
+import api from "common/api";
+import Pagination from 'components/pagination/pagination'
+import config from "common/config"; 
+export default{
+	 components: {
+        Pagination
+    },
+   // props:['orderNo'],
+   props:{
+   		 orderNo: {
+                type: String,
+                default: ''
+            },
+   },
+	data(){
+		return{
+			list:[],
+			field:{
+				createTimeStr:{
+					label:'审批时间'
+				},
+				operatorName:{
+					label:'审批人'
+				},
+				nodeStatus:{
+					label:'审批结果'
+				},
+				remark:{
+					label:'反馈意见'
+				},
+			},
+			
+		}
+	},
+	created(){
+		
+		setTimeout(()=>{this.getInfo(this.orderNo)},1000)
+	},
+	methods:{
+		getInfo(orderNo){
+			if(orderNo==''|| orderNo == null){
+				return
+			}else{
+				console.log(11,this.$route.query)
+				api.approval.WfDetailInfo({
+					'orderNo':orderNo,
+					orderTypeCode:this.$route.query.billtype
+				},res => {
+				if(res.data.code == 'success'){
+					this.list = res.data.obj
+				}
+			})
+			}
+			
+		},
+		getText(data){
+			let text = '';
+			switch(data.nodeStatus){
+				case -2:
+				text = "撤销"
+				break;
+				case -1:
+				text = '待审批'
+				break;
+				case 0:
+				text="驳回"
+				break;
+				case 1:
+				if(data.nodeName == '提交审批'){
+					text ="提交审批"
+				}else{
+					text ="通过"
+				}
+				break;
+			}
+			return text
+		}
+	},
+	watch:{
+		orderNo(val) {
+			if(this.orderNo != ''){
+				console.log('test:>this.orderNo', this.orderNo)
+				this.getInfo(this.orderNo);
+			}
+		}
+	}
+/*	filters:{
+		setnodeStatus(val){
+			let text = '';
+			switch(val){
+				case -1:
+				text = '待审批'
+				break;
+				case 0:
+				text="驳回"
+				break;
+				case 1:
+				text ="通过"
+				break;
+			}
+			return text
+		}
+	},*/
+}
+</script>
+
+<style>
+#emp-insert .modal-lg {
+    max-width: 1200px !important;
+}
+
+</style>
+<style lang="scss">
+	.approval {
+		.el-tooltip__popper{ width:300px !important }
+	}
+</style>

package/src/components/area/index.vue

@@ -0,0 +1,146 @@
+<template>
+    <div class="cooperate-area">
+        <el-col :span="8">
+            <label>省</label>
+            <el-select v-model="provinceCode" :disabled="disabled" @change="selectProvince" placeholder="">
+                <el-option
+                    v-for="item in provinceList"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                />
+            </el-select>
+        </el-col>
+        <el-col :span="8">
+            <label>市</label>
+            <el-select v-model="cityCode" :disabled="disabled" @change="selectCity" placeholder="">
+                <el-option
+                    v-for="item in cityList"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                />
+            </el-select>
+        </el-col>
+        <el-col :span="8">
+            <label>区</label>
+            <el-select v-model="districtCode" :disabled="disabled" placeholder="">
+                <el-option
+                    v-for="item in direectList"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                />
+            </el-select>
+        </el-col>
+    </div>
+</template>
+
+<script>
+    /**
+    * Author: Nassua
+    * Creat time: 2018-08-28
+    * Des: 省市区三级联动 父组件通过 ref 获取相应的 code
+    */
+    import Vue from 'vue'
+    import api from 'common/api'
+    import { Col, Select, Option } from 'element-ui'
+
+    Vue.use(Col)
+    Vue.use(Select)
+    Vue.use(Option)
+
+    export default {
+        data() {
+            return {
+                provinceList: [],
+                provinceCode: '',
+                cityList: [],
+                cityCode: '',
+                direectList: [],
+                districtCode: '',
+            }
+        },
+        props: {
+            province: {
+                type: String,
+                default: ''
+            },
+            city: {
+                type: String,
+                default: ''
+            },
+            district: {
+                type: String,
+                default: ''
+            },
+            disabled: {
+                type: Boolean,
+                default: false
+            }
+        },
+        watch: {
+            province(code) {
+                code && (this.provinceCode = code)
+            },
+            city(code) {
+                code && (this.cityCode = code)
+            },
+            district(code) {
+                code && (this.districtCode = code)
+            }
+        },
+        created() {
+            this.initPage()
+        },
+        methods: {
+
+            // 初始化省
+            initPage() {
+                const params = { levels: 1 }
+                this.querychinaarea(params)
+            },
+
+            // 选择省 => 市
+            selectProvince(val) {
+                if (!val) return
+                const params = { levels: 2, fatherAreaCode: val }
+                this.querychinaarea(params)
+            },
+
+            // 选择市 => 区
+            selectCity(val) {
+                if (!val) return
+                const params = { levels: 3, fatherAreaCode: val }
+                this.querychinaarea(params)
+            },
+
+            // 省市区
+            querychinaarea(params) {
+                api.chinaarea.querychinaarea(params, res => {
+                    if (res && res.data.code == 'success') {
+                        
+                        const list = res.data.obj || []
+                        const target = list.map(({ areaName: label, areaCode: value }) => ({ label, value }))
+                        
+                        if (params.levels == 1) this.provinceList = target
+
+                        if (params.levels == 2) {
+                            this.cityList = target
+                            if (this.provinceCode != this.province) {
+                                this.direectList = []
+                                this.cityCode = ''
+                                this.districtCode = ''
+                            }
+                        }
+
+                        if (params.levels == 3) {
+                            this.direectList = target
+                            if (this.cityCode != this.city) this.districtCode = ''
+                        }
+                    }    
+                })
+            }
+        }
+    }
+</script>

package/src/components/aside/Aside.vue

@@ -0,0 +1,231 @@
+<template>
+  <aside class="aside-menu">
+    <b-tabs>
+      <b-tab title="<i class='icon-list'></i>">
+        <Callout class="m-0 py-2 text-muted text-center bg-light text-uppercase">
+          <small><b>Today</b></small>
+        </Callout>
+        <hr class="transparent mx-3 my-0">
+        <Callout variant="warning" class="m-0 py-3">
+          <div class="avatar float-right">
+            <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+          </div>
+          <div>Meeting with <strong>Lucas</strong></div>
+          <small class="text-muted mr-3"><i class="icon-calendar"></i>&nbsp; 1 - 3pm</small>
+          <small class="text-muted"><i class="icon-location-pin"></i>&nbsp; Palo Alto, CA </small>
+        </Callout>
+        <hr class="mx-3 my-0">
+        <Callout variant="info" class="m-0 py-3">
+          <div class="avatar float-right">
+            <img src="static/img/avatars/4.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+          </div>
+          <div>Skype with <strong>Megan</strong></div>
+          <small class="text-muted mr-3"><i class="icon-calendar"></i>&nbsp; 4 - 5pm</small>
+          <small class="text-muted"><i class="icon-social-skype"></i>&nbsp; On-line </small>
+        </Callout>
+        <hr class="transparent mx-3 my-0">
+        <Callout class="m-0 py-2 text-muted text-center bg-light text-uppercase">
+          <small><b>Tomorrow</b></small>
+        </Callout>
+        <hr class="transparent mx-3 my-0">
+        <Callout variant="danger" class="m-0 py-3">
+          <div>New UI Project - <strong>deadline</strong></div>
+          <small class="text-muted mr-3"><i class="icon-calendar"></i>&nbsp; 10 - 11pm</small>
+          <small class="text-muted"><i class="icon-home"></i>&nbsp; creativeLabs HQ </small>
+          <div class="avatars-stack mt-2">
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/2.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/3.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/4.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/5.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/6.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+          </div>
+        </Callout>
+        <hr class="mx-3 my-0">
+        <Callout variant="success" class="m-0 py-3">
+          <div><strong>#10 Startups.Garden</strong> Meetup</div>
+          <small class="text-muted mr-3"><i class="icon-calendar"></i>&nbsp; 1 - 3pm</small>
+          <small class="text-muted"><i class="icon-location-pin"></i>&nbsp; Palo Alto, CA </small>
+        </Callout>
+        <hr class="mx-3 my-0">
+        <Callout variant="primary" class="m-0 py-3">
+          <div><strong>Team meeting</strong></div>
+          <small class="text-muted mr-3"><i class="icon-calendar"></i>&nbsp; 4 - 6pm</small>
+          <small class="text-muted"><i class="icon-home"></i>&nbsp; creativeLabs HQ </small>
+          <div class="avatars-stack mt-2">
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/2.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/3.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/4.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/5.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/6.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+            <div class="avatar avatar-xs">
+              <img src="static/img/avatars/8.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+            </div>
+          </div>
+        </Callout>
+        <hr class="mx-3 my-0">
+      </b-tab>
+      <b-tab title="<i class='icon-speech'></i>">
+        <div class="p-3">
+          <div class="message">
+            <div class="py-3 pb-5 mr-3 float-left">
+              <div class="avatar">
+                <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+                <span class="avatar-status badge-success"></span>
+              </div>
+            </div>
+            <div>
+              <small class="text-muted">Lukasz Holeczek</small>
+              <small class="text-muted float-right mt-1">1:52 PM</small>
+            </div>
+            <div class="text-truncate font-weight-bold">Lorem ipsum dolor sit amet</div>
+            <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt...</small>
+          </div>
+          <hr>
+          <div class="message">
+            <div class="py-3 pb-5 mr-3 float-left">
+              <div class="avatar">
+                <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+                <span class="avatar-status badge-success"></span>
+              </div>
+            </div>
+            <div>
+              <small class="text-muted">Lukasz Holeczek</small>
+              <small class="text-muted float-right mt-1">1:52 PM</small>
+            </div>
+            <div class="text-truncate font-weight-bold">Lorem ipsum dolor sit amet</div>
+            <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt...</small>
+          </div>
+          <hr>
+          <div class="message">
+            <div class="py-3 pb-5 mr-3 float-left">
+              <div class="avatar">
+                <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+                <span class="avatar-status badge-success"></span>
+              </div>
+            </div>
+            <div>
+              <small class="text-muted">Lukasz Holeczek</small>
+              <small class="text-muted float-right mt-1">1:52 PM</small>
+            </div>
+            <div class="text-truncate font-weight-bold">Lorem ipsum dolor sit amet</div>
+            <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt...</small>
+          </div>
+          <hr>
+          <div class="message">
+            <div class="py-3 pb-5 mr-3 float-left">
+              <div class="avatar">
+                <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+                <span class="avatar-status badge-success"></span>
+              </div>
+            </div>
+            <div>
+              <small class="text-muted">Lukasz Holeczek</small>
+              <small class="text-muted float-right mt-1">1:52 PM</small>
+            </div>
+            <div class="text-truncate font-weight-bold">Lorem ipsum dolor sit amet</div>
+            <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt...</small>
+          </div>
+          <hr>
+          <div class="message">
+            <div class="py-3 pb-5 mr-3 float-left">
+              <div class="avatar">
+                <img src="static/img/avatars/7.jpg" class="img-avatar" alt="admin@bootstrapmaster.com">
+                <span class="avatar-status badge-success"></span>
+              </div>
+            </div>
+            <div>
+              <small class="text-muted">Lukasz Holeczek</small>
+              <small class="text-muted float-right mt-1">1:52 PM</small>
+            </div>
+            <div class="text-truncate font-weight-bold">Lorem ipsum dolor sit amet</div>
+            <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt...</small>
+          </div>
+        </div>
+      </b-tab>
+      <b-tab title="<i class='icon-settings'></i>">
+        <div class="p-3">
+          <h6>Settings</h6>
+          <div class="aside-options">
+            <div class="clearfix mt-4">
+              <small><b>Option 1</b></small>
+              <c-switch type="text" variant="success" on="on" off="off" :pill="true" size="sm" class="float-right" :checked="true"/>
+            </div>
+            <div>
+              <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</small>
+            </div>
+          </div>
+          <div class="aside-options">
+            <div class="clearfix mt-3">
+              <small><b>Option 2</b></small>
+              <c-switch type="text" variant="success" on="on" off="off" :pill="true" size="sm" class="float-right"/>
+            </div>
+            <div>
+              <small class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</small>
+            </div>
+          </div>
+          <div class="aside-options">
+            <div class="clearfix mt-3">
+              <small><b>Option 3</b></small>
+              <c-switch type="text" variant="success" on="on" off="off" :pill="true" size="sm" class="float-right"/>
+            </div>
+          </div>
+          <div class="aside-options">
+            <div class="clearfix mt-3">
+              <small><b>Option 4</b></small>
+              <c-switch type="text" variant="success" on="on" off="off" :pill="true" size="sm" class="float-right" :checked="true"/>
+            </div>
+          </div>
+          <hr>
+          <h6>System Utilization</h6>
+          <div class="text-uppercase mb-1 mt-4"><small><b>CPU Usage</b></small></div>
+          <b-progress class="progress-xs" variant="info" :value="25"></b-progress>
+          <small class="text-muted">348 Processes. 1/4 Cores.</small>
+          <div class="text-uppercase mb-1 mt-2"><small><b>Memory Usage</b></small></div>
+          <b-progress class="progress-xs" variant="warning" :value="70"></b-progress>
+          <small class="text-muted">11444GB/16384MB</small>
+          <div class="text-uppercase mb-1 mt-2"><small><b>SSD 1 Usage</b></small></div>
+          <b-progress class="progress-xs" variant="danger" :value="95"></b-progress>
+          <small class="text-muted">243GB/256GB</small>
+          <div class="text-uppercase mb-1 mt-2"><small><b>SSD 2 Usage</b></small></div>
+          <b-progress class="progress-xs" variant="success" :value="10"></b-progress>
+          <small class="text-muted">25GB/256GB</small>
+        </div>
+      </b-tab>
+    </b-tabs>
+  </aside>
+</template>
+
+<script>
+import Callout from './../utils/Callout'
+import cSwitch from './../utils/Switch'
+export default {
+  name: 'aside',
+  components: {
+    Callout,
+    cSwitch
+  }
+}
+</script>