提交 f8f0b9b8 编写于 作者: RedPig97's avatar RedPig97

update: less组件替换scss

上级 fcc4ae31
......@@ -28,6 +28,6 @@ export default class Error404 extends Vue {
}
</script>
<style lang='less'>
@import './404.less';
<style lang='scss'>
@import './404.scss';
</style>
\ No newline at end of file
......@@ -28,6 +28,6 @@ export default class Error404 extends Vue {
}
</script>
<style lang='less'>
@import './500.less';
<style lang='scss'>
@import './500.scss';
</style>
\ No newline at end of file
......@@ -163,6 +163,6 @@ export default class ActionTimeline extends Vue {
}
</script>
<style lang='less'>
@import './action-timeline.less';
<style lang='scss'>
@import './action-timeline.scss';
</style>
\ No newline at end of file
......@@ -150,6 +150,6 @@ export default class AppActionBar extends Vue {
}
</script>
<style lang='less'>
@import "./app-actionbar.less";
<style lang='scss'>
@import "./app-actionbar.scss";
</style>
\ No newline at end of file
......@@ -93,6 +93,6 @@ export default class AppAddressSelection extends Vue {
}
</script>
<style lang='less'>
@import './app-address-selection.less';
<style lang='scss'>
@import './app-address-selection.scss';
</style>
\ No newline at end of file
......@@ -112,7 +112,7 @@ export default class AppAlertGroup extends Vue {
}
</script>
<style lang="less">
<style lang="scss">
.view-body-messages {
margin-bottom: 6px;
}
......
......@@ -230,6 +230,6 @@ export default class AppAlert extends Vue {
}
</script>
<style lang="less">
@import './app-alert.less';
<style lang="scss">
@import './app-alert.scss';
</style>
\ No newline at end of file
......@@ -319,6 +319,6 @@ export default class AppAutocomplete extends Vue {
}
</script>
<style lang='less'>
@import './app-autocomplete.less';
<style lang='scss'>
@import './app-autocomplete.scss';
</style>
\ No newline at end of file
......@@ -216,6 +216,6 @@ export default class Breadcrumb extends Vue {
}
</script>
<style lang='less'>
@import "./app-breadcrumb.less";
<style lang='scss'>
@import "./app-breadcrumb.scss";
</style>
\ No newline at end of file
......@@ -55,6 +55,6 @@ export default class AppBuild extends Vue {
}
</script>
<style lang="less">
@import './app-build.less';
<style lang="scss">
@import './app-build.scss';
</style>
\ No newline at end of file
.app-calendar-itemlayoutpanel{
display: flex;
.item-icon{
width: 40px;
height: 40px;
margin-right: 10px;
img{
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.item-text{
.title{
font-size: 18px;
font-weight: bold;
}
.srfdescription{
margin-top: 14px;
margin-bottom: 14px;
}
.date{
.start{
margin:0 6px;
}
.end{
margin:0 6px;
}
}
}
}
<template>
<div class="app-calendar-itemlayoutpanel">
<div class="item-icon">
</div>
<div class="item-text">
<div class="title">{{inputData.title}}</div>
<div class="srfdescription">{{inputData.srfdescription}}</div>
<div class="date">
{{ $t('userCustom.AppCalendarItemlayoutpanel.from') }}
<span class="start">{{inputData.start}}</span>
{{$t('userCustom.AppCalendarItemlayoutpanel.to')}}
<span class="end">{{inputData.end}}</span>
</div>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
import { Subject,Subscription } from 'rxjs';
@Component({
})
export default class AppCalendarItemlayoutpanel extends Vue {
/**
* 面板数据对象
*
* @type {*}
* @memberof AppCalendarItemlayoutpanel
*/
@Prop() public inputData?: any;
}
</script>
<style lang="scss">
@import './app-calendar-itemlayoutpanel.scss';
</style>
\ No newline at end of file
......@@ -284,6 +284,6 @@ export default class AppCheckBox extends Vue {
}
</script>
<style lang='less'>
@import './app-checkbox-list.less';
<style lang='scss'>
@import './app-checkbox-list.scss';
</style>
\ No newline at end of file
......@@ -50,6 +50,6 @@ export default class AppCheckbox extends Vue {
}
</script>
<style lang='less'>
@import "./app-checkbox.less";
<style lang='scss'>
@import "./app-checkbox.scss";
</style>
\ No newline at end of file
......@@ -179,6 +179,6 @@ export default class AppColorPicker extends Vue {
}
</script>
<style lang="less">
@import './app-color-picker.less';
<style lang="scss">
@import './app-color-picker.scss';
</style>
......@@ -152,7 +152,7 @@ export default class AppColorSpan extends Vue {
}
</script>
<style lang="less">
<style lang="scss">
.text-color{
padding: 2px 8px;
margin: 6px 6px 6px 0px;
......
......@@ -53,6 +53,6 @@ export default class AppColumnFormat extends Vue {
}
</script>
<style lang='less'>
@import "./app-column-format.less";
<style lang='scss'>
@import "./app-column-format.scss";
</style>
\ No newline at end of file
......@@ -314,6 +314,6 @@ export default class AppColumnLink extends Vue {
}
</script>
<style lang='less'>
@import './app-column-link.less';
<style lang='scss'>
@import './app-column-link.scss';
</style>
\ No newline at end of file
......@@ -148,6 +148,6 @@ export default class AppColumnRender extends Vue {
}
</script>
<style lang='less'>
@import "./app-column-render.less";
<style lang='scss'>
@import "./app-column-render.scss";
</style>
\ No newline at end of file
......@@ -457,6 +457,6 @@ export default class AppDashboardDesign extends Vue {
}
</script>
<style lang="less">
@import "./app-dashboard-design.less";
<style lang="scss">
@import "./app-dashboard-design.scss";
</style>
\ No newline at end of file
.app-data-card{
padding: 10px;
.data-item{
display: flex;
margin-bottom: 16px;
.item-text{
.srfmajortext{
font-size: 18px;
font-weight: bold;
}
.srfdescription{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
}
}
.item-icon{
width: 50px;
height: 50px;
margin-right: 10px;
.single-card-img{
border-radius: 50%;
width: 100%;
height: 100%;
}
}
}
.data-view-item-action{
width: 100%;
display: flex;
justify-content: space-around;
border-top: 1px solid #e2e2e2;
padding-top: 10px;
button{
width: 50%;
font-size: 15px;
border: none;
background-color: transparent;
border: none;
}
}
}
\ No newline at end of file
<template>
<div class="app-data-card">
<div class="data-item">
<div class="item-icon">
<img v-if="inputData.srficonpath" :src="inputData.srficonpath" class="single-card-img" />
<img v-else src="/assets/img/noimage.png" class="single-card-img" />
</div>
<div class="item-text">
<div class="srfmajortext">{{inputData.srfmajortext}}</div>
<div class="srfdescription" :title="inputData.srfdescription">{{inputData.srfdescription}}</div>
</div>
</div>
<div class="data-view-item-action" v-if="actionModel">
<template v-for="(action,index) in Object.keys(actionModel)">
<button type="info" :key="index" @click="uiAction(inputData, action, $event)">
<i :class="actionModel[action].icon" style="margin-right:2px;"></i>
<span>{{actionModel[action].caption}}</span>
</button>
</template>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
import { Subject,Subscription } from 'rxjs';
@Component({
})
export default class AppDataCard extends Vue {
/**
* 面板数据对象
*
* @type {*}
* @memberof AppDataCard
*/
@Prop() public inputData?: any;
/**
* 操作栏模型
*
* @type {*}
* @memberof AppDataCard
*/
@Prop() public actionModel:any;
/**
* 操作列界面行为
*
* @param {*} data
* @param {*} tag
* @param {*} $event
* @memberof AppDataCard
*/
public uiAction(data: any, tag: any, $event: any) {
this.$emit('uiAction',data, tag, $event)
}
}
</script>
<style lang="scss">
@import './app-data-card.scss';
</style>
\ No newline at end of file
......@@ -607,6 +607,6 @@ export default class AppDataUploadView extends Vue {
}
</script>
<style lang="less">
@import "./app-data-upload.less";
<style lang="scss">
@import "./app-data-upload.scss";
</style>
......@@ -431,6 +431,6 @@ export default class AppDepartmentPersonnel extends Vue {
}
</script>
<style lang="less">
@import './app-department-personnel.less';
<style lang="scss">
@import './app-department-personnel.scss';
</style>
\ No newline at end of file
......@@ -283,6 +283,6 @@ export default class AppDepartmentSelect extends Vue {
}
</script>
<style lang='less'>
@import './app-department-select.less';
<style lang='scss'>
@import './app-department-select.scss';
</style>
\ No newline at end of file
......@@ -285,6 +285,6 @@ export default class AppEmbedPicker extends Vue {
}
</script>
<style lang='less'>
@import './app-embed-picker.less';
<style lang='scss'>
@import './app-embed-picker.scss';
</style>
\ No newline at end of file
......@@ -135,6 +135,6 @@ export default class AppExportExcel extends Vue {
}
</script>
<style lang='less'>
@import './app-export-excel.less';
<style lang='scss'>
@import './app-export-excel.scss';
</style>
......@@ -513,6 +513,6 @@ export default class AppFileUpload extends Vue {
}
</script>
<style lang='less'>
@import './app-file-upload.less';
<style lang='scss'>
@import './app-file-upload.scss';
</style>
\ No newline at end of file
......@@ -497,6 +497,6 @@ export default class AppFormDRUIPart extends Vue {
}
}
</script>
<style lang = "less">
@import './app-form-druipart.less';
<style lang="scss">
@import './app-form-druipart.scss';
</style>
\ No newline at end of file
......@@ -351,6 +351,6 @@ export default class AppFormGroup extends Vue {
}
}
</script>
<style lang='less'>
@import './app-form-group.less';
<style lang='scss'>
@import './app-form-group.scss';
</style>
\ No newline at end of file
......@@ -62,6 +62,6 @@ export default class AppFormGroup2 extends Vue {
}
</script>
<style lang="less">
@import './app-form-group2.less';
<style lang="scss">
@import './app-form-group2.scss';
</style>
\ No newline at end of file
......@@ -288,6 +288,6 @@ export default class AppFormItem extends Vue {
}
</script>
<style lang='less'>
@import "./app-form-item.less";
<style lang='scss'>
@import "./app-form-item.scss";
</style>
\ No newline at end of file
......@@ -211,6 +211,6 @@ export default class AppFormItem2 extends Vue {
}
}
</script>
<style lang="less">
@import "./app-form-item2.less";
<style lang="scss">
@import "./app-form-item2.scss";
</style>
\ No newline at end of file
......@@ -239,6 +239,6 @@ export default class AppFormPart extends Vue {
}
</script>
<style lang = "less">
@import './app-form-part.less';
<style lang="scss">
@import './app-form-part.scss';
</style>
\ No newline at end of file
......@@ -28,6 +28,6 @@ export default class AppForm extends Vue {
@Prop() public name?: string;
}
</script>
<style lang = "less">
@import './app-form.less';
<style lang="scss">
@import './app-form.scss';
</style>
\ No newline at end of file
......@@ -91,6 +91,6 @@ export default class AppFormatData extends Vue {
}
</script>
<style lang="less">
@import './app-format-data.less';
<style lang="scss">
@import './app-format-data.scss';
</style>
\ No newline at end of file
<template>
<div class="fullscren">
<Icon :type="fullScren == true ? 'ios-contract' : 'ios-expand'" size="22" @click="handleScreen"/>
<Icon :type="fullScren == true ? 'ios-contract' : 'ios-expand'" color="#aaa" size="22" @click="handleScreen"/>
</div>
</template>
<script lang = 'ts'>
......@@ -82,7 +82,7 @@ export default class AppFullScren extends Vue{
}
</script>
<style lang='less'>
<style lang='scss'>
.fullscren{
cursor:pointer;
padding: 0 5px;
......
......@@ -283,7 +283,7 @@ export default class AppGroupPicker extends Vue {
}
</script>
<style lang="less">
<style lang="scss">
.ibiz-group-picker{
width: 100%;
height: 100%;
......
......@@ -327,6 +327,6 @@ export default class AppGroupSelect extends Vue {
}
</script>
<style lang="less">
@import './app-group-select.less';
<style lang="scss">
@import './app-group-select.scss';
</style>
\ No newline at end of file
......@@ -74,6 +74,6 @@ export default class AppQuickMenus extends Vue {
}
</script>
<style lang='less'>
@import "./app-icon-menus.less";
<style lang='scss'>
@import "./app-icon-menus.scss";
</style>
\ No newline at end of file
......@@ -199,6 +199,6 @@ export default class AppImagePreview extends Vue {
}
</script>
<style lang = "less">
@import './app-image-preview.less';
<style lang="scss">
@import './app-image-preview.scss';
</style>
\ No newline at end of file
......@@ -503,6 +503,6 @@ export default class AppImageUpload extends Vue {
}
}
</script>
<style lang = "less">
@import './app-image-upload.less';
<style lang="scss">
@import './app-image-upload.scss';
</style>
\ No newline at end of file
......@@ -184,6 +184,6 @@ export default class AppInputIp extends Vue {
}
</script>
<style lang='less'>
@import './app-input-ip.less';
<style lang='scss'>
@import './app-input-ip.scss';
</style>
......@@ -177,7 +177,7 @@ export default {
}
</script>
<style lang="less">
<style lang="scss">
</style>
......@@ -67,6 +67,6 @@ export default class AppLang extends Vue {
}
</script>
<style lang="less">
@import './app-lang.less';
<style lang="scss">
@import './app-lang.scss';
</style>
\ No newline at end of file
.app-list-itemlayoutpanel{
padding: 0 0 0 20px;
// margin: 10px;
.srfmajortext{
font-size: 16px;
cursor: pointer;
}
.srfdescription{
margin-bottom: 10px;
}
.el-tag{
margin: 10px 6px 10px 0;
color: #000;
padding: 0 16px;
max-height: 24px;
line-height: 24px;
background-color: rgb(250, 250, 250)
}
.srfmajortext:hover{
color: #40a9ff;
}
.user-information{
display: flex;
.srficon{
width: 28px;
height: 28px;
margin-right: 6px;
>img{
width: 100%;
border-radius: 50%;
height: 100%;
}
}
}
.app-list-item-action{
margin-top:6px;
>a{
margin:0 20px 0 0 !important;
}
}
}
<template>
<div v-if="inputData" class="app-list-itemlayoutpanel">
<h4 class="srfmajortext">{{inputData.srfmajortext}}</h4>
<template v-for="(tagitem,index) of tagArr">
<el-tag v-if="tagArr" type="info" size="medium" :key="index">{{tagitem}}</el-tag>
</template>
<p class="srfdescription">{{inputData.srfdescription}}</p>
<div class="user-information">
<div class="srficon">
<img v-if="inputData.srficon" :src="inputData.srficon" />
<img v-else src="/assets/img/noimage.png" alt="">
</div>
<span class="srfdate">{{inputData.srfdate}}</span>
</div>
<div class="app-list-item-action" v-if="actionModel">
<template v-for="(action,index) in Object.keys(actionModel)">
<a :key="index" style="display: inline-block;margin: 0 12px;" @click="uiAction(inputData, action, $event)">
<i :class="actionModel[action].icon" style="margin-right:2px;"></i>
<span>{{actionModel[action].caption}}</span>
</a>
</template>
</div>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Model, Watch } from 'vue-property-decorator';
import { Subject,Subscription } from 'rxjs';
@Component({
})
export default class AppListItemlayoutpanel extends Vue {
/**
* 传递数据
*
* @type {any}
* @memberof AppListItemlayoutpanel
*/
@Prop() public inputData: any;
/**
* 操作栏模型
*
* @type {*}
* @memberof AppListItemlayoutpanel
*/
@Prop() public actionModel:any;
/**
* 处理数据
*
* @memberof AppListItemlayoutpanel
*/
public tagArr:Array<any>=[];
/**
* 操作列界面行为
*
* @param {*} data
* @param {*} tag
* @param {*} $event
* @memberof AppListItemlayoutpanel
*/
public uiAction(data: any, tag: any, $event: any) {
this.$emit('uiAction',data, tag, $event)
}
/**
* vue生命周期
*
* @memberof AppListItemlayoutpanel
*/
public created(){
if(this.inputData && this.inputData.srftag){
this.tagArr = this.inputData.srftag.split(',');
}
}
}
</script>
<style lang='scss'>
@import './app-list-itemlayoutpanel.scss';
</style>
\ No newline at end of file
<template>
<div class="lockscren">
<span>
<Icon type="md-lock" size="22" @click="handleLock"/>
<Icon type="md-lock" size="22" color="#aaa" @click="handleLock"/>
<el-dialog :title="this.$t('components.lockScren.title')"
:visible.sync="box"
width="30%"
......@@ -91,7 +91,7 @@ export default class AppLockScren extends Vue{
}
</script>
<style lang='less'>
<style lang='scss'>
.lockscren{
cursor:pointer;
padding: 0 5px;
......
......@@ -116,6 +116,6 @@ export default class AppLockIndex extends Vue{
}
</script>
<style lang='less'>
@import './app-lock.less';
<style lang='scss'>
@import './app-lock.scss';
</style>
\ No newline at end of file
......@@ -464,6 +464,6 @@ export default class AppMapPosition extends Vue {
}
</script>
<style lang='less'>
@import './app-map-position.less';
<style lang='scss'>
@import './app-map-position.scss';
</style>
\ No newline at end of file
......@@ -19,6 +19,7 @@
font-size: 19px;
padding-top: 2px;
padding-right: 2px;
color: #aaa;
cursor: pointer;
}
......
......@@ -224,6 +224,6 @@ export default class AppMessagePopover extends Vue {
}
</script>
<style lang='less'>
@import "app-message-popover.less";
<style lang='scss'>
@import "app-message-popover.scss";
</style>
\ No newline at end of file
......@@ -386,6 +386,6 @@ export default class AppMpicker extends Vue {
}
</script>
<style lang="less">
@import './app-mpicker.less';
<style lang="scss">
@import './app-mpicker.scss';
</style>
\ No newline at end of file
......@@ -320,6 +320,6 @@ export default class AppOrgSelect extends Vue {
}
</script>
<style lang="less">
@import "./app-org-select.less";
<style lang="scss">
@import "./app-org-select.scss";
</style>
\ No newline at end of file
......@@ -151,6 +151,6 @@ export default class AppOrgSector extends Vue {
}
</script>
<style lang="less">
@import "./app-orgsector.less";
<style lang="scss">
@import "./app-orgsector.scss";
</style>
\ No newline at end of file
......@@ -57,6 +57,6 @@ export default class AppPanelButton extends Vue {
}
</script>
<style lang='less'>
<style lang='scss'>
</style>
\ No newline at end of file
......@@ -201,6 +201,6 @@ export default class AppPanelField extends Vue {
}
}
</script>
<style lang='less'>
@import "./app-panel-field.less";
<style lang='scss'>
@import "./app-panel-field.scss";
</style>
\ No newline at end of file
此差异已折叠。
此差异已折叠。
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册