<template>
|
<div class="container">
|
<div class="title">
|
{{ topHeader }}
|
<span class="back" @click="back"> <i class="iconfont icon-fanhui"></i> 返回 </span>
|
</div>
|
|
<div class="log-list">
|
<el-divider content-position="left" direction="vertical" class="top-class"></el-divider>
|
<el-text type="primary">可以根据下面预设值进行初始化</el-text>
|
|
<!-- <el-form model="form" ref="form" :inline="true" class="pre-form-class" label-width="auto" size="small"> -->
|
<el-form model="form" ref="form" :inline="true" class="pre-form-class" label-width="auto">
|
<el-form-item label="日志日期">
|
<el-date-picker
|
v-model="daily_date"
|
type="date"
|
placeholder="日志日期"
|
size="default"
|
value-format="YYYY-MM-DD"
|
style="width: 120px"
|
@change="preDateChange"
|
:disabled="true"
|
/>
|
</el-form-item>
|
|
<el-form-item label="日志类型">
|
<el-select
|
v-model="daily_type"
|
placeholder="日志类型"
|
style="width: 120px"
|
clearable
|
filterable
|
:disabled="confirm_flag"
|
@change="preDailyTypeChange"
|
>
|
<el-option v-for="item in dailyTypeArr" :key="item.value" :label="item.label" :value="item.value" />
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="所属项目">
|
<el-select
|
v-model="project_id"
|
placeholder="所属项目"
|
style="width: 150px"
|
clearable
|
filterable
|
:disabled="confirm_flag"
|
@change="preProjectInfoChange"
|
>
|
<el-option v-for="item in projectInfoArr" :key="item.id" :label="item.project_name" :value="item.id" />
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="状态">
|
<el-select
|
v-model="daily_status"
|
placeholder="状态"
|
style="width: 150px"
|
clearable
|
filterable
|
:disabled="confirm_flag"
|
@change="preProjectStatusChange"
|
>
|
<el-option v-for="item in dailyStatusArr" :key="item.value" :label="item.label" :value="item.value" />
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="初始化条数">
|
<el-input
|
type="number"
|
v-model="itemSize"
|
placeholder="初始化条数"
|
style="width: 80px"
|
@change="preItemSizeChange"
|
:disabled="confirm_flag"
|
/>
|
</el-form-item>
|
|
<el-form-item>
|
<el-button @click="addRow" class="add-button" type="primary" v-if="!confirm_flag">增加</el-button>
|
<el-button @click="submitForm" class="add-button" type="primary" v-if="!confirm_flag">保存</el-button>
|
<el-button @click="submitConfirmForm" class="add-button" type="primary" v-else>工时确认</el-button>
|
</el-form-item>
|
</el-form>
|
|
<div v-for="(daily, index) in dailys" :key="index" class="log-item">
|
<!-- <el-form :inline="true" :rules="rules" :ref="refHandler" :key="index" :model="daily" size="small"> -->
|
<el-form :inline="true" :rules="rules" :ref="refHandler" :key="index" :model="daily">
|
<div class="log-item-content">
|
<el-form-item>
|
<el-text class="log-index">{{ index + 1 }}</el-text>
|
</el-form-item>
|
|
<el-form-item label="日志日期" prop="daily_date" :label-width="labelWidth">
|
<el-date-picker
|
v-model="daily.daily_date"
|
type="date"
|
placeholder="日志日期"
|
size="default"
|
value-format="YYYY-MM-DD"
|
style="width: 120px"
|
:disabled="true"
|
:key="index"
|
/>
|
</el-form-item>
|
|
<el-form-item label="日志类型" prop="daily_type" :label-width="labelWidth">
|
<el-select
|
v-model="daily.daily_type"
|
placeholder="日志类型"
|
style="width: 100px"
|
clearable
|
filterable
|
:disabled="confirm_flag"
|
:key="index"
|
>
|
<!-- 其他类型选项 -->
|
<el-option
|
v-for="item in daily.dailyTypeArr"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="所属项目" prop="project_id" :label-width="labelWidth">
|
<el-select
|
v-model="daily.project_id"
|
placeholder="所属项目"
|
style="width: 140px"
|
clearable
|
filterable
|
:disabled="confirm_flag"
|
:key="index"
|
@change="updateTasks(index)"
|
>
|
<el-option
|
v-for="item in daily.projectInfoArr"
|
:key="item.id"
|
:label="item.project_name"
|
:value="item.id"
|
/>
|
</el-select>
|
</el-form-item>
|
|
<!-- <el-tooltip effect="dark" content="任务">
|
<el-form-item label="任务" prop="task_id" :label-width="labelWidth">
|
<el-select v-model="daily.task_id" placeholder="任务" style="width: 120px;" clearable filterable :disabled="confirm_flag" >
|
<el-option
|
v-for="item in daily.projectTaskArr"
|
:key="item.id"
|
:label="item.task_name"
|
:value="item.id"
|
/>
|
|
</el-select>
|
</el-form-item>
|
</el-tooltip> -->
|
|
<el-form-item label="状态" prop="daily_status" :label-width="labelWidth">
|
<el-select
|
v-model="daily.daily_status"
|
placeholder="状态"
|
style="width: 100px"
|
clearable
|
filterable
|
:key="index"
|
>
|
<el-option
|
v-for="item in daily.dailyStatusArr"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
/>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="日志内容" prop="daily_content" :label-width="labelWidth">
|
<el-input
|
v-model="daily.daily_content"
|
placeholder="日志内容"
|
style="width: 300px"
|
:disabled="confirm_flag"
|
:key="index"
|
/>
|
</el-form-item>
|
|
<el-form-item label="计划用时" prop="estimated_hours" :label-width="labelWidth">
|
<el-input-number
|
v-model="daily.estimated_hours"
|
:step="0.5"
|
label="计划用时"
|
placeholder="计划用时"
|
style="width: 120px"
|
:disabled="confirm_flag"
|
:key="index"
|
/>
|
</el-form-item>
|
|
<el-form-item label="实际用时" prop="actual_hours" :label-width="labelWidth" v-if="confirm_flag">
|
<el-input-number
|
v-model="daily.actual_hours"
|
:step="0.5"
|
:min="0"
|
label="实际用时"
|
placeholder="实际用时"
|
style="width: 120px"
|
:key="index"
|
/>
|
</el-form-item>
|
|
<el-form-item
|
label="备注"
|
prop="remark"
|
:label-width="labelWidth"
|
:rules="
|
daily.daily_status != '2' && confirm_flag
|
? { required: true, message: '请输入备注', trigger: ['blur', 'change'] }
|
: { required: false }
|
"
|
>
|
<el-input v-model="daily.remark" placeholder="备注" style="width: 120px" :key="index" />
|
</el-form-item>
|
|
<el-form-item>
|
<span @click="deleteRow(index)" class="delete-button" v-if="!confirm_flag" :key="index">删除</span>
|
</el-form-item>
|
</div>
|
</el-form>
|
|
<!-- <div class="log-item-action">
|
|
<span @click="deleteRow(index)" class="delete-button" v-if="!confirm_flag" >删除</span>
|
</div> -->
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { reactive, ref, onMounted } from 'vue'
|
import { ElMessageBox, ElMessage } from 'element-plus'
|
import projectInfo from '@/model/projectInfo'
|
import sysDictItemModel from '@/model/sysDictItem'
|
import projectDaily from '@/model/projectDaily'
|
|
export default {
|
props: {
|
comfirmFlag: {
|
type: Boolean,
|
default: false,
|
},
|
editDailyDate: {
|
type: String,
|
default: null,
|
},
|
},
|
setup(props, context) {
|
const topHeader = ref('日志新增')
|
const labelWidth = ref('90px')
|
const loading = ref(false)
|
|
const dailyTypeArr = ref([])
|
const dailyStatusArr = ref([])
|
const projectInfoArr = ref([])
|
const projectTaskArr = ref([])
|
|
const daily_date = ref(getDefaultDate())
|
const confirm_flag = ref(false)
|
const daily_type = ref('1')
|
const project_id = ref('')
|
const daily_status = ref('0')
|
|
const itemSize = ref(3)
|
|
const dailys = ref([])
|
|
const form = ref({})
|
|
const ruleForm = ref([])
|
const refHandler = el => {
|
if (el) {
|
ruleForm.value.push(el)
|
}
|
}
|
|
const listAssign = (a, b) => Object.keys(a).forEach(key => {
|
a[key] = b[key] || a[key]
|
})
|
|
/**
|
* 表单规则验证
|
*/
|
const rules = ref(getAddRules())
|
|
onMounted(() => {
|
loadDictDitems()
|
|
if (props.editId) {
|
// getdaily()
|
}
|
|
if (props.editDailyDate) {
|
// 设定当天的日志只能是传过来的值
|
daily_date.value = props.editDailyDate
|
}
|
confirm_flag.value = props.comfirmFlag
|
if (confirm_flag.value == true) {
|
topHeader.value = '日志工时确认'
|
rules.value = getConfirmRules()
|
} else {
|
confirm_flag.value == false
|
topHeader.value = '日志新增'
|
rules.value = getAddRules()
|
}
|
})
|
|
// 根据字典类型查询字典
|
const loadDictDitems = async () => {
|
dailyTypeArr.value = await sysDictItemModel.getSysDictItemListByType('daily_type')
|
dailyStatusArr.value = await sysDictItemModel.getSysDictItemListByType('daily_status')
|
const params = { status: '1,2,3,4' }
|
projectInfoArr.value = await projectInfo.getProjectInfoList(params)
|
// projectInfoArr.value= await projectInfo.getProjectInfoList("")
|
// 获取该daily_date 日期下的所有日志信息
|
await getdailyByDailyDate()
|
}
|
|
// 根据字典类型查询字典
|
const loadBatchRows = () => {
|
// 循环10次
|
for (let i = 0; i < itemSize.value; i++) {
|
addRow()
|
}
|
}
|
|
const getdaily = async () => {
|
loading.value = true
|
const res = await projectDaily.getProjectDaily(props.editId)
|
// listAssign(daily, res)
|
loading.value = false
|
}
|
|
const getdailyByDailyDate = async () => {
|
loading.value = true
|
const res = await projectDaily.getProjectDailyByDailyDate(daily_date.value)
|
if (res && res.length > 0) {
|
res.forEach(item => {
|
item.daily_type = String(item.daily_type)
|
item.project_id = String(item.project_id)
|
item.task_id = String(item.task_id)
|
item.daily_status = String(item.daily_status)
|
item.dailyTypeArr = dailyTypeArr
|
item.dailyStatusArr = dailyStatusArr
|
item.projectInfoArr = projectInfoArr
|
item.projectTaskArr = projectTaskArr
|
})
|
dailys.value = res
|
} else {
|
loadBatchRows()
|
}
|
|
loading.value = false
|
}
|
|
const preDateChange = () => {
|
for (let i = 0; i < dailys.value.length; i++) {
|
dailys.value[i].daily_date = daily_date.value
|
}
|
}
|
|
const preDailyTypeChange = () => {
|
for (let i = 0; i < dailys.value.length; i++) {
|
dailys.value[i].daily_type = daily_type.value
|
}
|
}
|
|
const preProjectInfoChange = () => {
|
for (let i = 0; i < dailys.value.length; i++) {
|
dailys.value[i].project_id = project_id.value
|
}
|
}
|
|
const preProjectStatusChange = () => {
|
for (let i = 0; i < dailys.value.length; i++) {
|
dailys.value[i].daily_status = daily_status.value
|
}
|
}
|
|
const preItemSizeChange = () => {
|
dailys.value = []
|
loadBatchRows()
|
}
|
|
// 重置表单
|
const resetForm = () => {
|
// dailys.value=[]
|
getdailyByDailyDate()
|
loadBatchRows()
|
const forms = ruleForm.value
|
forms.forEach(tmpForm => {
|
if (tmpForm) {
|
tmpForm.resetFields()
|
}
|
})
|
}
|
|
const validForm = () => {
|
const forms = ruleForm.value
|
|
const validateArray = forms.map(async (tmpForm, index, array) => await tmpForm.validate(valid => valid))
|
|
const result = Promise.all(validateArray)
|
return result
|
}
|
|
const submitForm = async formName => {
|
const result = validForm()
|
result.then(res => {
|
let validateFlag = true
|
res.forEach(validateRes => {
|
validateFlag &= validateRes
|
})
|
if (validateFlag) {
|
// 查看计划工时
|
let planHours = 0
|
for (let i = 0; i < dailys.value.length; i++) {
|
const index = i + 1
|
const tmpDaily = dailys.value[i]
|
planHours += tmpDaily.estimated_hours
|
}
|
if (planHours < 6) {
|
ElMessage.error(`计划用时小于6小时不能保存,${daily_date.value}的计划工时数为${planHours}小时！`)
|
return
|
}
|
|
ElMessageBox.confirm('确认保存吗, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(async () => {
|
loading.value = true
|
|
const newData = camel(dailys.value)
|
|
const tempForm = { daily_list: JSON.stringify(newData) }
|
|
const res = await projectDaily.createProjectDailyBatch(tempForm)
|
|
if (res.code < window.MAX_SUCCESS_CODE) {
|
// 重新初始化
|
resetForm()
|
ElMessage.success(`${res.message}`)
|
loading.value = false
|
} else {
|
ElMessage.error(`${res.message}`)
|
loading.value = false
|
}
|
})
|
.catch(() => {
|
// 用户点击取消按钮时执行的操作
|
// 可以选择不做任何事情，也可以显示取消消息
|
// ElMessage.info('操作已取消'); // 如果需要显示取消消息，可以取消注释
|
})
|
}
|
})
|
}
|
|
const submitForm2 = async formName => {
|
let planHours = 0
|
for (let i = 0; i < dailys.value.length; i++) {
|
const index = i + 1
|
const tmpDaily = dailys.value[i]
|
if (!tmpDaily.daily_date) {
|
ElMessage.error(`条目（${index}）的日志日期不能为空！`)
|
return
|
}
|
if (!tmpDaily.project_id) {
|
ElMessage.error(`条目（${index}）的所属项目不能为空！`)
|
return
|
}
|
if (!tmpDaily.daily_type) {
|
ElMessage.error(`条目（${index}）的日志类型不能为空！`)
|
return
|
}
|
if (!tmpDaily.daily_status) {
|
ElMessage.error(`条目（${index}）的状态不能为空！`)
|
return
|
}
|
|
if (!tmpDaily.daily_content) {
|
ElMessage.error(`条目（${index}）的日志内容不能为空！`)
|
return
|
}
|
if (!tmpDaily.estimated_hours) {
|
ElMessage.error(`条目（${index}）的计划用时不能为空！`)
|
return
|
}
|
planHours += tmpDaily.estimated_hours
|
}
|
|
// 工时不满6个小时的不可以保存，数据库加当前，区分新增和修改情况
|
const existHours = await projectDaily.getExistsHours(daily_date.value, '')
|
|
if (existHours) {
|
planHours += existHours.estimated_hours
|
}
|
if (planHours < 6) {
|
ElMessage.error(`计划用时小于6小时不能保存,${daily_date.value}的计划工时数为${planHours}小时！`)
|
return
|
}
|
|
// ElMessageBox.confirm('保存后当日日志需重新提交，如是未在计划内的请走补录流程, 是否继续?', '提示', {
|
ElMessageBox.confirm('确认保存吗, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(async () => {
|
loading.value = true
|
|
const newData = camel(dailys.value)
|
|
const tempForm = { daily_list: JSON.stringify(newData) }
|
|
const res = await projectDaily.createProjectDailyBatch(tempForm)
|
|
if (res.code < window.MAX_SUCCESS_CODE) {
|
// 重新初始化
|
resetForm()
|
ElMessage.success(`${res.message}`)
|
loading.value = false
|
} else {
|
ElMessage.error(`${res.message}`)
|
loading.value = false
|
}
|
})
|
.catch(() => {
|
// 用户点击取消按钮时执行的操作
|
// 可以选择不做任何事情，也可以显示取消消息
|
// ElMessage.info('操作已取消'); // 如果需要显示取消消息，可以取消注释
|
})
|
}
|
|
const submitConfirmForm = () => {
|
const result = validForm()
|
result.then(res => {
|
let validateFlag = true
|
res.forEach(validateRes => {
|
validateFlag &= validateRes
|
})
|
if (validateFlag) {
|
// 查看计划工时
|
let actualHours = 0
|
for (let i = 0; i < dailys.value.length; i++) {
|
const index = i + 1
|
const tmpDaily = dailys.value[i]
|
actualHours += tmpDaily.actual_hours
|
|
if (tmpDaily.daily_status != '2' && isBlank(tmpDaily.remark)) {
|
ElMessage.error('日志状态是非完成的需要填写备注！')
|
return
|
}
|
}
|
if (actualHours < 6) {
|
ElMessage.error(`实际用时小于6小时不能保存,${daily_date.value}的实际工时数为${actualHours}小时！`)
|
return
|
}
|
|
ElMessageBox.confirm('确认保存吗, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
})
|
.then(async () => {
|
loading.value = true
|
|
const newData = camel(dailys.value)
|
|
const tempForm = { daily_list: JSON.stringify(newData) }
|
|
const res = await projectDaily.createProjectDailyBatch(tempForm)
|
|
if (res.code < window.MAX_SUCCESS_CODE) {
|
// 重新初始化
|
resetForm()
|
ElMessage.success(`${res.message}`)
|
loading.value = false
|
} else {
|
ElMessage.error(`${res.message}`)
|
loading.value = false
|
}
|
})
|
.catch(() => {
|
// 用户点击取消按钮时执行的操作
|
// 可以选择不做任何事情，也可以显示取消消息
|
// ElMessage.info('操作已取消'); // 如果需要显示取消消息，可以取消注释
|
})
|
}
|
})
|
}
|
|
const addRow = () => {
|
dailys.value.push({
|
id: '',
|
project_id: project_id.value,
|
task_id: '',
|
task_desc: '',
|
// daily_date:daily_date.value,
|
daily_date: props.editDailyDate,
|
daily_type: daily_type.value,
|
daily_content: '',
|
daily_status: daily_status.value,
|
estimated_hours: 2,
|
actual_hours: 0,
|
remark: '',
|
dailyTypeArr,
|
dailyStatusArr,
|
projectInfoArr,
|
projectTaskArr,
|
})
|
}
|
|
function isBlank(str) {
|
return !str || str.replace(/\s/g, '').length === 0
|
}
|
|
const deleteRow = index => {
|
dailys.value.splice(index, 1)
|
}
|
|
const updateTasks = index => {
|
console.log(dailys.value[index])
|
|
dailys.value[index].projectTaskArr = [
|
{ task_name: '子选项1', id: 'suboption1' },
|
{ task_name: '子选项2', id: 'suboption2' },
|
]
|
}
|
|
const back = () => {
|
context.emit('editClose')
|
}
|
|
return {
|
back,
|
rules,
|
resetForm,
|
submitForm,
|
|
topHeader,
|
labelWidth,
|
|
dailys,
|
addRow,
|
deleteRow,
|
submitConfirmForm,
|
|
dailyTypeArr,
|
dailyStatusArr,
|
projectInfoArr,
|
updateTasks,
|
|
form,
|
daily_date,
|
confirm_flag,
|
daily_type,
|
project_id,
|
daily_status,
|
itemSize,
|
|
preDateChange,
|
preDailyTypeChange,
|
preProjectInfoChange,
|
preItemSizeChange,
|
preProjectStatusChange,
|
|
loading,
|
|
getConfirmRules,
|
getAddRules,
|
ruleForm,
|
refHandler,
|
}
|
},
|
}
|
function getDefaultDate() {
|
const today = new Date()
|
const year = today.getFullYear()
|
const month = String(today.getMonth() + 1).padStart(2, '0')
|
const day = String(today.getDate()).padStart(2, '0')
|
const now = `${year}-${month}-${day}`
|
return now
|
}
|
|
/**
|
* 表单验证规则
|
*/
|
function getAddRules() {
|
/**
|
* 验证回调函数
|
*/
|
const hourInfo = (rule, value, callback) => {
|
if (value <= 0) {
|
callback(new Error('工时至少为0.5小时'))
|
}
|
callback()
|
}
|
const rules = {
|
daily_date: [{ message: '请输入日期', trigger: 'blur', required: true }],
|
daily_type: [{ message: '请选择日志类型', trigger: 'blur', required: true }],
|
project_id: [{ message: '请选择项目', trigger: 'blur', required: true }],
|
daily_status: [{ message: '请选择日志状态', trigger: 'blur', required: true }],
|
daily_content: [{ message: '请输入日志内容', trigger: 'change', required: true }],
|
estimated_hours: [{ validator: hourInfo, trigger: 'change', required: true }],
|
}
|
return rules
|
}
|
|
function getConfirmRules() {
|
/**
|
* 验证回调函数
|
*/
|
const checkHourInfo = (rule, value, callback) => {
|
if (value <= 0) {
|
callback(new Error('工时至少为0.5小时'))
|
}
|
callback()
|
}
|
const checkRemarkInfo = (rule, value, callback) => {
|
if (!value) {
|
callback(new Error('信息不能为空'))
|
}
|
callback()
|
}
|
|
const checkStatusInfo = (rule, value, callback) => {
|
if (!value) {
|
callback(new Error('请选择日志状态'))
|
}
|
|
callback()
|
}
|
|
const rules = {
|
daily_date: [{ message: '请输入日期', trigger: 'blur', required: true }],
|
daily_type: [{ message: '请选择日志类型', trigger: 'blur', required: true }],
|
project_id: [{ message: '请选择项目', trigger: 'blur', required: true }],
|
daily_status: [{ validator: checkStatusInfo, trigger: 'blur', required: true }],
|
daily_content: [{ message: '请输入日志内容', trigger: 'blur', required: true }],
|
estimated_hours: [{ validator: checkHourInfo, trigger: 'change', required: true }],
|
actual_hours: [{ validator: checkHourInfo, trigger: 'change', required: true }],
|
// remark: [{validator:checkRemarkInfo, trigger: 'change', required: true }],
|
}
|
return rules
|
}
|
|
/**
|
* 表单验证规则
|
*/
|
function getHoursRules() {
|
/**
|
* 验证回调函数
|
*/
|
const checkInfo = (rule, value, callback) => {
|
if (!value) {
|
callback(new Error('信息不能为空'))
|
}
|
callback()
|
}
|
const rules = {
|
daily_date: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
daily_type: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
project_id: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
daily_content: [{ message: '请输入日志内容', trigger: 'blur', required: true }],
|
estimated_hours: [{ validator: checkInfo, trigger: 'blur', required: true }],
|
}
|
return { rules }
|
}
|
|
/**
|
* 下划线转驼峰
|
*/
|
function camel(data) {
|
if (typeof data !== 'object' || !data) return data
|
if (Array.isArray(data)) {
|
return data.map(item => camel(item))
|
}
|
|
const newData = {}
|
for (const key in data) {
|
const newKey = key.replace(/_([a-z])/g, (p, m) => m.toUpperCase())
|
newData[newKey] = camel(data[key])
|
}
|
return newData
|
}
|
|
/**
|
* 驼峰转下划线
|
*/
|
function underline(data) {
|
if (typeof data !== 'object' || !data) return data
|
if (Array.isArray(data)) {
|
return data.map(item => underline(item))
|
}
|
|
const newData = {}
|
for (const key in data) {
|
const newKey = key.replace(/([A-Z])/g, (p, m) => `_${m.toLowerCase()}`)
|
newData[newKey] = underline(data[key])
|
}
|
return newData
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.container {
|
.title {
|
height: 59px;
|
line-height: 59px;
|
color: $parent-title-color;
|
font-size: 16px;
|
font-weight: 500;
|
text-indent: 40px;
|
border-bottom: 1px solid #dae1ec;
|
|
.back {
|
float: right;
|
margin-right: 40px;
|
cursor: pointer;
|
}
|
}
|
|
.wrap {
|
padding: 20px;
|
}
|
|
.submit {
|
float: left;
|
}
|
}
|
</style>
|
|
<style scoped>
|
.top-class {
|
margin: 10 5 5 5;
|
}
|
.pre-form-class {
|
margin: 5px;
|
}
|
.log-list {
|
margin-top: 10px;
|
max-height: 90%; /* 设置最大高度，出现滚动条 */
|
overflow-y: auto; /* 垂直滚动条 */
|
width: 99%;
|
overflow-x: auto;
|
scrollbar-width: thin;
|
scrollbar-color: #ccc #f2f2f2;
|
}
|
|
.log-index {
|
padding-left: 5px;
|
padding-right: 5px;
|
width: 20px;
|
}
|
.log-item {
|
display: flex;
|
align-items: center;
|
justify-content: left;
|
margin-bottom: 2px;
|
/* padding: 10px; */
|
/* background-color: #f2f2f2; */
|
}
|
|
.log-item-content {
|
/* flex: 1; */
|
/* display: flex; */
|
/* align-items: center; */
|
width: auto;
|
display: flex;
|
}
|
|
.log-item-action {
|
flex-shrink: 0;
|
margin-left: 5px;
|
}
|
|
.delete-button {
|
cursor: pointer;
|
font-size: 14px;
|
}
|
|
.add-button {
|
margin: 5px;
|
}
|
</style>
|
