|
@@ -67,8 +67,9 @@
|
|
|
</span>
|
|
|
<svg-icon icon-class="edit" @click.native="handleEditClick(scope.row, scope.$index)" />
|
|
|
</div>
|
|
|
- <el-input v-else v-model="scope.row.sortIndex" size="mini" style="width:60px;" type="number"
|
|
|
- @blur="onNumberBlur(scope.row, scope.$index)" placeholder="序号" ref="numberInput" />
|
|
|
+ <el-input v-else v-model="editData.sortIndex" size="mini" style="width:60px;" type="number"
|
|
|
+ @blur="onNumberBlur(scope.row, scope.$index)" @keyup.enter.native="onNumberBlur(scope.row, scope.$index)"
|
|
|
+ placeholder="序号" ref="numberInput" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="更新时间" prop="updateTime" align="center">
|
|
@@ -125,6 +126,7 @@ export default {
|
|
|
total: 0,
|
|
|
// 列表
|
|
|
tableData: [],
|
|
|
+ editData: {},
|
|
|
currentEditIndex: -1,
|
|
|
// 批量上下架
|
|
|
obj: {
|
|
@@ -230,30 +232,55 @@ export default {
|
|
|
},
|
|
|
// 点击编辑图标显示输入框
|
|
|
handleEditClick(row, index) {
|
|
|
- // 设置当前编辑的行索引
|
|
|
+ this.editData = {
|
|
|
+ sortIndex: row.sortIndex,
|
|
|
+ };
|
|
|
this.currentEditIndex = index;
|
|
|
-
|
|
|
- // 使用nextTick确保DOM更新后再获取焦点
|
|
|
this.$nextTick(() => {
|
|
|
- const inputs = this.$refs.numberInput;
|
|
|
- if (inputs && inputs.length) {
|
|
|
- inputs[0].focus();
|
|
|
- } else if (inputs) {
|
|
|
- inputs.focus();
|
|
|
- }
|
|
|
+ this.$refs.numberInput.focus();
|
|
|
});
|
|
|
},
|
|
|
|
|
|
// 输入框失去焦点时隐藏
|
|
|
onNumberBlur(row, index) {
|
|
|
- // 重置当前编辑的行索引
|
|
|
- this.currentEditIndex = -1;
|
|
|
- if (row.sortIndex != this.tableData[index].sortIndex) {
|
|
|
- console.log('修改后的序号:', row.sortIndex);
|
|
|
- // 这里可以添加序号修改的API调用逻辑
|
|
|
+ let newValue = this.editData.sortIndex ?? -1;
|
|
|
+ console.log("newValue", newValue);
|
|
|
+
|
|
|
+ if (newValue === -1 || newValue === '') {
|
|
|
+ // 新值为空时处理
|
|
|
+ this.currentEditIndex = -1;
|
|
|
+ console.log('序号未修改:', newValue);
|
|
|
+ return
|
|
|
}
|
|
|
+
|
|
|
+ if (newValue <= 0) {
|
|
|
+ // 新值与原值相同时处理
|
|
|
+ this.$message.warning('序号必须大于0', newValue);
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ // 检查序号是否重复
|
|
|
+ const isDuplicate = this.tableData.some((item, i) =>
|
|
|
+ i !== index && item.sortIndex === newValue
|
|
|
+ );
|
|
|
+
|
|
|
+ if (isDuplicate) {
|
|
|
+ this.$message.warning('序号已存在');
|
|
|
+ } else {
|
|
|
+ // 更新到tableData
|
|
|
+ this.$set(this.tableData, index, {
|
|
|
+ ...row,
|
|
|
+ sortIndex: newValue
|
|
|
+ });
|
|
|
+ console.log('序号修改成功:', newValue, "row.sortIndex", row.sortIndex, "this.tableData", this.tableData[index].sortIndex);
|
|
|
+ // 隐藏编辑框
|
|
|
+ this.currentEditIndex = -1;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
},
|
|
|
|
|
|
+
|
|
|
// 字典翻译
|
|
|
platformFormatter(row) {
|
|
|
return this.selectDictLabel(this.platformOptions, row.platformId);
|