Browse Source

feat:看板页面样式调整;

fuyang
YOU 9 months ago
parent
commit
3ccac5b39a
  1. 6
      src/views/dashboard/comp/bar.vue
  2. 18
      src/views/dashboard/comp/block.vue
  3. 4
      src/views/dashboard/comp/pop.vue

6
src/views/dashboard/comp/bar.vue

@ -52,7 +52,7 @@ export default defineComponent({
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 100%; height: 100%;
color: #00caff;
color: #fff;
&.around { &.around {
justify-content: space-around; justify-content: space-around;
.item { .item {
@ -93,12 +93,12 @@ export default defineComponent({
font-size: 24px; font-size: 24px;
text-align: left; text-align: left;
padding-right: 10px; padding-right: 10px;
color: #00faa8;
color: #1ef580;
font-weight: bold; font-weight: bold;
} }
> .unit { > .unit {
width: 6em; width: 6em;
color: #00e5ff;
color: #fff;
font-family: 'Alibaba PuHuiTi Heavy'; // font-family: 'Alibaba PuHuiTi Heavy'; //
font-size: 16px; font-size: 16px;
text-align: right; text-align: right;

18
src/views/dashboard/comp/block.vue

@ -15,19 +15,27 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, nextTick, onMounted, reactive, toRefs } from 'vue';
import { computed, defineComponent, h, nextTick, onMounted, reactive, toRefs } from 'vue';
import { IObject } from '@/types/interface'; import { IObject } from '@/types/interface';
import utilService from '@/service/utilService'; import utilService from '@/service/utilService';
export default defineComponent({ export default defineComponent({
name: 'block', name: 'block',
props: { item: { type: Object, default: () => ({}) }, dataForm: { type: Object, default: () => ({}) } },
props: { item: { type: Object, default: () => ({}) }, dataForm: { type: Object, default: () => ({}) }, width: { type: String, default: () => '484px' }, height: { type: String, default: () => '318px' } },
setup(props) { setup(props) {
const state = reactive({ const state = reactive({
blockRef: null, blockRef: null,
}); });
const block = computed(() => {
return {
w: props.width,
h: props.height,
};
});
return { return {
...toRefs(state), ...toRefs(state),
block,
}; };
}, },
emits: ['change-code'], emits: ['change-code'],
@ -36,8 +44,8 @@ export default defineComponent({
<style scoped lang="less"> <style scoped lang="less">
.block { .block {
width: 484px;
height: 318px;
width: v-bind('block.w');
height: v-bind('block.h');
background: url('@/assets/images/njhl/block.png') no-repeat center; background: url('@/assets/images/njhl/block.png') no-repeat center;
background-size: 100% 100%; background-size: 100% 100%;
display: flex; display: flex;
@ -50,7 +58,7 @@ export default defineComponent({
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 10px 38px; padding: 10px 38px;
color: #00e5ff;
color: #fff;
> span { > span {
font-size: 20px; font-size: 20px;

4
src/views/dashboard/comp/pop.vue

@ -67,7 +67,7 @@ export default defineComponent({
display: flex; display: flex;
flex-direction: column; flex-direction: column;
> .top { > .top {
color: #00caff;
color: #fff;
font-size: 18px; font-size: 18px;
margin: 6px 0; margin: 6px 0;
font-weight: bold; font-weight: bold;
@ -77,7 +77,7 @@ export default defineComponent({
position: relative; position: relative;
display: flex; display: flex;
align-items: center; align-items: center;
color: #00faa8;
color: #1ef580;
> .wrap { > .wrap {
position: absolute; position: absolute;
width: 100%; width: 100%;

Loading…
Cancel
Save