可编辑文本

This commit is contained in:
庞东林
2021-12-08 21:07:37 +08:00
parent 5cfb7ecf27
commit 93692924f5

View File

@@ -21,9 +21,9 @@
<template #enumber="{ text, record ,index }"> <template #enumber="{ text, record ,index }">
<div class="editable-cell"> <div class="editable-cell">
<div v-if="editableData[index] && editableData[index].edable=='index1'" class="editable-cell-input-wrapper"> <div v-if="editableData[index] && editableData[index].edable=='index3'" class="editable-cell-input-wrapper">
<a-input v-model:value="editableData[index][index3]" @pressEnter="save(editableData[index],index)" /> <a-input v-model:value="editableData[index]['index3']" @pressEnter="save(index)" />
<check-outlined class="editable-cell-icon-check" @click="save(editableData[index],index)" /> <check-outlined class="editable-cell-icon-check" @click="save(index)" />
</div> </div>
<div v-else class="editable-cell-text-wrapper"> <div v-else class="editable-cell-text-wrapper">
{{ text || ' ' }} {{ text || ' ' }}
@@ -34,9 +34,9 @@
<template #wnumber="{ text, record ,index }"> <template #wnumber="{ text, record ,index }">
<div class="editable-cell"> <div class="editable-cell">
<div v-if="editableData[index] && editableData[index].edable=='index2'" class="editable-cell-input-wrapper"> <div v-if="editableData[index] && editableData[index].edable=='index4'" class="editable-cell-input-wrapper">
<a-input v-model:value="editableData[index][index4]" @pressEnter="save(editableData[index],index)" /> <a-input v-model:value="editableData[index]['index4']" @pressEnter="save(index)" />
<check-outlined class="editable-cell-icon-check" @click="save(editableData[index],index)" /> <check-outlined class="editable-cell-icon-check" @click="save(index)" />
</div> </div>
<div v-else class="editable-cell-text-wrapper"> <div v-else class="editable-cell-text-wrapper">
{{ text || ' ' }} {{ text || ' ' }}
@@ -48,8 +48,8 @@
<template #desc="{ text, record ,index }"> <template #desc="{ text, record ,index }">
<div class="editable-cell"> <div class="editable-cell">
<div v-if="editableData[index] && editableData[index].edable=='index6'" class="editable-cell-input-wrapper"> <div v-if="editableData[index] && editableData[index].edable=='index6'" class="editable-cell-input-wrapper">
<a-input v-model:value="editableData[index][index6]" @pressEnter="save(editableData[index],index)" /> <a-input v-model:value="editableData[index]['index6']" @pressEnter="save(index)" />
<check-outlined class="editable-cell-icon-check" @click="save(editableData[index],index)" /> <check-outlined class="editable-cell-icon-check" @click="save(index)" />
</div> </div>
<div v-else class="editable-cell-text-wrapper"> <div v-else class="editable-cell-text-wrapper">
{{ text || ' ' }} {{ text || ' ' }}
@@ -61,8 +61,8 @@
<template #remark="{ text, record ,index }"> <template #remark="{ text, record ,index }">
<div class="editable-cell"> <div class="editable-cell">
<div v-if="editableData[index] && editableData[index].edable=='remark'" class="editable-cell-input-wrapper"> <div v-if="editableData[index] && editableData[index].edable=='remark'" class="editable-cell-input-wrapper">
<a-input v-model:value="editableData[index][remark]" @pressEnter="save(editableData[index],index)" /> <a-input v-model:value="editableData[index]['remark']" @pressEnter="save(index)" />
<check-outlined class="editable-cell-icon-check" @click="save(editableData[index],index)" /> <check-outlined class="editable-cell-icon-check" @click="save(index)" />
</div> </div>
<div v-else class="editable-cell-text-wrapper"> <div v-else class="editable-cell-text-wrapper">
{{ text || ' ' }} {{ text || ' ' }}
@@ -87,7 +87,7 @@ import {
import locale from "ant-design-vue/es/date-picker/locale/zh_CN"; import locale from "ant-design-vue/es/date-picker/locale/zh_CN";
// import { tableColumns } from "./colums"; // import { tableColumns } from "./colums";
import moment from "moment"; // import moment from "moment";
import Search from "./../components/search.vue"; import Search from "./../components/search.vue";
import { CheckOutlined, EditOutlined } from '@ant-design/icons-vue'; import { CheckOutlined, EditOutlined } from '@ant-design/icons-vue';
@@ -204,10 +204,10 @@ export default {
this.editableData[index].edable=key this.editableData[index].edable=key
}, },
save(item,index){ save(index){
console.log('item',item) // console.log('item',this.editableData[index]['index3'])
console.log('item.remark', item.remark) // // console.log('item.remark', item.remark)
this.datasource[index] = item this.datasource[index] = {...this.editableData[index]}
this.editableData = [] this.editableData = []
}, },