update: 删除demo
This commit is contained in:
xieyonghong
parent
232c844080
commit
8cc721b790
|
|
@ -50,36 +50,16 @@ export const AccountMenu = {
|
|||
|
||||
export default [
|
||||
{ path: '/*', redirect: '/'},
|
||||
// start: 测试用, 可删除
|
||||
{
|
||||
path: '/login',
|
||||
component: () => import('@/views/user/Login/index.vue')
|
||||
},
|
||||
{
|
||||
path: '/demo',
|
||||
component: () => import('@/views/demo/index.vue')
|
||||
},
|
||||
{
|
||||
path: '/account/center/bind',
|
||||
component: () => import('@/views/account/Center/bind/index.vue')
|
||||
},
|
||||
{
|
||||
path: '/table',
|
||||
component: () => import('@/views/demo/table/index.vue')
|
||||
},
|
||||
{
|
||||
path: '/form',
|
||||
component: () => import('@/views/demo/Form.vue')
|
||||
},
|
||||
// {
|
||||
// path: '/system/Api',
|
||||
// component: () => import('@/views/system/Platforms/index.vue')
|
||||
// },
|
||||
// end: 测试用, 可删除
|
||||
|
||||
// 初始化
|
||||
{
|
||||
path: '/init-home',
|
||||
path: '/init-home', // 初始化
|
||||
component: () => import('@/views/init-home/index.vue')
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -1,61 +0,0 @@
|
|||
<template>
|
||||
<Form
|
||||
ref='form'
|
||||
:options='options'
|
||||
:initValue='initValue'
|
||||
/>
|
||||
<a-button @click='submit'>提交</a-button>
|
||||
<a-button @click='reset'>重置</a-button>
|
||||
<a-button @click='setValue'>修改name</a-button>
|
||||
</template>
|
||||
|
||||
<script setup name='FormDemo'>
|
||||
import { componentType } from 'components/Form'
|
||||
const form = ref()
|
||||
const initValue = reactive({})
|
||||
|
||||
const submit = () => {
|
||||
form.value.formValidate().then(res => {
|
||||
console.log(res)
|
||||
})
|
||||
}
|
||||
|
||||
const reset = () => {
|
||||
form.value.reset()
|
||||
}
|
||||
|
||||
const setValue =() => {
|
||||
initValue.name = '111111'
|
||||
}
|
||||
|
||||
const options = reactive({
|
||||
name: {
|
||||
component: componentType.input,
|
||||
componentProps: {
|
||||
style: {
|
||||
width: '200px'
|
||||
}
|
||||
},
|
||||
title: '测试',
|
||||
required: true
|
||||
},
|
||||
sex: {
|
||||
component: componentType.select,
|
||||
title: '性别',
|
||||
options: [
|
||||
{ label: '111', value: 1 },
|
||||
{ label: '222', value: 2 },
|
||||
],
|
||||
required: true,
|
||||
rules: [
|
||||
{ required: true, message: '请选择性别'}
|
||||
],
|
||||
tooltip: '性别',
|
||||
default: 1
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
|
@ -1,83 +0,0 @@
|
|||
<!-- test demo -->
|
||||
<template>
|
||||
<div class="page-container">
|
||||
父级: {{ testValue }}
|
||||
<ValueItem v-model="testValue" />
|
||||
<!-- 卡片 -->
|
||||
<br />卡片组件：
|
||||
<a-row :gutter="20">
|
||||
<a-col :span="6">
|
||||
<CardBox
|
||||
status="disable"
|
||||
:statusNames="{ disable: StatusColorEnum.error }"
|
||||
statusText="正常"
|
||||
:actions="actions"
|
||||
v-model="data"
|
||||
>
|
||||
<template #img>
|
||||
<img :src="getImage('/device-product.png')" />
|
||||
</template>
|
||||
<template #content>
|
||||
<div class="card-item-heard-name">设备名称</div>
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
设备类型
|
||||
</div>
|
||||
<div>直连设备</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
产品名称
|
||||
</div>
|
||||
<div>测试固定地址</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
</CardBox>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import CardBox from '@/components/CardBox/index.vue';
|
||||
import { StatusColorEnum } from '@/utils/consts';
|
||||
import { getImage } from '@/utils/comm';
|
||||
|
||||
const testValue = ref('');
|
||||
// 卡片按钮
|
||||
const actions = ref([
|
||||
{
|
||||
key: 'check',
|
||||
label: '查看',
|
||||
},
|
||||
{
|
||||
key: 'edit',
|
||||
label: '编辑',
|
||||
disabled: true,
|
||||
message: '暂无权限，请联系管理员',
|
||||
},
|
||||
{
|
||||
key: 'delete',
|
||||
label: '删除',
|
||||
},
|
||||
]);
|
||||
const data = ref({
|
||||
id: 123
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.card-item-heard-name {
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.card-item-content-text {
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,187 +0,0 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<JTable
|
||||
:columns="columns"
|
||||
:request="request"
|
||||
:rowSelection="{
|
||||
selectedRowKeys: _selectedRowKeys,
|
||||
onChange: onSelectChange
|
||||
}"
|
||||
@cancelSelect="cancelSelect"
|
||||
>
|
||||
<template #headerTitle>
|
||||
<a-button type="primary" @click="add">新增</a-button>
|
||||
</template>
|
||||
<template #card="slotProps">
|
||||
<CardBox
|
||||
:value="slotProps"
|
||||
@click="handleClick"
|
||||
:actions="getActions(slotProps)"
|
||||
v-bind="slotProps"
|
||||
:active="_selectedRowKeys.includes(slotProps.id)"
|
||||
:status="slotProps.state ? 'success' : 'error'"
|
||||
>
|
||||
<template #img>
|
||||
<slot name="img">
|
||||
<img :src="getImage('/device-product.png')" />
|
||||
</slot>
|
||||
</template>
|
||||
<template #content>
|
||||
<h3>{{slotProps.name}}</h3>
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<div class="card-item-content-text">
|
||||
设备类型
|
||||
</div>
|
||||
<div>直连设备</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
<template #actions="item">
|
||||
<a-popconfirm v-if="item.popConfirm" v-bind="item.popConfirm">
|
||||
<a-button :disabled="item.disabled">
|
||||
<DeleteOutlined v-if="item.key === 'delete'" />
|
||||
<template v-else>
|
||||
<AIcon :type="item.icon" />
|
||||
<span>{{ item.text }}</span>
|
||||
</template>
|
||||
</a-button>
|
||||
</a-popconfirm>
|
||||
<template v-else>
|
||||
<a-button :disabled="item.disabled">
|
||||
<DeleteOutlined v-if="item.key === 'delete'" />
|
||||
<template v-else>
|
||||
<AIcon :type="item.icon" />
|
||||
<span>{{ item.text }}</span>
|
||||
</template>
|
||||
</a-button>
|
||||
</template>
|
||||
</template>
|
||||
</CardBox>
|
||||
</template>
|
||||
<template #id="slotProps">
|
||||
<a>{{slotProps.id}}</a>
|
||||
</template>
|
||||
<template #action="slotProps">
|
||||
<a-space :size="16">
|
||||
<a-tooltip v-for="i in getActions(slotProps)" :key="i.key" v-bind="i.tooltip">
|
||||
<a-popconfirm v-if="i.popConfirm" v-bind="i.popConfirm">
|
||||
<a-button :disabled="i.disabled" style="padding: 0" type="link"><AIcon :type="i.icon" /></a-button>
|
||||
</a-popconfirm>
|
||||
<a-button style="padding: 0" type="link" v-else @click="i.onClick && i.onClick(slotProps)">
|
||||
<a-button :disabled="i.disabled" style="padding: 0" type="link"><AIcon :type="i.icon" /></a-button>
|
||||
</a-button>
|
||||
</a-tooltip>
|
||||
</a-space>
|
||||
</template>
|
||||
</JTable>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import server from "@/utils/request";
|
||||
import type { ActionsType } from '@/components/Table/index.vue'
|
||||
import { getImage } from '@/utils/comm';
|
||||
import { DeleteOutlined } from '@ant-design/icons-vue'
|
||||
import { message } from "ant-design-vue";
|
||||
|
||||
const request = (data: any) => server.post(`/device-product/_query`, data)
|
||||
// const request = (data: any) => server.post(`/device/category/_tree`, {paging: false})
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
title: 'ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
scopedSlots: true
|
||||
},
|
||||
{
|
||||
title: '分类',
|
||||
dataIndex: 'classifiedName',
|
||||
key: 'classifiedName',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
fixed: 'right',
|
||||
width: 250,
|
||||
scopedSlots: true
|
||||
}
|
||||
]
|
||||
|
||||
const _selectedRowKeys = ref<string[]>([])
|
||||
|
||||
const onSelectChange = (keys: string[]) => {
|
||||
_selectedRowKeys.value = [...keys]
|
||||
}
|
||||
|
||||
const cancelSelect = () => {
|
||||
_selectedRowKeys.value = []
|
||||
}
|
||||
|
||||
const handleClick = (dt: any) => {
|
||||
// _selectedRowKeys.value = [dt.id] // 单选
|
||||
// _selectedRowKeys.value = [..._selectedRowKeys.value, dt.id] // 多选
|
||||
if(_selectedRowKeys.value.includes(dt.id)) {
|
||||
const _index = _selectedRowKeys.value.findIndex(i => i === dt.id)
|
||||
_selectedRowKeys.value.splice(_index, 1)
|
||||
} else {
|
||||
_selectedRowKeys.value = [..._selectedRowKeys.value, dt.id]
|
||||
}
|
||||
}
|
||||
|
||||
const getActions = (data: Partial<Record<string, any>>): ActionsType[] => {
|
||||
if(!data){
|
||||
return []
|
||||
}
|
||||
return [
|
||||
{
|
||||
key: 'edit',
|
||||
text: "编辑",
|
||||
tooltip: {
|
||||
title: '编辑'
|
||||
},
|
||||
icon: 'icon-rizhifuwu'
|
||||
},
|
||||
{
|
||||
key: 'import',
|
||||
text: "导入",
|
||||
tooltip: {
|
||||
title: '导入'
|
||||
},
|
||||
disabled: true,
|
||||
icon: 'icon-xiazai'
|
||||
},
|
||||
{
|
||||
key: 'delete',
|
||||
text: "删除",
|
||||
tooltip: {
|
||||
title: !!data?.state ? '正常的产品不能删除' : '删除'
|
||||
},
|
||||
popConfirm: {
|
||||
title: '确认删除?'
|
||||
},
|
||||
icon: 'icon-huishouzhan'
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
const add = () => {
|
||||
message.warn('123')
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="less" scoped>
|
||||
.box {
|
||||
padding: 20px;
|
||||
background: #f0f2f5;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
import { Button } from 'ant-design-vue'
|
||||
|
||||
export default defineComponent({
|
||||
setup(){
|
||||
return () => <div>
|
||||
<Button type='primary'>新增</Button>
|
||||
</div>
|
||||
}
|
||||
})
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<div>
|
||||
<div class='timer'>
|
||||
<Timer ref='timerRef' v-model:value='data.trigger.timer' />
|
||||
<Action
|
||||
:thenOptions="data.branches ? data?.branches[0].then : []"
|
||||
:name="0"
|
||||
|
|
@ -13,6 +14,7 @@
|
|||
import { useSceneStore } from '@/store/scene';
|
||||
import Action from '../action/index.vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import Timer from '../components/Timer'
|
||||
|
||||
const sceneStore = useSceneStore();
|
||||
const { data } = storeToRefs(sceneStore);
|
||||
|
|
|
|||
|
|
@ -14,6 +14,10 @@
|
|||
<Device v-if='data.triggerType === "device"' />
|
||||
<Manual v-else-if='data.triggerType === "manual"' />
|
||||
<Timer v-else-if='data.triggerType === "timer"' />
|
||||
<j-form-item>
|
||||
<j-text-area
|
||||
/>
|
||||
</j-form-item>
|
||||
</j-form>
|
||||
<PermissionButton
|
||||
type='primary'
|
||||
|
|
|
|||
Loading…
Reference in New Issue